
@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800;900&display=swap');
:root{
  --ielts-maroon:#983247;--ielts-maroon-dark:#742536;--ielts-maroon-deep:#5D1D2B;--ielts-rose:#FCECEF;
  --ielts-navy:#294A64;--ielts-navy-dark:#203B51;--ielts-blue:#EEF5F8;
  --ielts-gold:#B4944D;--ielts-gold-soft:#FBF5E8;--ielts-sage:#5C806D;--ielts-sage-soft:#EEF6F1;
  --ielts-bg:#FCFAF7;--ielts-card:#fff;--ielts-soft:#F8F4EF;--ielts-ink:#24272C;--ielts-muted:#737980;--ielts-line:#E9E0D8;
  --ielts-shadow:0 14px 34px rgba(45,35,30,.085),0 2px 6px rgba(45,35,30,.04);
  --ielts-btn-shadow:0 4px 0 #DED4CC,0 8px 18px rgba(45,35,30,.075);
}
.server-nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.server-nav a,.server-nav button{font-family:"Vazirmatn",Tahoma,"Segoe UI",Arial,sans-serif!important;text-decoration:none}
.server-hidden{display:none!important}
.account-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid #E3D9D1;background:#FFFDFC;border-radius:999px;padding:7px 10px;color:#626A71;font:700 11px "Vazirmatn",Tahoma,sans-serif}
.account-chip:before{content:"";width:7px;height:7px;border-radius:50%;background:#5C806D;box-shadow:0 0 0 3px #EEF6F1}
/* shared laptop polish */
@media(min-width:1000px){body{min-width:0}.app,.wrap,.shell{max-width:1240px}}

/* Grammar conversion from the old green UI to the IELTS academic product system. */
body.module-grammar{
  --g:#983247;--gd:#742536;--b:#AFC5D3;--bd:#294A64;--y:#B4944D;--r:#B95F69;--p:#EEF5F8;
  --ink:#24272C;--muted:#737980;--bg:#FCFAF7;--card:#fff;--line:#E9E0D8;--soft:#F8F4EF;--ok:#EEF6F1;--bad:#FFF1F3;--shadow:#DED4CC;
  font-family:"Vazirmatn",Tahoma,"Segoe UI",Arial,sans-serif!important;
  background:radial-gradient(820px 400px at 92% -8%,rgba(152,50,71,.075),transparent 62%),radial-gradient(760px 430px at -8% 20%,rgba(41,74,100,.065),transparent 60%),linear-gradient(180deg,#FFFDFC 0%,#FCFAF7 34%,#FBF8F4 100%)!important;
}
body.module-grammar .app{width:min(1220px,calc(100% - 28px));margin:20px auto 54px}
body.module-grammar .top{padding:16px 18px;margin-bottom:15px;background:rgba(255,255,255,.96);border:1px solid rgba(152,50,71,.14);border-top:4px solid #983247;border-radius:18px;box-shadow:0 10px 26px rgba(45,35,30,.08)}
body.module-grammar .logo{width:58px;height:58px;border-radius:14px;background:linear-gradient(155deg,#A43B50,#742536);border:1px solid #7A2739;box-shadow:0 5px 0 #5D1D2B,0 10px 20px rgba(116,37,54,.18);font-size:15px;font-family:Arial,sans-serif}
body.module-grammar .brand h1{font-size:clamp(22px,3.4vw,30px);font-weight:850;color:#20242B}
body.module-grammar .brand p{font-size:12px;line-height:1.8;color:#737980}
body.module-grammar .panel{border:1px solid #E8DED6;border-radius:20px;box-shadow:var(--ielts-shadow);padding:clamp(18px,3vw,25px)}
body.module-grammar .tab,body.module-grammar .btn{border:1px solid #E3D9D1;border-radius:12px;background:linear-gradient(180deg,#fff,#FCFAF8);color:#24272C;box-shadow:var(--ielts-btn-shadow);transition:.14s ease}
body.module-grammar .tab:hover,body.module-grammar .btn:hover{transform:translateY(-2px);border-color:#D9CAC1;box-shadow:0 5px 0 #D9CFC7,0 12px 24px rgba(45,35,30,.1)}
body.module-grammar .tab.active,body.module-grammar .btn.primary{background:linear-gradient(180deg,#A63A50 0%,#983247 58%,#882C40 100%);border-color:#81283B;color:#fff;box-shadow:0 5px 0 #6D2434,0 10px 21px rgba(116,37,54,.18)}
body.module-grammar .btn.blue{background:linear-gradient(180deg,#F8FBFD,#EEF5F8);border-color:#D6E1E7;color:#294A64;box-shadow:0 4px 0 #D0DCE3,0 8px 18px rgba(41,74,100,.08)}
body.module-grammar .hero{border:1px solid rgba(152,50,71,.13);border-radius:21px;background:radial-gradient(520px 250px at 96% 5%,rgba(41,74,100,.075),transparent 70%),linear-gradient(128deg,#FCEBED 0%,#FFF8F5 53%,#EEF5F8 100%)}
body.module-grammar .badge{border:1px solid rgba(152,50,71,.15);background:#fff;color:#983247}
body.module-grammar .hero-side,body.module-grammar .stat,body.module-grammar .day-box,body.module-grammar .timeline,body.module-grammar .skill,body.module-grammar .tool-card,body.module-grammar .question{border:1px solid #E7DED7;background:#fff;box-shadow:0 4px 12px rgba(45,35,30,.045)}
body.module-grammar .stat{position:relative;overflow:hidden;border-radius:16px}.module-grammar .stat:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:#983247}.module-grammar .stat:nth-child(2):before{background:#B4944D}.module-grammar .stat:nth-child(3):before{background:#5C806D}.module-grammar .stat:nth-child(4):before{background:#567D98}.module-grammar .stat:nth-child(5):before{background:#8B6270}
body.module-grammar .track>div,body.module-grammar .session-track div,body.module-grammar .mini div{background:linear-gradient(90deg,#983247,#B96776)}
body.module-grammar .day-btn{border:1px solid #E4DCD5;border-radius:10px}.module-grammar .day-btn.active{background:#983247;border-color:#983247}.module-grammar .day-btn.done{background:#EEF6F1;border-color:#CEE2D5;color:#426B54}
body.module-grammar .stage{border:1px solid #E7DED7;border-radius:14px}.module-grammar .stage.done{background:#EEF6F1;border-color:#CEE2D5}.module-grammar .stage-num{background:#FCECEF;color:#983247}.module-grammar .stage-time{color:#294A64}
body.module-grammar .skill:hover{border-color:#D8C8CB}.module-grammar .chip.active{background:#983247}.module-grammar .chip.done{background:#EEF6F1;color:#426B54}
body.module-grammar .control select,body.module-grammar .control input,body.module-grammar textarea{border-color:#E3D9D1!important}
body.module-grammar .options .option:hover{border-color:#C99AA3}

/* Writing & Listening receive same product shell even if their embedded legacy styles load first. */
body.module-writing,body.module-listening{
  background:radial-gradient(820px 400px at 92% -8%,rgba(152,50,71,.075),transparent 62%),radial-gradient(760px 430px at -8% 20%,rgba(41,74,100,.065),transparent 60%),linear-gradient(180deg,#FFFDFC 0%,#FCFAF7 34%,#FBF8F4 100%)!important;
}
body.module-writing .top,body.module-listening .top{padding:16px 18px;border:1px solid rgba(152,50,71,.14);border-top:4px solid #983247;border-radius:18px;background:rgba(255,255,255,.96);box-shadow:0 10px 26px rgba(45,35,30,.08)}
body.module-writing .logo,body.module-listening .logo{border-radius:14px!important;background:linear-gradient(155deg,#A43B50,#742536)!important;border:1px solid #7A2739!important;box-shadow:0 5px 0 #5D1D2B,0 10px 20px rgba(116,37,54,.18)!important}
