:root{
    --orange:#F97316; --yellow:#F59E0B; --teal:#3B82F6; --purple:#8B5CF6;
    --pink:#EC4899; --blue:#3B82F6; --green:#10B981;
    --cream:#F0F4FA; --cream-2:#E8EDF7; --surface:#FFFFFF;
    --ink:#1E2A3A; --ink-soft:#5B6B84; --line:#D8E2EF;
    --bar:#1A2238;
    --good:#10B981; --good-bg:#ECFDF5; --bad:#EF4444; --bad-bg:#FEF2F2;
    --shadow:0 2px 12px rgba(30,42,58,.08); --shadow-lg:0 12px 36px rgba(30,42,58,.14);
    --radius:18px;
    --display:ui-rounded, system-ui, -apple-system, Segoe UI, sans-serif;
    --body:ui-rounded, system-ui, -apple-system, Segoe UI, sans-serif;
  }
  *{box-sizing:border-box}
  body{margin:0;font-family:var(--body);background:var(--cream);color:var(--ink);line-height:1.5;font-weight:500}
  button{font-family:inherit;cursor:pointer}
  h1,h2,h3{font-family:var(--display);font-weight:600;margin:0}
  .hidden{display:none!important}

  header{background:var(--bar);color:#fff;position:sticky;top:0;z-index:300;box-shadow:0 4px 20px rgba(32,42,74,.25)}
  .bar{display:flex;align-items:center;gap:13px;padding:13px 22px;max-width:1120px;margin:0 auto}
  @media(max-width:600px){.bar{gap:8px;padding:10px 14px}}
  @media(max-width:420px){.bar{gap:6px;padding:8px 10px}}
  .logo{width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#3B82F6,#6366F1);
    display:grid;place-items:center;color:#fff;font-family:var(--display);font-size:26px;font-weight:700;
    box-shadow:0 4px 12px rgba(59,130,246,.45);flex:none;line-height:1;cursor:pointer;user-select:none}
  .logo svg{width:23px;height:23px;display:block}
  .splash-logo svg{width:40px;height:40px;display:block}
  .brand-txt{display:flex;flex-direction:column;line-height:1.05}
  .brand-name{font-family:var(--display);font-size:19px;font-weight:600}
  .brand-sub{font-size:13px;color:#9aa6c4;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
  @media(max-width:600px){.logo{width:38px;height:38px;font-size:24px}.logo svg{width:21px;height:21px}.brand-name{font-size:16px}}
  @media(max-width:420px){.logo{width:36px;height:36px;font-size:22px}.logo svg{width:20px;height:20px}.brand-name{font-size:15.5px}.brand-sub{display:none}}
  .snav{display:flex;gap:4px;background:rgba(255,255,255,.08);padding:4px;border-radius:12px;flex-wrap:wrap}
  .snav-tab{background:transparent;border:0;color:#aeb8d4;padding:7px 15px;border-radius:9px;font-family:var(--display);font-size:15.5px;font-weight:600;white-space:nowrap;flex-shrink:0}
  @media(max-width:520px){.snav{gap:2px;padding:2px;justify-content:space-between}.snav-tab{padding:6px 10px;font-size:13.5px}}
  @media(max-width:420px){.snav-tab{padding:5px 8px;font-size:12.5px}}
  .snav-tab.active{background:#fff;color:var(--ink)}
  .snav-tab:not(.active):hover{color:#fff}
  .profile-chip{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.16);border-radius:30px;padding:5px 13px 5px 6px;color:#fff;cursor:pointer}
  .profile-chip:hover{background:rgba(255,255,255,.2)}
  .chip-emoji{width:28px;height:28px;border-radius:50%;background:var(--c);display:grid;place-items:center;font-size:16px}
  .chip-name{font-family:var(--display);font-weight:600;font-size:15.5px}

  /* profile gate */
  .pg-wrap{max-width:640px;margin:0 auto;padding:40px 4px}
  .pg-title{font-size:30px;text-align:center}
  .pg-sub{color:var(--ink-soft);text-align:center;font-weight:500;margin:8px 0 26px}
  .pg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px}
  .pg-card{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:20px;padding:22px 14px;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:var(--shadow);cursor:pointer;transition:.15s}
  .pg-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--c)}
  .pg-av{width:62px;height:62px;border-radius:50%;background:var(--c);display:grid;place-items:center;font-size:32px;color:#fff}
  .pg-card.add .pg-av{background:var(--cream);color:var(--ink-soft);border:2px dashed var(--line)}
  .pg-name{font-family:var(--display);font-weight:600;font-size:16px}
  .pg-meta{font-size:13.5px;color:var(--ink-soft);font-weight:500}
  .pg-del{position:absolute;top:8px;right:10px;width:22px;height:22px;border-radius:50%;background:var(--cream);color:var(--ink-soft);display:grid;place-items:center;font-size:15px;line-height:1}
  .pg-del:hover{background:var(--bad);color:#fff}
  .pg-form{background:var(--surface);border:1.5px solid var(--line);border-radius:20px;padding:22px 24px;box-shadow:var(--shadow)}
  .pg-choices{display:flex;flex-wrap:wrap;gap:9px}
  .pg-emoji{width:46px;height:46px;border-radius:13px;background:#fff;border:1.5px solid var(--line);font-size:24px;cursor:pointer}
  .pg-emoji.on{border-color:var(--teal);background:#EAF8F6}
  .pg-swatch{width:34px;height:34px;border-radius:50%;border:3px solid transparent;cursor:pointer}
  .pg-swatch.on{border-color:var(--ink)}
  .pg-form-acts{display:flex;gap:11px;justify-content:flex-end;margin-top:20px}
  .pg-foot{display:flex;gap:11px;justify-content:center;margin-top:28px;flex-wrap:wrap}
  .pg-foot-btn{background:#fff;border:1.5px solid var(--line);border-radius:11px;padding:9px 16px;font-family:var(--display);font-weight:600;font-size:15px;color:var(--ink)}
  .pg-foot-btn:hover{background:var(--cream);border-color:var(--ink-soft)}
  .pg-foot-note{text-align:center;color:var(--ink-soft);font-size:14px;font-weight:500;margin:10px 0 0}

  /* dashboard */
  .dash-top{padding:24px 0 18px}
  #dash-hi{font-size:27px}
  .stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:13px;margin-bottom:26px}
  .stat-card{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);overflow:hidden}
  .stat-card::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--c)}
  .stat-val{font-family:var(--display);font-size:30px;font-weight:700;color:var(--ink);line-height:1}
  .stat-label{font-size:14.5px;color:var(--ink-soft);font-weight:600;margin-top:4px}
  .dash-sec{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin-bottom:16px;box-shadow:var(--shadow)}
  .dash-sec-title{font-family:var(--display);font-weight:600;font-size:17px;display:block;margin-bottom:14px}
  .bars{display:flex;flex-direction:column;gap:11px}
  .bar-row{display:flex;align-items:center;gap:12px}
  .bar-label{flex:0 0 130px;font-weight:600;font-size:15.5px}
  .bar-track{flex:1;height:14px;background:var(--cream);border-radius:30px;overflow:hidden}
  .bar-fill{height:100%;border-radius:30px;min-width:3px;transition:width .4s}
  .bar-val{flex:0 0 46px;text-align:right;font-family:var(--display);font-weight:600;font-size:15.5px}
  .recent{display:flex;flex-direction:column;gap:9px}
  .recent-row{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:13px;padding:11px 14px}
  .recent-left{flex:1;min-width:0}
  .recent-title{display:block;font-weight:600;font-size:15px}
  .recent-sub{display:block;font-size:14px;color:var(--ink-soft);font-weight:500}
  .recent-score{font-family:var(--display);font-weight:700;font-size:16px;padding:4px 12px;border-radius:10px}
  .recent-score.ok{background:var(--good-bg);color:var(--good)}
  .recent-score.no{background:var(--bad-bg);color:var(--bad)}

  /* best badge on home cards */
  .qc-best{position:absolute;top:14px;right:14px;background:var(--bar);color:#fff;border-radius:20px;padding:2px 10px;font-family:var(--display);font-size:13px;font-weight:600}

  /* player extras: bookmark + mock timer */
  .flex1{flex:1}
  .bm-btn{background:transparent;border:0;font-size:22px;line-height:1;color:var(--ink-soft);cursor:pointer;padding:0 2px}
  .bm-btn.on{color:var(--yellow)}
  .timer-bar{display:flex;align-items:center;justify-content:space-between;background:var(--bar);color:#fff;border-radius:var(--radius);padding:13px 20px;margin-bottom:16px;position:sticky;top:74px;z-index:10;box-shadow:var(--shadow)}
  .timer-label{font-family:var(--display);font-weight:600;font-size:15.5px}
  .timer-val{font-family:var(--display);font-weight:700;font-size:24px}
  .timer-val.low{color:var(--orange);font-weight:800}
  .timer-val.critical{color:var(--bad);animation:pulse .7s infinite alternate}
  @keyframes pulse{from{opacity:1}to{opacity:.5}}

  /* dashboard top row */
  .top-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:13px;margin-bottom:16px}
  .top-card{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;gap:2px}
  .top-card::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--c)}
  .top-card.center{align-items:center;text-align:center}
  .top-label{font-family:var(--display);font-weight:600;font-size:14.5px;color:var(--ink-soft)}
  .top-big{font-family:var(--display);font-size:38px;font-weight:700;line-height:1.05;color:var(--ink)}
  .top-unit{font-size:14.5px;color:var(--ink-soft);font-weight:600}
  .top-hint{font-size:15px;color:var(--ink-soft);font-weight:500;margin:6px 0}
  .top-date{margin-top:8px;border:1.5px solid var(--line);border-radius:9px;padding:6px 9px;font-family:var(--body);font-size:14.5px;color:var(--ink);background:#fff;width:100%}
  .goal-ring{width:84px;height:84px;margin:4px 0}
  .ring-bg{fill:none;stroke:var(--cream);stroke-width:7}
  .ring-fg{fill:none;stroke:var(--c);stroke-width:7;stroke-linecap:round;transition:stroke-dashoffset .5s}
  .ring-text{font-family:var(--display);font-weight:700;font-size:15px;fill:var(--ink)}
  .goal-ctl{display:flex;align-items:center;gap:8px;margin-top:4px}
  .goal-num{font-family:var(--display);font-weight:600;font-size:14.5px;color:var(--ink-soft);min-width:48px}

  .dash-acts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}

  /* line chart */
  .line-chart{width:100%;height:auto;display:block}
  .line-chart .grid{stroke:var(--line);stroke-width:1}
  .line-chart .line{fill:none;stroke:var(--teal);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
  .line-chart .dot{fill:var(--teal)}
  .line-chart .chart-axis{fill:var(--ink-soft);font-family:var(--body);font-size:10px}
  .line-chart .chart-val{fill:var(--ink);font-family:var(--display);font-size:10px;font-weight:600}

  /* focus area */
  .focus-card{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
  .focus-text{font-size:15.5px;font-weight:500}

  /* achievements */
  .ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:11px}
  .ach{background:var(--cream-2);border:1.5px solid var(--line);border-radius:14px;padding:14px 8px;text-align:center;opacity:.45;filter:grayscale(1);position:relative;cursor:help;transition:.2s}
  .ach:hover{opacity:.6}
  .ach::after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--cream);padding:8px 12px;border-radius:8px;white-space:nowrap;font-size:.8rem;font-weight:500;z-index:1000;opacity:0;pointer-events:none;transition:opacity .2s;margin-bottom:8px;box-shadow:0 4px 12px rgba(0,0,0,.15)}
  .ach:hover::after{opacity:1}
  .ach::before{content:'';position:absolute;bottom:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--ink);opacity:0;pointer-events:none;transition:opacity .2s;margin-bottom:-2px;z-index:1000}
  .ach:hover::before{opacity:1}
  .ach.on{opacity:1;filter:none;border-color:var(--teal);background:#fff}
  .ach.on:hover::after{content:attr(data-tooltip);opacity:1}
  .ach-ic{display:block;font-size:26px;line-height:1;margin-bottom:5px}
  .ach-lb{display:block;font-family:var(--display);font-weight:600;font-size:13.5px;color:var(--ink)}

  /* dev bar */
  
  
  
  
  
  
  
  
  
  

  main{max-width:1120px;margin:0 auto;padding:0 22px 96px}
  .section-title{font-size:25px;margin:0 0 3px;color:var(--ink)}
  .section-sub{color:var(--ink-soft);font-size:15.5px;margin:0 0 18px;font-weight:500}

  /* hero + quiz grid (student) */
  .hero{text-align:center;padding:42px 16px 28px}
  .hero h1{font-size:33px}
  .hero p{color:var(--ink-soft);font-size:16px;max-width:560px;margin:9px auto 0;font-weight:500}
  .hero .pills{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:16px}
  .hero .pill{background:#fff;border:1.5px solid var(--line);border-radius:30px;padding:5px 14px;font-family:var(--display);font-size:14.5px;font-weight:600;color:var(--ink-soft);box-shadow:var(--shadow);cursor:pointer;transition:all .12s}
  .hero .pill:hover{border-color:var(--teal);color:var(--ink);transform:translateY(-1px)}
  .hero .pill.active{background:var(--teal);border-color:var(--teal);color:#fff}
  .quiz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:16px}
  .quiz-card{position:relative;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:22px;padding:20px 20px 17px;display:flex;flex-direction:column;gap:5px;box-shadow:var(--shadow);transition:.16s;overflow:hidden;cursor:pointer}
  .quiz-card::before{content:"";position:absolute;inset:0 0 auto 0;height:7px;background:var(--green)}
  .quiz-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--green)}
  .qc-icon{font-size:36px;line-height:1;margin:6px 0 4px}
  .qc-subject{font-family:var(--display);font-size:13.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--green)}
  .qc-title{font-size:20px;color:var(--ink)}
  .qc-blurb{color:var(--ink-soft);font-size:15px;font-weight:500;margin:2px 0 0;flex:1}
  .qc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding-top:12px;border-top:1.5px solid var(--line)}
  .qc-count{font-size:14.5px;color:var(--ink-soft);font-weight:600}
  .qc-go{font-family:var(--display);font-weight:600;color:var(--c)}

  /* quiz view */
  .quiz-top{display:flex;align-items:center;gap:14px;padding:20px 0 14px}
  .back-btn{background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:9px 16px;font-family:var(--display);font-weight:600;font-size:15.5px;color:var(--ink);box-shadow:var(--shadow)}
  .back-btn:hover{background:var(--cream)}
  .quiz-heading{display:flex;flex-direction:column;line-height:1.15}
  #quiz-subject{font-family:var(--display);font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--green)}
  #quiz-name{font-size:26px}
  .result-banner{border-radius:var(--radius);padding:22px;text-align:center;margin-bottom:18px;color:#fff;box-shadow:var(--shadow)}
  .result-banner.pass{background:linear-gradient(135deg,var(--green),var(--teal))}
  .result-banner.fail{background:linear-gradient(135deg,var(--orange),var(--pink))}
  .result-score{font-family:var(--display);font-size:40px;font-weight:700;line-height:1}
  .result-pct{font-weight:600;margin-top:6px;opacity:.95}
  .quiz-actions{display:flex;gap:11px;justify-content:flex-end;margin-top:18px;flex-wrap:wrap}

  /* library (dev) */
  
  .count-pill{background:var(--orange);color:#fff;border-radius:30px;padding:2px 13px;font-family:var(--display);font-size:15.5px;font-weight:600}
  
  
  
  
  
  
  
  

  /* details card (dev editor) */
  .details-card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin-bottom:30px;box-shadow:var(--shadow)}
  .details-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
  .details-grid .dg-wide{grid-column:1/-1}
  .add-card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin-bottom:30px;box-shadow:var(--shadow)}
  .add-actions{display:flex;gap:11px;justify-content:flex-end;margin-top:18px;flex-wrap:wrap}
  .import-bar{display:flex;align-items:center;gap:12px;background:var(--cream-2);border:1.5px dashed var(--line);border-radius:14px;padding:12px 16px;margin-bottom:18px;flex-wrap:wrap}
  
  
  
  
  
  
  .meta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-top:6px}
  .meta-grid .pts-in{max-width:none;width:100%}
  .img-wrap{display:flex;align-items:center;gap:12px;margin-top:6px}
  .img-thumb{max-height:70px;border-radius:10px;border:1.5px solid var(--line)}
  .play-image{display:block;max-width:100%;border-radius:12px;margin-bottom:14px;border:1.5px solid var(--line)}
  .add-preview{border:1.5px dashed var(--line);border-radius:14px;padding:14px;background:var(--cream-2);margin-bottom:4px}
  .add-preview .play-card{margin-bottom:0;box-shadow:none}
  .pv-head{display:flex;justify-content:flex-end;margin-bottom:10px}
  .pv-seg{display:inline-flex;gap:3px;background:var(--cream);border:1.5px solid var(--line);border-radius:24px;padding:3px}
  .pv-seg-btn{border:none;background:transparent;border-radius:20px;padding:5px 14px;font-family:var(--display);font-weight:600;font-size:.88rem;color:var(--ink-soft);cursor:pointer}
  .pv-seg-btn.on{background:var(--teal);color:#fff}
  .pv-actions{display:flex;gap:10px;margin-top:12px}
  .pv-actions .primary-btn,.pv-actions .ghost-btn{width:auto}
  .pv-hint{display:block;font-size:.88rem;color:var(--ink-soft);margin-bottom:10px}
  .pv-setlist{display:flex;flex-direction:column;gap:8px}
  .pv-opt{display:flex;align-items:center;gap:10px;text-align:left;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);font-family:var(--body);font-size:.95rem;cursor:pointer;transition:border-color .12s,background .12s}
  .pv-opt:hover{border-color:var(--teal)}
  .pv-opt.correct{border-color:var(--good);background:var(--good-bg)}
  .pv-mark{flex:0 0 18px;color:var(--good);font-weight:700}
  .q-quick{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
  .q-quick-foot{display:flex;gap:10px;justify-content:flex-end;margin-top:8px}
  .q-quick-foot .ghost-btn{width:auto}
  .preview-empty{color:var(--ink-soft);font-size:15px;font-weight:500}
  .q-diff{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;border-radius:6px;padding:1px 8px}
  .q-diff.easy{background:var(--good-bg);color:var(--good)}
  .q-diff.medium{background:#FFF3DD;color:var(--orange)}
  .q-diff.hard{background:var(--bad-bg);color:var(--bad)}
  
  
  
  
  
  
  .import-bar-text{font-size:15.5px;font-weight:600;color:var(--ink-soft)}
  .csv-preview{margin-top:14px;border-top:1.5px solid var(--line);padding-top:12px}
  .csv-ok{font-family:var(--display);font-weight:600;color:var(--good);font-size:15.5px;margin-bottom:8px}
  .csv-errs{background:var(--bad-bg);border:1.5px solid #f0cdc8;border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:3px}
  .csv-err-title{font-family:var(--display);font-weight:600;color:var(--bad);font-size:14.5px}
  .csv-err{font-size:14px;color:var(--ink)}
  #csv-template{margin:4px 0 4px}
  #csv-file{margin-bottom:6px}

  /* type picker (dev editor) */
  .type-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:13px;margin-bottom:34px}
  .type-card{position:relative;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:16px 16px 15px;display:flex;flex-direction:column;gap:4px;box-shadow:var(--shadow);transition:.15s;overflow:hidden}
  .type-card::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--c)}
  .type-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--c)}
  .tc-icon{font-size:27px;line-height:1;margin-bottom:3px}
  .tc-name{font-family:var(--display);font-weight:600;font-size:15.5px}
  .tc-hint{font-size:14px;color:var(--ink-soft);line-height:1.35;font-weight:500}

  /* question cards (dev editor) */
  .list-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
  #q-list{display:flex;flex-direction:column;gap:12px}
  .q-card{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:15px 18px 15px 21px;box-shadow:var(--shadow)}
  .q-card::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;border-radius:var(--radius) 0 0 var(--radius);background:var(--c)}
  .q-card-top{display:flex;align-items:center;gap:9px;margin-bottom:7px}
  .q-num{font-family:var(--display);font-weight:600;color:var(--ink-soft);font-size:15.5px}
  .q-badge{background:color-mix(in srgb,var(--c) 16%,#fff);color:var(--ink);border-radius:9px;padding:3px 11px;font-size:14px;font-weight:700;font-family:var(--display)}
  .q-card-body{font-size:15.5px;margin-bottom:12px;white-space:pre-wrap;overflow-wrap:anywhere;font-weight:500}
  .q-actions{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
  .ed-foot{display:flex;gap:11px;justify-content:flex-end;margin-top:24px;flex-wrap:wrap}

  .mini-btn{background:var(--cream-2);border:1.5px solid var(--line);border-radius:10px;padding:6px 13px;font-family:var(--display);font-size:14.5px;font-weight:600;color:var(--ink);min-width:72px;flex-shrink:0;cursor:pointer;text-align:center}
  .mini-btn:hover{background:var(--cream);border-color:var(--ink-soft)}
  .mini-btn.danger{color:var(--bad)}.mini-btn.danger:hover{background:var(--bad-bg);border-color:var(--bad)}
  .empty{background:var(--cream-2);border:2px dashed var(--line);border-radius:var(--radius);padding:40px 24px;text-align:center;color:var(--ink-soft);font-weight:500}

  /* ── Full-screen loading overlay ───────────────────────────────────────── */
  .loading-overlay{position:fixed;left:0;right:0;bottom:0;top:60px;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;background:var(--cream);animation:loFadeIn .2s ease both}
  .loading-card{background:var(--surface,#fff);border:1.5px solid var(--line);border-radius:24px;box-shadow:var(--shadow-lg);padding:36px 28px 30px;max-width:380px;width:100%;text-align:center}
  .loading-icon-wrap{margin:0 auto 20px;width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,rgba(59,130,246,.12),rgba(139,92,246,.12));display:flex;align-items:center;justify-content:center;position:relative}
  .loading-icon{font-size:34px;line-height:1;animation:loPulse 2.4s ease-in-out infinite}
  .loading-ring{position:absolute;inset:0;border-radius:50%;border:2.5px solid transparent;border-top-color:var(--blue);border-right-color:rgba(59,130,246,.3);animation:loSpin 1.1s linear infinite}
  .loading-title{font-family:var(--display);font-size:1.1em;font-weight:700;color:var(--ink);margin:0 0 5px}
  .loading-sub{font-size:.83em;color:var(--ink-soft);margin:0 0 22px;font-weight:500}
  .loading-dots{display:flex;justify-content:center;gap:6px;margin-bottom:24px}
  .loading-dot{width:8px;height:8px;border-radius:50%;background:var(--blue);opacity:.25;animation:loDot 1.4s ease-in-out infinite}
  .loading-dot:nth-child(2){animation-delay:.2s}
  .loading-dot:nth-child(3){animation-delay:.4s}
  .loading-tip-card{background:var(--cream,#F0F4FA);border-radius:14px;padding:14px 16px;text-align:left}
  .loading-tip-label{display:block;font-size:.7em;font-weight:800;text-transform:uppercase;letter-spacing:.09em;color:var(--blue);margin-bottom:7px}
  .loading-tip-text{margin:0;font-size:.88em;line-height:1.6;color:var(--ink);font-weight:500;min-height:2.8em;transition:opacity .4s ease}
  .loading-tip-text.tip-fade{opacity:0}
  .loading-close-btn{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;box-shadow:var(--shadow)}
  .loading-close-btn:hover{background:var(--cream-2);color:var(--ink);border-color:var(--ink-soft)}
  @keyframes loFadeIn{from{opacity:0}to{opacity:1}}
  @keyframes loPulse{0%,100%{transform:scale(.92);opacity:.7}50%{transform:scale(1.06);opacity:1}}
  @keyframes loSpin{to{transform:rotate(360deg)}}
  @keyframes loDot{0%,80%,100%{opacity:.2;transform:scale(.7)}40%{opacity:1;transform:scale(1)}}
  @keyframes spin{to{transform:rotate(360deg)}}

  /* shared form bits */
  .field-label{display:block;font-family:var(--display);font-size:15px;font-weight:600;color:var(--ink);margin:15px 0 6px}
  .mini-label{font-family:var(--display);font-size:13.5px;font-weight:600;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;margin:11px 0 6px}
  .text-in,.text-answer,.ta,.pts-in,select{width:100%;border:1.5px solid var(--line);border-radius:11px;padding:10px 12px;font-size:15.5px;font-family:var(--body);font-weight:500;color:var(--ink);background:#fff}
  .ta{resize:vertical;min-height:62px;line-height:1.5}
  .text-in:focus,.text-answer:focus,.ta:focus,select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(59,130,246,.18)}
  .inline-hint{background:#EAF8F6;border:1.5px solid #C2EAE5;color:#1A6B63;border-radius:11px;padding:9px 12px;font-size:14px;margin:7px 0;font-weight:500}
  .divider{border:0;border-top:1.5px solid var(--line);margin:20px 0}
  .opt-list{display:flex;flex-direction:column;gap:8px}
  .opt-row{display:flex;align-items:center;gap:9px}.opt-row .text-in{flex:1}
  .opt-row input[type=radio],.opt-row input[type=checkbox]{width:19px;height:19px;flex:none;accent-color:var(--teal)}
  .icon-btn{background:var(--cream-2);border:1.5px solid var(--line);border-radius:10px;width:33px;height:33px;flex:none;font-size:15px;line-height:1;color:var(--ink-soft)}
  .icon-btn:hover{background:var(--cream);color:var(--ink)}
  .add-btn{background:#fff;border:1.5px dashed var(--teal);color:#178b80;border-radius:11px;padding:8px 14px;font-family:var(--display);font-size:14.5px;font-weight:600;margin-top:9px;align-self:flex-start}
  .add-btn:hover{background:#EAF8F6}
  .cb-row{display:flex;align-items:center;gap:9px;font-size:15.5px;margin-top:11px;cursor:pointer;font-weight:500}
  .cb-row input{width:18px;height:18px;accent-color:var(--teal)}
  .seq-num{background:var(--teal);color:#fff;border-radius:8px;min-width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--display);font-size:14px;font-weight:600;flex:none}
  .pair-arrow{color:var(--ink-soft);font-weight:700}
  .seg{display:flex;gap:9px}
  .seg-btn{flex:1;background:#fff;border:1.5px solid var(--line);border-radius:11px;padding:10px;font-family:var(--display);font-weight:600;color:var(--ink-soft)}
  .seg-btn.on{background:var(--teal);color:#fff;border-color:var(--teal)}
  .pts-row{margin-top:15px}.pts-in{max-width:130px}
  .cat-box{background:var(--cream-2);border:1.5px solid var(--line);border-radius:13px;padding:12px;display:flex;flex-direction:column;gap:8px}
  .cat-head{display:flex;gap:9px;align-items:center}.cat-head .text-in{flex:1;font-weight:600;font-family:var(--display)}
  .hs-stage{position:relative;display:inline-block;max-width:100%;margin-top:11px;border:1.5px solid var(--line);border-radius:13px;overflow:hidden;user-select:none}
  .hs-img{display:block;max-width:100%;height:auto}
  .hs-region{position:absolute;border:2.5px solid var(--teal);background:rgba(59,130,246,.2)}
  .hs-region.drawing{border-style:dashed}
  .hs-region.hs-show{border-color:var(--good);background:rgba(47,179,107,.2)}
  .hs-del{position:absolute;top:-1px;right:-1px;width:24px;height:24px;border-radius:0 0 0 8px}
  .hs-marker{position:absolute;width:18px;height:18px;border-radius:50%;background:var(--bad);border:3px solid #fff;transform:translate(-50%,-50%);box-shadow:0 2px 6px rgba(0,0,0,.4)}

  /* modal */
  .modal{position:fixed;inset:0;z-index:50;display:none}.modal.open{display:block}
  .modal-backdrop{position:absolute;inset:0;background:rgba(32,42,74,.55);backdrop-filter:blur(2px)}
  .modal-panel{position:relative;background:var(--cream-2);max-width:620px;margin:34px auto;border-radius:22px;max-height:calc(100vh - 68px);display:flex;flex-direction:column;box-shadow:var(--shadow-lg);overflow:hidden}
  .modal-panel.small{max-width:400px}
  .modal-head{padding:19px 24px;border-bottom:1.5px solid var(--line);background:#fff}
  .modal-head h2{margin:0;font-size:20px}
  .modal-body{padding:8px 24px 20px;overflow-y:auto}
  .modal-foot{padding:15px 24px;border-top:1.5px solid var(--line);display:flex;justify-content:flex-end;gap:11px;background:#fff}
  

  /* player (shared) */
  .play-card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin-bottom:15px;box-shadow:var(--shadow)}
  .play-head{display:flex;align-items:center;gap:9px;margin-bottom:9px}
  .play-num{font-family:var(--display);font-weight:600;color:var(--orange);font-size:15px}
  .play-type{background:var(--cream);color:var(--ink-soft);border-radius:8px;padding:2px 10px;font-size:13.5px;font-weight:700;font-family:var(--display)}
  .play-prompt{font-size:17.5px;font-weight:600;margin-bottom:15px;overflow-wrap:anywhere;color:var(--ink)}
  .play-area{display:flex;flex-direction:column;gap:9px}
  .choice{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:13px;padding:12px 15px;font-size:15.5px;cursor:pointer;font-weight:500;transition:.12s}
  .choice:hover{border-color:var(--teal);background:var(--cream-2)}
  .choice.sel{border-color:var(--teal);background:#EAF8F6}
  .choice.good{border-color:var(--good);background:var(--good-bg)}
  .choice.bad{border-color:var(--bad);background:var(--bad-bg)}
  .choice input{width:19px;height:19px;accent-color:var(--teal)}
  .text-answer{max-width:340px}
  .solution{font-size:15px;color:#178b80;background:#EAF8F6;border-radius:10px;padding:9px 12px;margin-top:5px;font-weight:500}
  .seq-play,.match-play{display:flex;flex-direction:column;gap:9px}
  .seq-item{display:flex;align-items:center;gap:11px;border:1.5px solid var(--line);border-radius:13px;padding:10px 13px;background:#fff;font-size:15.5px;font-weight:500}
  .seq-item.good{border-color:var(--good);background:var(--good-bg)}.seq-item.bad{border-color:var(--bad);background:var(--bad-bg)}
  .match-row{display:flex;align-items:center;gap:13px}.match-left{flex:1;font-weight:600;font-size:15.5px}
  .match-sel{max-width:250px}.match-sel.good{border-color:var(--good);background:var(--good-bg)}.match-sel.bad{border-color:var(--bad);background:var(--bad-bg)}
  .fill-play{font-size:16.5px;line-height:2.3;font-weight:500}
  .blank-input{display:inline-block;width:auto;border:0;border-bottom:2.5px solid var(--teal);border-radius:6px 6px 0 0;padding:2px 6px;font-size:15.5px;font-family:var(--body);font-weight:600;background:#EAF8F6;text-align:center}
  .blank-input.good{border-color:var(--good);background:var(--good-bg)}.blank-input.bad{border-color:var(--bad);background:var(--bad-bg)}
  .inline-sel{display:inline-block;width:auto;padding:4px 8px;font-size:15.5px;margin:0 3px;border-radius:9px}
  .inline-sel.good{border-color:var(--good);background:var(--good-bg)}.inline-sel.bad{border-color:var(--bad);background:var(--bad-bg)}
  .chip-bank{display:flex;flex-wrap:wrap;gap:9px;min-height:22px;margin-bottom:11px}
  .chip{background:#fff;border:1.5px solid var(--line);border-radius:11px;padding:8px 15px;font-size:15.5px;font-weight:600;font-family:var(--display);cursor:grab;user-select:none;box-shadow:0 2px 5px rgba(32,42,74,.06)}
  .chip:hover{border-color:var(--teal)}.chip.good{border-color:var(--good);background:var(--good-bg)}.chip.bad{border-color:var(--bad);background:var(--bad-bg)}
  /* Mock builder: unselected = light, selected (active) = teal */
  .mock-sub-grid .chip,.mock-count-row .chip{background:rgba(255,255,255,.6);border-color:var(--line);color:var(--ink-soft);cursor:pointer}
  .mock-sub-grid .chip:hover,.mock-count-row .chip:hover{background:rgba(255,255,255,.8)}
  .mock-sub-grid .chip.active,.mock-count-row .chip.active{background:var(--teal);border-color:var(--teal);color:#fff;cursor:pointer}
  .mock-sub-grid .chip.active:hover,.mock-count-row .chip.active:hover{opacity:.88}
  /* weekly heatmap */
  .heatmap{display:flex;gap:8px;margin-top:8px}
  .hm-cell{width:40px;height:40px;border-radius:9px;background:rgba(255,255,255,.1);border:1.5px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;cursor:default}
  .hm-cell.active{background:var(--teal);border-color:var(--teal)}
  .hm-day{font-family:var(--display);font-weight:700;font-size:.75rem;color:var(--ink-soft)}
  .hm-cell.active .hm-day{color:#fff}
  .time-row{display:flex;gap:20px;justify-content:space-between;margin-top:12px;padding:10px 0;border-top:1.5px solid var(--line);font-family:var(--display);font-weight:600;font-size:.95rem;color:var(--ink-soft)}
  .time-label{flex:1;text-align:center}
  /* mock history */
  .mocks-list{display:flex;flex-direction:column;gap:12px;margin-top:12px;margin-bottom:16px}
  .mock-row{display:flex;justify-content:space-between;align-items:center;background:var(--cream-2);border:1.5px solid var(--line);border-radius:16px;padding:15px 18px;gap:14px;box-shadow:0 2px 6px rgba(32,42,74,.08)}
  .mock-left{display:flex;gap:14px;align-items:center;flex:1;min-width:0}
  .mock-num{font-family:var(--display);font-weight:700;font-size:1.2rem;color:var(--teal);min-width:36px;text-align:center}
  .mock-info{display:flex;flex-direction:column;gap:3px;min-width:0}
  .mock-date{font-family:var(--display);font-weight:700;font-size:.98rem;color:var(--ink)}
  .mock-sub{font-size:.85rem;color:var(--ink-soft);font-weight:500}
  .mock-stats{display:flex;gap:14px;align-items:center;justify-content:flex-end;flex-shrink:0}
  .mock-score{font-family:var(--display);font-weight:700;font-size:1.15rem;padding:7px 12px;border-radius:11px;background:var(--cream);min-width:50px;text-align:center}
  .mock-score.good{color:var(--good);background:var(--good-bg)}
  .mock-score.ok{color:var(--orange);background:rgba(255,152,0,.12)}
  .mock-score.bad{color:var(--bad);background:var(--bad-bg)}
  .mock-time{font-family:var(--display);font-weight:600;font-size:.9rem;color:var(--ink-soft);min-width:55px;text-align:right}
  /* reports section */
  .cat-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:13px}
  .cat-col{display:flex;flex-direction:column;gap:7px}.cat-col-title{font-family:var(--display);font-weight:600;font-size:15.5px;text-align:center}
  .drop-zone{min-height:70px;border:2.5px dashed var(--line);border-radius:13px;padding:10px;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}
  .drop-zone.over{border-color:var(--teal);background:#EAF8F6}
  .word-gap{display:inline-block;min-width:70px;border-bottom:2.5px solid var(--teal);margin:0 4px;text-align:center;vertical-align:middle}
  .word-gap.empty{background:#EAF8F6;border-radius:6px 6px 0 0}.word-gap.over{background:#D7F1ED}
  .feedback{margin-top:15px;border-radius:13px;padding:13px 16px;font-size:15.5px;font-weight:500}
  .feedback.ok{background:var(--good-bg);border:1.5px solid #BCE6CC}.feedback.no{background:var(--bad-bg);border:1.5px solid #F2CBC7}
  .fb-tag{font-family:var(--display);font-weight:700;margin-bottom:5px;font-size:15px}
  .feedback.ok .fb-tag{color:var(--good)}.feedback.no .fb-tag{color:var(--bad)}
  .fb-msg{display:block;margin-bottom:7px}
  .fb-explain{font-size:15px;color:var(--ink);background:rgba(255,255,255,.7);border-radius:9px;padding:9px 11px}
  .mdcat-tip-box{margin-top:10px;padding:10px 12px;border-radius:12px;background:#EFF6FF;border:1.5px solid #BFDBFE;border-left:4px solid var(--blue);color:var(--ink)}
  .mdcat-tip-box strong{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--blue);margin-bottom:4px}
  .mdcat-tip-box span{display:block;font-size:14px;line-height:1.5;color:var(--ink);font-weight:600}

  .primary-btn{background:var(--blue);color:#fff;border:0;border-radius:13px;padding:12px 26px;font-family:var(--display);font-size:15px;font-weight:600;box-shadow:0 5px 14px rgba(59,130,246,.35)}
  .primary-btn:hover{background:#2563EB}
  .ghost-btn{background:#fff;border:1.5px solid var(--line);border-radius:13px;padding:12px 22px;font-family:var(--display);font-size:15px;font-weight:600;color:var(--ink)}
  .ghost-btn:hover{background:var(--cream)}

  .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--bar);color:#fff;padding:11px 20px;border-radius:30px;font-family:var(--display);font-size:15.5px;font-weight:600;opacity:0;transition:.25s;pointer-events:none;z-index:90;box-shadow:var(--shadow-lg)}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.toast.err{background:var(--bad)}

  /* ===== In-app dialog (alert / confirm replacement) ===== */
  .ui-dialog{position:fixed;inset:0;z-index:300;display:none;align-items:center;justify-content:center;padding:20px}
  .ui-dialog.open{display:flex}
  .ui-dialog-backdrop{position:absolute;inset:0;background:rgba(26,34,56,.55);backdrop-filter:blur(3px);animation:uiDlgFade .18s ease}
  .ui-dialog-card{position:relative;width:100%;max-width:420px;background:var(--surface);color:var(--ink);
    border-radius:22px;box-shadow:var(--shadow-lg);padding:26px 24px 20px;text-align:left;
    animation:uiDlgPop .2s cubic-bezier(.18,.9,.32,1.28)}
  .ui-dialog-title{font-family:var(--display);font-weight:700;font-size:1.18rem;line-height:1.3;margin-bottom:9px;color:var(--ink)}
  .ui-dialog-title:empty{display:none}
  .ui-dialog-msg{font-family:var(--body);font-size:.98rem;line-height:1.5;color:var(--ink-soft);white-space:pre-line}
  .ui-dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px;flex-wrap:wrap}
  .ui-dialog-btn{font-family:var(--display);font-weight:600;font-size:.95rem;border:none;cursor:pointer;
    padding:11px 20px;border-radius:26px;transition:transform .08s,filter .15s;min-width:96px}
  .ui-dialog-btn:hover{filter:brightness(1.05)}
  .ui-dialog-btn:active{transform:scale(.97)}
  .ui-dialog-btn:focus-visible{outline:3px solid rgba(59,130,246,.5);outline-offset:2px}
  .ui-dialog-cancel{background:var(--cream-2);color:var(--ink)}
  .ui-dialog-ok{background:var(--blue);color:#fff}
  .ui-dialog.danger .ui-dialog-ok{background:var(--bad)}
  .ui-dialog.alert .ui-dialog-cancel{display:none}
  @keyframes uiDlgFade{from{opacity:0}to{opacity:1}}
  @keyframes uiDlgPop{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
  :root[data-theme="dark"] .ui-dialog-cancel{background:var(--cream-2);color:var(--ink)}
  @media(max-width:480px){
    .ui-dialog-actions{flex-direction:column-reverse}
    .ui-dialog-btn{width:100%}
  }

  @media(max-width:600px){.hero h1{font-size:26px}.hero{padding:28px 12px 20px}#quiz-name{font-size:21px}}
  /* ---- timed vs practice chooser ---- */
  .mode-chooser{max-width:560px;margin:30px auto;text-align:center;display:flex;flex-direction:column;align-items:center;}
  .mode-q{font-family:'Fredoka',sans-serif;font-size:1.5rem;font-weight:600;color:var(--ink);display:block;}
  .mode-sub{color:#6B7280;margin-top:4px;display:block;}
  .mode-opts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px;width:100%;}
  .mode-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 18px;border:2px solid #E7E2D6;
    border-radius:18px;background:var(--surface,#fff);cursor:pointer;transition:transform .12s,border-color .12s,box-shadow .12s;}
  .mode-card:hover{transform:translateY(-3px);border-color:var(--teal);box-shadow:0 10px 24px rgba(59,130,246,.18);}
  .mode-ic{font-size:2.2rem;display:block;line-height:1;}
  .mode-name{font-family:'Fredoka',sans-serif;font-size:1.2rem;font-weight:600;color:var(--ink);display:block;}
  .mode-desc{font-size:.92rem;color:#6B7280;display:block;}
  .mode-back{margin-top:18px;}
  @media(max-width:520px){.mode-opts{grid-template-columns:1fr;}}

  /* ---- keep type/badge pills on one line ---- */
  .play-type,.q-badge,.qc-subject{white-space:nowrap}

  /* ---- per-option explanations (graded) ---- */
  .opt-why{font-size:14.5px;line-height:1.4;color:var(--ink-soft);margin:-3px 0 4px 32px;padding:7px 12px;border-left:3px solid var(--line);background:var(--cream-2);border-radius:0 9px 9px 0;font-weight:500}
  .opt-why.yes{color:#178b80;border-left-color:var(--good);background:var(--good-bg)}
  .opt-why-in{margin-top:5px;font-size:14.5px}
  .opt-edit{display:flex;flex-direction:column;gap:0}

  /* ---- flat result summary (sticky) ---- */
  .result-sticky{position:sticky;top:74px;z-index:12;display:flex;align-items:center;gap:16px;flex-wrap:wrap;
    background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:13px 18px;margin-bottom:16px;box-shadow:var(--shadow)}
  .rs-status{font-family:var(--display);font-weight:700;font-size:15.5px;border-radius:20px;padding:4px 14px;flex:none}
  .rs-status.pass{background:var(--good-bg);color:var(--good)}
  .rs-status.fail{background:var(--bad-bg);color:var(--bad)}
  .rs-score{font-family:var(--display);font-weight:700;font-size:26px;color:var(--ink);line-height:1}
  .rs-metric{display:flex;flex-direction:column;line-height:1.15}
  .rs-metric b{font-family:var(--display);font-size:16px;color:var(--ink)}
  .rs-metric span{font-size:13px;color:var(--ink-soft);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
  .rs-metric.warn b{color:var(--bad)}
  .rs-spacer{flex:1;min-width:8px}
  .rs-toggle{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:600;font-size:15px;color:var(--ink-soft);cursor:pointer;user-select:none;border:1.5px solid var(--line);border-radius:11px;padding:8px 13px;background:#fff}
  .rs-toggle:hover{border-color:var(--ink-soft)}
  .rs-toggle.on{background:var(--bar);color:#fff;border-color:var(--bar)}
  #quiz-body.only-wrong .play-card[data-correct="1"]{display:none}
  @media(max-width:600px){.result-sticky{top:64px}}

  /* ---- exam bar: timer + question navigator ---- */
  .exam-bar{position:sticky;top:74px;z-index:12;background:var(--bar);color:#fff;border-radius:var(--radius);padding:12px 18px;margin-bottom:16px;box-shadow:var(--shadow)}
  .timer-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .qnav{display:flex;flex-wrap:wrap;gap:7px;max-height:42vh;overflow:auto}
  .exam-head{display:flex;align-items:center;gap:10px}
  .timer-row + .exam-head{margin-top:11px;padding-top:11px;border-top:1px solid rgba(255,255,255,.14)}
  .exam-pos{font-family:var(--display);font-weight:600;color:#fff;font-size:.95rem}
  .palette-toggle{border:1.5px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#fff;border-radius:20px;padding:5px 12px;font-family:var(--display);font-weight:600;font-size:.85rem;cursor:pointer}
  .palette-toggle:hover{border-color:#fff}
  .palette{margin-top:11px;padding-top:11px;border-top:1px solid rgba(255,255,255,.14)}
  .palette.collapsed{display:none}
  .qnav-dot{width:32px;height:32px;border-radius:9px;border:1.5px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#cdd4e6;font-family:var(--display);font-weight:600;font-size:15px;line-height:1;flex:none}
  .qnav-dot:hover{border-color:#fff;color:#fff}
  .qnav-dot.done{background:var(--teal);border-color:var(--teal);color:#fff}
  .qnav-dot.flag{background:var(--orange);border-color:var(--orange);color:#fff}
  .qnav-dot.current{box-shadow:0 0 0 3px var(--yellow)}
  
  
  
  .reveal-wrap{margin-top:13px}
  .reveal-btn{background:transparent;border:1.5px dashed var(--line);color:var(--ink-soft);border-radius:13px;padding:9px 16px;font-family:var(--display);font-weight:700;font-size:.95rem;cursor:pointer}
  .reveal-btn:hover{border-color:var(--teal);color:var(--teal);border-style:solid}
  .reveal-panel{background:var(--good-bg);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:7px;position:relative}
  .reveal-tag{font-family:var(--display);font-weight:700;color:var(--good);font-size:.88rem;letter-spacing:.04em;text-transform:uppercase}
  .reveal-ans{font-family:var(--display);font-weight:700;font-size:1.1rem;color:var(--ink);background:rgba(0,0,0,.06);border-radius:9px;padding:9px 13px;border-left:3px solid var(--good)}
  .reveal-hide{align-self:flex-start;margin-top:5px;background:transparent;border:1.5px solid var(--good);color:var(--good);border-radius:11px;padding:5px 12px;font-family:var(--display);font-weight:600;font-size:.82rem;cursor:pointer}
  /* streak bar */
  .home-streak-bar{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:600;font-size:.95rem;color:var(--ink-soft);margin-bottom:10px;flex-wrap:wrap}
  .hsb-streak{color:var(--orange);font-weight:700}
  .hsb-dot{color:var(--line)}
  .hsb-goal{color:var(--ink)}
  .hsb-bar{flex:1;min-width:80px;height:6px;background:var(--line);border-radius:4px;overflow:hidden}
  .hsb-fill{height:100%;background:var(--teal);border-radius:4px;transition:width .3s}
  .home-streak-bar.done .hsb-fill{background:var(--good)}
  .home-streak-bar.done .hsb-goal{color:var(--good)}
  /* bookmark shortcut */
  .bm-shortcut{background:var(--cream-2);border:1.5px solid var(--line);color:var(--orange);border-radius:20px;padding:7px 16px;font-family:var(--display);font-weight:700;font-size:.92rem;cursor:pointer;margin-bottom:8px}
  .bm-shortcut:hover{border-color:var(--orange)}
  /* subject progress on pills */
  .pill-label{display:block}
  .pill-prog{display:block;height:3px;background:rgba(255,255,255,.25);border-radius:2px;margin-top:3px;overflow:hidden}
  .pill-prog-fill{display:block;height:100%;background:#fff;border-radius:2px}
  .pill.active .pill-prog{background:rgba(255,255,255,.3)}
  /* subject headers in grid */
  .subj-header{grid-column:1/-1;font-family:var(--display);font-weight:800;font-size:1rem;color:var(--ink-soft);letter-spacing:.05em;text-transform:uppercase;padding:18px 0 6px;border-top:1.5px solid var(--line);margin-top:6px}
  .subj-header:first-child{border-top:none;padding-top:6px}
  .unit-header{grid-column:1/-1;font-family:var(--display);font-weight:700;font-size:.82rem;color:var(--brand,#0a8);letter-spacing:.04em;text-transform:uppercase;padding:10px 0 2px;opacity:.85}
  /* completion badge on card */
  .qc-done{position:absolute;top:10px;right:10px;font-family:var(--display);font-weight:700;font-size:.75rem;color:var(--c);background:color-mix(in srgb,var(--c) 12%,var(--surface));border-radius:20px;padding:3px 9px;border:1.5px solid var(--c)}
  /* completed quiz: green check ribbon + tint */
  .quiz-card.quiz-complete::after{content:"\2713";position:absolute;top:8px;left:8px;width:22px;height:22px;border-radius:50%;background:var(--good);color:#fff;font-size:13px;font-weight:700;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.2);z-index:2}
  .quiz-card.quiz-complete{border-color:var(--good)}
  .quiz-done-btn.on{background:var(--good);color:#fff;border-color:var(--good)}
  :root[data-theme="dark"] .quiz-done-btn.on{background:var(--good);color:#0d1b17}
  /* instant-check button */
  .check-wrap{margin-top:11px}
  .check-btn{background:var(--teal);color:#fff;border:none;border-radius:13px;padding:10px 20px;font-family:var(--display);font-weight:700;font-size:1rem;cursor:pointer}
  .check-btn:hover{opacity:.88}
  .check-fb{margin-top:11px}
  /* mock builder */
  .mock-sub-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
  .mock-count-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;align-items:center}
  .mock-num-input{width:88px;padding:8px 10px;border-radius:10px;border:1.5px solid var(--line);background:#fff;color:var(--ink);font-size:14px;font-family:inherit}
  .mock-num-input:focus{outline:none;border-color:var(--teal)}
  
  
  
  .paged-pos{font-family:var(--display);font-weight:600;color:var(--ink-soft);font-size:1rem;align-self:center;margin:0 auto}
  .qnav-dot.flag::after{content:"\2691";position:absolute}
  .qnav-key{display:flex;gap:14px;margin-top:10px;font-size:13px;font-weight:600;color:#9aa6c4}
  .qnav-key i{font-style:normal}
  .qnav-key .k{display:inline-block;width:11px;height:11px;border-radius:3px;vertical-align:-1px;margin-right:5px}
  .flag-btn{background:transparent;border:0;font-size:20px;line-height:1;color:var(--ink-soft);cursor:pointer;padding:0 2px}
  .flag-btn.on{color:var(--orange)}
  @media(max-width:600px){.exam-bar{top:64px}}

  /* ---- topic mastery + drill ---- */
  .topic-row{display:flex;align-items:center;gap:12px}
  .topic-row .bar-label{flex:0 0 150px}
  .topic-drill{background:var(--cream-2);border:1.5px solid var(--line);border-radius:9px;padding:5px 11px;font-family:var(--display);font-weight:600;font-size:14px;color:var(--ink);flex:none}
  .topic-drill:hover{background:var(--cream);border-color:var(--teal)}

  /* ---- onboarding (empty dashboard) ---- */
  .onboard{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:26px 24px;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-top:6px}
  .onboard-k{font-family:var(--display);font-weight:600;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--teal)}
  .onboard-h{font-family:var(--display);font-weight:600;font-size:21px;color:var(--ink)}
  .onboard-p{color:var(--ink-soft);font-size:15.5px;font-weight:500;margin:0 0 8px}
  .onboard-rec{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:14px;padding:12px 16px;width:100%;cursor:pointer;background:var(--cream-2);transition:.14s}
  .onboard-rec:hover{border-color:var(--c,var(--teal));transform:translateY(-2px);box-shadow:var(--shadow)}
  .onboard-rec .or-ic{font-size:30px;line-height:1}
  .onboard-rec .or-t{font-family:var(--display);font-weight:600;font-size:16px;color:var(--ink)}
  .onboard-rec .or-s{font-size:14px;color:var(--ink-soft);font-weight:500}
  .onboard-rec .or-go{margin-left:auto;font-family:var(--display);font-weight:600;color:var(--teal)}

  .pacing-tag{font-family:var(--display);font-weight:700;font-size:12.5px;letter-spacing:.03em;text-transform:uppercase;border-radius:7px;padding:2px 8px}
  .pacing-tag.ok{background:var(--good-bg);color:var(--good)}
  .pacing-tag.over{background:var(--bad-bg);color:var(--bad)}

  /* ---- quiz swipe navigation ---- */
  .quiz-swipe-hint{display:block;text-align:center;color:var(--ink-soft);font-family:var(--display);font-weight:600;font-size:.88rem;margin:8px 0 14px}
  .play-card.quiz-swipe-card{touch-action:pan-y;user-select:none}

  /* ===== Quiz side nav arrows (desktop) ===== */
  .quiz-page-shell{display:flex;align-items:center;gap:14px}
  .quiz-page-col{flex:1;min-width:0}
  .quiz-side-nav{display:none;flex:0 0 auto;width:46px;height:46px;border-radius:50%;
    border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font-size:19px;font-weight:700;
    align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow);
    transition:transform .12s ease,filter .15s ease,opacity .15s ease}
  .quiz-side-nav:hover:not(:disabled){transform:scale(1.08);filter:brightness(1.05)}
  .quiz-side-nav:active:not(:disabled){transform:scale(.96)}
  .quiz-side-nav:disabled{opacity:.3;cursor:default}
  .quiz-side-nav:focus-visible{outline:3px solid rgba(59,130,246,.5);outline-offset:2px}
  @media(min-width:900px){.quiz-side-nav{display:flex}.quiz-swipe-hint{display:none}}

  /* ===== FLASHCARDS ===== */
  .wrap{max-width:920px;margin:0 auto;padding:0 4px}
  .fc-reviewbar{margin-top:14px;display:flex;justify-content:center}
  .fc-reviewbar .primary-btn{width:auto}
  /* study session */
  .study-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
  .study-exit{padding:6px 12px}
  .study-prog{font-family:var(--display);font-weight:600;color:var(--ink-soft)}
  .study-card{max-width:640px;margin:0 auto;min-height:260px;perspective:1100px;cursor:pointer;touch-action:pan-y;user-select:none}
  .study-card-inner{position:relative;width:100%;min-height:260px;transition:transform .55s ease;transform-style:preserve-3d}
  .study-card.flipped .study-card-inner{transform:rotateY(180deg)}
  .study-card-face{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;
    background:var(--surface);border:2px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:34px 26px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:auto}
  .study-card:hover .study-card-face{border-color:var(--teal)}
  .study-card-back{background:linear-gradient(180deg,var(--cream-2),var(--surface));border-color:var(--teal);transform:rotateY(180deg)}
  .study-face{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}
  .study-text{font-family:var(--display);font-size:1.5rem;font-weight:600;color:var(--ink);line-height:1.35}
  .study-card-back .study-text{font-size:1.25rem;font-weight:500}
  .study-img{max-width:100%;max-height:200px;border-radius:12px}
  .study-hint{font-size:.92rem;color:var(--ink-soft)}
  .study-swipe-hint{max-width:640px;margin:10px auto 0;text-align:center;font-size:.86rem;color:var(--ink-soft);font-weight:600}
  .study-flip{max-width:640px;margin:16px auto 0;display:block}
  .study-rate{max-width:640px;margin:16px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .rate-btn{display:flex;flex-direction:column;gap:2px;padding:14px 6px;border:none;border-radius:14px;cursor:pointer;color:#fff;font-family:var(--display);transition:transform .1s,filter .1s}
  .rate-btn:hover{transform:translateY(-2px);filter:brightness(1.05)}
  .rate-btn .rate-l{font-size:1.05rem;font-weight:600}
  .rate-btn .rate-s{font-size:.72rem;opacity:.85}
  .rate-btn.again{background:var(--orange)} .rate-btn.good{background:var(--green)} .rate-btn.easy{background:var(--green)}
  .study-summary{max-width:560px;margin:30px auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
  .study-emoji{font-size:3rem}
  .study-done-h{font-family:var(--display);font-size:1.5rem;font-weight:600;color:var(--ink)}
  .study-done-sub{color:var(--ink-soft)}
  /* dashboard tabs — scrollable for 6 tabs */
  .dash-tabs{display:flex;gap:4px;background:var(--cream);border:1.5px solid var(--line);border-radius:30px;padding:4px;margin-bottom:20px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .dash-tabs::-webkit-scrollbar{display:none}
  .dash-tab{border:none;background:transparent;border-radius:24px;padding:7px 16px;font-family:var(--display);font-weight:600;font-size:.88rem;color:var(--ink-soft);cursor:pointer;white-space:nowrap;flex-shrink:0}
  .dash-tab.active{background:var(--teal);color:#fff}
  /* summary band (overview top row) */
  .dash-summary-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:18px}
  .dash-summary-card{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;gap:3px}
  .dash-summary-card::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--c,var(--teal))}
  .dash-summary-center{align-items:center;text-align:center}
  .dash-summary-countdown .top-big{font-size:2.4rem}
  /* stat sublabel */
  .stat-sublabel{font-size:11px;color:var(--ink-soft);font-weight:500;margin-top:2px}
  /* dashboard footer */
  .dash-footer{margin-top:24px;padding-top:16px;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:10px}
  .dash-reset-footer{background:transparent;border:none;color:var(--ink-soft);font-size:13px;font-weight:500;cursor:pointer;text-align:left;padding:0;opacity:.7}
  .dash-reset-footer:hover{opacity:1;color:var(--bad)}
  .fc-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
  @media(max-width:640px){.fc-stat-grid{grid-template-columns:1fr 1fr}}
  /* fc panels */
  .fc-panel{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;margin-bottom:14px}
  .fc-panel-h{font-family:var(--display);font-weight:600;color:var(--ink);display:block;margin-bottom:10px}
  .fc-panel-h-row{display:flex;align-items:center;gap:8px;margin-bottom:10px}
  .count-pill{background:var(--cream);border:1px solid var(--line);border-radius:20px;padding:1px 10px;font-size:.85rem;font-weight:600;color:var(--ink-soft)}
  .fc-bar-row{display:flex;align-items:center;gap:10px;margin:7px 0}
  .fc-bar-label{width:120px;font-size:.92rem;color:var(--ink-soft);flex-shrink:0}
  .fc-bar-track{flex:1;height:10px;background:var(--cream);border-radius:6px;overflow:hidden}
  .fc-bar-fill{height:100%;background:var(--teal);border-radius:6px}
  .fc-bar-val{width:42px;text-align:right;font-size:.88rem;font-weight:600;color:var(--ink)}
  .fc-deck-row,.fc-recent-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--line);flex-wrap:nowrap}
  .fc-deck-row:first-of-type,.fc-recent-row:first-of-type{border-top:none}
  .fc-deck-mid{display:flex;flex-direction:column;flex:1;min-width:0}
  .fc-deck-name,.fc-recent-name{font-weight:600;color:var(--ink)}
  .fc-deck-meta,.fc-recent-meta{font-size:.88rem;color:var(--ink-soft)}
  /* deck manager */
  .mgr-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
  .mgr-title{font-family:var(--display);color:var(--ink);margin:0}
  .mgr-head .primary-btn{width:auto}
  .mgr-tools{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap}
  .mgr-tools .text-in{flex:1;min-width:160px}
  .mgr-list{display:flex;flex-direction:column;gap:10px}
  /* deck editor card rows */
  .card-row{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px solid var(--line);border-left:5px solid var(--teal);border-radius:12px;padding:10px 12px}
  .card-row.dragging{opacity:.5} .card-row.drag-over{border-color:var(--teal);box-shadow:var(--shadow)}
  .card-mid{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
  .card-front{font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .card-back{font-size:.92rem;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .card-acts{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
  .fc-csv{margin-top:12px;border-top:1px dashed var(--line);padding-top:10px}
  .fc-csv summary{cursor:pointer;font-size:.92rem;color:var(--ink-soft);font-weight:600}
  .fc-csv .ta{margin-top:8px}
  /* ===== PODCASTS ===== */
  .pod-hint{background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:.92rem;color:var(--ink-soft);margin-bottom:14px}
  .field-hint{display:block;font-size:.82rem;color:var(--ink-soft);margin:-4px 0 8px}
  /* ===== DARK MODE ===== */
  :root[data-theme="dark"]{
    --cream:#161D2E; --cream-2:#1E2740; --surface:#222C44;
    --ink:#EAF0FF; --ink-soft:#A4AEC9; --line:#34415C;
    --good:#3FD089; --good-bg:#15302A; --bad:#FF6B5E; --bad-bg:#3A201E;
    --shadow:0 6px 18px rgba(0,0,0,.38); --shadow-lg:0 18px 44px rgba(0,0,0,.55);
  }
  :root[data-theme="dark"] body{background:var(--cream)}
  :root[data-theme="dark"] .snav-tab.active,
  :root[data-theme="dark"] .pg-emoji,
  :root[data-theme="dark"] .pg-foot-btn,
  :root[data-theme="dark"] .top-date,
  :root[data-theme="dark"] .ach.on,
  :root[data-theme="dark"] .hero .pill,
  :root[data-theme="dark"] .back-btn,
  :root[data-theme="dark"] .text-in,
  :root[data-theme="dark"] .text-answer,
  :root[data-theme="dark"] .ta,
  :root[data-theme="dark"] .pts-in,
  :root[data-theme="dark"] select,
  :root[data-theme="dark"] .add-btn,
  :root[data-theme="dark"] .seg-btn,
  :root[data-theme="dark"] .modal-head,
  :root[data-theme="dark"] .modal-foot,
  :root[data-theme="dark"] .seq-item,
  :root[data-theme="dark"] .chip,
  :root[data-theme="dark"] .ghost-btn,
  :root[data-theme="dark"] .rs-toggle,
  :root[data-theme="dark"] .result-sticky{background:var(--surface);color:var(--ink)}
  :root[data-theme="dark"] .mock-sub-grid .chip,
  :root[data-theme="dark"] .mock-count-row .chip{background:var(--surface);border-color:var(--line);color:var(--ink-soft)}
  :root[data-theme="dark"] .mock-sub-grid .chip.active,
  :root[data-theme="dark"] .mock-count-row .chip.active{background:var(--teal);border-color:var(--teal);color:#fff}
  :root[data-theme="dark"] .hm-cell{background:rgba(255,255,255,.08);border-color:var(--line)}
  :root[data-theme="dark"] .hm-cell.active{background:var(--teal);border-color:var(--teal)}
  :root[data-theme="dark"] .mock-row{background:var(--surface);border-color:var(--line)}
  :root[data-theme="dark"] .mock-score{background:var(--cream-2);color:var(--ink-soft)}
  :root[data-theme="dark"] .mock-score.good{background:var(--good-bg)}
  :root[data-theme="dark"] .mock-score.ok{background:rgba(255,152,0,.15)}
  :root[data-theme="dark"] .ach::after{background:var(--cream);color:var(--ink)}
  :root[data-theme="dark"] .ach::before{border-top-color:var(--cream)}
  :root[data-theme="dark"] .modal{background:var(--surface)}
  .theme-toggle{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font-size:1.05rem;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-right:8px;transition:transform .1s}
  .theme-toggle:hover{transform:scale(1.07)}
  .content-search{display:block;width:100%;max-width:420px;margin:0 auto 12px;padding:11px 16px;border:1.5px solid var(--line);border-radius:24px;background:var(--surface);color:var(--ink);font-family:var(--body);font-size:.95rem}
  .content-search:focus{outline:none;border-color:var(--teal)}
  .study-keys{max-width:640px;margin:14px auto 0;text-align:center;font-size:.74rem;color:var(--ink-soft);opacity:.8}
  .dash-reset{display:flex;justify-content:flex-end;margin:-6px 0 14px}
  .reset-link{background:none;border:none;color:var(--ink-soft);font-family:var(--body);font-size:.88rem;cursor:pointer;text-decoration:underline;padding:4px}
  .reset-link:hover{color:var(--bad)}
  /* dark-mode hardening: theme-level surfaces/text that were hardcoded light */
  :root[data-theme="dark"] .mode-card{border-color:var(--line)}
  :root[data-theme="dark"] .mode-sub,
  :root[data-theme="dark"] .mode-desc{color:var(--ink-soft)}
  :root[data-theme="dark"] .add-btn{background:var(--surface);color:var(--teal)}
  :root[data-theme="dark"] .add-btn:hover{background:var(--cream)}
  :root[data-theme="dark"] .solution,
  :root[data-theme="dark"] .inline-hint{background:var(--good-bg);border-color:var(--line);color:var(--good)}
  :root[data-theme="dark"] .reveal-panel{background:var(--good-bg)}
  :root[data-theme="dark"] .reveal-ans{background:rgba(255,255,255,.06);color:var(--ink)}
  /* dark: tone down bright pastel chips/badges so they don't read as white blobs */
  :root[data-theme="dark"] .q-diff.medium{background:#3A2E12;color:var(--orange)}
  :root[data-theme="dark"] .q-badge{background:color-mix(in srgb,var(--c) 30%,var(--surface));color:var(--ink)}
  :root[data-theme="dark"] .inline-hint{background:var(--good-bg);border-color:transparent;color:var(--good)}
  :root[data-theme="dark"] .solution{background:var(--good-bg);color:var(--good)}
  :root[data-theme="dark"] .feedback.ok{border-color:transparent}
  :root[data-theme="dark"] .feedback.no{border-color:transparent}
  :root[data-theme="dark"] .opt-why.yes{color:var(--good)}
  :root[data-theme="dark"] .qnav-dot:hover{border-color:var(--teal);color:#fff}

  /* dark-mode hardening: notes */
  :root[data-theme="dark"] .note-hero-card{background:linear-gradient(135deg,color-mix(in srgb,var(--c,var(--teal)) 22%,var(--surface)),var(--surface))}
  :root[data-theme="dark"] .note-chip.subject{background:color-mix(in srgb,var(--c,var(--teal)) 20%,var(--surface));border-color:color-mix(in srgb,var(--c,var(--teal)) 35%,var(--line))}
  :root[data-theme="dark"] .note-chip.medium{background:#3A2E12;color:var(--orange)}
  :root[data-theme="dark"] .mnemonic-box{background:color-mix(in srgb,var(--teal) 16%,var(--surface));border-color:var(--line)}
  :root[data-theme="dark"] .mnemonic-phrase{background:var(--surface);border-color:var(--line)}
  :root[data-theme="dark"] .note-table,
  :root[data-theme="dark"] .note-table-wrap{background:var(--surface)}
  :root[data-theme="dark"] .note-table th{background:var(--cream-2)}
  :root[data-theme="dark"] .note-timeline-card{background:linear-gradient(135deg,var(--surface),var(--cream-2))}
  :root[data-theme="dark"] .timeline-dot{border-color:var(--surface)}

  /* dark-mode hardening: score boosters / traps */
  :root[data-theme="dark"] .trap-select{background:var(--surface);color:var(--ink)}
  :root[data-theme="dark"] .trap-block.bad{background:#3A201E;border-color:var(--line)}
  :root[data-theme="dark"] .trap-block.good{border-color:var(--line)}
  :root[data-theme="dark"] .trap-block.pearl{background:#3A2E12;border-color:var(--line)}
  :root[data-theme="dark"] .trap-block.why{background:#1B2A40;border-color:var(--line)}
  :root[data-theme="dark"] .trap-back-card{background:linear-gradient(180deg,var(--surface),var(--cream-2))}
  :root[data-theme="dark"] .boosters-kicker,
  :root[data-theme="dark"] .page-kicker{background:var(--surface)}

  /* dark-mode hardening: flashcards (sfc / study cards) */
  :root[data-theme="dark"] .sfc-card,
  :root[data-theme="dark"] .sfc-body{background:var(--surface)}
  :root[data-theme="dark"] .sfc-body:hover{background:var(--cream-2)}
  :root[data-theme="dark"] .sfc-hd-btn.bookmarked{background:#3A2E12}
  :root[data-theme="dark"] .sfc-act.repeat{background:#3A201E;border-color:var(--line);color:var(--bad)}
  :root[data-theme="dark"] .sfc-act.repeat:hover:not(.disabled){background:#4a2624;border-color:var(--bad)}
  :root[data-theme="dark"] .sfc-act.done{background:#15302A;border-color:var(--line);color:var(--good)}
  :root[data-theme="dark"] .sfc-act.done:hover:not(.disabled){background:#1c3c33;border-color:var(--good)}

  /* dark-mode hardening: mock builder */
  :root[data-theme="dark"] .mock-type-card{background:var(--surface)}
  :root[data-theme="dark"] .mock-type-card.active{background:color-mix(in srgb,var(--orange) 16%,var(--surface))}
  :root[data-theme="dark"] .pmdc-pattern-table{background:var(--surface)}
  :root[data-theme="dark"] .pmdc-pattern-table tr.total td{background:color-mix(in srgb,var(--orange) 16%,var(--surface))}
  :root[data-theme="dark"] .mock-num-input{background:var(--surface);color:var(--ink)}
  :root[data-theme="dark"] .mock-score.good{background:var(--good-bg);color:var(--good)}
  :root[data-theme="dark"] .mock-score.ok{background:rgba(255,152,0,.15);color:var(--orange)}
  :root[data-theme="dark"] .mock-score.bad{background:var(--bad-bg);color:var(--bad)}


  /* ===== NOTES ===== */
  .note-card::before{background:var(--c,var(--purple))}
  .note-card:hover{border-color:var(--c,var(--purple))}
  .note-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:7px}
  .note-chip{display:inline-flex;align-items:center;border-radius:20px;padding:2px 10px;font-family:var(--display);font-weight:700;font-size:12.5px;background:var(--cream);color:var(--ink-soft);border:1px solid var(--line)}
  .note-chip.subject{background:color-mix(in srgb,var(--c,var(--teal)) 14%,#fff);color:var(--ink);border-color:color-mix(in srgb,var(--c,var(--teal)) 35%,var(--line))}
  .note-chip.easy{background:var(--good-bg);color:var(--good)}
  .note-chip.medium{background:#FFF3DD;color:var(--orange)}
  .note-chip.hard{background:var(--bad-bg);color:var(--bad)}
  .note-hero-card{background:linear-gradient(135deg,color-mix(in srgb,var(--c,var(--teal)) 18%,#fff),#fff);border:1.5px solid var(--line);border-radius:22px;padding:22px;margin-bottom:16px;box-shadow:var(--shadow)}
  .note-hero-top{display:flex;align-items:center;gap:13px;flex-wrap:wrap}
  .note-emoji-big{width:58px;height:58px;border-radius:17px;background:var(--c,var(--teal));display:grid;place-items:center;color:#fff;font-size:31px;box-shadow:var(--shadow)}
  .note-actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
  .note-section{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:18px 20px;margin-bottom:14px;box-shadow:var(--shadow);position:relative;overflow:hidden}
  .note-section::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--c,var(--teal))}
  .note-section h3{font-size:19px;margin:0 0 9px;color:var(--ink)}
  .note-section p{margin:0 0 9px;color:var(--ink);font-weight:500}
  .note-section ul{margin:8px 0 0;padding-left:22px}
  .note-section li{margin:4px 0}
  .mnemonic-box{background:#EAF8F6;border:1.5px solid #C2EAE5;border-radius:15px;padding:13px 15px;margin:9px 0}
  .mnemonic-phrase{display:inline-block;background:#fff;border-radius:11px;padding:7px 11px;margin:5px 0;font-family:var(--display);font-weight:700;color:var(--teal);border:1.5px solid var(--line)}
  .note-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border:1.5px solid var(--line);border-radius:13px;background:#fff;margin-top:8px}
  .note-table th,.note-table td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
  .note-table th{font-family:var(--display);background:var(--cream);color:var(--ink)}
  .note-table tr:last-child td{border-bottom:0}
  @media(max-width:600px){.note-actions .primary-btn,.note-actions .ghost-btn{width:100%}.note-hero-top{align-items:flex-start}.note-emoji-big{width:50px;height:50px;font-size:27px}}


/* linked practice buttons inside Notes */
.note-study-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1.5px dashed var(--line)}
.note-study-actions .primary-btn,.note-study-actions .ghost-btn{width:auto}
.note-related-meta{flex-basis:100%;font-size:14px;color:var(--ink-soft);font-weight:600}
@media(max-width:560px){.note-study-actions .primary-btn,.note-study-actions .ghost-btn{width:100%}}


/* ===== NOTE AUDIO PLAYER ===== */
  background:linear-gradient(135deg,#EAF8F6,#FFFFFF);
  border:1.5px solid var(--line);
  border-radius:16px;
  padding:14px 16px;
  margin:0 0 18px;
  box-shadow:var(--shadow);
}
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:10px;
  font-family:var(--display);
  font-weight:700;
  color:var(--ink);
}
  width:100%;
  display:block;
}
  display:block;
  margin-top:7px;
  font-size:13.5px;
  color:var(--ink-soft);
  font-weight:600;
}


/* ===== NOTE AUDIO PLAYER - FINAL ===== */
  background:linear-gradient(135deg,#EAF8F6,#FFFFFF);
  border:2px solid var(--teal);
  border-radius:16px;
  padding:14px 16px;
  margin:0 0 18px;
  box-shadow:var(--shadow);
}
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:10px;
  font-family:var(--display);
  font-weight:700;
  color:var(--ink);
}


/* ===== NOTE AUDIO PLAYER - STABLE ===== */

/* Score Boosters / MDCAT Danger Zone */
.boosters-hero{padding-bottom:18px}
.trap-filter-bar{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.retry-wrong-btn{border-color:var(--pink)!important;color:var(--pink)!important}
.retry-wrong-btn:hover{background:var(--pink)!important;color:#fff!important}
.trap-filter{display:flex;flex-direction:column;gap:4px;text-align:left}
.trap-filter-label{font-family:var(--display);font-size:12px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;padding-left:2px}
.trap-select{width:auto;min-width:150px;border:1.5px solid var(--line);border-radius:24px;padding:9px 14px;font-family:var(--display);font-size:14.5px;font-weight:600;color:var(--ink);background:#fff;box-shadow:var(--shadow);cursor:pointer}
.trap-select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(59,130,246,.18)}
.trap-select:disabled{opacity:.55;cursor:not-allowed}
@media(max-width:560px){.trap-filter-bar{gap:10px}.trap-filter{flex:1 1 100%}.trap-select{width:100%;min-width:0}}
.boosters-kicker{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:6px 14px;margin-bottom:10px;font-family:var(--display);font-weight:700;color:var(--pink);box-shadow:var(--shadow)}
.page-kicker{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:6px 14px;margin-bottom:10px;font-family:var(--display);font-weight:700;color:var(--kc,var(--blue));box-shadow:var(--shadow)}

/* Launcher — 5-card home landing screen */
.launcher-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;max-width:1120px;margin:0 auto;padding:6px 4px 40px}
.launcher-card{position:relative;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:22px;padding:24px 22px 20px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow);transition:.16s;overflow:hidden;cursor:pointer}
.launcher-card::before{content:"";position:absolute;inset:0 0 auto 0;height:7px;background:var(--c)}
.launcher-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--c)}
.launcher-ic{width:52px;height:52px;border-radius:16px;background:var(--c);color:#fff;display:grid;place-items:center;font-size:26px;margin-bottom:4px}
.launcher-title{font-family:var(--display);font-size:19px;font-weight:700;color:var(--ink)}
.launcher-blurb{color:var(--ink-soft);font-size:14px;font-weight:500;margin:0}
.launcher-foot{margin-top:auto;padding-top:10px;display:flex;align-items:center;gap:10px}
.launcher-go{color:var(--c);font-family:var(--display);font-weight:700;font-size:14px;white-space:nowrap;margin-left:auto}
.launcher-count{color:var(--ink-soft);font-weight:700;font-size:13.5px}
.launcher-badge{position:absolute;top:14px;right:14px;background:#F59E0B;color:#fff;border-radius:20px;padding:3px 11px;font-family:var(--display);font-size:11.5px;font-weight:700;letter-spacing:.01em;white-space:nowrap}
:root[data-theme="dark"] .launcher-badge{background:#B45309}
@media(max-width:600px){.launcher-grid{gap:13px;padding-bottom:26px}.launcher-card{padding:19px 17px 16px}}

/* Launcher — "or study by subject" row */
.launcher-subject-heading{text-align:center;max-width:1120px;margin:8px auto 14px;color:var(--ink-soft);font-family:var(--display);font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.05em;display:flex;align-items:center;gap:12px}
.app-footer{max-width:1120px;margin:8px auto 4px;padding-top:16px;border-top:1px solid var(--line);text-align:center;color:var(--ink-soft);font-size:12.5px;line-height:1.6}
.app-footer p{margin:2px 0}
.app-footer a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.footer-help-link{background:none;border:none;color:inherit;font:inherit;font-size:12.5px;text-decoration:underline;text-underline-offset:2px;cursor:pointer;padding:4px 0}
.footer-help-link:hover{color:var(--teal,#1fbf80)}
body[data-view="launcher"] main{padding-bottom:24px}
.launcher-subject-heading::before,.launcher-subject-heading::after{content:"";flex:1;height:1px;background:var(--line)}
.launcher-subject-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;max-width:1120px;margin:0 auto 20px;padding:0 4px}
.subject-row-card{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px solid var(--line);border-radius:16px;padding:13px 15px;box-shadow:var(--shadow);cursor:pointer;transition:.16s;text-align:left}
.subject-row-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--c)}
.subject-row-ic{width:36px;height:36px;border-radius:11px;background:var(--c);color:#fff;display:grid;place-items:center;font-size:18px;flex:none}
.subject-row-name{font-family:var(--display);font-weight:700;font-size:14.5px;color:var(--ink)}
@media(max-width:600px){.launcher-subject-grid{gap:9px;margin-bottom:14px}.subject-row-card{padding:11px 12px}}

/* Subject hub */
.hub-back{margin-bottom:14px}
.launcher-card-empty{cursor:default;opacity:.5}
.launcher-card-empty:hover{transform:none;box-shadow:var(--shadow);border-color:var(--line)}

/* Expiry warning banner */
.expiry-warn{grid-column:1/-1;background:#FEF3C7;border:1.5px solid #F59E0B;border-radius:14px;padding:12px 16px;font-size:13.5px;color:#92400E;font-weight:600;line-height:1.5;margin-bottom:4px}
.expiry-warn a{color:#B45309;font-weight:700;text-decoration:underline}
.expiry-warn strong{color:#78350F}

/* === Auth screen === */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:20px}
.auth-card{width:100%;max-width:400px;background:var(--surface);border:1.5px solid var(--line);border-radius:24px;padding:36px 32px}
@media(max-width:440px){.auth-card{padding:28px 20px;border-radius:20px}}
.auth-logo{font-size:48px;text-align:center;margin-bottom:8px}
.auth-logo-svg{display:flex;align-items:center;justify-content:center;margin-bottom:8px}.auth-logo-svg svg{width:52px;height:52px;color:var(--blue)}
.auth-title{font-family:var(--display);font-size:26px;font-weight:800;text-align:center;margin:0 0 4px;color:var(--ink)}
.auth-sub{text-align:center;color:var(--ink-soft);font-size:14px;margin:0 0 24px}
.auth-tabs{display:flex;gap:4px;background:var(--cream);border-radius:12px;padding:4px;margin-bottom:20px}
.auth-tab{flex:1;padding:8px;border:none;background:transparent;border-radius:9px;font-family:var(--display);font-size:14px;font-weight:600;color:var(--ink-soft);cursor:pointer;transition:.15s}
.auth-tab.active{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.1)}
.auth-input{width:100%;padding:11px 14px;border:1.5px solid var(--line);border-radius:12px;font-size:15px;font-family:var(--body);background:var(--bg);color:var(--ink);margin-bottom:10px;box-sizing:border-box;transition:.15s}
.auth-input:focus{outline:none;border-color:var(--blue)}
.auth-btn{width:100%;padding:12px;background:var(--blue);color:#fff;border:none;border-radius:12px;font-family:var(--display);font-size:15px;font-weight:700;cursor:pointer;margin-top:4px;transition:.15s}
.auth-btn:hover{opacity:.9}
.auth-btn:disabled{opacity:.6;cursor:not-allowed}
.auth-forgot{width:100%;padding:10px;background:none;border:none;color:var(--ink-soft);font-size:13px;cursor:pointer;margin-top:4px}
.auth-forgot:hover{color:var(--ink)}
.auth-error{background:#FEF2F2;border:1.5px solid #FCA5A5;color:#991B1B;border-radius:10px;padding:10px 14px;font-size:13.5px;margin-bottom:12px}

/* === Upgrade prompt system === */
.upgrade-card{border-color:var(--uc,#F59E0B)!important}
.upgrade-card:hover{border-color:var(--uc,#F59E0B)!important;box-shadow:0 12px 32px rgba(0,0,0,.12)}
.upgrade-card[data-uc-style="trial"]{background:linear-gradient(155deg,#fefce8 0%,#fff7ed 100%)}
.upgrade-card[data-uc-style="pro"]{background:linear-gradient(155deg,#f5f3ff 0%,#ede9fe 100%)}
:root[data-theme="dark"] .upgrade-card[data-uc-style="trial"]{background:linear-gradient(155deg,#292510 0%,#261e0d 100%)}
:root[data-theme="dark"] .upgrade-card[data-uc-style="pro"]{background:linear-gradient(155deg,#1e1230 0%,#18102a 100%)}
/* Edition badges */
.edition-badge{display:inline-flex;align-items:center;border-radius:999px;padding:3px 10px;font-family:var(--display);font-size:12px;font-weight:700;letter-spacing:.01em;margin-top:5px;width:fit-content;border:1.5px solid transparent}
.edition-badge-trial{background:#FEF3C7;color:#92400E;border-color:#F59E0B}
.edition-badge-pro{background:#EFF6FF;color:#1D4ED8;border-color:#3B82F6}
.edition-badge-extreme{background:#F5F3FF;color:#5B21B6;border-color:#8B5CF6}
:root[data-theme="dark"] .edition-badge-trial{background:#312810;color:#FCD34D;border-color:#B45309}
:root[data-theme="dark"] .edition-badge-pro{background:#172554;color:#93C5FD;border-color:#2563EB}
:root[data-theme="dark"] .edition-badge-extreme{background:#1E1230;color:#C4B5FD;border-color:#7C3AED}
/* Upgrade modal: keep it above the sticky app header and usable on short screens */
body.upgrade-modal-open{overflow:hidden}
:is(#upgrade-modal,#welcome-offer-modal){z-index:1200}
:is(#upgrade-modal,#welcome-offer-modal).open{display:flex;align-items:center;justify-content:center;padding:12px;box-sizing:border-box}
:is(#upgrade-modal,#welcome-offer-modal) .modal-backdrop{position:fixed}
:is(#upgrade-modal,#welcome-offer-modal) .modal-panel{
  width:min(680px,calc(100vw - 24px));
  max-width:680px;
  max-height:calc(100vh - 24px);
  max-height:calc(100dvh - 24px);
  margin:0;
  background:var(--cream-2);
}
:is(#upgrade-modal,#welcome-offer-modal) .modal-head{
  flex:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:17px 22px;
}
:is(#upgrade-modal,#welcome-offer-modal) .modal-head h2{font-size:20px;line-height:1.25}
.upgrade-modal-x{
  width:34px;height:34px;flex:none;border:1.5px solid var(--line);border-radius:50%;
  display:grid;place-items:center;background:var(--surface);color:var(--ink-soft);
  font:700 20px/1 var(--body);cursor:pointer;transition:.15s;
}
.upgrade-modal-x:hover{background:var(--cream);color:var(--ink);border-color:var(--ink-soft)}
:is(#upgrade-modal,#welcome-offer-modal) .modal-body{
  min-height:0;
  padding:14px 22px 18px;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
:is(#upgrade-modal,#welcome-offer-modal) .modal-foot{
  flex:none;
  padding:13px 22px;
  flex-wrap:wrap;
  align-items:center;
}
:is(#upgrade-modal,#welcome-offer-modal) .modal-foot .ghost-btn,
:is(#upgrade-modal,#welcome-offer-modal) .modal-foot .primary-btn{min-height:44px}
@media(max-height:650px){
  :is(#upgrade-modal,#welcome-offer-modal).open{padding:8px}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-panel{width:min(680px,calc(100vw - 16px));max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px)}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-head{padding:12px 18px}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-head h2{font-size:18px}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-body{padding:10px 18px 12px}
  :is(#upgrade-modal,#welcome-offer-modal) .upgrade-trial-note{padding:10px 12px;margin-bottom:10px;line-height:1.45}
  :is(#upgrade-modal,#welcome-offer-modal) .upgrade-plan-cards{gap:10px;margin-bottom:7px}
  :is(#upgrade-modal,#welcome-offer-modal) .upgrade-plan-card{padding:11px 12px}
  :is(#upgrade-modal,#welcome-offer-modal) .upgrade-plan-price{margin-bottom:8px}
  :is(#upgrade-modal,#welcome-offer-modal) .upgrade-feat-list{gap:4px}
  :is(#upgrade-modal,#welcome-offer-modal) .upgrade-feat-list li{line-height:1.3}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-foot{padding:10px 18px}
}
@media(max-width:560px){
  :is(#upgrade-modal,#welcome-offer-modal).open{padding:8px}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-panel{width:calc(100vw - 16px);max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);border-radius:18px}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-head{padding:14px 16px}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-body{padding:11px 16px 14px}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-foot{padding:11px 16px;display:grid;grid-template-columns:1fr}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-foot .ghost-btn,
  :is(#upgrade-modal,#welcome-offer-modal) .modal-foot .primary-btn{width:100%;justify-content:center}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-foot .primary-btn{grid-row:1}
}

/* Upgrade modal plan cards */
.upgrade-trial-note{font-size:14px;color:var(--ink-soft);background:var(--cream);border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:16px;line-height:1.55}
.upgrade-trial-note strong{color:var(--ink)}
.upgrade-plan-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px}
@media(max-width:520px){.upgrade-plan-cards{grid-template-columns:1fr}}
.upgrade-plan-card{border:2px solid var(--line);border-radius:14px;padding:14px 15px;background:var(--surface)}
.upgrade-plan-card.current-plan{opacity:.8}
.upgrade-plan-cards .upgrade-plan-card:nth-child(1){border-color:var(--blue)}
.upgrade-plan-cards .upgrade-plan-card:nth-child(2){border-color:var(--purple)}
.upgrade-plan-name{font-family:var(--display);font-weight:700;font-size:15.5px;color:var(--ink);margin-bottom:6px;display:flex;align-items:center;gap:7px}
.upgrade-current-tag{font-size:11px;font-weight:700;background:var(--blue);color:#fff;border-radius:999px;padding:2px 8px;letter-spacing:.02em}
.upgrade-plan-price{font-family:var(--display);font-size:20px;font-weight:700;color:var(--blue);margin-bottom:11px;line-height:1}
.upgrade-plan-price small{font-size:13px;color:var(--ink-soft);text-decoration:line-through;font-weight:500;margin-left:6px}
.upgrade-offer-chip{display:table;margin:0 auto 10px;padding:5px 11px;border-radius:999px;background:#DCFCE7;color:#166534;border:1px solid #86EFAC;font-family:var(--display);font-size:11px;font-weight:900;letter-spacing:.06em}
.upgrade-whatsapp-help{margin:12px 0 8px;padding:11px 13px;border-radius:12px;border:1.5px solid color-mix(in srgb,#16A34A 35%,var(--line));background:color-mix(in srgb,#16A34A 8%,var(--surface));display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--ink-soft);font-size:13px;line-height:1.4}
.upgrade-whatsapp-help a{color:#15803D;font-family:var(--display);font-weight:800;text-decoration:none;white-space:nowrap}
.upgrade-whatsapp-help a:hover{text-decoration:underline}
.upgrade-footer-note{font-size:12.5px;color:var(--ink-soft);text-align:center;margin:6px 0 0}
@media(max-width:520px){.upgrade-whatsapp-help{align-items:flex-start;flex-direction:column;gap:7px}.upgrade-whatsapp-help a{white-space:normal}}
.upgrade-feat-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:7px}
.upgrade-feat-list li{display:flex;align-items:flex-start;gap:7px;font-size:13px;color:var(--ink-soft);font-weight:500;line-height:1.4}
.upgrade-feat-list li::before{content:"✓";color:var(--good);font-weight:700;font-size:13px;flex-shrink:0}
.trap-progress{display:flex;align-items:center;gap:14px;margin:0 0 16px;background:var(--surface);border:1.5px solid var(--line);border-radius:17px;padding:14px 18px;box-shadow:var(--shadow)}
.trap-progress-label{font-family:var(--display);font-weight:700;font-size:14.5px;color:var(--ink);white-space:nowrap}
.trap-progress-bar{flex:1;height:8px;border-radius:99px;background:var(--cream-2);overflow:hidden}
.trap-progress-fill{height:100%;background:var(--pink);border-radius:99px;transition:width .3s ease}
@media(max-width:520px){.trap-progress{flex-direction:column;align-items:flex-start;gap:8px}.trap-progress-bar{width:100%}}
.trap-mode-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;margin-bottom:15px}
.trap-heatmap{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:16px}
.trap-heat-card{position:relative;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:17px;padding:15px 16px;box-shadow:var(--shadow);overflow:hidden;transition:.16s;color:var(--ink)}
.trap-heat-card::before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:var(--c)}
.trap-heat-card:hover{transform:none;box-shadow:var(--shadow-lg);border-color:var(--c)}
.trap-heat-title{display:block;font-family:var(--display);font-size:17px;font-weight:800;margin-top:4px}
.trap-heat-count{display:block;color:var(--ink-soft);font-weight:700;font-size:14px;margin-top:2px}
.trap-mini-bars{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.trap-mini{background:var(--cream);border:1px solid var(--line);border-radius:999px;padding:3px 9px;font-size:13px;font-weight:800;color:var(--ink-soft)}
.trap-mini.deadly{background:var(--bad-bg);color:var(--bad)}
.trap-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.trap-card{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:22px;padding:17px 18px;box-shadow:var(--shadow);overflow:hidden;transition:.16s}
.trap-card::before{content:"";position:absolute;inset:0 0 auto 0;height:7px;background:var(--c)}
.trap-card:hover{transform:none;box-shadow:var(--shadow-lg)}
.trap-card.reviewed{opacity:.82;border-color:var(--good)}
.trap-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px;flex-wrap:wrap}
.trap-badge{border-radius:999px;background:var(--bad-bg);color:var(--bad);font-family:var(--display);font-weight:800;font-size:12.5px;padding:4px 9px}
.trap-subject{color:var(--ink-soft);font-size:13px;font-weight:800;text-align:right}
.trap-title{font-size:18px;line-height:1.2;margin:12px 0 11px}
.trap-block{border:1.5px solid var(--line);border-radius:15px;padding:11px 12px;margin-top:9px;background:var(--cream-2)}
.trap-block-label{display:block;font-family:var(--display);font-size:12px;font-weight:900;letter-spacing:.05em;text-transform:uppercase;margin-bottom:4px;color:var(--ink-soft)}
.trap-block p{margin:0;color:var(--ink);font-size:14.5px;font-weight:600;line-height:1.45}
.trap-block.bad{background:#FDEBEA;border-color:#F8C9C5}
.trap-block.bad .trap-block-label{color:var(--bad)}
.trap-block.good{background:var(--good-bg);border-color:#BFE8D0}
.trap-block.good .trap-block-label{color:var(--good)}
.trap-block.pearl{background:#FFF7D8;border-color:#FFE39A}
.trap-block.pearl .trap-block-label{color:#B77900}
.trap-block.why{background:#EFF6FF;border-color:#CFE3FF}
.trap-block.why .trap-block-label{color:var(--blue)}
.trap-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1.5px solid var(--line);padding-top:12px;margin-top:13px;flex-wrap:wrap}
.trap-frequency{font-size:13.5px;font-weight:800;color:var(--ink-soft)}
@media(max-width:720px){.trap-grid{grid-template-columns:1fr}.trap-mode-row{justify-content:center}.trap-subject{text-align:left}.trap-card{padding:16px}}

/* CMS v6 structured note rendering upgrade */
.note-section .note-para{white-space:normal;line-height:1.72;margin:8px 0 10px;color:var(--ink);font-weight:500}
.note-section .note-subhead{font-size:16px;margin:16px 0 8px;color:var(--ink);font-family:var(--display);font-weight:800}
.note-rich-list{margin:8px 0 12px;padding-left:24px;line-height:1.65}
.note-rich-list li{margin:6px 0;color:var(--ink)}
.note-section .fc-panel-h{display:block;margin-bottom:10px}


/* CMS/App v6.1 note rendering improvements */
.note-table-wrap{width:100%;overflow-x:auto;margin:12px 0;border-radius:14px;border:1.5px solid var(--line);background:#fff;box-shadow:var(--shadow)}
.note-table{width:100%;border-collapse:collapse;min-width:420px;background:#fff}
.note-table th,.note-table td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;font-size:14px}
.note-table th{background:var(--cream-2);font-family:var(--display);font-weight:700;color:var(--ink)}
.note-table tr:last-child td{border-bottom:0}
.note-rich-list{margin:10px 0 0 1.2rem;padding:0}.note-rich-list li{margin:6px 0}.note-subhead{margin:16px 0 8px;font-size:1rem;color:var(--ink);font-family:var(--display)}
.note-para{margin:8px 0;line-height:1.65}
.note-related-meta{font-size:13px;color:var(--ink-soft);font-weight:600;margin-top:8px;flex-basis:100%}


/* ============================================================
   MDCAT App v6.2 UI: collapsible cards, timeline, bookmarks,
   progress widgets, smart revision mode
   ============================================================ */
.note-section.note-collapsible{padding:0;overflow:hidden;border-left:6px solid var(--c);}
.note-section-head{width:100%;border:0;background:transparent;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px 14px;color:var(--ink);font-family:var(--display);font-weight:900;font-size:18px;text-align:left;letter-spacing:.01em}
.note-section-title{font-weight:900}.note-section-chev{font-size:18px;transition:transform .18s ease;color:var(--ink-soft)}
.note-section-body{padding:0 20px 18px}.note-section.is-collapsed .note-section-body{display:none}.note-section.is-collapsed .note-section-chev{transform:rotate(-90deg)}
.note-view-tools{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 14px;align-items:center}.note-view-tools .ghost-btn{padding:8px 13px}
.note-timeline-card{background:linear-gradient(135deg,#FFFFFF,#F4F8FF)}
.timeline-list{position:relative;margin:6px 0 2px;padding-left:10px}.timeline-list:before{content:"";position:absolute;left:18px;top:8px;bottom:8px;width:3px;background:var(--line);border-radius:999px}
.timeline-item{position:relative;display:grid;grid-template-columns:46px 96px 1fr;gap:10px;align-items:start;margin:12px 0}
.timeline-dot{width:16px;height:16px;border-radius:50%;background:var(--blue);border:4px solid #fff;box-shadow:0 0 0 2px var(--blue);position:relative;z-index:2;margin-left:0;margin-top:4px}
.timeline-year{font-family:var(--display);font-weight:900;color:var(--blue);font-size:16px;line-height:1.25}.timeline-content strong{font-family:var(--display);font-weight:900;color:var(--ink)}.timeline-content p{margin:3px 0 0;color:var(--ink-soft);font-weight:600;line-height:1.45}
.mnemonic-compact{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.mnemonic-arrow{color:var(--ink-soft);font-weight:900}.v62-bookmark-btn{white-space:nowrap}
.v62-dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin:12px 0 16px}.v62-muted{color:var(--ink-soft);font-weight:600;margin:7px 0 12px}.v62-bookmark-row{width:100%;border:1.5px solid var(--line);background:var(--cream-2);color:var(--ink);font-weight:800;text-align:left;border-radius:12px;padding:10px 12px;margin:7px 0}.v62-bookmark-row:hover{border-color:var(--blue);transform:translateY(-1px)}
@media(max-width:640px){.note-section-head{font-size:16px;padding:15px 16px 12px}.note-section-body{padding:0 16px 15px}.timeline-item{grid-template-columns:34px 76px 1fr}.timeline-year{font-size:14px}.note-view-tools .ghost-btn{font-size:13px;padding:7px 10px}}


/* v6.2.1 — Quiz unit grid polish
   Since MDCAT has one main quiz per unit, quiz cards are shown as compact tiles
   without separate UNIT headers. */
#home .quiz-grid{
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:14px;
  align-items:stretch;
}
#home .quiz-card{
  min-height:0;
  padding:18px 18px 15px;
  border-radius:20px;
  gap:6px;
}
#home .quiz-card .qc-icon{
  font-size:34px;
  margin-bottom:5px;
}
#home .quiz-card .qc-title{
  font-size:18px;
  line-height:1.25;
}
#home .quiz-card .qc-blurb{
  font-size:14px;
  line-height:1.35;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
#home .quiz-card .qc-foot{
  margin-top:10px;
  padding-top:10px;
}
#home .unit-header{display:none!important}

/* v6.2.1 — avoid duplicate quiz/flashcard buttons in the note hero.
   The note footer already has Practice MCQs / Open Flashcards actions. */
.note-hero-card .note-study-actions{display:none!important}



/* v6.3 Mock Test Center: PMDC Official Pattern */
.mock-center-panel{max-width:760px}
.mock-type-wrap{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0 18px}
.mock-type-card{border:1.5px solid var(--line);background:#fff;border-radius:16px;padding:16px 18px;text-align:left;color:var(--ink);box-shadow:var(--shadow);transition:.15s}
.mock-type-card b{display:block;font-family:var(--display);font-size:18px;font-weight:800;margin-bottom:4px}
.mock-type-card span{display:block;color:var(--ink-soft);font-weight:600;font-size:14px;line-height:1.35}
.mock-type-card.active{border-color:var(--orange);box-shadow:0 8px 24px rgba(255,138,61,.20);background:#fff7ec}
.mock-pane{margin-top:8px}
.pmdc-pattern-table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1.5px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
.pmdc-pattern-table th,.pmdc-pattern-table td{padding:13px 16px;border-bottom:1px solid var(--line);text-align:left;font-weight:700}
.pmdc-pattern-table th{background:var(--cream);font-family:var(--display);color:var(--ink)}
.pmdc-pattern-table td:nth-child(2),.pmdc-pattern-table td:nth-child(3),.pmdc-pattern-table th:nth-child(2),.pmdc-pattern-table th:nth-child(3){text-align:center}
.pmdc-pattern-table tr:last-child td{border-bottom:0}
.pmdc-pattern-table tr.total td{background:#fff7ec;font-family:var(--display);font-weight:900}
.pmdc-pattern-table tr.missing td{color:var(--bad)}
.pmdc-note{margin-top:12px;color:var(--ink-soft);font-weight:700}
.mock-warning{margin-top:12px;padding:12px 14px;border-radius:13px;background:var(--bad-bg);color:var(--bad);font-weight:800}
.pmdc-result-card{background:var(--surface);border:1.5px solid var(--line);border-left:8px solid var(--orange);border-radius:var(--radius);padding:18px;margin:14px 0;box-shadow:var(--shadow)}
.pmdc-result-card h3{font-size:20px;font-weight:900;margin-bottom:12px}
@media(max-width:640px){.mock-type-wrap{grid-template-columns:1fr}.pmdc-pattern-table th,.pmdc-pattern-table td{padding:10px 9px;font-size:14px}}

/* v6.3.1 Score Booster unit-wise grouping */

.trap-unit-section{grid-column:1/-1;margin:8px 0 -4px;padding:10px 14px;border-radius:14px;background:var(--bar);color:#fff;font-family:var(--display);font-weight:900;letter-spacing:.02em;box-shadow:var(--shadow)}
.trap-heat-card.active{border-color:var(--c);box-shadow:0 0 0 3px rgba(59,130,246,.12),var(--shadow)}


/* v6.3.6 Score Booster collapsible unit groups */
.trap-unit-groups{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.trap-unit-group{
  background:var(--surface);
  border:1.5px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.trap-unit-header{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:15px 18px;
  border:0;
  background:linear-gradient(180deg,#fff,var(--cream-2));
  color:var(--ink);
  text-align:left;
  cursor:pointer;
  font-family:var(--display);
}
.trap-unit-header:hover{
  background:#fff;
}
.trap-unit-arrow{
  width:22px;
  height:22px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--cream);
  color:var(--ink-soft);
  font-size:12px;
  flex:0 0 22px;
}
.trap-unit-title{
  flex:1;
  font-weight:800;
  font-size:16px;
}
.trap-unit-count{
  border:1.5px solid var(--line);
  background:#fff;
  color:var(--ink-soft);
  border-radius:999px;
  padding:4px 10px;
  font-size:13px;
  font-weight:700;
  white-space:nowrap;
}
.trap-unit-body{
  padding:14px;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:14px;
  border-top:1.5px solid var(--line);
  background:var(--cream-2);
}
.trap-unit-group.collapsed .trap-unit-header{
  border-bottom:0;
}
.trap-expand-btn{
  white-space:nowrap;
}
@media(max-width:640px){
  .trap-unit-header{padding:13px 14px}
  .trap-unit-title{font-size:14.5px}
  .trap-unit-count{font-size:12px;padding:3px 8px}
  .trap-unit-body{grid-template-columns:1fr;padding:12px}
}


/* v6.3.7 Score Booster stability fixes: prevent hover/click movement and accidental selection */
.trap-unit-header,
.trap-heat-card,
.trap-card,
.trap-expand-btn{
  transform:none!important;
}
.trap-unit-header{
  user-select:none;
  -webkit-user-select:none;
  touch-action:manipulation;
}
.trap-unit-body{
  overflow-anchor:none;
}


/* v6.3.8 Score Booster navigation fixes */
.trap-back-btn{margin-right:auto}
.trap-back-card{background:linear-gradient(180deg,#fff,#F4F8FF)}
.trap-unit-group{display:block;opacity:1;visibility:visible;min-height:0}
.trap-unit-group.collapsed{opacity:1;visibility:visible}
.trap-unit-group.collapsed .trap-unit-body{display:none!important}
.trap-unit-group.collapsed .trap-unit-header{opacity:1}
@media(max-width:720px){.trap-back-btn{margin-right:0;width:100%;justify-content:center}}
  /* readiness bar (overview + boosters) */
  .readiness-bar{height:5px;background:var(--line);border-radius:4px;overflow:hidden;margin-top:6px}
  .readiness-fill{height:100%;border-radius:4px;transition:width .4s}
  /* streak at-risk warning */
  .streak-warn{font-size:11px;font-weight:600;color:var(--bad);margin-top:5px;line-height:1.3}
  /* boosters tab */
  .booster-list{display:flex;flex-direction:column;gap:6px}
  .booster-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:10px}
  .booster-info{flex:1;min-width:0}
  .booster-title{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  .booster-sub{font-size:11px;color:var(--ink-soft);margin-top:2px;display:block}
  /* mock rows */
  .mocks-list{display:flex;flex-direction:column;gap:6px}
  .mock-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;background:var(--surface);border:1px solid var(--line);border-radius:10px}
  .mock-left{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
  .mock-num{font-size:12px;font-weight:700;color:var(--ink-soft);width:24px;flex-shrink:0}
  .mock-info{min-width:0}
  .mock-date{font-size:13px;font-weight:600;color:var(--ink);display:block}
  .mock-sub{font-size:11px;color:var(--ink-soft);display:block;margin-top:1px}
  .mock-stats{display:flex;align-items:center;gap:10px;flex-shrink:0}
  .mock-score{font-size:15px;font-weight:700;padding:2px 8px;border-radius:6px}
  .mock-score.good{background:#eaf3de;color:#3b6d11}
  .mock-score.ok{background:#faeeda;color:#854f0b}
  .mock-score.bad{background:#fcebeb;color:#a32d2d}
  .mock-time{font-size:12px;color:var(--ink-soft)}
  /* dashboard footer */
  .dash-footer{margin-top:24px;padding-top:16px;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:10px}
  .dash-reset-footer{background:transparent;border:none;color:var(--ink-soft);font-size:13px;font-weight:500;cursor:pointer;text-align:left;padding:0;opacity:.7}
  .dash-reset-footer:hover{opacity:1;color:var(--bad)}
  /* stat sublabel */
  .stat-sublabel{font-size:11px;color:var(--ink-soft);font-weight:500;margin-top:2px}
  /* ── Integrated flashcard study view (sfc-*) ── */
  .sfc-card{max-width:640px;margin:0 auto;background:#fff;border:1.5px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column}

  /* header */
  .sfc-head{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1.5px solid var(--line);background:var(--cream)}
  .sfc-subject{font-size:11px;font-weight:600;color:var(--ink-soft);letter-spacing:.04em;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sfc-prog-wrap{display:flex;align-items:center;gap:6px;flex-shrink:0}
  .sfc-prog-bar{width:60px;height:4px;background:var(--line);border-radius:2px;overflow:hidden}
  .sfc-prog-fill{height:100%;background:var(--teal,#1fbf80);border-radius:2px;transition:width .35s}
  .sfc-prog-num{font-size:11px;color:var(--ink-soft);font-weight:600;white-space:nowrap}
  /* header icon buttons */
  .sfc-hd-btn{width:32px;height:32px;border-radius:8px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;transition:background .12s,color .12s,border-color .12s;font-family:var(--display,inherit)}
  .sfc-hd-btn:hover{background:var(--cream-2,#e8eaf2);color:var(--ink);border-color:var(--teal,#1fbf80)}
  .sfc-hd-btn.bookmarked{color:#e07b00;border-color:#e07b00;background:#fff4e0}

  /* due-filter notice: shown when the session only includes cards due for review */
  .sfc-due-notice{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
    padding:9px 14px;background:#fff8e6;border-bottom:1.5px solid var(--line);font-size:12.5px}
  .sfc-due-text{color:#8a6416;font-weight:600}
  .sfc-due-link{background:none;border:none;color:var(--teal,#1fbf80);font-weight:700;font-size:12.5px;
    cursor:pointer;text-decoration:underline;padding:2px 0;font-family:var(--display,inherit)}
  .sfc-due-link:hover{color:var(--ink)}
  :root[data-theme="dark"] .sfc-due-notice{background:#3a2f14}
  :root[data-theme="dark"] .sfc-due-text{color:#e0b957}

  /* body */
  .sfc-body{min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2.5rem 1.75rem 1.75rem;cursor:pointer;position:relative;touch-action:pan-y;user-select:none;transition:background .15s;gap:14px;text-align:center;background:#fff}
  .sfc-body:hover{background:#f7f8fa}
  .sfc-side-label{position:absolute;top:12px;left:16px;font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--teal,#1fbf80)}
  .sfc-question{font-family:var(--display);font-size:1.45rem;font-weight:600;color:var(--ink);line-height:1.4}
  .sfc-answer{font-family:var(--display);font-size:1.2rem;font-weight:500;color:var(--ink);line-height:1.55;background:var(--cream-2,#e8eaf2);padding:1rem 1.25rem;border-radius:12px;width:100%}
  .sfc-flip-hint{font-size:.82rem;color:var(--ink-soft);margin-top:2px}

  /* Repeat/Done grading — sits inline inside the card face, right under the answer */
  .sfc-actions{display:flex;gap:10px;margin-top:2px}
  .sfc-act{font-size:13px;font-weight:700;padding:8px 20px;border-radius:22px;border:2px solid;cursor:pointer;transition:all .15s;letter-spacing:.01em}
  .sfc-act.repeat{color:#a32d2d;background:#fcebeb;border-color:#f7c1c1}
  .sfc-act.repeat:hover{background:#f7c1c1;border-color:#e87070}
  .sfc-act.done{color:#3b6d11;background:#eaf3de;border-color:#c0dd97}
  .sfc-act.done:hover{background:#c0dd97;border-color:#8ec44f}

  /* bottom nav bar (Quizlet-style): prev arrow · counter · next arrow */
  .sfc-nav-row{display:flex;align-items:center;justify-content:center;gap:22px;padding:10px 14px;border-top:1.5px solid var(--line);background:var(--cream)}
  .sfc-nav-btn{width:38px;height:38px;border-radius:50%;border:none;background:transparent;cursor:pointer;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:600;transition:background .12s,color .12s,transform .1s}
  .sfc-nav-btn:hover:not(:disabled){background:var(--cream-2,#e8eaf2);color:var(--ink)}
  .sfc-nav-btn:active:not(:disabled){transform:scale(.94)}
  .sfc-nav-btn:disabled{opacity:.3;cursor:default}
  .sfc-nav-btn:focus-visible{outline:2px solid var(--teal,#1fbf80);outline-offset:2px}
  .sfc-nav-count{font-size:13px;font-weight:600;color:var(--ink-soft);min-width:52px;text-align:center;font-variant-numeric:tabular-nums}





/* ====================================================
   STUDY PLAN — real scheduler
   ==================================================== */
  /* setup card */
  .sp-setup{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);margin-bottom:16px}
  .sp-setup-h{font-family:var(--display);font-weight:700;font-size:1.05rem;color:var(--ink);margin-bottom:4px}
  .sp-setup-sub{font-size:.85rem;color:var(--ink-soft);margin-bottom:16px;line-height:1.5}
  .sp-setup-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
  .sp-field{display:flex;flex-direction:column;gap:4px}
  .sp-field label{font-size:.72rem;font-weight:800;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em}
  .sp-field input,.sp-field select{background:var(--cream);border:1.5px solid var(--line);border-radius:10px;padding:8px 12px;font-family:var(--body);font-size:.9rem;font-weight:600;color:var(--ink);outline:none;min-width:130px}
  .sp-field input:focus,.sp-field select:focus{border-color:var(--teal)}
  .sp-gen-btn{background:var(--teal);color:#fff;border:none;border-radius:99px;padding:10px 22px;font-family:var(--display);font-weight:700;font-size:.9rem;cursor:pointer;transition:opacity .15s;align-self:flex-end}
  .sp-gen-btn:hover{opacity:.85}
  .sp-regen-btn{background:transparent;border:1.5px solid var(--line);color:var(--ink-soft);border-radius:99px;padding:8px 16px;font-family:var(--display);font-weight:700;font-size:.82rem;cursor:pointer;transition:all .15s}
  .sp-regen-btn:hover{border-color:var(--bad);color:var(--bad)}

  /* week nav */
  .sp-week-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
  .sp-week-label{font-family:var(--display);font-weight:700;font-size:.95rem;color:var(--ink)}
  .sp-nav-btn{background:var(--cream);border:1.5px solid var(--line);border-radius:8px;width:32px;height:32px;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:all .15s}
  .sp-nav-btn:hover{border-color:var(--teal);color:var(--teal)}
  .sp-nav-btn:disabled{opacity:.35;cursor:default}

  /* week grid */
  .sp-week-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:16px}
  @media(max-width:680px){.sp-week-grid{grid-template-columns:repeat(4,1fr)}}
  @media(max-width:400px){.sp-week-grid{grid-template-columns:repeat(2,1fr)}}

  .sp-day{background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:10px 8px;display:flex;flex-direction:column;gap:4px;min-height:110px;cursor:pointer;transition:all .15s;position:relative}
  .sp-day:hover{border-color:var(--teal);box-shadow:0 4px 14px rgba(0,0,0,.07)}
  .sp-day.sp-today{border-color:var(--teal);border-width:2px}
  .sp-day.sp-done{background:rgba(var(--teal-rgb,6,214,160),.06)}
  .sp-day.sp-past{opacity:.55}
  .sp-day.sp-off{background:var(--cream);opacity:.45;cursor:default}
  .sp-day-hd{display:flex;justify-content:space-between;align-items:flex-start}
  .sp-day-name{font-size:.68rem;font-weight:800;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em}
  .sp-day-date{font-size:.68rem;color:var(--ink-soft)}
  .sp-day-num{font-family:var(--display);font-weight:700;font-size:1.1rem;color:var(--ink);line-height:1;margin:2px 0 4px}
  .sp-day-tasks{display:flex;flex-direction:column;gap:3px}
  .sp-day-task{font-size:.68rem;font-weight:700;color:#fff;border-radius:5px;padding:2px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sp-done-tick{position:absolute;top:7px;right:7px;width:18px;height:18px;border-radius:50%;background:var(--teal);color:#fff;font-size:.7rem;display:flex;align-items:center;justify-content:center}

  /* day detail panel */
  .sp-day-detail{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow);margin-bottom:16px}
  .sp-detail-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;flex-wrap:wrap}
  .sp-detail-title{font-family:var(--display);font-weight:700;font-size:1rem;color:var(--ink)}
  .sp-detail-meta{font-size:.78rem;color:var(--ink-soft)}
  .sp-mark-done-btn{background:var(--teal);color:#fff;border:none;border-radius:99px;padding:8px 18px;font-family:var(--display);font-weight:700;font-size:.82rem;cursor:pointer;transition:opacity .15s}
  .sp-mark-done-btn:hover{opacity:.85}
  .sp-mark-done-btn.done{background:var(--cream);color:var(--ink-soft);border:1.5px solid var(--line)}
  .sp-task-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line)}
  .sp-task-row:first-of-type{border-top:none}
  .sp-task-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}
  .sp-task-mid{flex:1;min-width:0}
  .sp-task-main{display:block;font-weight:700;font-size:.88rem;color:var(--ink)}
  .sp-task-sub{display:block;font-size:.75rem;color:var(--ink-soft);margin-top:1px}
  .sp-task-go{border:none;border-radius:99px;padding:5px 13px;font-family:var(--display);font-weight:700;font-size:.75rem;cursor:pointer;white-space:nowrap;transition:opacity .15s;color:#fff}
  .sp-task-go:hover{opacity:.82}

  /* progress bar */
  .sp-progress-row{display:flex;align-items:center;gap:10px;margin-bottom:14px}
  .sp-progress-track{flex:1;height:8px;background:var(--cream);border-radius:99px;overflow:hidden}
  .sp-progress-fill{height:100%;border-radius:99px;background:var(--teal);transition:width .4s}
  .sp-progress-label{font-size:.78rem;font-weight:700;color:var(--ink-soft);white-space:nowrap}

  /* stats row */
  .sp-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;margin-bottom:16px}
  .sp-stat{background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;position:relative;overflow:hidden}
  .sp-stat::before{content:'';position:absolute;inset:0 auto 0 0;width:4px;background:var(--c,var(--teal))}
  .sp-stat-val{font-family:var(--display);font-weight:700;font-size:1.4rem;color:var(--ink);line-height:1}
  .sp-stat-lbl{font-size:.72rem;color:var(--ink-soft);margin-top:3px}

  .sp-offline-note{background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:11px 14px;font-size:.82rem;color:var(--ink-soft);line-height:1.55;margin-bottom:14px}
  .sp-offline-note strong{color:var(--ink)}

  /* edit row */
  .sp-edit-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
  .sp-edit-lbl{font-size:.82rem;font-weight:700;color:var(--ink-soft)}

  /* coverage banners */
  .sp-coverage-banner{background:rgba(245,158,11,.1);border:1.5px solid rgba(245,158,11,.35);border-radius:12px;padding:11px 14px;font-size:.84rem;color:var(--ink);line-height:1.55;margin-bottom:14px}
  .sp-coverage-banner strong{color:var(--orange)}
  .sp-coverage-ok{background:rgba(16,185,129,.08);border:1.5px solid rgba(16,185,129,.3);border-radius:12px;padding:11px 14px;font-size:.84rem;color:var(--ink);line-height:1.55;margin-bottom:14px}

  /* impossible banner */
  .sp-coverage-bad{background:rgba(239,71,111,.1);border:1.5px solid rgba(239,71,111,.4);border-radius:12px;padding:11px 14px;font-size:.84rem;color:var(--ink);line-height:1.55;margin-bottom:14px}
  .sp-coverage-bad strong{color:var(--bad)}

/* ============================================================
   MDCATedge — header menu, brand link,
   account page, changelog modal
   ============================================================ */
.brand-link{display:flex;flex-direction:column;justify-content:center;text-decoration:none;color:inherit;line-height:1.15}
.brand-link:hover .brand-name{text-decoration:underline}

.menu-wrap{position:relative}
.menu-toggle{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.16);border-radius:12px;color:#fff;padding:8px 14px;font-family:var(--display);font-size:14.5px;font-weight:600;cursor:pointer}
.menu-toggle:hover{background:rgba(255,255,255,.2)}
.menu-toggle-ic{font-size:15px}
.menu-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:220px;background:var(--surface);border:1.5px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);padding:8px;z-index:60;display:flex;flex-direction:column;gap:2px}
.menu-dropdown.hidden{display:none}
.menu-item{display:block;width:100%;text-align:left;background:transparent;border:0;border-radius:10px;padding:10px 12px;font-family:var(--display);font-size:14.5px;font-weight:600;color:var(--ink);cursor:pointer}
.menu-item:hover{background:var(--cream)}
.menu-item.active{background:var(--teal);color:#fff}
.menu-sep{height:1px;background:var(--line);margin:6px 4px}
.menu-group-label{font-family:var(--display);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);padding:6px 12px 2px}

.top-tabs{display:flex;align-items:center;gap:2px;margin-left:8px}
.top-tab{display:flex;align-items:center;gap:6px;padding:9px 12px;border-radius:10px;background:transparent;border:0;color:rgba(255,255,255,.7);font-family:var(--display);font-size:13.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.top-tab:hover{background:rgba(255,255,255,.09);color:#fff}
.top-tab.active{background:rgba(255,255,255,.15);color:#fff}
.top-tab-ic{font-size:15px;line-height:1}
@media(max-width:1080px){.top-tab-label{display:none}.top-tab{padding:9px 10px}}
@media(max-width:759px){.top-tabs{display:none}}
@media(min-width:760px){.menu-study-group{display:none}}
@media(max-width:600px){.menu-toggle-lb{display:none}.menu-toggle{padding:8px 10px}}


/* Account page */
.acct-wrap{max-width:640px;margin:0 auto;padding:6px 4px 40px}
.acct-top{margin-bottom:10px}
.acct-head{display:flex;align-items:center;gap:16px;margin:6px 0 22px}
.acct-av{width:64px;height:64px;border-radius:20px;background:var(--c,var(--teal));display:flex;align-items:center;justify-content:center;font-size:32px;flex-shrink:0;box-shadow:var(--shadow)}
.acct-hmeta{display:flex;flex-direction:column;gap:3px}
.acct-name{font-family:var(--display);font-size:22px;font-weight:700;color:var(--ink)}
.acct-sub{font-size:13.5px;color:var(--ink-soft)}
.acct-card{background:var(--surface);border:1.5px solid var(--line);border-radius:18px;padding:18px 20px;margin-bottom:16px;box-shadow:var(--shadow)}
.acct-danger{border-color:color-mix(in srgb,var(--bad) 45%,var(--line))}
.acct-danger .acct-card-title{color:var(--bad)}
.danger-btn{background:var(--bad-bg);color:var(--bad);border:1.5px solid color-mix(in srgb,var(--bad) 45%,var(--line));border-radius:12px;padding:10px 18px;font-family:var(--display);font-weight:700;font-size:.92rem;cursor:pointer}
.danger-btn:hover{background:var(--bad);color:#fff}
.acct-card-title{display:block;font-family:var(--display);font-size:13px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px}
.acct-member-offer{border-color:color-mix(in srgb,var(--orange) 45%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--orange) 8%,var(--surface)),var(--surface))}
.acct-member-offer .acct-card-title{color:var(--orange)}
.acct-member-offer__title{margin:0 0 12px;font-size:19px;color:var(--ink)}
.acct-member-offer__prices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.acct-member-offer__prices span{display:grid;grid-template-columns:auto 1fr;gap:3px 8px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.acct-member-offer__prices b{grid-row:1/3;align-self:center;color:var(--ink)}
.acct-member-offer__prices del{font-size:11.5px;color:var(--ink-soft)}
.acct-member-offer__prices strong{font-family:var(--display);font-size:15px;color:var(--good)}
.acct-member-offer .acct-acts{margin-bottom:0}
.acct-member-offer .acct-acts a{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:480px){.acct-member-offer__prices{grid-template-columns:1fr}}
.acct-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 0;border-top:1px solid var(--line)}
.acct-row:first-of-type{border-top:0;padding-top:0}
.acct-row-col{flex-direction:column;align-items:flex-start;gap:8px}
.acct-row-label{font-size:14px;font-weight:600;color:var(--ink)}
.acct-input{max-width:220px}
.acct-note{font-size:13.5px;color:var(--ink-soft);line-height:1.55;margin:0 0 14px}
.acct-copyright{font-size:12px;margin-top:-6px;opacity:.8}
.acct-acts{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.acct-acts .ghost-btn{width:auto;padding:9px 16px;font-size:14px}
@media(max-width:560px){.acct-row{flex-direction:column;align-items:flex-start;gap:8px}.acct-input{max-width:100%;width:100%}}

/* Changelog modal */
.changelog-list{display:flex;flex-direction:column;gap:18px}
.help-list{display:flex;flex-direction:column;gap:16px}
.help-entry-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.help-entry-icon{font-size:19px;line-height:1}
.help-entry-title{font-family:var(--display);font-size:16px;font-weight:700;color:var(--ink)}
.help-entry-badge{background:#F59E0B;color:#fff;border-radius:20px;padding:2px 10px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:.01em;white-space:nowrap}
:root[data-theme="dark"] .help-entry-badge{background:#B45309}
.help-entry-body{margin:0;color:var(--ink-soft);font-size:14px;line-height:1.65;white-space:pre-line}
.changelog-entry-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:6px}
.changelog-entry-title{font-family:var(--display);font-size:16px;font-weight:700;color:var(--ink)}
.changelog-entry-date{font-size:12.5px;color:var(--ink-soft);white-space:nowrap}
.changelog-entry-items{margin:0;padding-left:20px;color:var(--ink-soft);font-size:14px;line-height:1.65}
.changelog-entry-items li{margin-bottom:2px}

.unit-group-ctl{margin-bottom:14px}

:root[data-theme="dark"] .menu-dropdown,
:root[data-theme="dark"] .acct-card{background:var(--surface);border-color:var(--line)}
.menu-wrap-hide{display:none}

/* Dashboard reorg — hero band (countdown + readiness + CTA) and Focus-here panel */
.dash-hero-band{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:14px;margin-bottom:18px}
.dash-hero-card{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:18px;padding:20px 22px;box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;gap:4px;justify-content:center}
.dash-hero-card::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--c,var(--teal))}
.dash-hero-card .top-big{font-size:2.6rem}
.dash-hero-cta-card{align-items:flex-start;justify-content:center}
.dash-hero-cta{width:100%;margin-top:10px;text-align:center}
@media(max-width:860px){.dash-hero-band{grid-template-columns:1fr 1fr}.dash-hero-cta-card{grid-column:1 / -1}}
@media(max-width:520px){.dash-hero-band{grid-template-columns:1fr}}

.focus-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.focus-head .section-sub{margin:0;flex:1;min-width:220px}
.focus-drill-subject{width:auto;padding:9px 16px;font-size:13.5px;white-space:nowrap}

/* Fix: Flashcards/Notes grids (.quiz-grid) are CSS grid containers sized
   for individual cards. The collapsible unit-group wrapper (and its expand/collapse
   controls row) must span the full grid width instead of being squeezed into one
   card-sized column. */
.quiz-grid > .unit-group-ctl,
.quiz-grid > .trap-unit-groups{
  grid-column:1 / -1;
  width:100%;
}
.quiz-grid{align-items:start}

/* ============================================================
   Splash screen
   ============================================================ */
.splash{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.22),transparent 28%),radial-gradient(circle at 82% 24%,rgba(16,185,129,.22),transparent 26%),linear-gradient(135deg,#1D4ED8,#6366F1 56%,#3B82F6);transition:opacity .45s ease;opacity:1}
.splash::before,.splash::after{content:"";position:absolute;border-radius:999px;background:rgba(255,255,255,.12);filter:blur(.2px);animation:splashFloat 5s ease-in-out infinite}
.splash::before{width:220px;height:220px;left:-72px;bottom:-64px}.splash::after{width:150px;height:150px;right:-42px;top:68px;animation-delay:-1.8s}
.splash-hide{opacity:0;pointer-events:none}
.splash-inner{position:relative;z-index:1;width:min(390px,calc(100vw - 44px));text-align:center;color:#fff;animation:splashIn .5s ease}
.splash-logo{width:82px;height:82px;border-radius:24px;background:rgba(255,255,255,.16);border:1.5px solid rgba(255,255,255,.38);display:flex;align-items:center;justify-content:center;font-size:38px;margin:0 auto 16px;box-shadow:0 18px 42px rgba(15,23,42,.24),inset 0 1px 0 rgba(255,255,255,.18);animation:splashPulse 1.8s ease-in-out infinite}
.splash-name{font-family:var(--display);font-size:28px;font-weight:700;letter-spacing:.01em}
.splash-tag{font-size:14px;opacity:.9;margin-top:6px}
.splash-loader{display:flex;justify-content:center;gap:8px;margin:20px 0 16px}
.splash-loader span{width:9px;height:9px;border-radius:50%;background:#fff;opacity:.42;animation:splashDot 1.05s ease-in-out infinite}.splash-loader span:nth-child(2){animation-delay:.16s}.splash-loader span:nth-child(3){animation-delay:.32s}
.splash-tip{margin:0 auto;padding:12px 14px;border:1px solid rgba(255,255,255,.24);border-radius:16px;background:rgba(255,255,255,.13);box-shadow:0 12px 32px rgba(15,23,42,.16);backdrop-filter:blur(10px);text-align:left}
.splash-tip span{display:block;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;opacity:.84;margin-bottom:4px}.splash-tip p{margin:0;font-size:13.5px;line-height:1.45;font-weight:600}
@keyframes splashIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes splashPulse{0%,100%{transform:translateY(0);box-shadow:0 18px 42px rgba(15,23,42,.24),inset 0 1px 0 rgba(255,255,255,.18)}50%{transform:translateY(-3px);box-shadow:0 22px 48px rgba(15,23,42,.3),inset 0 1px 0 rgba(255,255,255,.22)}}
@keyframes splashDot{0%,100%{opacity:.38;transform:translateY(0)}50%{opacity:1;transform:translateY(-6px)}}
@keyframes splashFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(16px,-14px,0)}}

/* ============================================================
   Global search button + modal
   ============================================================ */
.global-search-btn{width:38px;height:38px;border-radius:50%;border:1.5px solid rgba(255,255,255,.16);background:rgba(255,255,255,.1);color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-right:6px}
.global-search-btn:hover{background:rgba(255,255,255,.2)}
.gsearch-input{margin-top:10px;width:100%}
.gsearch-list{display:flex;flex-direction:column;gap:8px}
.gsearch-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;cursor:pointer}
.gsearch-row:hover{border-color:var(--teal);background:var(--cream)}
.gsearch-ic{font-size:20px;flex:0 0 24px;text-align:center}
.gsearch-mid{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.gsearch-title{font-family:var(--display);font-weight:700;font-size:15px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsearch-sub{font-size:12.5px;color:var(--ink-soft)}
.gsearch-go{font-size:13px;font-weight:600;color:var(--teal);white-space:nowrap}

/* ============================================================
   Onboarding tour
   ============================================================ */
.tour-panel{max-width:420px}
.tour-ic{display:block;font-size:44px;text-align:center;margin:18px 0 6px}
.tour-title{text-align:center;font-size:20px;margin:0 0 8px}
.tour-body-text{text-align:center;color:var(--ink-soft);font-size:14.5px;line-height:1.6;margin:0 0 6px}
.tour-foot{align-items:center;justify-content:space-between}
.tour-dots{display:flex;gap:6px}
.tour-dot{width:7px;height:7px;border-radius:50%;background:var(--line)}
.tour-dot.on{background:var(--teal);width:18px;border-radius:4px;transition:.2s}

/* Online account button: keep it clickable above header menus/overlays */
.profile-chip{position:relative;z-index:500;pointer-events:auto;flex:0 0 auto;min-width:42px;min-height:38px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
@media(max-width:520px){.profile-chip{padding:5px 7px}.chip-name{display:none}}

:root[data-theme="dark"] .gsearch-row{background:var(--surface);border-color:var(--line)}

/* Changelog: version badge, tabs, tagged items, roadmap */
.changelog-tabs{display:flex;gap:6px;margin-top:12px}
.changelog-tab{background:var(--cream);border:1.5px solid var(--line);border-radius:20px;padding:7px 14px;font-family:var(--display);font-size:13.5px;font-weight:600;color:var(--ink-soft);cursor:pointer}
.changelog-tab.active{background:var(--teal);border-color:var(--teal);color:#fff}
.changelog-entry-titlewrap{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.changelog-entry-version{font-family:var(--display);font-size:11.5px;font-weight:700;color:#fff;background:var(--blue);border-radius:8px;padding:2px 8px;letter-spacing:.02em}
.change-tag{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:700;border-radius:7px;padding:2px 7px;margin-right:7px;white-space:nowrap;vertical-align:middle}
.change-tag-new{background:rgba(59,130,246,.14);color:var(--blue)}
.change-tag-improved{background:rgba(20,184,166,.14);color:var(--teal)}
.change-tag-fixed{background:rgba(239,71,111,.12);color:var(--bad)}

.roadmap-list{display:flex;flex-direction:column;gap:14px}
.roadmap-card{background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:14px 16px}
.roadmap-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.roadmap-card-title{font-family:var(--display);font-weight:700;font-size:15px;color:var(--ink)}
.roadmap-card-desc{display:block;font-size:13.5px;color:var(--ink-soft);line-height:1.55;margin-top:4px}
.roadmap-status{font-size:11px;font-weight:700;border-radius:20px;padding:3px 10px;white-space:nowrap}
.roadmap-status-planned{background:rgba(148,163,184,.18);color:var(--ink-soft)}
.roadmap-status-in-progress{background:rgba(59,130,246,.14);color:var(--blue)}
.roadmap-status-exploring{background:rgba(168,85,247,.14);color:var(--purple)}

/* Answer-sound toggle in quiz header */
.sound-btn{margin-left:auto;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:8px 11px;font-size:1rem;line-height:1;cursor:pointer;box-shadow:var(--shadow);transition:opacity .15s ease, transform .1s ease}
:root[data-theme="dark"] .sound-btn{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.sound-btn:hover{transform:scale(1.06)}
.sound-btn.off{opacity:.45}
.sound-btn.hidden{display:none}

/* ── Auth screen enhancements (signup-first, trust, what-you-get) ─────────── */
.auth-whatyouget{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 20px}
.auth-wyg-item{background:var(--cream);border-radius:12px;padding:10px 4px;text-align:center}
.auth-wyg-n{display:block;font-family:var(--display);font-size:15px;font-weight:800;color:var(--blue);line-height:1.1}
.auth-wyg-l{display:block;font-size:10.5px;color:var(--ink-soft);margin-top:2px;font-weight:600}
@media(max-width:440px){.auth-wyg-n{font-size:13.5px}.auth-wyg-l{font-size:9.5px}}
.auth-pass-wrap{position:relative;margin-bottom:10px}
.auth-pass-wrap .auth-input{margin-bottom:0;padding-right:44px}
.auth-pass-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:16px;padding:4px 6px;line-height:1;opacity:.65}
.auth-pass-toggle:hover{opacity:1}
.auth-microcopy{text-align:center;font-size:12px;color:var(--ink-soft);margin:10px 0 0;font-weight:500}
.auth-trust{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.auth-trust-item{font-size:11.5px;color:var(--ink-soft);font-weight:600;white-space:nowrap}
.auth-trust-link{text-decoration:none;color:var(--blue);transition:.15s}
.auth-trust-link:hover{opacity:.75;text-decoration:underline}

/* ============================================================
   Free-plan upgrade banner
   One shared banner inside #student-app, so it appears on every
   app view/unit while remaining completely hidden for paid plans.
   ============================================================ */
.free-upgrade-banner{
  display:flex;
  align-items:center;
  gap:14px;
  margin:18px 0 2px;
  padding:14px 16px;
  border:1.5px solid rgba(59,130,246,.30);
  border-radius:16px;
  background:linear-gradient(110deg,rgba(59,130,246,.13),rgba(99,102,241,.09) 55%,rgba(16,185,129,.10));
  box-shadow:var(--shadow);
}
.free-upgrade-banner__icon{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:linear-gradient(135deg,#3B82F6,#6366F1);
  color:#fff;
  font-size:21px;
  box-shadow:0 6px 16px rgba(59,130,246,.25);
}
.free-upgrade-banner__copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.free-upgrade-banner__copy strong{
  font-family:var(--display);
  font-size:15.5px;
  font-weight:750;
  color:var(--ink);
}
.free-upgrade-banner__copy span{
  color:var(--ink-soft);
  font-size:13.5px;
  line-height:1.42;
  font-weight:600;
}
.free-upgrade-banner__copy .free-upgrade-banner__proof{
  margin-top:2px;
  font-size:11.8px;
  line-height:1.35;
  font-weight:650;
  color:var(--ink-faint);
}
.free-upgrade-banner__cta{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:40px;
  padding:9px 17px;
  border-radius:12px;
  background:linear-gradient(135deg,#2563EB,#4F46E5);
  color:#fff;
  font-family:var(--display);
  font-size:14px;
  font-weight:750;
  text-decoration:none;
  border:0;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:0 6px 16px rgba(37,99,235,.22);
  transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;
}
.free-upgrade-banner__cta:hover{
  transform:translateY(-1px);
  box-shadow:0 9px 20px rgba(37,99,235,.28);
  filter:brightness(1.04);
}
.free-upgrade-banner__cta:focus-visible{
  outline:3px solid rgba(59,130,246,.35);
  outline-offset:3px;
}
:root[data-theme="dark"] .free-upgrade-banner{
  border-color:rgba(96,165,250,.34);
  background:linear-gradient(110deg,rgba(59,130,246,.16),rgba(99,102,241,.12) 55%,rgba(16,185,129,.10));
}
@media(max-width:700px){
  .free-upgrade-banner{align-items:flex-start;gap:11px;padding:13px 13px;margin-top:14px}
  .free-upgrade-banner__icon{width:38px;height:38px;flex-basis:38px;border-radius:11px;font-size:19px}
  .free-upgrade-banner__copy strong{font-size:14.5px}
  .free-upgrade-banner__copy span{font-size:12.5px}
  .free-upgrade-banner__cta{min-height:38px;padding:8px 13px;font-size:13px}
}
@media(max-width:520px){
  .free-upgrade-banner{display:grid;grid-template-columns:38px 1fr;gap:9px 10px}
  .free-upgrade-banner__copy{align-self:center}
  .free-upgrade-banner__cta{grid-column:1 / -1;width:100%;margin-top:2px}
}

/* Free-user WhatsApp support card — added without changing launcher cards */
.free-whatsapp-support-card{max-width:1120px;margin:-20px auto 20px;padding:14px 16px;display:flex;align-items:center;gap:13px;border:1.5px solid color-mix(in srgb,#16A34A 34%,var(--line));border-radius:16px;background:linear-gradient(110deg,color-mix(in srgb,#16A34A 10%,var(--surface)),var(--surface));box-shadow:var(--shadow)}
.free-whatsapp-support-card__icon{width:42px;height:42px;flex:0 0 42px;border-radius:13px;background:#16A34A;color:#fff;display:grid;place-items:center;font-size:21px;box-shadow:0 6px 16px rgba(22,163,74,.22)}
.free-whatsapp-support-card__copy{min-width:0;display:flex;flex-direction:column;gap:2px;flex:1}
.free-whatsapp-support-card__copy strong{font-family:var(--display);font-size:15px;color:var(--ink)}
.free-whatsapp-support-card__copy span{font-size:13px;color:var(--ink-soft);font-weight:600}
.free-whatsapp-support-card__cta{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:9px 15px;border-radius:12px;background:#16A34A;color:#fff;text-decoration:none;font-family:var(--display);font-size:13.5px;font-weight:750;white-space:nowrap;transition:.15s}
.free-whatsapp-support-card__cta:hover{background:#15803D;transform:translateY(-1px)}
@media(max-width:600px){.free-whatsapp-support-card{margin:-12px 4px 16px;padding:13px;display:grid;grid-template-columns:38px 1fr;gap:9px 10px}.free-whatsapp-support-card__icon{width:38px;height:38px;flex-basis:38px}.free-whatsapp-support-card__cta{grid-column:1/-1;width:100%}}

/* Floating WhatsApp support — Free users only */
.free-whatsapp-float{position:fixed;right:22px;bottom:22px;z-index:900;display:inline-flex;align-items:center;gap:9px;padding:11px 15px 11px 12px;border-radius:999px;background:#16A34A;color:#fff;text-decoration:none;font-family:var(--display);font-size:13.5px;font-weight:800;box-shadow:0 12px 30px rgba(22,163,74,.32);transition:transform .15s,box-shadow .15s,background .15s}
.free-whatsapp-float svg{width:25px;height:25px;flex:none}
.free-whatsapp-float:hover{background:#15803D;transform:translateY(-2px);box-shadow:0 16px 34px rgba(22,163,74,.38)}
body[data-view="quiz-view"] .free-whatsapp-float,body:has(.modal.open) .free-whatsapp-float{display:none!important}
/* The launcher already contains the large premium daily-mock card. */
body[data-view="launcher"] #free-upgrade-banner{display:none!important}
@media(max-width:600px){.free-whatsapp-float{right:15px;bottom:15px;width:52px;height:52px;padding:0;justify-content:center}.free-whatsapp-float span{display:none}.free-whatsapp-float svg{width:28px;height:28px}}

/* v14.1 — Free Unit-1 PMDC-style sample mock */
.free-sample-mock-card{background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--teal) 8%,var(--surface)));border-color:color-mix(in srgb,var(--teal) 42%,var(--line))}
.free-sample-mock-card::after{content:"UNIT 1 · ALL 5 SUBJECTS";position:absolute;right:-40px;bottom:18px;transform:rotate(-38deg);font-family:var(--display);font-size:10px;font-weight:900;letter-spacing:.08em;color:color-mix(in srgb,var(--teal) 35%,transparent);pointer-events:none}
.free-sample-mock-card .launcher-badge{background:var(--teal)}
.free-sample-analysis-note{margin:0 0 14px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--blue) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--blue) 30%,var(--line));color:var(--ink-soft);font-weight:700;line-height:1.45}
.free-sample-upgrade-btn{border-color:color-mix(in srgb,var(--orange) 45%,var(--line));color:var(--orange)}
:root[data-theme="dark"] .free-sample-mock-card{background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--teal) 12%,var(--surface)))}


/* v14.2 — Balanced sample generation + post-result conversion */
.free-sample-conversion{margin-top:18px;padding:20px;border-radius:18px;border:1px solid color-mix(in srgb,var(--orange) 36%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--orange) 8%,var(--surface)),color-mix(in srgb,var(--teal) 6%,var(--surface)));box-shadow:0 12px 34px rgba(15,23,42,.08)}
.free-sample-conversion__kicker{font-family:var(--display);font-size:11px;font-weight:900;letter-spacing:.12em;color:var(--orange);margin-bottom:7px}
.free-sample-conversion__title{margin:0 0 8px;font-size:1.25rem;line-height:1.25;color:var(--ink)}
.free-sample-conversion__body{margin:0;color:var(--ink-soft);font-weight:650;line-height:1.55}
.free-sample-conversion__benefits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 14px;margin:16px 0}
.free-sample-conversion__benefit{display:flex;align-items:flex-start;gap:8px;color:var(--ink);font-size:.92rem;font-weight:750;line-height:1.35}
.free-sample-conversion__check{display:inline-grid;place-items:center;flex:0 0 20px;width:20px;height:20px;border-radius:50%;background:color-mix(in srgb,var(--teal) 16%,var(--surface));color:var(--teal);font-weight:1000}
.free-sample-conversion__offer{margin:0 0 14px;padding:11px 13px;border-radius:12px;background:color-mix(in srgb,var(--orange) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--orange) 35%,var(--line));color:var(--ink-soft);font-size:.9rem;font-weight:700;line-height:1.45}
.free-sample-conversion__offer strong,.free-sample-conversion__offer b{color:var(--ink)}
.free-sample-conversion__offer span{display:inline-block;margin-left:6px;padding:2px 7px;border-radius:999px;background:#DCFCE7;color:#166534;font-size:.75rem;font-weight:900}
.free-sample-conversion__actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.free-sample-conversion__primary{background:linear-gradient(135deg,var(--orange),color-mix(in srgb,var(--orange) 68%,var(--purple)));border-color:transparent;box-shadow:0 8px 20px color-mix(in srgb,var(--orange) 24%,transparent)}
.free-sample-conversion__secondary{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
:root[data-theme="dark"] .free-sample-conversion{box-shadow:none}
@media(max-width:680px){
  .free-sample-conversion{padding:16px}
  .free-sample-conversion__benefits{grid-template-columns:1fr}
  .free-sample-conversion__actions{display:grid;grid-template-columns:1fr}
  .free-sample-conversion__actions .primary-btn,.free-sample-conversion__actions .ghost-btn{width:100%;text-align:center}
}

/* v14.3.5 — Metadata-only locked premium unit catalogue for Free members */
.locked-coverage-banner{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:0 0 14px;
  padding:14px 16px;
  border:1.5px solid color-mix(in srgb,var(--c) 35%,var(--line));
  border-radius:16px;
  background:linear-gradient(110deg,color-mix(in srgb,var(--c) 10%,var(--surface)),var(--surface));
  box-shadow:var(--shadow);
}
.locked-coverage-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.locked-coverage-copy strong{font-family:var(--display);font-size:15px;color:var(--ink)}
.locked-coverage-copy span{font-size:13px;font-weight:650;color:var(--ink-soft)}
.locked-coverage-cta{flex:none;min-height:38px;padding:8px 14px;border-color:color-mix(in srgb,var(--c) 42%,var(--line));color:var(--ink)}
.locked-catalog-section{grid-column:1/-1;width:100%;margin-top:18px}
.locked-catalog-heading{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--orange) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--orange) 28%,var(--line))}
.locked-catalog-heading-icon{font-size:17px}
.locked-catalog-heading-title{font-family:var(--display);font-weight:850;color:var(--ink)}
.locked-catalog-heading-count{margin-left:auto;padding:4px 9px;border-radius:999px;background:color-mix(in srgb,var(--orange) 14%,var(--surface));color:var(--orange);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}
.locked-catalog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:16px;align-items:stretch}
.locked-catalog-grid .subj-header{grid-column:1/-1}
.locked-unit-card{min-height:230px;border-style:dashed!important;border-color:color-mix(in srgb,var(--c) 34%,var(--line))!important;background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--c) 4%,var(--surface)))!important;filter:saturate(.82)}
.locked-unit-card::before{background:color-mix(in srgb,var(--c) 55%,var(--line))!important}
.locked-unit-card::after{content:"LOCKED";position:absolute;right:-32px;bottom:18px;transform:rotate(-38deg);font-family:var(--display);font-size:11px;font-weight:950;letter-spacing:.12em;color:color-mix(in srgb,var(--ink-soft) 18%,transparent);pointer-events:none}
.locked-unit-card:hover{filter:saturate(1);transform:translateY(-3px);border-color:var(--c)!important}
.locked-unit-badge{position:absolute;top:13px;right:13px;z-index:2;display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;background:color-mix(in srgb,var(--orange) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--orange) 32%,var(--line));color:var(--orange);font-family:var(--display);font-size:10px;font-weight:950;letter-spacing:.06em}
.locked-unit-icon{display:grid;place-items:center;background:color-mix(in srgb,var(--c) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--c) 22%,var(--line));border-radius:14px;width:46px;height:46px}
.locked-unit-card .qc-title{padding-right:48px}
.locked-unit-card .qc-blurb{color:var(--ink-soft)}
.locked-unit-card .qc-go{color:var(--orange);font-weight:850}
.locked-subj-header{margin-top:10px}
:root[data-theme="dark"] .locked-unit-card{background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--c) 8%,var(--surface)))!important}
@media(max-width:700px){
  .locked-coverage-banner{align-items:flex-start;padding:13px}
  .locked-coverage-cta{min-width:104px}
  .locked-catalog-grid{grid-template-columns:1fr}
  .locked-unit-card{min-height:0}
}
@media(max-width:520px){
  .locked-coverage-banner{display:grid;grid-template-columns:1fr}
  .locked-coverage-cta{width:100%}
}

/* v14.3.6 — delayed inline quiz skeleton (replaces quiz full-screen blocker) */
.quiz-inline-loader{
  grid-column:1/-1;
  width:100%;
  box-sizing:border-box;
  margin:0 0 16px;
  padding:14px;
  border:1.5px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow);
}
.quiz-inline-loader-head{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 0 12px;
  color:var(--ink-soft);
  font-family:var(--display);
  font-size:14px;
  font-weight:600;
}
.quiz-inline-spinner{
  width:15px;
  height:15px;
  flex:none;
  border-radius:50%;
  border:2px solid var(--line);
  border-top-color:var(--blue);
  animation:spin .8s linear infinite;
}
.quiz-skeleton-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
}
.quiz-skeleton-card{
  min-height:166px;
  box-sizing:border-box;
  border:1.5px solid var(--line);
  border-radius:var(--radius);
  padding:17px;
  background:var(--cream-2);
  overflow:hidden;
}
.quiz-skeleton-icon,
.quiz-skeleton-line{
  position:relative;
  display:block;
  overflow:hidden;
  background:color-mix(in srgb,var(--line) 70%,var(--surface));
}
.quiz-skeleton-icon::after,
.quiz-skeleton-line::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);
  animation:quizSkeletonShimmer 1.25s ease-in-out infinite;
}
.quiz-skeleton-icon{width:40px;height:40px;border-radius:12px;margin-bottom:14px}
.quiz-skeleton-line{height:10px;border-radius:999px;margin-top:10px;width:100%}
.quiz-skeleton-line-short{width:34%}
.quiz-skeleton-line-title{width:72%;height:15px;margin-top:12px}
.quiz-skeleton-line-foot{width:52%;margin-top:23px}
@keyframes quizSkeletonShimmer{100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){
  .quiz-inline-spinner,.quiz-skeleton-icon::after,.quiz-skeleton-line::after{animation:none}
}


/* ===== v14.3.7 welcome + sample mock conversion modal ===== */
:is(#upgrade-modal,#welcome-offer-modal) .modal-panel{width:min(760px,calc(100vw - 24px));max-width:760px}
.upgrade-sample-card{position:relative;margin:0 0 14px;padding:16px;border:2px solid color-mix(in srgb,var(--teal) 55%,var(--line));border-radius:16px;background:linear-gradient(145deg,color-mix(in srgb,var(--teal) 9%,var(--surface)),var(--surface));box-shadow:var(--shadow);overflow:hidden}
.upgrade-sample-card__badge{position:absolute;top:12px;right:12px;padding:4px 9px;border-radius:999px;background:var(--teal);color:#fff;font-family:var(--display);font-size:10.5px;font-weight:900;letter-spacing:.06em}
.upgrade-sample-card__head{display:flex;align-items:flex-start;gap:12px;padding-right:118px}
.upgrade-sample-card__icon{width:46px;height:46px;display:grid;place-items:center;flex:none;border-radius:14px;background:var(--teal);color:#fff;font-size:24px}
.upgrade-sample-card h3{margin:1px 0 5px;font-family:var(--display);font-size:18px;line-height:1.25;color:var(--ink)}
.upgrade-sample-card p{margin:0;color:var(--ink-soft);font-size:13.5px;line-height:1.45}
.upgrade-sample-card__facts{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 11px}
.upgrade-sample-card__facts span{padding:5px 9px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--ink-soft);font-size:11.5px;font-weight:800}
.upgrade-sample-card__cta{width:100%;justify-content:center;background:var(--teal)!important}
.upgrade-sample-card__note{margin-top:9px!important;text-align:center;font-size:12.5px!important}
.upgrade-sample-card__note strong{color:var(--purple)}
.upgrade-payment-row{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap;margin:10px 0 6px;padding:10px 12px;border:1.5px solid var(--line);border-radius:13px;background:var(--cream)}
.upgrade-payment-label{width:100%;text-align:center;color:var(--ink-soft);font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.upgrade-payment-method{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:10px;background:var(--surface);border:1px solid var(--line);font-size:13px;color:var(--ink)}
.upgrade-payment-method svg{width:23px;height:23px;display:block;flex:none}
.upgrade-payment-method--easypaisa strong{color:#008E48;font-family:var(--display);font-size:14px;letter-spacing:-.02em}
.upgrade-payment-bank{font-size:18px;line-height:1}
:root[data-theme="dark"] .upgrade-sample-card{background:linear-gradient(145deg,color-mix(in srgb,var(--teal) 12%,var(--surface)),var(--surface))}
@media(max-width:600px){
  :is(#upgrade-modal,#welcome-offer-modal) .modal-panel{width:calc(100vw - 16px);max-width:none}
  .upgrade-sample-card{padding:14px}
  .upgrade-sample-card__head{padding-right:0;padding-top:26px}
  .upgrade-sample-card__badge{top:9px;right:9px}
  .upgrade-sample-card h3{font-size:16.5px}
  .upgrade-payment-method{flex:1 1 auto;justify-content:center}
}

/* v14.3.12 — plan-selection tracking affordance */
.upgrade-plan-card[data-plan-select]{cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.upgrade-plan-card[data-plan-select]:hover,.upgrade-plan-card[data-plan-select]:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 14%,transparent);transform:translateY(-1px)}
.upgrade-plan-card[data-plan-select].selected-plan{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 18%,transparent)}
.upgrade-plan-select-hint{display:inline-flex;margin-top:10px;font-size:.78rem;font-weight:800;color:var(--blue);text-transform:uppercase;letter-spacing:.04em}

/* ===== v14.4 — Admin-activated Today's Exam ===== */
.daily-exam-card{
  background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--orange) 10%,var(--surface)));
  border-color:color-mix(in srgb,var(--orange) 48%,var(--line));
  position:relative;
  overflow:hidden;
}
.daily-exam-card::after{
  content:"ONE ACTIVATION · ONE EXAM";
  position:absolute;
  right:-48px;
  bottom:20px;
  transform:rotate(-38deg);
  font-family:var(--display);
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  color:color-mix(in srgb,var(--orange) 38%,transparent);
  pointer-events:none;
}
.daily-exam-card .launcher-badge{background:var(--orange);color:#fff}
:root[data-theme="dark"] .daily-exam-card{
  background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--orange) 14%,var(--surface)));
}

/* ===== v14.4.4 — Refined premium daily mock + complete-access comparison ===== */
/* The former Unit-1 free sample is retired from the user-facing app. */
.free-sample-mock-card{display:none!important}

/* Welcome banner: replace the old plan-discount banner with the daily mock offer. */
.daily-mock-welcome-banner{
  position:relative;
  overflow:hidden;
  border:1px solid color-mix(in srgb,#0EA5E9 42%,var(--line));
  background:
    radial-gradient(circle at 9% 10%,rgba(255,255,255,.72),transparent 25%),
    linear-gradient(115deg,color-mix(in srgb,#22D3EE 14%,var(--surface)),color-mix(in srgb,#3B82F6 9%,var(--surface)) 56%,color-mix(in srgb,#8B5CF6 8%,var(--surface)));
  box-shadow:0 14px 38px rgba(14,165,233,.11),0 8px 22px rgba(59,130,246,.08);
}
.daily-mock-welcome-banner::after{
  content:"DAILY · PMDC PATTERN";
  position:absolute;
  right:-34px;
  bottom:4px;
  transform:rotate(-12deg);
  font-family:var(--display);
  font-size:10px;
  font-weight:950;
  letter-spacing:.15em;
  color:rgba(124,58,237,.13);
  pointer-events:none;
}
.daily-mock-welcome-banner .free-upgrade-banner__icon{
  background:linear-gradient(145deg,#06B6D4,#2563EB);
  box-shadow:0 8px 20px rgba(37,99,235,.22);
}
.daily-mock-welcome-banner .free-upgrade-banner__copy strong{
  font-size:16px;
  letter-spacing:-.01em;
}
.daily-mock-welcome-banner .free-upgrade-banner__copy > span:not(.free-upgrade-banner__proof){
  color:var(--ink);
  font-weight:700;
}
.daily-mock-welcome-banner .free-upgrade-banner__proof{
  color:var(--ink-soft);
  font-size:12px;
  font-weight:800;
  letter-spacing:.01em;
}
.daily-mock-welcome-banner .free-upgrade-banner__analysis{
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  margin-top:3px;
  padding:4px 8px;
  border-radius:999px;
  background:color-mix(in srgb,#2563EB 9%,var(--surface));
  color:var(--blue);
  font-size:11px;
  font-weight:900;
}
.daily-mock-welcome-banner .free-upgrade-banner__cta{
  position:relative;
  z-index:1;
  border:none;
  background:linear-gradient(135deg,#0284C7,#4F46E5);
  color:#fff;
  box-shadow:0 8px 20px rgba(37,99,235,.22);
}
.daily-mock-welcome-banner .free-upgrade-banner__cta:hover{
  background:linear-gradient(135deg,#0369A1,#4338CA);
  box-shadow:0 11px 25px rgba(67,56,202,.24);
}

/* Lead dashboard card. */
.daily-exam-card{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  min-height:315px;
  padding:0!important;
  border:1px solid rgba(255,255,255,.22)!important;
  border-radius:26px!important;
  color:#fff;
  background:
    radial-gradient(circle at 88% 14%,rgba(255,255,255,.22),transparent 20%),
    radial-gradient(circle at 7% 105%,rgba(34,211,238,.30),transparent 30%),
    linear-gradient(128deg,#071A2B 0%,#0F4C5C 38%,#075985 68%,#4C1D95 116%)!important;
  box-shadow:0 22px 55px rgba(7,89,133,.25),0 10px 24px rgba(7,26,43,.20)!important;
  overflow:hidden;
  isolation:isolate;
}
.daily-exam-card::before{
  content:"";
  position:absolute;
  inset:0;
  height:auto;
  background:
    linear-gradient(115deg,transparent 20%,rgba(255,255,255,.08) 38%,transparent 54%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 1px,transparent 1px 12px);
  transform:translateX(-30%);
  pointer-events:none;
  z-index:-1;
}
.daily-exam-card::after{
  content:"PREMIUM DAILY MOCK";
  right:-54px;
  bottom:22px;
  transform:rotate(-36deg);
  font-size:11px;
  letter-spacing:.16em;
  color:rgba(255,255,255,.09);
}
.daily-exam-card:hover{
  transform:translateY(-5px) scale(1.002);
  border-color:rgba(255,255,255,.48)!important;
  box-shadow:0 28px 64px rgba(7,89,133,.30),0 13px 30px rgba(7,26,43,.24)!important;
}
.daily-exam-card:focus-visible{
  outline:3px solid rgba(245,158,11,.72);
  outline-offset:4px;
}
.daily-exam-card__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:20px 24px 0;
  position:relative;
  z-index:1;
}
.daily-exam-card__kicker{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#FDE68A;
  font-family:var(--display);
  font-size:11px;
  font-weight:950;
  letter-spacing:.13em;
}
.daily-exam-card__price{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 15px;
  border:1px solid rgba(255,255,255,.58);
  border-radius:999px;
  background:linear-gradient(135deg,#FEF3C7,#FDE68A);
  color:#7C2D12;
  font-family:var(--display);
  font-size:16px;
  font-weight:950;
  letter-spacing:.04em;
  box-shadow:0 8px 20px rgba(245,158,11,.24);
  backdrop-filter:blur(8px);
}
.daily-exam-card__body{
  display:grid;
  grid-template-columns:76px minmax(0,1fr);
  align-items:center;
  gap:18px;
  padding:22px 24px 16px;
  position:relative;
  z-index:1;
}
.daily-exam-card__icon{
  width:76px;
  height:76px;
  display:grid;
  place-items:center;
  border-radius:22px;
  background:linear-gradient(145deg,#FBBF24,#F97316);
  color:#fff;
  font-size:38px;
  box-shadow:0 14px 30px rgba(249,115,22,.32),inset 0 1px 0 rgba(255,255,255,.50);
}
.daily-exam-card__copy{min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.daily-exam-card__syllabus{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  max-width:100%;
  margin:0 0 11px;
  padding:7px 12px;
  border:1px solid rgba(255,255,255,.92);
  border-radius:9px;
  background:linear-gradient(135deg,#FEF08A 0%,#FBBF24 58%,#F59E0B 100%);
  color:#451A03;
  font-size:11px;
  font-weight:950;
  letter-spacing:.055em;
  line-height:1.2;
  text-transform:uppercase;
  box-shadow:0 8px 22px rgba(245,158,11,.34),inset 0 1px 0 rgba(255,255,255,.74);
  transform:rotate(-1deg);
  position:relative;
  z-index:4;
  opacity:1;
  visibility:visible;
}
.daily-exam-card__title{
  margin:0 0 7px;
  color:#fff;
  font-family:var(--display);
  font-size:clamp(24px,3vw,36px);
  line-height:1.12;
  letter-spacing:-.035em;
  text-wrap:balance;
}
.daily-exam-card__blurb{
  margin:0;
  max-width:900px;
  color:rgba(255,255,255,.84);
  font-size:14.5px;
  font-weight:650;
  line-height:1.55;
}
.daily-exam-card__facts{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:0 24px 15px;
  position:relative;
  z-index:1;
}
.daily-exam-card__facts span{
  display:inline-flex;
  align-items:center;
  min-height:31px;
  padding:6px 11px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:#fff;
  font-size:11.5px;
  font-weight:850;
  backdrop-filter:blur(7px);
}
.daily-exam-card__subjects{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  padding:0 24px 15px;
  position:relative;
  z-index:1;
}
.daily-exam-card__subject{
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto auto;
  align-items:center;
  gap:0 7px;
  min-width:0;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.20);
  border-radius:13px;
  background:rgba(17,24,39,.20);
  text-align:left;
  backdrop-filter:blur(7px);
}
.daily-exam-card__subject b{
  min-width:0;
  overflow:hidden;
  color:rgba(255,255,255,.88);
  font-size:11px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.daily-exam-card__subject strong{
  grid-row:1/3;
  grid-column:2;
  color:#FDE68A;
  font-family:var(--display);
  font-size:20px;
  font-weight:950;
}
.daily-exam-card__subject small{
  color:rgba(255,255,255,.58);
  font-size:9.5px;
  font-weight:750;
}

.daily-exam-card__promise{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 24px 17px;
  padding:11px 13px;
  border:1px solid rgba(253,230,138,.25);
  border-radius:13px;
  background:rgba(245,158,11,.13);
  position:relative;
  z-index:1;
}
.daily-exam-card__promise strong{
  color:#FDE68A;
  font-family:var(--display);
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}
.daily-exam-card__promise span{
  color:rgba(255,255,255,.78);
  font-size:12.5px;
  font-weight:700;
}
.daily-exam-card__foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:15px 24px 18px;
  border-top:1px solid rgba(255,255,255,.14);
  background:rgba(17,24,39,.18);
  position:relative;
  z-index:1;
}
.daily-exam-card__status-line{
  color:rgba(255,255,255,.76);
  font-size:12.5px;
  font-weight:750;
}
.daily-exam-card__action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 17px;
  border-radius:12px;
  background:linear-gradient(135deg,#FBBF24,#F97316);
  color:#111827;
  font-family:var(--display);
  font-size:13.5px;
  font-weight:950;
  box-shadow:0 9px 22px rgba(249,115,22,.28);
  white-space:nowrap;
}
.daily-exam-card__badge{
  position:absolute;
  top:63px;
  right:24px;
  z-index:2;
  display:none;
}

/* Welcome modal premium offer. */
.daily-mock-offer-card{
  border-color:color-mix(in srgb,#F59E0B 58%,var(--line));
  background:
    radial-gradient(circle at 88% 12%,rgba(245,158,11,.20),transparent 28%),
    linear-gradient(145deg,color-mix(in srgb,#312E81 11%,var(--surface)),color-mix(in srgb,#F59E0B 8%,var(--surface)));
  box-shadow:0 16px 38px rgba(49,46,129,.12);
}
.daily-mock-offer-card .upgrade-sample-card__badge{
  background:linear-gradient(135deg,#7C3AED,#C2410C);
  box-shadow:0 7px 16px rgba(124,58,237,.20);
}
.daily-mock-offer-card .upgrade-sample-card__icon{
  background:linear-gradient(145deg,#FBBF24,#F97316);
  box-shadow:0 10px 22px rgba(249,115,22,.24);
}
.daily-mock-offer-card__price{
  display:inline-flex;
  margin:0 0 8px;
  padding:7px 12px;
  border:1px solid color-mix(in srgb,#F59E0B 34%,var(--line));
  border-radius:999px;
  background:linear-gradient(135deg,#FEF3C7,#FDE68A);
  color:#9A3412;
  font-family:var(--display);
  font-size:25px;
  font-weight:950;
  letter-spacing:-.03em;
  box-shadow:0 8px 18px rgba(245,158,11,.16);
}
.daily-mock-offer-card__price span{
  color:var(--ink-soft);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.daily-mock-offer-card .upgrade-sample-card__facts span{
  border-color:color-mix(in srgb,#F59E0B 30%,var(--line));
  background:color-mix(in srgb,#F59E0B 7%,var(--surface));
}
.daily-mock-offer-card .upgrade-sample-card__cta{
  background:linear-gradient(135deg,#F59E0B,#EA580C)!important;
  box-shadow:0 10px 24px rgba(234,88,12,.24);
}
.daily-mock-offer-card .upgrade-sample-card__cta:hover{
  background:linear-gradient(135deg,#D97706,#C2410C)!important;
}

/* Welcome offer: Daily Mock OR complete Pro/Extreme access. */
.welcome-offer-or{
  display:flex;
  align-items:center;
  gap:12px;
  margin:17px 0 13px;
  color:var(--ink-soft);
  font-family:var(--display);
  font-size:11px;
  font-weight:950;
  letter-spacing:.13em;
}
.welcome-offer-or::before,.welcome-offer-or::after{content:"";height:1px;flex:1;background:var(--line)}
.welcome-offer-or span{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--purple)}
.welcome-plan-heading{margin:0 0 12px;text-align:center}
.welcome-plan-heading h3{margin:0 0 4px;font-family:var(--display);font-size:18px;color:var(--ink)}
.welcome-plan-heading p{margin:0 auto;max-width:610px;color:var(--ink-soft);font-size:12.5px;line-height:1.5}
.daily-mock-subject-facts{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px!important}
.daily-mock-subject-fact{display:flex!important;align-items:baseline;justify-content:center;gap:5px;min-width:0;padding:9px 7px!important;text-align:center!important;white-space:nowrap}
.daily-mock-subject-fact b{font-size:10px;font-weight:900}
.daily-mock-subject-fact .daily-exam-blueprint-count{display:inline-flex;align-items:baseline;gap:3px}
.daily-mock-subject-fact strong{font-family:var(--display);font-size:17px;color:#C2410C}
.daily-mock-subject-fact small{font-size:9px;color:var(--ink-soft)}
.daily-mock-analysis-note{display:flex;align-items:center;justify-content:center;gap:7px;margin:10px 0 0;padding:9px 11px;border:1px solid color-mix(in srgb,#2563EB 22%,var(--line));border-radius:11px;background:color-mix(in srgb,#2563EB 6%,var(--surface));color:var(--blue);font-size:11.5px;font-weight:900}

/* Compact Rs. 500 payment and activation modal. */
#daily-exam-payment-modal{z-index:220}
#daily-exam-payment-modal .modal-panel{position:relative;width:min(430px,calc(100vw - 24px));max-width:430px;margin:auto;overflow:visible;border-radius:20px;background:var(--surface);box-shadow:0 24px 70px rgba(15,23,42,.25)}
.daily-exam-payment-close-x{position:absolute;top:10px;right:10px;z-index:2}
.daily-exam-payment-body{padding:28px 24px 24px!important}
.daily-exam-payment-price{display:grid;gap:5px;padding:18px;border-radius:16px;background:linear-gradient(135deg,#0F4C5C,#075985 62%,#4C1D95);color:#fff;text-align:center;box-shadow:0 14px 30px rgba(7,89,133,.22)}
.daily-exam-payment-price span{font-size:11px;font-weight:950;letter-spacing:.13em}
.daily-exam-payment-price strong{color:#FDE68A;font-family:var(--display);font-size:34px;line-height:1.05;letter-spacing:-.03em}
.daily-exam-payment-lead{margin:17px 2px 15px;color:var(--ink);font-size:14px;line-height:1.55;text-align:center}
.daily-exam-payment-account{display:grid;gap:0;border:1px solid color-mix(in srgb,#00A651 25%,var(--line));border-radius:15px;background:color-mix(in srgb,#00A651 5%,var(--surface));overflow:hidden}
.daily-exam-payment-account div{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;padding:13px 15px}
.daily-exam-payment-account div+div{border-top:1px solid color-mix(in srgb,#00A651 18%,var(--line))}
.daily-exam-payment-account span{color:var(--ink-soft);font-size:12px;font-weight:850}
.daily-exam-payment-account strong{color:var(--ink);font-family:var(--display);font-size:16px;text-align:right}
.daily-exam-copy-number{width:100%;margin-top:14px;justify-content:center;background:linear-gradient(135deg,#00A651,#07823F)!important;box-shadow:0 9px 20px rgba(0,166,81,.20)}
.daily-exam-copy-number:hover{background:linear-gradient(135deg,#07823F,#05662F)!important}

:root[data-theme="dark"] .daily-mock-welcome-banner{
  background:linear-gradient(115deg,rgba(245,158,11,.15),rgba(124,58,237,.13) 58%,rgba(37,99,235,.11));
}
:root[data-theme="dark"] .daily-mock-offer-card{
  background:linear-gradient(145deg,rgba(49,46,129,.22),rgba(245,158,11,.09));
}

@media(max-width:720px){
  .daily-exam-card{min-height:0;border-radius:22px!important}
  .daily-exam-card__top{padding:17px 17px 0}
  .daily-exam-card__body{grid-template-columns:58px minmax(0,1fr);gap:13px;padding:17px 17px 13px}
  .daily-exam-card__icon{width:58px;height:58px;border-radius:17px;font-size:29px}
  .daily-exam-card__title{font-size:22px;line-height:1.16}
  .daily-exam-card__blurb{font-size:13.5px}
  .daily-exam-card__facts{padding:0 17px 13px}
  .daily-exam-card__promise{margin:0 17px 14px;align-items:flex-start;flex-direction:column;gap:2px}
  .daily-exam-card__promise strong{white-space:normal}
  .daily-exam-card__foot{padding:13px 17px 16px}
}
@media(max-width:520px){
  .daily-exam-card__top{align-items:flex-start}
  .daily-exam-card__kicker{font-size:9.5px;letter-spacing:.09em}
  .daily-exam-card__price{font-size:10.5px;padding:6px 9px}
  .daily-exam-card__body{grid-template-columns:1fr}
  .daily-exam-card__icon{width:50px;height:50px;font-size:25px}
  .daily-exam-card__title{font-size:21px}
  .daily-exam-card__facts span{flex:1 1 calc(50% - 8px);justify-content:center;text-align:center}
  .daily-exam-card__foot{display:grid;grid-template-columns:1fr;gap:10px}
  .daily-exam-card__action{width:100%}
  .daily-mock-offer-card .upgrade-sample-card__head{padding-top:32px}
}

@media(max-width:820px){
  .daily-exam-card__subjects,.daily-exam-payment-blueprint,.daily-mock-subject-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .daily-exam-card__subject:last-child,.daily-exam-payment-subject:last-child,.daily-mock-subject-fact:last-child{grid-column:1/-1}
  .daily-exam-payment-account{grid-template-columns:1fr 1fr}.daily-exam-payment-account button{grid-column:1/-1;width:100%}
}
@media(max-width:520px){
  #daily-exam-payment-modal .modal-panel{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);margin:8px auto;border-radius:18px}
  #daily-exam-payment-modal .modal-foot{display:grid;grid-template-columns:1fr;padding:11px 16px}
  #daily-exam-payment-modal .modal-foot .primary-btn,#daily-exam-payment-modal .modal-foot .ghost-btn{width:100%;justify-content:center}
  .daily-exam-payment-account{grid-template-columns:1fr}
  .daily-exam-payment-account button{grid-column:auto}
}

/* v14.4.4 mobile refinements for the premium daily mock. */
@media(max-width:720px){
  .daily-exam-card::after{display:none}
  .daily-exam-card__top{flex-wrap:wrap;gap:10px}
  .daily-exam-card__price{font-size:14px;padding:8px 12px}
  .daily-mock-welcome-banner{border-radius:16px}
  .daily-mock-subject-fact{white-space:normal;flex-wrap:wrap;line-height:1.25}
}
@media(max-width:520px){
  .daily-exam-card{border-radius:19px!important}
  .daily-exam-card__top{padding:15px 15px 0}
  .daily-exam-card__body{padding:15px}
  .daily-exam-card__facts,.daily-exam-card__subjects{padding-left:15px;padding-right:15px}
  .daily-exam-card__promise{margin-left:15px;margin-right:15px}
  .daily-exam-card__foot{padding-left:15px;padding-right:15px}
  .daily-exam-card__price{font-size:13px}
  .daily-mock-subject-facts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .daily-mock-subject-fact:last-child{grid-column:1/-1}
  #daily-exam-payment-modal .modal-panel{width:calc(100vw - 20px);border-radius:17px}
  .daily-exam-payment-body{padding:25px 16px 18px!important}
  .daily-exam-payment-price{padding:16px 12px}
  .daily-exam-payment-price strong{font-size:30px}
  .daily-exam-payment-lead{font-size:13.5px}
  .daily-exam-payment-account div{grid-template-columns:1fr;gap:4px;text-align:left}
  .daily-exam-payment-account strong{text-align:left;font-size:17px}
}
@media(max-width:400px){
  .daily-exam-card__subjects{grid-template-columns:1fr}
  .daily-exam-card__subject:last-child{grid-column:auto}
  .daily-exam-card__title{font-size:19px}
}

/* ===== v14.4.5 — Unified banner background + responsive modal cleanup ===== */
/* The home daily-mock banner now uses the same soft premium background as the
   slim banner shown on internal pages. */
.daily-mock-welcome-banner,
.daily-exam-card{
  background:
    radial-gradient(circle at 8% 8%,rgba(255,255,255,.88),transparent 27%),
    linear-gradient(115deg,#FFF8ED 0%,#F8F5FF 58%,#F1F5FF 100%)!important;
  border-color:color-mix(in srgb,#F59E0B 48%,var(--line))!important;
  box-shadow:0 14px 34px rgba(79,70,229,.09),0 7px 18px rgba(245,158,11,.08)!important;
}
.daily-exam-card{
  min-height:0;
  color:var(--ink);
  isolation:isolate;
}
.daily-exam-card::before{
  background:
    radial-gradient(circle at 88% 18%,rgba(139,92,246,.09),transparent 25%),
    repeating-linear-gradient(135deg,rgba(37,99,235,.018) 0 1px,transparent 1px 12px);
  transform:none;
}
.daily-exam-card::after{color:rgba(124,58,237,.08)}
.daily-exam-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,#F59E0B 70%,var(--line))!important;
  box-shadow:0 18px 42px rgba(79,70,229,.12),0 9px 22px rgba(245,158,11,.11)!important;
}
.daily-exam-card__kicker{color:#7C3AED}
.daily-exam-card__title{color:var(--ink)}
.daily-exam-card__blurb{color:var(--ink-soft)}
.daily-exam-card__facts span{
  border-color:color-mix(in srgb,#2563EB 18%,var(--line));
  background:rgba(255,255,255,.74);
  color:var(--ink);
  backdrop-filter:none;
}
.daily-exam-card__subject{
  border-color:color-mix(in srgb,#F59E0B 24%,var(--line));
  background:rgba(255,255,255,.70);
  backdrop-filter:none;
}
.daily-exam-card__subject b{color:var(--ink)}
.daily-exam-card__subject strong{color:#C2410C}
.daily-exam-card__subject small{color:var(--ink-soft)}
.daily-exam-card__promise{
  border-color:color-mix(in srgb,#2563EB 22%,var(--line));
  background:color-mix(in srgb,#2563EB 6%,rgba(255,255,255,.78));
}
.daily-exam-card__promise strong{color:#1D4ED8}
.daily-exam-card__promise span{color:var(--ink-soft)}
.daily-exam-card__foot{
  border-top-color:color-mix(in srgb,#7C3AED 13%,var(--line));
  background:rgba(255,255,255,.42);
}
.daily-exam-card__status-line{color:var(--ink-soft)}
.daily-exam-card__action{
  background:linear-gradient(135deg,#F59E0B,#F97316);
  color:#fff;
}

/* Keep both access modals fully inside the viewport, including borders and the
   close button. */
:is(#upgrade-modal,#welcome-offer-modal).open{
  padding:16px;
  overflow-x:hidden;
}
:is(#upgrade-modal,#welcome-offer-modal) .modal-panel{
  box-sizing:border-box;
  width:min(760px,calc(100vw - 32px));
  max-width:760px;
  overflow:hidden;
}
:is(#upgrade-modal,#welcome-offer-modal) .modal-body{
  box-sizing:border-box;
  max-width:100%;
  overflow-x:hidden;
}

/* Clean, non-overlapping PMDC subject distribution in the welcome modal. */
.daily-mock-subject-facts{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:9px!important;
  margin:13px 0 11px!important;
}
.daily-mock-subject-fact{
  grid-column:span 2;
  display:grid!important;
  align-content:center;
  justify-items:center;
  gap:4px!important;
  min-width:0;
  min-height:64px;
  padding:10px 8px!important;
  border-radius:14px!important;
  text-align:center!important;
  white-space:normal!important;
  line-height:1.2;
}
.daily-mock-subject-fact:nth-child(4){grid-column:2/span 2}
.daily-mock-subject-fact:nth-child(5){grid-column:4/span 2}
.daily-mock-subject-fact b{
  max-width:100%;
  color:var(--ink);
  font-size:11.5px;
  font-weight:900;
  line-height:1.2;
  overflow-wrap:anywhere;
}
.daily-mock-subject-fact .daily-exam-blueprint-count{
  display:flex!important;
  align-items:baseline;
  justify-content:center;
  gap:4px;
}
.daily-mock-subject-fact strong{font-size:20px}
.daily-mock-subject-fact small{font-size:10px}
.daily-mock-analysis-note{line-height:1.35;text-align:center}

/* Smaller, simpler Easypaisa modal. */
#daily-exam-payment-modal.open{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  overflow:hidden;
}
#daily-exam-payment-modal .modal-panel{
  box-sizing:border-box;
  width:min(380px,calc(100vw - 28px));
  max-width:380px;
  max-height:calc(100dvh - 28px);
  margin:auto;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--surface);
  box-shadow:0 20px 55px rgba(15,23,42,.22);
}
.daily-exam-payment-close-x{top:8px;right:8px}
.daily-exam-payment-body{padding:24px 20px 20px!important}
.daily-exam-payment-price{
  display:grid;
  justify-items:center;
  gap:9px;
  padding:2px 34px 4px;
  border-radius:0;
  background:transparent;
  color:var(--ink);
  box-shadow:none;
}
.daily-exam-payment-price span{
  color:var(--ink-soft);
  font-size:10.5px;
  letter-spacing:.11em;
}
.daily-exam-payment-price strong{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 17px;
  border:1px solid #F5D36A;
  border-radius:999px;
  background:#FEF3C7;
  color:#9A3412;
  font-size:29px;
  box-shadow:0 6px 16px rgba(245,158,11,.12);
}
.daily-exam-payment-lead{
  margin:14px 3px;
  color:var(--ink-soft);
  font-size:13.5px;
  line-height:1.5;
}
.daily-exam-payment-account{
  border-color:var(--line);
  border-radius:13px;
  background:var(--cream-2);
}
.daily-exam-payment-account div{padding:11px 13px}
.daily-exam-payment-account div+div{border-top-color:var(--line)}
.daily-exam-payment-account span{font-size:11.5px}
.daily-exam-payment-account strong{font-size:15.5px}
.daily-exam-copy-number{
  min-height:42px;
  margin-top:12px;
  border-radius:11px;
}

:root[data-theme="dark"] .daily-exam-card{
  background:linear-gradient(125deg,color-mix(in srgb,#F59E0B 10%,var(--surface)),color-mix(in srgb,#7C3AED 12%,var(--surface)))!important;
}
:root[data-theme="dark"] .daily-exam-card__facts span,
:root[data-theme="dark"] .daily-exam-card__subject,
:root[data-theme="dark"] .daily-exam-card__foot{background:rgba(255,255,255,.045)}

@media(max-width:600px){
  :is(#upgrade-modal,#welcome-offer-modal).open{padding:10px}
  :is(#upgrade-modal,#welcome-offer-modal) .modal-panel{
    width:calc(100vw - 20px);
    max-width:none;
    max-height:calc(100dvh - 20px);
  }
  .daily-mock-offer-card{padding:13px}
  .daily-mock-offer-card .upgrade-sample-card__head{
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    gap:10px;
    padding:30px 0 0;
  }
  .daily-mock-offer-card__price{font-size:24px}
  .daily-mock-subject-facts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .daily-mock-subject-fact,
  .daily-mock-subject-fact:nth-child(4),
  .daily-mock-subject-fact:nth-child(5){grid-column:auto}
  .daily-mock-subject-fact:last-child{grid-column:1/-1}
  .daily-mock-subject-fact{min-height:58px;padding:9px 7px!important}
  .upgrade-sample-card__note{font-size:11.5px!important;line-height:1.45}
  #daily-exam-payment-modal.open{padding:10px}
  #daily-exam-payment-modal .modal-panel{
    width:calc(100vw - 20px);
    max-height:calc(100dvh - 20px);
  }
}
@media(max-width:400px){
  .daily-mock-subject-facts{grid-template-columns:1fr!important}
  .daily-mock-subject-fact:last-child{grid-column:auto}
  .daily-exam-payment-body{padding:22px 15px 16px!important}
  .daily-exam-payment-price strong{font-size:26px}
}

/* ===== v14.4.6 — Remove nested question-count pills ===== */
/* The subject tile remains, but the number + "questions" is plain text. */
.daily-mock-subject-fact .daily-exam-blueprint-count,
.daily-mock-offer-card .upgrade-sample-card__facts .daily-exam-blueprint-count{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}


/* Daily Mock premium result sheet */
.daily-result-modal{position:fixed;inset:0;z-index:10050;display:none;align-items:center;justify-content:center;padding:20px}
.daily-result-modal.open{display:flex}
.daily-result-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.72);backdrop-filter:blur(5px)}
.daily-result-sheet{position:relative;width:min(820px,100%);max-height:min(92vh,900px);display:flex;flex-direction:column;background:#fff;border-radius:22px;box-shadow:0 30px 90px rgba(15,23,42,.34);overflow:hidden;border:1px solid #dbe5f2}
.daily-result-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 24px 18px;background:linear-gradient(135deg,#eff6ff 0%,#fff7ed 58%,#f5f3ff 100%);border-bottom:1px solid #dbe5f2}
.daily-result-kicker{display:block;font-size:11px;letter-spacing:.14em;font-weight:900;color:#ea580c;margin-bottom:5px}
.daily-result-head h2{margin:0;font-size:22px;line-height:1.25;color:#172554}
.daily-result-close-x{flex:0 0 38px;width:38px;height:38px;border-radius:50%;border:1px solid #cbd5e1;background:#fff;color:#334155;font-size:25px;line-height:1;cursor:pointer}
.daily-result-body{overflow:auto;padding:22px 24px 8px}
.daily-result-hero{display:grid;grid-template-columns:150px 1fr;align-items:center;gap:24px;padding:20px;border:1px solid #dbeafe;border-radius:18px;background:linear-gradient(135deg,#f8fbff,#fffaf4)}
.daily-result-score-ring{--score:0;width:132px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#2563eb calc(var(--score)*1%),#e2e8f0 0);position:relative}
.daily-result-score-ring:before{content:"";position:absolute;inset:11px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px #e2e8f0}
.daily-result-score-ring>div{position:relative;text-align:center;display:grid;gap:2px}
.daily-result-score-ring strong{font-size:30px;color:#172554;line-height:1}
.daily-result-score-ring span{font-size:11px;font-weight:800;color:#64748b}
.daily-result-status{display:inline-flex;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:900;letter-spacing:.03em;background:#eef2ff;color:#4338ca}
.daily-result-status.excellent,.daily-result-status.strong{background:#dcfce7;color:#166534}.daily-result-status.developing{background:#fef3c7;color:#92400e}.daily-result-status.focus,.daily-result-status.foundation{background:#fee2e2;color:#991b1b}
.daily-result-hero-copy h3{font-size:24px;color:#0f172a;margin:10px 0 5px}.daily-result-hero-copy p{margin:0;color:#64748b;line-height:1.55;font-weight:600}
.daily-result-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.daily-result-summary article{border:1px solid #e2e8f0;border-radius:14px;padding:14px 16px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:10px}
.daily-result-summary span{font-size:12px;font-weight:800;color:#64748b}.daily-result-summary strong{font-size:18px;color:#172554}
.daily-result-section{margin-top:18px}.daily-result-section-title{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:10px}.daily-result-section-title span{font-size:10px;letter-spacing:.12em;font-weight:900;color:#2563eb}.daily-result-section-title h3{font-size:19px;margin:3px 0 0;color:#172554}.daily-result-section-title p{font-size:12px;color:#64748b;margin:0;text-align:right}
.daily-result-table-wrap{overflow:hidden;border:1px solid #dbe5f2;border-radius:15px}.daily-result-table{width:100%;border-collapse:collapse}.daily-result-table th{background:#eff6ff;color:#475569;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:11px 14px}.daily-result-table td{padding:12px 14px;border-top:1px solid #e7edf5;color:#334155}.daily-result-table th:nth-child(n+2),.daily-result-table td:nth-child(n+2){text-align:center}.daily-result-table .total td{background:#fff7ed;color:#9a3412;font-weight:900}.daily-result-accuracy{display:inline-block;min-width:48px;font-weight:900;color:#1d4ed8}
.daily-result-insights{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.daily-result-insights article{position:relative;border-radius:14px;padding:14px 58px 14px 16px;border:1px solid}.daily-result-insights .positive{background:#f0fdf4;border-color:#bbf7d0}.daily-result-insights .priority{background:#fff7ed;border-color:#fed7aa}.daily-result-insights span{display:block;font-size:11px;font-weight:800;color:#64748b}.daily-result-insights strong{display:block;margin-top:3px;color:#172554}.daily-result-insights b{position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:20px;color:#172554}
.daily-result-guidance{display:flex;gap:12px;padding:14px 16px;border-radius:14px;background:#eff6ff;border:1px solid #bfdbfe}.daily-result-guidance>span{font-size:22px}.daily-result-guidance strong{color:#1e3a8a}.daily-result-guidance p{margin:3px 0 0;color:#475569;line-height:1.45;font-size:13px}
.daily-result-consumed{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 4px;padding:13px 15px;border-radius:13px;background:#f8fafc;border:1px dashed #cbd5e1;color:#64748b;font-size:12px}.daily-result-consumed strong{color:#334155}.daily-result-foot{padding:14px 24px 18px;display:flex;justify-content:flex-end;background:#fff;border-top:1px solid #edf2f7}.daily-result-done{min-width:130px}
@media(max-width:640px){.daily-result-modal{padding:8px}.daily-result-sheet{max-height:96vh;border-radius:16px}.daily-result-head{padding:16px}.daily-result-head h2{font-size:17px}.daily-result-body{padding:14px}.daily-result-hero{grid-template-columns:1fr;text-align:center;justify-items:center;gap:12px;padding:16px}.daily-result-score-ring{width:112px}.daily-result-hero-copy h3{font-size:20px}.daily-result-summary{grid-template-columns:1fr;gap:8px}.daily-result-summary article{padding:11px 13px}.daily-result-section-title{display:block}.daily-result-section-title p{text-align:left;margin-top:4px}.daily-result-table th,.daily-result-table td{padding:10px 8px;font-size:12px}.daily-result-insights{grid-template-columns:1fr}.daily-result-foot{padding:10px 14px 14px}.daily-result-done{width:100%}}

/* v14.4.8 — Daily mock time taken and previous-attempt history */
.daily-result-summary{grid-template-columns:repeat(4,minmax(0,1fr))}
.daily-result-foot{gap:10px;align-items:center}
.daily-result-history{min-width:150px}
.daily-exam-history-card{background:linear-gradient(145deg,#ffffff 0%,#f5f3ff 100%);border-color:#ddd6fe!important}
.daily-exam-history-card .launcher-badge{background:#7c3aed;color:#fff}

.daily-history-modal{position:fixed;inset:0;z-index:10060;display:none;align-items:center;justify-content:center;padding:20px}
.daily-history-modal.open{display:flex}
.daily-history-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.72);backdrop-filter:blur(5px)}
.daily-history-sheet{position:relative;width:min(930px,100%);max-height:min(92vh,920px);display:flex;flex-direction:column;background:#fff;border:1px solid #dbe5f2;border-radius:22px;overflow:hidden;box-shadow:0 30px 90px rgba(15,23,42,.34)}
.daily-history-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 24px 18px;background:linear-gradient(135deg,#f5f3ff 0%,#eff6ff 54%,#fff7ed 100%);border-bottom:1px solid #dbe5f2}
.daily-history-head>div>span{display:block;font-size:10px;letter-spacing:.14em;font-weight:900;color:#7c3aed;margin-bottom:5px}
.daily-history-head h2{margin:0;color:#172554;font-size:23px;line-height:1.25}
.daily-history-head p{margin:6px 0 0;color:#64748b;font-size:13px;line-height:1.45;font-weight:600}
.daily-history-close{flex:0 0 38px;width:38px;height:38px;border-radius:50%;border:1px solid #cbd5e1;background:#fff;color:#334155;font-size:25px;line-height:1;cursor:pointer}
.daily-history-body{padding:18px 20px;overflow:auto;background:#f8fafc}
.daily-history-list{display:grid;gap:12px}
.daily-history-item{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:16px;align-items:center;padding:15px 16px;border:1px solid #dbe5f2;border-radius:16px;background:#fff;box-shadow:0 4px 14px rgba(15,23,42,.04)}
.daily-history-attempt{height:62px;border-radius:14px;background:#eef2ff;display:grid;place-items:center;align-content:center;border:1px solid #ddd6fe}
.daily-history-attempt span{font-size:10px;font-weight:900;letter-spacing:.08em;color:#6d28d9;text-transform:uppercase}
.daily-history-attempt strong{font-size:22px;line-height:1;color:#4c1d95;margin-top:3px}
.daily-history-main{min-width:0}
.daily-history-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.daily-history-title-row>strong{color:#172554;font-size:14px}
.daily-history-title-row .daily-result-status{white-space:nowrap}
.daily-history-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.daily-history-metrics span{display:grid;gap:2px;padding:8px 10px;border-radius:10px;background:#f8fafc;border:1px solid #edf2f7}
.daily-history-metrics small{font-size:10px;font-weight:800;color:#64748b}
.daily-history-metrics b{font-size:14px;color:#172554}
.daily-history-view{white-space:nowrap;padding:10px 14px}
.daily-history-loading,.daily-history-empty{min-height:230px;display:grid;place-items:center;align-content:center;text-align:center;color:#64748b;gap:7px;padding:30px}
.daily-history-empty>span{font-size:38px}.daily-history-empty h3{margin:0;color:#172554;font-size:19px}.daily-history-empty p{margin:0;max-width:520px;line-height:1.55}
.daily-history-empty.error h3{color:#991b1b}
.daily-history-foot{padding:13px 20px 17px;border-top:1px solid #e5e7eb;background:#fff;display:flex;justify-content:flex-end}

@media(max-width:760px){
  .daily-result-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .daily-history-item{grid-template-columns:64px minmax(0,1fr);align-items:start}
  .daily-history-view{grid-column:1/-1;width:100%}
  .daily-history-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .daily-history-title-row{align-items:flex-start;flex-direction:column;gap:7px}
}
@media(max-width:640px){
  .daily-result-foot{display:grid;grid-template-columns:1fr 1fr}.daily-result-history,.daily-result-done{width:100%;min-width:0}
  .daily-history-modal{padding:7px}.daily-history-sheet{max-height:97vh;border-radius:16px}
  .daily-history-head{padding:16px}.daily-history-head h2{font-size:18px}.daily-history-head p{font-size:12px}
  .daily-history-body{padding:12px}.daily-history-item{padding:12px;gap:11px}
}
@media(max-width:420px){
  .daily-result-summary{grid-template-columns:1fr}
  .daily-result-foot{grid-template-columns:1fr}
  .daily-history-item{grid-template-columns:1fr}
  .daily-history-attempt{height:auto;min-height:58px;grid-template-columns:auto auto;gap:7px;align-content:center}
  .daily-history-attempt strong{margin:0}
  .daily-history-metrics{grid-template-columns:1fr 1fr}
}

/* ===== v14.4.9 — Complete Daily Mock answer review ===== */
.daily-result-review{min-width:150px}
.daily-history-actions{display:grid;gap:8px;min-width:138px}
.daily-history-actions .ghost-btn,
.daily-history-actions .primary-btn{white-space:nowrap;padding:9px 12px;font-size:13px}

.daily-review-modal{position:fixed;inset:0;z-index:10070;display:none;align-items:center;justify-content:center;padding:16px}
.daily-review-modal.open{display:flex}
.daily-review-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.78);backdrop-filter:blur(5px)}
.daily-review-sheet{position:relative;width:min(1180px,100%);height:min(96vh,980px);display:flex;flex-direction:column;background:#f8fafc;border:1px solid #dbe5f2;border-radius:22px;overflow:hidden;box-shadow:0 30px 90px rgba(15,23,42,.38)}
.daily-review-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:15px 20px 13px;background:linear-gradient(135deg,#eff6ff 0%,#fff7ed 52%,#f5f3ff 100%);border-bottom:1px solid #dbe5f2}
.daily-review-head>div>span{display:block;font-size:10px;letter-spacing:.14em;font-weight:900;color:#2563eb;margin-bottom:5px}
.daily-review-head h2{margin:0;color:#172554;font-size:22px;line-height:1.25}
.daily-review-head p{margin:6px 0 0;color:#64748b;font-size:13px;line-height:1.45;font-weight:600}
.daily-review-close{flex:0 0 38px;width:38px;height:38px;border-radius:50%;border:1px solid #cbd5e1;background:#fff;color:#334155;font-size:25px;line-height:1;cursor:pointer}
.daily-review-toolbar{padding:10px 16px 9px;background:#fff;border-bottom:1px solid #e2e8f0}
.daily-review-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:9px}
.daily-review-overview>span{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;border:1px solid #e2e8f0;border-radius:11px;background:#f8fafc}
.daily-review-overview small{font-size:10px;font-weight:850;color:#64748b;text-transform:uppercase;letter-spacing:.04em}
.daily-review-overview strong{font-size:15px;color:#172554}
.daily-review-filter-row{display:grid;gap:7px}
.daily-review-filter-group{display:flex;gap:7px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}
.daily-review-filter-group.subjects{border-top:1px dashed #dbe5f2;padding-top:7px}
.daily-review-filter{flex:0 0 auto;border:1px solid #cbd5e1;border-radius:999px;background:#fff;color:#475569;padding:6px 10px;font:800 12px/1 var(--body);cursor:pointer}
.daily-review-filter b{margin-left:3px;color:inherit}
.daily-review-filter.active{background:#1d4ed8;border-color:#1d4ed8;color:#fff;box-shadow:0 4px 12px rgba(37,99,235,.22)}
.daily-review-filter-group.subjects .daily-review-filter.active{background:#7c3aed;border-color:#7c3aed}
.daily-review-body{flex:1;overflow:auto;padding:11px 16px 16px;background:#f8fafc}
.daily-review-visible-count{margin:0 0 10px;color:#64748b;font-size:12px;font-weight:700}
.daily-review-list{display:grid;gap:14px}
.daily-review-question{border:1px solid #dbe5f2;border-left:5px solid #94a3b8;border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 4px 16px rgba(15,23,42,.05)}
.daily-review-question.correct{border-left-color:#16a34a}
.daily-review-question.incorrect{border-left-color:#dc2626}
.daily-review-question.unanswered{border-left-color:#d97706}
.daily-review-question-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:13px 16px;background:#f8fafc;border-bottom:1px solid #edf2f7}
.daily-review-question-head>div{display:grid;gap:3px;min-width:0}
.daily-review-qnum{font-size:13px;font-weight:900;color:#172554}
.daily-review-meta{font-size:11px;color:#64748b;font-weight:700;text-transform:capitalize;overflow-wrap:anywhere}
.daily-review-state{flex:0 0 auto;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.daily-review-state.correct{background:#dcfce7;color:#166534}
.daily-review-state.incorrect{background:#fee2e2;color:#991b1b}
.daily-review-state.unanswered{background:#fef3c7;color:#92400e}
.daily-review-prompt{padding:16px 16px 11px;color:#0f172a;font-size:16px;font-weight:700;line-height:1.55}
.daily-review-image{display:block;max-width:min(520px,calc(100% - 32px));max-height:300px;object-fit:contain;margin:0 16px 12px;border-radius:12px;border:1px solid #e2e8f0}
.daily-review-options{display:grid;gap:8px;padding:0 16px 14px}
.daily-review-option{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:46px;padding:8px 11px;border:1.5px solid #e2e8f0;border-radius:12px;background:#fff;color:#334155}
.daily-review-letter{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#f1f5f9;color:#475569;font-size:12px;font-weight:900}
.daily-review-option-text{font-size:14px;line-height:1.45;font-weight:600;min-width:0}
.daily-review-option.correct{border-color:#86efac;background:#f0fdf4}
.daily-review-option.correct .daily-review-letter{background:#16a34a;color:#fff}
.daily-review-option.selected-wrong{border-color:#fca5a5;background:#fef2f2}
.daily-review-option.selected-wrong .daily-review-letter{background:#dc2626;color:#fff}
.daily-review-option-note{white-space:nowrap;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.daily-review-option-note.correct{background:#dcfce7;color:#166534}
.daily-review-option-note.wrong{background:#fee2e2;color:#991b1b}
.daily-review-answer-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:13px 16px;border-top:1px solid #edf2f7;background:#fff}
.daily-review-answer-summary>span{display:grid;gap:3px;padding:9px 11px;border-radius:10px;background:#f8fafc;border:1px solid #e2e8f0}
.daily-review-answer-summary small{font-size:10px;color:#64748b;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.daily-review-answer-summary strong{font-size:12px;color:#334155;line-height:1.4}
.daily-review-explanation{margin:0 16px 16px;padding:13px 14px;border:1px solid #bfdbfe;border-left:4px solid #2563eb;border-radius:12px;background:#eff6ff;color:#334155;font-size:13px;line-height:1.55}
.daily-review-explanation.muted{border-color:#e2e8f0;border-left-color:#94a3b8;background:#f8fafc;color:#64748b}
.daily-review-explanation-title{margin-bottom:5px;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#1d4ed8}
.daily-review-explanation p{margin:0 0 7px}.daily-review-explanation p:last-child{margin-bottom:0}
.daily-review-loading,.daily-review-empty{min-height:280px;display:grid;place-items:center;align-content:center;text-align:center;color:#64748b;gap:7px;padding:30px}
.daily-review-empty>span{font-size:38px}.daily-review-empty h3{margin:0;color:#172554;font-size:19px}.daily-review-empty p{margin:0;max-width:520px;line-height:1.55}.daily-review-empty.error h3{color:#991b1b}
.daily-review-foot{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 16px 12px;border-top:1px solid #dbe5f2;background:#fff}
.daily-review-foot button{min-width:132px}
.daily-review-foot-nav{display:flex;align-items:center;justify-content:center;gap:9px}
.daily-review-foot-nav button{min-width:120px}
.daily-review-page-label{min-width:130px;text-align:center;color:#475569;font-size:12px;font-weight:850}
.daily-review-foot button:disabled{opacity:.42;cursor:not-allowed;box-shadow:none}


.daily-review-pagebar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 10px;padding:8px 11px;border:1px solid #dbe5f2;border-radius:12px;background:#fff;box-shadow:0 2px 8px rgba(15,23,42,.04)}
.daily-review-pagebar>div{display:flex;align-items:baseline;gap:9px;min-width:0}
.daily-review-pagebar strong{color:#172554;font-size:13px}
.daily-review-pagebar span{color:#64748b;font-size:11px;font-weight:700}
.daily-review-jump{display:flex;align-items:center;gap:7px;color:#64748b;font-size:11px;font-weight:800;white-space:nowrap}
.daily-review-jump select{max-width:150px;border:1px solid #cbd5e1;border-radius:9px;background:#fff;color:#334155;padding:6px 26px 6px 9px;font:800 11px/1.2 var(--body)}
.daily-review-single{max-width:980px;margin:0 auto}
.daily-review-single .daily-review-question{min-height:0}

:root[data-theme="dark"] .daily-review-sheet,
:root[data-theme="dark"] .daily-review-question,
:root[data-theme="dark"] .daily-review-toolbar,
:root[data-theme="dark"] .daily-review-foot{background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .daily-review-body,
:root[data-theme="dark"] .daily-review-question-head,
:root[data-theme="dark"] .daily-review-overview>span,
:root[data-theme="dark"] .daily-review-answer-summary>span{background:var(--cream-2)}

@media(max-width:820px){
  .daily-history-item{grid-template-columns:64px minmax(0,1fr)}
  .daily-history-actions{grid-column:1/-1;grid-template-columns:1fr 1fr;min-width:0}
  .daily-review-overview{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .daily-result-foot{grid-template-columns:1fr 1fr}.daily-result-done{grid-column:1/-1}
  .daily-result-history,.daily-result-review,.daily-result-done{width:100%;min-width:0}
  .daily-review-modal{padding:0}
  .daily-review-sheet{width:100%;height:100dvh;max-height:none;border-radius:0;border:0}
  .daily-review-head{padding:14px 15px 12px}.daily-review-head h2{font-size:17px}.daily-review-head p{font-size:11.5px}
  .daily-review-toolbar{padding:10px 11px}
  .daily-review-body{padding:11px 10px 18px}
  .daily-review-question-head{padding:11px 12px}.daily-review-prompt{padding:13px 12px 9px;font-size:15px}
  .daily-review-options{padding:0 12px 12px}.daily-review-option{grid-template-columns:30px minmax(0,1fr);padding:8px}
  .daily-review-option-note{grid-column:2;justify-self:start;margin-top:-3px}
  .daily-review-answer-summary{grid-template-columns:1fr;padding:11px 12px}
  .daily-review-explanation{margin:0 12px 13px;padding:11px 12px}
  .daily-review-foot{grid-template-columns:1fr 1fr;grid-template-areas:"nav nav" "result done";gap:8px;padding:8px 10px 10px}.daily-review-foot button{min-width:0;padding:10px 8px}.daily-review-foot-nav{grid-area:nav}.daily-review-back-result{grid-area:result}.daily-review-done{grid-area:done}.daily-review-foot-nav button{flex:1;min-width:0}.daily-review-page-label{min-width:94px;font-size:11px}
  .daily-review-pagebar{align-items:flex-start;padding:8px 9px}.daily-review-pagebar>div{display:grid;gap:2px}.daily-review-jump{align-self:center}.daily-review-jump select{max-width:118px}
}
@media(max-width:420px){
  .daily-history-actions{grid-template-columns:1fr}
  .daily-review-overview{grid-template-columns:1fr 1fr;gap:7px}
  .daily-review-overview>span{display:grid;gap:2px;padding:8px}
  .daily-review-meta{font-size:10px}
  .daily-review-question-head{display:grid;grid-template-columns:1fr auto}
  .daily-review-option-text{font-size:13px}
  .daily-review-foot{display:grid;grid-template-columns:1fr 1fr}
  .daily-review-pagebar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.daily-review-pagebar span{display:none}.daily-review-jump{font-size:0}.daily-review-jump select{font-size:11px;max-width:105px}
}

/* v14.4.11 — compact answer-review toolbar */
.daily-review-head{align-items:center;padding:10px 16px 9px}
.daily-review-head>div>span{margin-bottom:2px;font-size:9px}
.daily-review-head h2{font-size:19px;line-height:1.2}
.daily-review-head p{display:none}
.daily-review-close{flex-basis:34px;width:34px;height:34px;font-size:22px}
.daily-review-toolbar{padding:6px 12px}
.daily-review-compactbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.daily-review-inline-stats{display:flex;align-items:center;gap:7px;min-width:0;white-space:nowrap;color:#475569;font-size:11px;font-weight:750}
.daily-review-inline-stats span{display:inline-flex;align-items:center;gap:3px}
.daily-review-inline-stats b{color:#172554;font-size:10px;text-transform:uppercase;letter-spacing:.03em}
.daily-review-inline-stats i{color:#cbd5e1;font-style:normal}
.daily-review-compact-controls{display:flex;align-items:center;justify-content:flex-end;gap:7px;min-width:0}
.daily-review-compact-controls label{display:flex;align-items:center;gap:5px;min-width:0;color:#64748b;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.035em}
.daily-review-compact-controls select{height:32px;min-width:105px;max-width:145px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#334155;padding:4px 25px 4px 8px;font:800 11px/1.2 var(--body)}
.daily-review-compact-controls label:last-child select{min-width:120px}
.daily-review-body{padding:7px 12px 12px}
.daily-review-single{max-width:1040px}
.daily-review-question-head{padding:9px 12px}
.daily-review-prompt{padding:11px 12px 8px;font-size:15px;line-height:1.45}
.daily-review-options{gap:6px;padding:0 12px 10px}
.daily-review-option{min-height:40px;padding:6px 9px;border-radius:10px}
.daily-review-answer-summary{gap:7px;padding:9px 12px}
.daily-review-answer-summary>span{padding:7px 9px}
.daily-review-explanation{margin:0 12px 11px;padding:10px 11px}
.daily-review-foot{padding:7px 12px 8px}
:root[data-theme="dark"] .daily-review-compact-controls select{background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .daily-review-inline-stats b{color:var(--ink)}

@media(max-width:860px){
  .daily-review-compactbar{display:grid;grid-template-columns:1fr;gap:5px}
  .daily-review-inline-stats{overflow-x:auto;scrollbar-width:none;padding-bottom:1px}
  .daily-review-inline-stats::-webkit-scrollbar{display:none}
  .daily-review-compact-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .daily-review-compact-controls label{display:block}
  .daily-review-compact-controls label>span{display:none}
  .daily-review-compact-controls select,.daily-review-compact-controls label:last-child select{width:100%;min-width:0;max-width:none}
}
@media(max-width:640px){
  .daily-review-head{padding:8px 10px 7px}
  .daily-review-head>div>span{display:none}
  .daily-review-head h2{font-size:15px}
  .daily-review-close{flex-basis:30px;width:30px;height:30px;font-size:20px}
  .daily-review-toolbar{padding:5px 8px}
  .daily-review-inline-stats{font-size:10px;gap:5px}
  .daily-review-inline-stats b{font-size:9px}
  .daily-review-compact-controls select{height:30px;font-size:10.5px;padding-left:6px}
  .daily-review-body{padding:6px 7px 10px}
  .daily-review-question-head{padding:8px 9px}
  .daily-review-prompt{padding:9px 9px 7px;font-size:14px}
  .daily-review-options{padding:0 9px 9px}
  .daily-review-option{min-height:38px;padding:6px 7px}
  .daily-review-answer-summary{padding:8px 9px}
  .daily-review-explanation{margin:0 9px 9px;padding:9px}
  .daily-review-foot{padding:6px 8px 7px}
}

@media(max-width:600px){
  .daily-exam-card__syllabus{font-size:9px;padding:6px 9px;margin-bottom:8px;letter-spacing:.035em;transform:none}
}


/* PDF Study Books — full-width external resource banner */
.menu-item-external{display:flex;align-items:center;justify-content:space-between;gap:12px}
.launcher-bottom-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:stretch}
.launcher-bottom-grid>.launcher-card{min-width:0;height:auto}
.pdf-study-books-banner{grid-column:1/-1;position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px;background:linear-gradient(135deg,var(--surface) 0%,rgba(15,118,110,.08) 55%,rgba(37,99,235,.05) 100%);border:1.5px solid rgba(15,118,110,.34);border-radius:22px;padding:19px 22px;box-shadow:var(--shadow);overflow:hidden}
.pdf-study-books-banner::before{content:"";position:absolute;inset:0 auto 0 0;width:7px;background:linear-gradient(180deg,#0f766e,#2563eb)}
.pdf-books-banner-icon{width:66px;height:66px;border-radius:18px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(15,118,110,.20);flex:0 0 auto}
.pdf-books-ic{background:linear-gradient(145deg,#0f766e,#155e75);overflow:visible}
.pdf-book-stack{position:relative;width:38px;height:40px;display:block;transform:rotate(-2deg)}
.pdf-book-stack i{position:absolute;display:block;width:24px;height:34px;border-radius:3px 5px 5px 3px;border:1px solid rgba(255,255,255,.78);box-shadow:0 3px 6px rgba(0,0,0,.22)}
.pdf-book-stack i:nth-child(1){left:0;top:5px;background:#f59e0b;transform:rotate(-9deg)}
.pdf-book-stack i:nth-child(2){left:8px;top:2px;background:#7c3aed;transform:rotate(1deg)}
.pdf-book-stack i:nth-child(3){left:14px;top:0;background:#2563eb;transform:rotate(8deg)}
.pdf-book-stack i::after{content:"";position:absolute;left:3px;top:5px;right:3px;height:2px;border-radius:2px;background:rgba(255,255,255,.85);box-shadow:0 5px 0 rgba(255,255,255,.55),0 10px 0 rgba(255,255,255,.38)}
.pdf-books-banner-copy{min-width:0}
.pdf-books-banner-eyebrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:5px}
.pdf-books-banner-kicker{font-family:var(--display);font-size:10.5px;font-weight:900;letter-spacing:.07em;color:#0f766e}
.pdf-books-banner-title{margin:0;color:var(--ink);font-family:var(--display);font-size:23px;line-height:1.15}
.pdf-books-banner-blurb{margin:5px 0 0;color:var(--ink-soft);font-size:14.5px;line-height:1.45;max-width:680px}
.pdf-books-free-badge{display:inline-flex;align-items:center;border-radius:999px;padding:4px 9px;background:#dcfce7;color:#166534;font-family:var(--display);font-size:10.5px;font-weight:900;letter-spacing:.035em}
.pdf-books-banner-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap;max-width:340px}
.pdf-books-btn{min-height:42px;border-radius:12px;padding:9px 14px;font-family:var(--display);font-size:12.8px;font-weight:900;cursor:pointer;transition:.15s;white-space:nowrap}
.pdf-books-btn:hover{transform:translateY(-1px)}
.pdf-books-btn-primary{border:1.5px solid #0f766e;background:#0f766e;color:#fff}
.pdf-books-btn-primary:hover{background:#115e59}
.pdf-books-btn-secondary{border:1.5px solid #0f766e;background:transparent;color:#0f766e}
.pdf-books-btn-secondary:hover{background:rgba(15,118,110,.08)}
:root[data-theme="dark"] .pdf-study-books-banner{background:linear-gradient(135deg,var(--surface) 0%,rgba(20,184,166,.10) 58%,rgba(59,130,246,.08) 100%);border-color:rgba(45,212,191,.35)}
:root[data-theme="dark"] .pdf-books-banner-kicker{color:#5eead4}
:root[data-theme="dark"] .pdf-books-free-badge{background:rgba(34,197,94,.18);color:#86efac}
:root[data-theme="dark"] .pdf-books-btn-secondary{color:#5eead4;border-color:#2dd4bf}
:root[data-theme="dark"] .pdf-books-btn-secondary:hover{background:rgba(45,212,191,.10)}
@media(max-width:760px){
  .launcher-bottom-grid{grid-template-columns:1fr;gap:13px}
  .pdf-study-books-banner{grid-template-columns:auto minmax(0,1fr);gap:14px;padding:17px 17px 17px 20px}
  .pdf-books-banner-actions{grid-column:1/-1;width:100%;max-width:none;display:grid;grid-template-columns:1fr 1fr}
  .pdf-books-btn{white-space:normal}
}
@media(max-width:520px){
  .pdf-study-books-banner{grid-template-columns:1fr;text-align:left}
  .pdf-books-banner-icon{width:56px;height:56px;border-radius:16px}
  .pdf-books-banner-title{font-size:21px}
  .pdf-books-banner-blurb{font-size:13.5px}
  .pdf-books-banner-actions{grid-template-columns:1fr}
  .pdf-books-btn{min-height:43px;font-size:13px}
}