/* Noandishan v20 — mobile-first UX overhaul */
:root{
  --v20-bg:#f4f7fb;
  --v20-card:#ffffff;
  --v20-ink:#14243b;
  --v20-muted:#6c7b90;
  --v20-line:#e2e9f2;
  --v20-blue:#2f5bea;
  --v20-blue2:#173fbd;
  --v20-teal:#0d9f82;
  --v20-amber:#f3a22d;
  --v20-purple:#7b5be7;
  --v20-danger:#d84d6c;
  --v20-radius:24px;
  --v20-shadow:0 18px 55px rgba(24,47,83,.10);
  --v20-app-height:100dvh;
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--v20-bg);scroll-behavior:smooth}
html,body,button,input,textarea,select{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans Arabic",Tahoma,Arial,sans-serif!important}
body{overscroll-behavior-y:none;background:var(--v20-bg);color:var(--v20-ink)}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
button{touch-action:manipulation}

/* app-like mobile shell */
@media(max-width:900px){
  :root{--v13-top-h:58px;--v13-nav-h:72px}
  body{background:linear-gradient(180deg,#f7f9fd 0,#f2f6fb 100%);padding:0!important}
  .layout{display:block!important;min-height:100dvh;background:transparent}
  .sidebar{display:none!important}
  .mobile-topbar{height:calc(58px + env(safe-area-inset-top))!important;padding:calc(7px + env(safe-area-inset-top)) 12px 7px!important;background:rgba(255,255,255,.96)!important;border-bottom:1px solid rgba(221,230,241,.95)!important;box-shadow:0 6px 24px rgba(25,48,83,.06)!important}
  .mobile-brand{min-width:0;gap:9px!important}.mobile-logo{width:40px!important;height:40px!important;border-radius:14px!important;background:linear-gradient(145deg,#3157d5,#11a8b8)!important;color:#fff!important;box-shadow:0 8px 22px rgba(49,87,213,.22)!important}
  .mobile-brand b{font-size:13px!important}.mobile-brand small{font-size:10px!important;max-width:48vw!important;color:#738198!important}
  .mobile-icon-btn{width:40px!important;height:40px!important;border-radius:14px!important;background:#f3f6fb!important;border:1px solid #e2e9f2!important;box-shadow:none!important}
  .main{padding:calc(58px + env(safe-area-inset-top) + 12px) 10px calc(78px + env(safe-area-inset-bottom) + 14px)!important;min-height:100dvh;background:transparent!important}
  .main>.card:first-child{margin-top:0}
  .mobile-nav{height:calc(72px + env(safe-area-inset-bottom))!important;padding:6px 7px calc(7px + env(safe-area-inset-bottom))!important;border-radius:22px 22px 0 0!important;background:rgba(255,255,255,.97)!important;box-shadow:0 -12px 36px rgba(24,47,83,.12)!important;gap:4px!important}
  .mobile-nav .mobile-nav-item{height:58px!important;min-height:58px!important;border-radius:17px!important;gap:2px!important;transition:transform .18s ease,background .18s ease!important}
  .mobile-nav .mobile-nav-item:active{transform:scale(.94)}
  .mobile-nav .mobile-nav-item.active{background:linear-gradient(145deg,#edf3ff,#eaf8f5)!important;color:#214fc6!important;box-shadow:inset 0 0 0 1px #d7e2ff!important}
  .mobile-nav .nav-icon{font-size:21px!important}.mobile-nav .nav-label{font-size:9.5px!important}
  .mobile-drawer{border-radius:30px 30px 0 0!important;padding-bottom:calc(18px + env(safe-area-inset-bottom))!important}
  .mobile-drawer-list{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.mobile-drawer-item{min-height:58px!important;border-radius:17px!important}
  .card{border-radius:22px!important;box-shadow:0 12px 34px rgba(24,47,83,.075)!important;border-color:#e2e9f2!important}
  .grid.cols-4,.grid.cols-3,.grid.cols-2{grid-template-columns:1fr 1fr!important;gap:9px!important}
  .card.stat{padding:14px!important;min-height:102px}.card.stat b{font-size:22px!important}.card.stat small{font-size:9px!important}
  .actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.actions>button,.actions>a{width:100%!important;min-height:48px!important}
  input,textarea,select{min-height:50px!important;border-radius:15px!important;font-size:16px!important}
  textarea{min-height:112px!important}
  .table-wrap{border-radius:17px!important;overflow:auto!important;box-shadow:inset 0 0 0 1px #e2e9f2}.table-wrap table{min-width:720px}
}

/* session library: clean 2x2 mobile tiles */
@media(max-width:900px){
  .v16-library{gap:12px!important}.v16-library-hero{padding:20px 17px!important;border-radius:25px!important;gap:15px!important;background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.16),transparent 14rem),linear-gradient(145deg,#163b9d,#3157d5 55%,#0d9f82)!important}
  .v16-library-hero h2{font-size:22px!important;line-height:1.55!important;margin:10px 0 6px!important}.v16-library-hero p{font-size:12px!important;line-height:1.95!important}
  .v16-library-stats{grid-template-columns:1fr 1fr!important;gap:8px!important}.v16-library-stats div{padding:12px!important;border-radius:17px!important}.v16-library-stats b{font-size:22px!important}
  .v16-session-card{border-radius:25px!important;box-shadow:var(--v20-shadow)!important}.v16-session-card-cover{height:7px!important}.v16-session-card-main{padding:16px!important}.v16-session-card-head{display:grid!important;gap:7px!important}.v16-session-card-head h3{font-size:19px!important;line-height:1.6!important;margin:4px 0!important}.v16-session-card-head p{font-size:12px!important;line-height:1.9!important}.v16-session-status{justify-self:start!important}
  .v16-session-modules.v19-four{grid-template-columns:1fr 1fr!important;gap:8px!important;margin:14px 0!important}.v16-module{min-height:91px!important;padding:12px!important;border-radius:18px!important;text-align:right!important;display:grid!important;grid-template-columns:38px 1fr!important;grid-template-rows:auto auto!important;align-items:center!important;column-gap:9px!important}.v16-module i{grid-row:1/3;width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.68);font-size:20px!important}.v16-module b{margin:0!important;font-size:12px!important;line-height:1.4!important}.v16-module span{font-size:9px!important;line-height:1.5!important}
  .v16-session-progress{gap:8px!important}.v16-progress-track{height:8px!important}.v16-session-actions{grid-template-columns:1fr!important;gap:8px!important}.v16-session-actions button{min-height:50px!important;border-radius:16px!important}.v16-enter{font-size:14px!important}
}

/* immersive app frame */
body.v16-immersive-open{overflow:hidden!important;background:#edf2f8!important}
@media(max-width:900px){
  body.v16-immersive-open .mobile-topbar,body.v16-immersive-open .mobile-nav,body.v16-immersive-open .mobile-drawer,body.v16-immersive-open .mobile-scrim{display:none!important}
  .v16-immersive{height:var(--v20-app-height)!important;min-height:var(--v20-app-height)!important;grid-template-rows:auto 1fr auto!important;background:linear-gradient(180deg,#f7f9fd,#edf2f8)!important}
  .v16-topbar{min-height:58px!important;padding:calc(7px + env(safe-area-inset-top)) 9px 7px!important;gap:8px!important;background:rgba(255,255,255,.97)!important;box-shadow:0 6px 24px rgba(24,47,83,.08)!important}.v16-back,.v16-icon-btn{width:40px!important;height:40px!important;border-radius:14px!important;box-shadow:none!important}.v16-brandline b{font-size:12px!important}.v16-brandline span{font-size:9px!important}.v16-top-tools{display:none!important}
  .v16-tabbar{display:none!important}
  .v16-workspace{padding:9px 8px calc(88px + env(safe-area-inset-bottom))!important;scroll-padding-bottom:110px!important;overscroll-behavior:contain!important}
  .v16-bottom-nav{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:4px!important;padding:6px 6px calc(7px + env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.98)!important;box-shadow:0 -12px 35px rgba(24,47,83,.11)!important;border-radius:22px 22px 0 0!important}
  .v16-bottom-nav button{min-height:57px!important;border-radius:17px!important;font-size:9px!important;gap:2px!important;color:#748297!important;transition:.16s ease!important}.v16-bottom-nav button i{font-size:19px!important}.v16-bottom-nav button.active{background:linear-gradient(145deg,#edf3ff,#e9f9f4)!important;color:#224fc6!important;box-shadow:inset 0 0 0 1px #d7e2ff!important}.v16-bottom-nav button:active{transform:scale(.94)}
  body.v20-keyboard .v16-bottom-nav{display:none!important}.v16-workspace:has(input:focus),.v16-workspace:has(textarea:focus){padding-bottom:22px!important}
}

/* mobile learning: less nesting, clearer hierarchy */
@media(max-width:900px){
  .v19-learning{padding:0!important;gap:8px!important}.v19-learning-head{margin:0!important;padding:16px!important;border-radius:22px!important;display:grid!important;gap:12px!important;background:radial-gradient(circle at 88% 10%,rgba(255,210,85,.22),transparent 13rem),linear-gradient(145deg,#14345f,#2d5f96 62%,#0d8874)!important}.v19-learning-head>div:first-child span{font-size:10px!important}.v19-learning-head h1{font-size:20px!important;line-height:1.55!important;margin:5px 0!important}.v19-learning-head p{font-size:10px!important;line-height:1.75!important;display:none!important}
  .v19-learning-tools{display:grid!important;grid-template-columns:1fr auto!important;gap:7px!important;margin:0!important;min-width:0!important}.v19-mode-switch{grid-column:1/-1!important;display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important}.v19-mode-switch button{min-height:40px!important;padding:7px!important}.v19-notebook-btn{min-height:43px!important;padding:8px 11px!important;font-size:11px!important}.v19-learning-tools .v18-total-progress{width:54px!important;height:43px!important;min-width:54px!important;border-radius:14px!important;display:grid!important;place-items:center!important}.v19-learning-tools .v18-total-progress b{font-size:12px!important}.v19-learning-tools .v18-total-progress span{display:none!important}
  .v18-lesson-rail{position:sticky!important;top:0!important;z-index:12!important;display:flex!important;overflow-x:auto!important;gap:7px!important;margin:8px -1px 6px!important;padding:5px!important;border-radius:17px!important;background:rgba(247,249,253,.94)!important;backdrop-filter:blur(14px)!important;scroll-snap-type:x mandatory!important}.v18-lesson-rail button{flex:0 0 155px!important;min-height:52px!important;scroll-snap-align:center!important;border-radius:15px!important;padding:7px 9px!important}.v18-lesson-rail button b{font-size:10px!important}.v18-lesson-rail button span{font-size:8px!important}
  .v18-phase-rail{display:flex!important;overflow-x:auto!important;gap:6px!important;margin:0 0 8px!important;padding:5px!important;border-radius:17px!important;scroll-snap-type:x mandatory!important}.v18-phase-rail button{flex:0 0 126px!important;min-height:43px!important;padding:6px!important;scroll-snap-align:center!important;font-size:9px!important}
  .v19-slide-shell,.v19-slide-deck{max-width:none!important;margin:0!important}.v19-slide-progress{position:sticky!important;top:0!important;z-index:11!important;margin:0 0 7px!important;padding:9px 11px!important;border-radius:16px!important;background:rgba(255,255,255,.95)!important;box-shadow:0 8px 25px rgba(24,47,83,.07)!important}.v19-slide-progress>div:first-child{display:grid!important;gap:1px!important;min-width:84px!important}.v19-slide-progress b{font-size:10px!important}.v19-slide-progress span{font-size:8px!important}.v19-slide-progress i{height:6px!important;min-width:15px!important}
  .v19-learning-slide{border-radius:22px!important;box-shadow:0 14px 40px rgba(24,47,83,.09)!important}.v19-learning-slide>header{padding:18px 15px 16px!important}.v19-learning-slide>header>span{font-size:9px!important;padding:5px 8px!important}.v19-learning-slide>header h1{font-size:22px!important;line-height:1.55!important;margin:8px 0 5px!important}.v19-learning-slide>header p{font-size:11px!important;line-height:1.85!important}.v19-slide-body{padding:14px 12px!important}.v19-slide-body .v18-demo,.v19-slide-body .v18-key-grid,.v19-slide-body .v18-examples{border-radius:18px!important}.v19-slide-body svg{max-width:100%!important;min-width:0!important;height:auto!important}.v19-slide-body .v18-key-grid{grid-template-columns:1fr!important}.v19-slide-body .v18-examples{grid-template-columns:1fr!important}
  .v19-reflection{margin:0 10px 14px!important;padding:14px!important;border-radius:19px!important}.v19-reflection-head{display:grid!important;gap:4px!important}.v19-reflection-head h3{font-size:16px!important}.v19-reflection-head small{justify-self:start!important;font-size:9px!important}.v19-reflection>p{font-size:11px!important}.v19-reflection textarea{min-height:110px!important;font-size:16px!important;border-radius:15px!important;padding:12px!important}.v19-reflection-actions{display:grid!important;gap:8px!important}.v19-reflection-actions button{width:100%!important;min-height:47px!important;margin:0!important}
  .v19-slide-nav{position:sticky!important;bottom:0!important;z-index:13!important;grid-template-columns:1fr 1fr!important;gap:7px!important;margin:8px 0 0!important;padding:7px!important;border-radius:18px!important;background:rgba(255,255,255,.97)!important;border:1px solid #dfe7f1!important;box-shadow:0 12px 32px rgba(24,47,83,.11)!important}.v19-slide-nav>div{display:none!important}.v19-slide-nav button{min-height:48px!important;min-width:0!important;padding:8px!important;font-size:11px!important;border-radius:14px!important}
  .v19-notebook{margin:0!important;border-radius:22px!important}.v19-notebook-cover{padding:18px 15px!important;display:grid!important;gap:10px!important}.v19-notebook-cover h1{font-size:23px!important}.v19-notebook-cover p{font-size:10px!important}.v19-notebook-cover button{width:100%!important}.v19-notebook-tabs{padding:8px!important;gap:6px!important}.v19-notebook-tabs button{min-height:40px!important;font-size:10px!important}.v19-notebook-pages{padding:14px 12px 24px!important;grid-template-columns:1fr!important;gap:10px!important;background-size:100% 30px!important}.v19-notebook-pages article{min-height:0!important;padding:14px!important;border-radius:18px!important}.v19-notebook-pages p{font-size:13px!important;line-height:2!important}
}

/* guided / mastery / practice question pages */
@media(max-width:900px){
  .v18-question-page,.v16-practice-main{gap:8px!important}.v18-q-head,.v16-practice-head{padding:15px!important;border-radius:21px!important;display:grid!important;gap:9px!important}.v18-q-head h1,.v16-practice-head h2{font-size:19px!important;line-height:1.5!important;margin:4px 0!important}.v18-q-head p,.v16-practice-head p{font-size:10px!important;line-height:1.8!important}.v18-score-pill{justify-self:start!important;font-size:10px!important;padding:7px 10px!important}.v18-q-progress{height:8px!important;border-radius:999px!important}
  .v18-mastery-status{padding:10px!important;border-radius:16px!important;display:grid!important;gap:8px!important}.v18-mastery-status>div{display:flex!important;overflow-x:auto!important;gap:5px!important}.v18-mastery-status button{flex:0 0 31px!important;width:31px!important;height:31px!important;min-height:31px!important}
  .v18-q-card,.v16-question-card{padding:15px!important;border-radius:22px!important;min-height:0!important;box-shadow:0 14px 40px rgba(24,47,83,.08)!important}.v18-q-meta,.v16-q-meta{display:flex!important;overflow-x:auto!important;gap:6px!important;white-space:nowrap!important}.v18-q-meta span,.v16-q-meta span{font-size:9px!important;padding:5px 8px!important}.v18-q-card h2,.v16-question-card h2{font-size:18px!important;line-height:2!important;margin:13px 0 16px!important;overflow-wrap:anywhere!important}.v18-options,.v16-answer-zone{grid-template-columns:1fr!important;gap:8px!important}.v18-options button,.v16-option{min-height:60px!important;border-radius:17px!important;padding:10px!important;font-size:13px!important}.v18-options button span,.v16-option .letter{width:34px!important;height:34px!important;min-width:34px!important;border-radius:11px!important}.v18-input input,.v16-numeric input{min-height:60px!important;font-size:23px!important}.v18-hint,.v18-feedback{border-radius:17px!important;padding:12px!important}.v18-hint p,.v18-feedback p{font-size:11px!important;line-height:1.9!important}
  .v18-q-actions,.v16-question-nav{position:sticky!important;bottom:0!important;z-index:14!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;padding:7px!important;border-radius:18px!important;background:rgba(255,255,255,.97)!important;border:1px solid #dfe7f1!important;box-shadow:0 12px 32px rgba(24,47,83,.12)!important}.v18-q-actions>span,.v16-question-dots{display:none!important}.v18-q-actions button,.v16-question-nav button{min-height:48px!important;border-radius:14px!important;font-size:11px!important}.v18-q-actions .v18-hint-btn{grid-column:1/-1!important;order:-1!important;min-height:41px!important}
  .v16-practice{grid-template-columns:1fr!important;gap:8px!important}.v16-practice-side{padding:6px!important;border-radius:17px!important}.v16-station-list{display:flex!important;overflow-x:auto!important;gap:6px!important}.v16-station{flex:0 0 155px!important;min-height:55px!important;border-radius:15px!important}.v16-practice-insight{display:none!important}.v16-visual{min-height:0!important;overflow:hidden!important;padding:8px!important;border-radius:17px!important}.v16-visual svg{width:100%!important;min-width:0!important;max-height:190px!important}.v16-token-visual{padding:12px!important;gap:6px!important}.v16-token-visual i{width:38px!important;height:38px!important;border-radius:12px!important;font-size:10px!important}
  .v16-result-panel{padding:15px!important;border-radius:19px!important}
}

/* duel: question first, board collapsible, score compact */
.v20-board-details>summary{display:none}
@media(max-width:900px){
  .v19-duel{padding:0 0 8px!important}.v19-duel-head{position:relative!important;padding:15px!important;border-radius:22px!important;display:grid!important;gap:10px!important}.v19-duel-head>div:first-child span{font-size:9px!important}.v19-duel-head h1{font-size:19px!important;line-height:1.55!important;margin:4px 0!important}.v19-duel-head p{display:none!important}.v19-duel-timer{position:absolute!important;left:12px!important;top:12px!important;margin:0!important;min-width:80px!important;padding:8px 10px!important;border-radius:15px!important}.v19-duel-timer small{font-size:7px!important}.v19-duel-timer b{font-size:17px!important}
  .v19-duel-scoreboard{grid-template-columns:1fr 1fr!important;gap:7px!important;margin:8px 0!important}.v19-duel-scoreboard article{padding:10px!important;border-radius:17px!important}.v19-duel-scoreboard header{gap:7px!important}.v19-duel-scoreboard header>span{width:34px!important;height:34px!important;border-radius:12px!important;font-size:10px!important}.v19-duel-scoreboard header b{font-size:10px!important}.v19-duel-scoreboard header small{font-size:8px!important}.v19-duel-scoreboard article>div:nth-of-type(1){display:grid!important;gap:2px!important}.v19-duel-scoreboard article strong{font-size:14px!important}.v19-duel-scoreboard article>div span,.v19-duel-scoreboard footer span{font-size:8px!important}.v19-duel-scoreboard footer{display:grid!important;gap:2px!important}.v19-duel-scoreboard footer b{font-size:9px!important}
  .v19-duel-layout{display:flex!important;flex-direction:column!important;gap:8px!important}.v19-duel-question{order:1!important;position:static!important;padding:14px!important;border-radius:21px!important;box-shadow:0 14px 40px rgba(24,47,83,.09)!important}.v19-speed-tiers{padding:10px!important;border-radius:16px!important}.v19-speed-tiers>b{font-size:10px!important}.v19-speed-tiers>div{display:flex!important;overflow-x:auto!important;flex-wrap:nowrap!important;gap:5px!important}.v19-speed-tiers>div span{flex:0 0 auto!important;font-size:8px!important;padding:4px 6px!important}.v19-speed-tiers i{width:22px!important;height:22px!important}.v19-speed-tiers small{font-size:8px!important}.v19-q-badge{margin:10px 0 5px!important}.v19-q-badge span,.v19-q-badge b{font-size:9px!important}.v19-duel-question h2{font-size:18px!important;line-height:2!important;margin:8px 0 13px!important}.v19-duel-options{grid-template-columns:1fr!important;gap:7px!important}.v19-duel-options button{min-height:58px!important;border-radius:17px!important;padding:9px!important;font-size:12px!important}.v19-submit-answer{position:sticky!important;bottom:0!important;z-index:3!important;min-height:50px!important;border-radius:15px!important;margin-top:10px!important}.v19-duel-reminder{font-size:8px!important}
  .v20-board-details{order:2!important;border:1px solid #dfe7f1!important;border-radius:19px!important;background:#fff!important;overflow:hidden!important}.v20-board-details>summary{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;padding:12px 14px!important;font-size:11px!important;font-weight:900!important;color:#284360!important;cursor:pointer!important;list-style:none!important}.v20-board-details>summary::-webkit-details-marker{display:none}.v20-board-details>summary:after{content:'نمایش';font-size:9px;color:#3157d5;background:#edf3ff;padding:5px 8px;border-radius:999px}.v20-board-details[open]>summary:after{content:'بستن'}
  .v19-board-wrap{padding:7px!important;border:0!important;border-top:1px solid #e5ebf3!important;border-radius:0!important}.v19-board{grid-template-columns:repeat(5,minmax(0,1fr))!important;aspect-ratio:auto!important;border-width:3px!important;border-radius:12px!important}.v19-cell{aspect-ratio:1!important;min-height:0!important}.v19-cell>span{font-size:8px!important}.v19-cell>b{font-size:15px!important}.v19-tokens i{width:18px!important;height:18px!important;font-size:6px!important}.v19-board-legend{font-size:8px!important;gap:7px!important}
  .v19-duel-ready,.v19-duel-lock,.v19-duel-wait,.v19-duel-result{padding:21px 14px!important;border-radius:23px!important;margin:0!important}.v19-ready-art{font-size:46px!important}.v19-duel-ready h1,.v19-duel-lock h1,.v19-duel-wait h1,.v19-duel-result h1{font-size:23px!important;line-height:1.55!important}.v19-duel-ready>p,.v19-duel-lock>p,.v19-duel-wait>p{font-size:11px!important;line-height:1.9!important}.v19-duel-rules{grid-template-columns:1fr 1fr!important;gap:7px!important}.v19-duel-rules>div{padding:11px!important;border-radius:16px!important}.v19-find-opponent{width:100%!important;min-height:52px!important;border-radius:16px!important}.v19-gate-list{grid-template-columns:1fr!important}.v19-result-actions{display:grid!important;grid-template-columns:1fr!important}
}

/* very narrow phones */
@media(max-width:390px){
  .main{padding-inline:7px!important}.grid.cols-4,.grid.cols-3,.grid.cols-2{grid-template-columns:1fr!important}.actions{grid-template-columns:1fr!important}
  .v16-session-modules.v19-four{grid-template-columns:1fr!important}.v16-module{min-height:72px!important}
  .v19-learning-head h1{font-size:18px!important}.v19-learning-tools{grid-template-columns:1fr!important}.v19-notebook-btn{width:100%!important}.v19-learning-tools .v18-total-progress{display:none!important}
  .v19-duel-scoreboard{grid-template-columns:1fr!important}.v19-duel-head h1{padding-left:84px!important}
}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}