.brand-switcher{position:relative}
    .brand-switcher-button{border:0; background:transparent; cursor:pointer; text-align:left; color:inherit; display:flex; align-items:center; gap:6px}
    .app-switcher-menu{position:absolute; z-index:80; left:0; top:calc(100% + 10px); width:270px; padding:9px; border:1px solid var(--border); border-radius:14px; background:#fff; box-shadow:0 16px 36px rgba(15,23,42,.16)}
    .app-switcher-menu[hidden]{display:none!important}
    .app-switcher-menu>p{margin:4px 8px 8px; color:var(--muted); font-size:.7rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase}
    .app-switcher-menu>a{display:flex; align-items:center; gap:9px; padding:9px; border-radius:10px; color:inherit; text-decoration:none}
    .app-switcher-menu>a:hover,.app-switcher-menu>a.is-current{background:#eff6ff}
    .app-switcher-menu img{width:32px; height:32px; object-fit:contain; border-radius:8px}
    .app-switcher-menu span{display:grid; line-height:1.15; font-weight:800}.app-switcher-menu small{color:var(--muted); font-size:.72rem; font-weight:600}.app-switcher-menu em{margin-left:auto; color:#3730a3; font-size:.68rem; font-style:normal; font-weight:900}
    :root{
      --bg:#f5f7fb;
      --surface:#ffffff;
      --surface-2:#f8fafc;
      --text:#0f172a;
      --muted:#475569;
      --border:#e2e8f0;
      --shadow:0 10px 30px rgba(15,23,42,.10);

      --primary:#2563eb;      /* blue */
      --primary-2:#1d4ed8;
      --good:#16a34a;         /* green */
      --warn:#f59e0b;         /* amber */
      --danger:#dc2626;       /* red */

      --focus: #93c5fd;       /* focus ring */
      --radius: 14px;
      --space-1: 8px;
      --space-2: 12px;
      --space-3: 16px;
      --space-4: 20px;
      --keyhint-bg:#eff6ff;
      --keyhint-border:#bfdbfe;
      --success-flash:#dcfce7;
      --error-flash:#fee2e2;
    }

    *{box-sizing:border-box}
    html,body{min-height:100%}
    body{
      margin:0;
      font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      background: radial-gradient(1200px 600px at 20% 0%, #eef2ff 0%, transparent 60%),
                  radial-gradient(1200px 600px at 80% 20%, #ecfeff 0%, transparent 55%),
                  var(--bg);
      color:var(--text);
      min-height:100vh;
      overflow-y:auto;
      padding:18px 22px 28px;
    }

    a{color:var(--primary)}
    .app{
      width:100%;
      max-width:780px;
      display:flex;
      flex-direction:column;
      gap:14px;
      margin:0 auto;
    }

    /* Top bar */
    .topbar{
      position:sticky;
      top:10px;
      z-index:40;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
      padding:18px 20px;
      border:1px solid #d7e0ef;
      border-radius: var(--radius);
      background: rgba(255,255,255,.92);
      backdrop-filter: blur(8px);
      box-shadow: 0 14px 32px rgba(15,23,42,.10);
    }
    .brand{display:flex; flex-direction:column; gap:2px; min-width:0}
    .brand .title{font-weight:800; letter-spacing:.2px; font-size:1.18rem}
    .brand .subtitle{color:var(--muted); font-size:1rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

    .top-actions{display:flex; align-items:center; gap:12px}
    .chip{
      display:inline-flex;
      align-items:center;
      gap:8px;
      border:1px solid #d7e0ef;
      background: #ffffff;
      border-radius:999px;
      padding:8px 14px;
      font-size:1rem;
      font-weight:700;
      box-shadow: 0 2px 8px rgba(15,23,42,.05);
    }
    .chip .dot{width:9px; height:9px; border-radius:999px; background:var(--primary)}
    .meta{
      color:var(--muted);
      font-size:.9rem;
      margin-left:8px;
      white-space:nowrap;
    }

    .icon-btn{
      width:48px;height:48px;
      border-radius:14px;
      border:1px solid var(--border);
      background:#fff;
      cursor:pointer;
      font-size:20px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      box-shadow: 0 3px 10px rgba(15,23,42,.08);
    }
    .icon-btn{transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease}
    .icon-btn:hover{background:var(--surface-2); transform:translateY(-2px); box-shadow:0 9px 18px rgba(15,23,42,.12)}
    .icon-btn:active{transform: translateY(1px)}
    .icon-btn:focus-visible{outline:3px solid var(--focus); outline-offset:2px}
    #settingsBtn,
    #premiumBtn{
      width:54px;
      height:54px;
      font-size:22px;
      border-color:#bfdbfe;
      background:linear-gradient(180deg, #ffffff 0%, #eff6ff 100%);
      box-shadow: 0 6px 16px rgba(37,99,235,.14);
    }
    #settingsBtn:hover,
    #premiumBtn:hover{
      background:linear-gradient(180deg, #ffffff 0%, #dbeafe 100%);
    }
    #premiumBtn{
      color:#8a5a00;
      border-color:#f4c84c;
      background:linear-gradient(180deg, #fffdf2 0%, #fff7d6 100%);
    }
    #premiumBtn.unlocked{
      color:#166534;
      border-color:#86efac;
      background:linear-gradient(180deg, #ffffff 0%, #dcfce7 100%);
    }
    .premium-btn{width:auto!important; min-width:54px; padding:0 13px; gap:7px; font-size:18px!important; transition:transform .18s ease, box-shadow .18s ease, background .18s ease}
    .premium-btn-label{font-size:.75rem; font-weight:900; letter-spacing:.02em}
    .premium-btn:hover{transform:translateY(-2px) scale(1.02); box-shadow:0 10px 22px rgba(245,158,11,.2)!important}
    .premium-btn:hover span:first-child{transform:rotate(-8deg) scale(1.08)}
    .premium-btn span:first-child{display:inline-block; transition:transform .18s ease}

    /* Banner */
    .banner{
      border:1px solid #fde68a;
      background:#fffbeb;
      border-radius: var(--radius);
      padding:12px 14px;
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
      box-shadow: 0 1px 0 rgba(15,23,42,.05);
    }
    .banner strong{display:block; margin-bottom:4px}
    .banner .banner-actions{display:flex; gap:8px; flex-wrap:wrap}
    .banner .banner-actions button{white-space:nowrap}
    .banner strong{display:inline; margin:0}

    /* Card */
    .card{
      border:1px solid var(--border);
      border-radius: var(--radius);
      background: var(--surface);
      box-shadow: var(--shadow);
      padding:20px;
    }

    .top-row{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      margin-bottom:12px;
      flex-wrap:wrap;
    }
    .counts{
      color:var(--muted);
      font-size:.95rem;
      line-height:1.45;
    }
    .counts code{background:#f1f5f9; padding:2px 6px; border-radius:8px}

    .only-row-wrap{position:relative; margin-bottom:14px}
    .only-row{
      display:flex;
      flex-wrap:nowrap;
      gap:8px;
      align-items:center;
      overflow-x:auto;
      padding-bottom:2px;
      scrollbar-width:thin;
      -webkit-overflow-scrolling:touch;
    }
    .only-row-wrap::before,
    .only-row-wrap::after{
      content:"";
      position:absolute;
      top:0;
      bottom:0;
      width:24px;
      pointer-events:none;
      z-index:2;
    }
    .only-row-wrap::before{
      left:0;
      background:linear-gradient(to right, var(--surface), transparent);
    }
    .only-row-wrap::after{
      right:0;
      background:linear-gradient(to left, var(--surface), transparent);
    }
    .only-row .btn{white-space:nowrap}
    .only-row .btn.small{padding:9px 12px; font-size:.94rem}
    .only-row-mobile{
      display:none;
      gap:8px;
      align-items:center;
      margin-bottom:14px;
    }
    .key-hint-strip{
      display:flex;
      align-items:center;
      gap:10px;
      flex-wrap:wrap;
      border:1px solid var(--keyhint-border);
      background:var(--keyhint-bg);
      border-radius:12px;
      padding:8px 10px;
      margin-bottom:14px;
      font-size:.9rem;
    }
    .key-pill{
      border:1px solid #93c5fd;
      background:#fff;
      border-radius:8px;
      padding:2px 8px;
      font-weight:800;
    }

    /* Buttons */
    .btn{
      border:1px solid var(--border);
      background:#fff;
      border-radius:12px;
      padding:10px 12px;
      cursor:pointer;
      font-weight:800;
      letter-spacing:.1px;
      color:var(--text);
      display:inline-flex;
      align-items:center;
      gap:8px;
    }
    .btn:hover{background:var(--surface-2)}
    .btn:active{transform: translateY(1px)}
    .btn:focus-visible{outline:3px solid var(--focus); outline-offset:2px}
    .btn.primary{background:var(--primary); border-color:var(--primary); color:#fff}
    .btn.primary:hover{background:var(--primary-2)}
    .btn.warn{background:var(--warn); border-color:var(--warn); color:#111827}
    .btn.danger{background:var(--danger); border-color:var(--danger); color:#fff}
    .btn.ghost{background:transparent}
    .btn.small{padding:8px 10px; border-radius:10px; font-weight:800; font-size:.9rem}
    .btn[disabled]{opacity:.55; cursor:not-allowed; transform:none}

    .divider{height:1px;background:var(--border); margin:12px 0}

    /* Titles */
    h2{margin:0 0 8px; font-size:1.1rem}
    p.lead{margin:0 0 14px; color:var(--muted)}

    /* Active question controls */
    .never-row{
      display:flex;
      justify-content:flex-end;
      margin:6px 0 8px;
    }

    /* Numbers module UI (keeps original behavior/UX, restyled) */
    .display{
      font-size:2.4rem;
      padding:18px;
      border-radius:12px;
      background:var(--surface-2);
      border:1px solid var(--border);
      margin:12px 0 10px;
      text-align:center;
    }
    .spanish{
      min-height:1.7em;
      font-weight:900;
      letter-spacing:.2px;
      text-align:center;
      margin-bottom:12px;
    }
    .controls{display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:6px}
    .hint{margin-top:12px; color:var(--muted); font-size:.92rem}
    .keys{margin-top:10px; color:var(--muted); font-size:.88rem}
    .practice-indicator{margin-top:8px; color:#92400e; font-weight:900; min-height:1.3em}

    /* QA (text / mcq) */
    .qa-wrap{display:flex; flex-direction:column; gap:10px}
    .accent-toolbar{
      display:flex;
      flex-wrap:wrap;
      gap:6px;
      align-items:center;
      margin-bottom:6px;
    }
    .accent-toolbar .btn.small{font-weight:900; min-width:44px; justify-content:center}
    .input-row{
      display:flex;
      gap:10px;
      align-items:center;
      flex-wrap:wrap;
    }
    input[type="text"]{
      flex:1;
      min-width:240px;
      border:1px solid var(--border);
      border-radius:12px;
      padding:12px 12px;
      font-size:1rem;
      outline:none;
      background:#fff;
    }
    input[type="text"]:focus-visible{outline:3px solid var(--focus); outline-offset:2px}

    .actions{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      margin-top:4px;
    }

    .feedback{
      border:1px solid var(--border);
      background:var(--surface-2);
      border-radius:12px;
      padding:12px;
      color:var(--text);
      line-height:1.35;
      min-height:3.2em;
    }
    .feedback.good{border-color:#bbf7d0; background:#f0fdf4}
    .feedback.bad{border-color:#fecaca; background:#fef2f2}
    .feedback.neutral{border-color:var(--border); background:var(--surface-2)}
    .feedback.flash-good{animation:flashGood .32s ease}
    .feedback.flash-bad{animation:flashBad .32s ease}
    .feedback small{color:var(--muted)}

    /* MCQ */
    .mcq{
      display:flex;
      flex-direction:column;
      gap:8px;
      margin:6px 0;
    }
    .mcq-option{
      border:1px solid var(--border);
      border-radius:12px;
      padding:10px 12px;
      display:flex;
      align-items:center;
      gap:10px;
      cursor:pointer;
      background:#fff;
    }
    .mcq-option:hover{background:var(--surface-2)}
    .mcq-option input{transform:scale(1.15)}
    .mcq-option:has(input:focus-visible){outline:3px solid var(--focus); outline-offset:2px}

    /* Modals */
    .modal-overlay{
      position:fixed;
      inset:0;
      background:rgba(15,23,42,.55);
      display:none;
      align-items:center;
      justify-content:center;
      padding:18px;
      z-index:1000;
    }
    .modal{
      width:min(720px, 100%);
      max-height: min(84vh, 900px);
      overflow:auto;
      background:#fff;
      border-radius:16px;
      border:1px solid var(--border);
      box-shadow: 0 18px 50px rgba(0,0,0,.35);
      padding:16px;
      position:relative;
      animation:modalIn .2s ease both;
    }
    .premium-form{display:grid; gap:8px; margin:14px 0 4px}
    .premium-field{display:grid; gap:6px; color:#334155; font-size:.78rem; font-weight:900; letter-spacing:.04em; text-transform:uppercase}
    .premium-field input{width:100%; border:1px solid #cbd5e1; border-radius:12px; padding:13px 14px; color:var(--text); background:#f8fafc; font:inherit; font-size:1rem; letter-spacing:0; text-transform:none; outline:none; transition:border-color .18s ease, box-shadow .18s ease, background .18s ease}
    .premium-field input:focus{border-color:#60a5fa; background:#fff; box-shadow:0 0 0 4px rgba(37,99,235,.14)}
    .premium-request-divider{display:flex; align-items:center; gap:10px; margin:16px 0 10px; color:#94a3b8; font-size:.72rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em}
    .premium-request-divider::before,.premium-request-divider::after{content:""; height:1px; flex:1; background:#e2e8f0}
    .premium-request-toggle{width:100%; justify-content:center; color:#1d4ed8; background:#eff6ff}
    .premium-request-form{display:grid; gap:9px; margin-top:12px; padding:13px; border:1px solid #e0e7ff; border-radius:14px; background:rgba(248,250,252,.7)}
    .premium-request-form p{margin:0 0 2px}
    .premium-request-form .btn{justify-content:center; margin-top:3px}
    @keyframes modalIn{from{opacity:0; transform:translateY(8px) scale(.98)}to{opacity:1; transform:none}}
    .feedback-fab{position:fixed; left:18px; bottom:18px; z-index:60; display:inline-flex; align-items:center; gap:7px; border:1px solid #c7d2fe; border-radius:999px; padding:9px 13px; color:#3730a3; background:rgba(255,255,255,.94); box-shadow:0 8px 20px rgba(30,41,59,.13); cursor:pointer; font:inherit; font-size:.78rem; font-weight:900; transition:transform .18s ease, box-shadow .18s ease, background .18s ease}
    .feedback-fab:hover{transform:translateY(-3px); background:#eff6ff; box-shadow:0 12px 24px rgba(37,99,235,.2)}
    .feedback-fab span:first-child{display:inline-block; transition:transform .18s ease}
    .feedback-fab:hover span:first-child{transform:rotate(15deg) scale(1.15)}
    .feedback-modal{width:min(520px,100%)}
    .feedback-form{display:grid; gap:12px; margin-top:14px}
    .feedback-field{display:grid; gap:6px; color:#334155; font-size:.78rem; font-weight:900; letter-spacing:.04em; text-transform:uppercase}
    .feedback-field small{font-size:.72rem; font-weight:700; letter-spacing:0; text-transform:none; color:var(--muted)}
    .feedback-field input,.feedback-field textarea,.feedback-field select{width:100%; border:1px solid #cbd5e1; border-radius:12px; padding:11px 12px; color:var(--text); background:#f8fafc; font:inherit; font-size:.95rem; letter-spacing:0; text-transform:none; outline:none; transition:border-color .18s ease, box-shadow .18s ease, background .18s ease}
    .feedback-field textarea{min-height:120px; resize:vertical; line-height:1.45}
    .feedback-field input:focus,.feedback-field textarea:focus,.feedback-field select:focus{border-color:#60a5fa; background:#fff; box-shadow:0 0 0 4px rgba(37,99,235,.14)}
    .feedback-form-actions{display:flex; justify-content:flex-end; gap:8px; margin-top:2px}
    .feedback-trap{position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden}
    .modal-head{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:12px;
      padding-bottom:8px;
      border-bottom:1px solid var(--border);
      margin-bottom:12px;
    }
    #settingsOverlay .modal-head{align-items:center;gap:18px;padding-bottom:16px;margin-bottom:18px}
    #settingsOverlay .modal-head>div:first-child{flex:1}
    #settingsOverlay .study-settings-tools{display:flex;align-items:center;gap:8px;flex:0 0 auto;margin:0}
    #settingsOverlay .study-settings-tools button{min-height:38px;padding:8px 12px;border:1px solid #d8e2f1;border-radius:11px;background:#fff;color:#26344a;font-size:.86rem;font-weight:750;box-shadow:0 1px 2px rgba(15,23,42,.04)}
    #settingsOverlay .study-settings-tools button:hover{border-color:#93b4f3;background:#f7faff}
    #moduleSettingsSection>.accordion-inner{padding-top:12px}
    #moduleSettingsSection>.accordion-inner>.module-group{margin:12px 0;border:1px solid #e1e8f2;border-radius:16px;background:#fbfcfe;overflow:hidden}
    #moduleSettingsSection>.accordion-inner>.module-group>summary{padding:14px 16px;font-size:.96rem;font-weight:850;list-style:none;cursor:pointer}
    #moduleSettingsSection>.accordion-inner>.module-group>summary::-webkit-details-marker{display:none}
    #moduleSettingsSection>.accordion-inner>.module-group>summary:after{content:'+';float:right;color:#728096}
    #moduleSettingsSection>.accordion-inner>.module-group[open]>summary:after{content:'−'}
    #moduleSettingsSection .module-group-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:9px;padding:0 12px 12px}
    #moduleSettingsSection .module-group-content>.toggle{min-height:72px;margin:0;padding:12px 13px;border:1px solid #e5eaf1;border-radius:13px;background:white;align-items:center;gap:12px}
    #moduleSettingsSection .module-group-content>.toggle .label{font-size:.92rem;font-weight:800;line-height:1.25}
    #moduleSettingsSection .module-group-content>.toggle .desc{margin-top:4px;color:#718096;font-size:.78rem;line-height:1.35}
    #settingsOverlay .summer-prep-settings>.accordion-inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:9px}
    #settingsOverlay .summer-prep-settings .settings-section-intro{grid-column:1/-1;margin:0 0 6px}
    #settingsOverlay .summer-prep-settings .toggle{min-height:72px;margin:0;padding:12px 13px;border:1px solid #e5eaf1;border-radius:13px;background:#fff;align-items:center;gap:12px}
    #settingsOverlay .summer-prep-settings .toggle .label{font-size:.92rem;font-weight:800;line-height:1.25}
    #settingsOverlay .summer-prep-settings .toggle .desc{margin-top:4px;color:#718096;font-size:.78rem;line-height:1.35}
    #settingsOverlay .premium-module-tag{font-size:.65rem}
    @media(max-width:620px){#settingsOverlay .modal-head{align-items:flex-start;flex-wrap:wrap;gap:10px}#settingsOverlay .study-settings-tools{width:100%;margin:0}#settingsOverlay .study-settings-tools button{flex:1}.module-group-content{grid-template-columns:1fr!important}}
    .modal h3{margin:14px 0 8px}
    .modal p{color:var(--muted); margin:0 0 10px}
    .modal .row{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
    .number-range-control{
      align-items:flex-end;
    }
    .number-range-control label{
      flex:1 0 100%;
      font-weight:800;
    }
    .number-range-end{
      display:flex;
      align-items:center;
      gap:8px;
      min-width:210px;
      flex:1;
    }
    .number-range-end span{
      min-width:44px;
      color:var(--muted);
      font-size:.9rem;
      font-weight:800;
    }
    .number-range-end input[type="range"]{
      flex:1;
      min-width:120px;
    }
    .number-range-end input[type="number"]{
      width:82px;
      border:1px solid var(--border);
      border-radius:10px;
      padding:8px 10px;
      font-size:.95rem;
      font-weight:800;
      background:#fff;
    }
    .number-range-end input[type="number"]:focus-visible{outline:3px solid var(--focus); outline-offset:2px}

    .toggle{
      display:flex;
      align-items:center;
      justify-content:flex-start;
      gap:12px;
      padding:10px 12px;
      border:1px solid var(--border);
      border-radius:12px;
      background:#fff;
      margin-bottom:8px;
    }
    .toggle > div{flex:0 1 430px; min-width:0}
    .toggle > label{
      display:flex;
      align-items:center;
      justify-content:center;
      padding:4px 8px;
      margin-left:0;
      flex:0 0 auto;
    }
    .toggle .label{font-weight:900}
    .toggle .desc{color:var(--muted); font-size:.9rem; margin-top:2px}
    .switch{
      position:relative;
      width:46px;height:28px;
      background:#e5e7eb;
      border-radius:999px;
      border:1px solid var(--border);
      cursor:pointer;
      flex: 0 0 auto;
    }
    .switch::after{
      content:"";
      position:absolute;
      top:3px; left:3px;
      width:22px; height:22px;
      border-radius:999px;
      background:#fff;
      box-shadow:0 2px 6px rgba(15,23,42,.18);
      transition: transform .18s ease;
    }
    .toggle input{display:none}
    .toggle input:checked + .switch{background:#bfdbfe; border-color:#93c5fd}
    .toggle input:checked + .switch::after{transform: translateX(18px)}
    .toggle input:focus-visible + .switch{outline:3px solid var(--focus); outline-offset:2px}
    .summary-toggle input{display:none}
    .summary-toggle input:checked + .switch{background:#bfdbfe; border-color:#93c5fd}
    .summary-toggle input:checked + .switch::after{transform: translateX(18px)}
    .summary-toggle input:focus-visible + .switch{outline:3px solid var(--focus); outline-offset:2px}

    .hr{height:1px;background:var(--border); margin:14px 0}
    .settings-accordion{
      border:1px solid var(--border);
      border-radius:12px;
      margin-bottom:10px;
      background:#fff;
      overflow:hidden;
    }
    .settings-accordion > summary{
      cursor:pointer;
      list-style:none;
      font-weight:900;
      padding:10px 12px;
      background:#f8fafc;
      border-bottom:1px solid var(--border);
    }
    .settings-accordion[open] > summary{background:#eff6ff}
    .settings-accordion .accordion-inner{padding:10px 12px}
    .mayo-madness-panel{
      border-color:#fde68a;
      background:#fffbeb;
    }
    .mayo-madness-panel > summary{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
    }
    .summary-toggle{
      display:inline-flex;
      align-items:center;
      gap:8px;
      font-size:.82rem;
      color:var(--muted);
      cursor:pointer;
    }
    .mayo-submodules{
      margin-top:10px;
      padding-left:10px;
      border-left:3px solid #fde68a;
    }
    .locked-note{
      padding:12px;
      border-radius:10px;
      border:1px dashed #f4c84c;
      background:#fff7d6;
      color:#5f3b00;
      font-weight:800;
    }

    /* Hidden list */
    .hidden-list{
      display:flex;
      flex-direction:column;
      gap:8px;
      margin-top:8px;
    }
    .hidden-item{
      display:flex;
      align-items:flex-start;
      gap:10px;
      border:1px solid var(--border);
      border-radius:12px;
      padding:10px 12px;
      background:#fff;
    }
    .hidden-item code{
      background:#f1f5f9;
      padding:2px 6px;
      border-radius:8px;
      margin-left:8px;
    }
    .hidden-item label{cursor:pointer}
    .muted{color:var(--muted)}
    .small{font-size:.9rem}
    .sr-only{
      position:absolute!important;
      width:1px!important;
      height:1px!important;
      padding:0!important;
      margin:-1px!important;
      overflow:hidden!important;
      clip:rect(0, 0, 0, 0)!important;
      border:0!important;
      white-space:nowrap!important;
    }
    .toast{
      position:fixed;
      left:50%;
      bottom:20px;
      transform:translateX(-50%);
      background:#111827;
      color:#fff;
      border-radius:10px;
      padding:10px 12px;
      display:none;
      align-items:center;
      gap:10px;
      z-index:1200;
      box-shadow:0 8px 20px rgba(0,0,0,.25);
    }
    .toast button{
      border:1px solid #9ca3af;
      background:#1f2937;
      color:#fff;
      border-radius:8px;
      padding:6px 10px;
      font-weight:800;
      cursor:pointer;
    }

    /* Footer microcopy */
    .footer{
      text-align:center;
      color:var(--muted);
      font-size:.85rem;
      padding:6px 0;
    }

    @keyframes flashGood{
      from{background:var(--success-flash)}
      to{background:#f0fdf4}
    }
    @keyframes flashBad{
      from{background:var(--error-flash)}
      to{background:#fef2f2}
    }

    @media (max-width:700px){
      .only-row{display:none}
      .only-row-mobile{display:flex}
      .topbar{
        top:8px;
        padding:15px 16px;
      }
      .chip{
        padding:7px 12px;
        font-size:.95rem;
      }
    }
    @media (max-width:520px){
      .brand .subtitle{display:none}
      input[type="text"]{min-width: 100%}
      body{padding:12px 12px 22px}
      .topbar{padding:14px}
      #settingsBtn,
      #premiumBtn{
        width:50px;
        height:50px;
        font-size:20px;
      }
      .premium-btn-label{display:none}
      .card{padding:16px}
      .feedback-fab{left:12px; bottom:12px; padding:9px 11px}
    }

    /* Vertex-derived Claro shell: same geometry, blue/purple identity, preserved module DOM. */
    [hidden]{display:none!important}
    .topbar{top:14px;gap:16px;padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.9);box-shadow:0 18px 55px rgba(37,99,235,.10);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
    .brand-switcher-button{gap:10px;min-height:42px;padding:0;background:transparent;transition:none!important}
    .brand-switcher-button:hover{transform:none!important;box-shadow:none!important;background:transparent!important}
    .brand-switcher-button .brand-mark{width:42px;height:42px;border-radius:0;object-fit:contain;background:transparent}
    .claro-brand-copy{display:grid;line-height:1.1;text-align:left}.brand-switcher-button #brandName{font-size:1.15rem}.brand-switcher-button #headerLevel{font-size:.77rem;color:var(--muted);font-weight:700}.claro-chevron{color:var(--muted);font-size:1.15rem;line-height:1}
    .top-actions{gap:10px}.top-actions .chip#activeModuleChip{display:none}
    .dashboard-switcher{position:relative}.dashboard-switcher-button{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:99px;padding:8px 12px;background:#eef2ff;color:#3730a3;font-size:.78rem;font-weight:800;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.dashboard-switcher-button:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(79,70,229,.14);background:#e0e7ff}.dashboard-dot{width:8px;height:8px;border-radius:50%;background:#6366f1}.dashboard-switcher-menu{position:absolute;right:0;top:calc(100% + 9px);z-index:80;width:240px;padding:8px;border:1px solid var(--border);border-radius:14px;background:#fff;box-shadow:0 16px 36px rgba(15,23,42,.16)}.dashboard-switcher-menu[hidden]{display:none!important}.dashboard-switcher-option{display:block;width:100%;padding:10px;border:0;border-radius:10px;background:transparent;text-align:left;color:var(--text);font:inherit;font-weight:800;cursor:pointer}.dashboard-switcher-option:hover,.dashboard-switcher-option.is-current{background:#eff6ff}.dashboard-switcher-option small{display:block;color:var(--muted);font-size:.72rem;font-weight:600}
    #premiumBtn,#settingsBtn{width:auto!important;min-width:100px;height:48px;font-size:.78rem!important;font-weight:800;border-radius:12px;border:1px solid var(--border);background:#fff;color:#3730a3;box-shadow:none;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.premium-btn-label{font-size:.78rem}.premium-btn:hover,#settingsBtn:hover{transform:translateY(-2px);background:#eff6ff;box-shadow:0 10px 20px rgba(79,70,229,.12)!important}.premium-btn.unlocked{color:#3730a3;background:#fff;border-color:var(--border)}
    #homeCard{width:100%;padding:30px;border-radius:26px;background:rgba(255,255,255,.92);box-shadow:0 18px 55px rgba(37,99,235,.10);border:1px solid #dbe4ff}.home-hero{padding:0 0 18px;gap:24px}.home-hero h1{font-size:clamp(2rem,5vw,3rem)}.home-intro{margin:10px 0 0;font-size:1rem}.home-mark{width:84px;height:84px;border-radius:0;object-fit:contain;background:transparent}.level-switch{margin:4px 0 18px}.home-actions{padding-bottom:22px}.dashboard-analytics{margin-top:20px;padding-top:18px}.analytics-grid{grid-template-columns:repeat(5,1fr);gap:12px}.analytics-card{min-height:112px;padding:14px;border:1px solid #dbe4ff;border-radius:16px;background:#f8f9ff;box-shadow:none}.analytics-card:hover{transform:translateY(-3px);border-color:#c7d2fe;box-shadow:0 12px 24px rgba(37,99,235,.09)}.home-overview{grid-template-columns:repeat(2,1fr);gap:12px;margin:22px 0}.home-overview-card{padding:16px;border:1px solid #dbe4ff;border-radius:16px;background:#f8f9ff;box-shadow:none;transition:transform .18s ease,box-shadow .18s ease}.home-overview-card:hover,.spanish2-panel:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(37,99,235,.09)}.home-overview-card-muted{border-color:#e2e8f0;background:#fbfcff}.spanish2-panel{margin:22px 0 0;padding:20px;border-radius:16px;background:#f8f9ff}.home-help{margin-top:18px}.session-history{margin-top:26px;padding-top:22px}.feedback-modal,.modal.compact{width:min(540px,100%);padding:20px;border-radius:20px;background:#fff;box-shadow:0 24px 60px rgba(0,0,0,.28)}.feedback-modal .modal-head,.modal.compact .modal-head{padding-bottom:13px;margin-bottom:0}.feedback-form{gap:13px;margin-top:16px}.feedback-field input,.feedback-field textarea,.feedback-field select,.premium-field input{padding:11px 12px;border-radius:12px;background:#fbfcff}.feedback-fab{left:18px;bottom:18px;padding:10px 14px;background:#fff;border-color:#c7d2fe;color:#3730a3}.admin-export-panel{display:grid;grid-template-columns:1fr auto;gap:8px 16px;margin-top:26px;padding:16px;border:1px solid #c7d2fe;border-radius:16px;background:#f8f9ff}.admin-export-panel h2{margin:2px 0 0}.admin-export-panel p{margin:3px 0 0;color:var(--muted)}.admin-export-panel .feedback{grid-column:1/-1}.admin-question-btn{margin-left:8px}.admin-gate-modal{width:min(460px,100%)}.admin-gate-overlay{z-index:1200;background:rgba(15,23,42,.6)}
    @media(max-width:720px){.analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-overview{grid-template-columns:1fr}.admin-export-panel{grid-template-columns:1fr}.admin-export-panel button{width:100%}}
@media(max-width:620px){body{padding:10px}.app{width:min(100% - 20px,920px);margin:10px auto}.topbar{top:6px}.home-card.card{padding:22px 18px}.home-mark{width:58px;height:58px}.app-switcher-menu{width:min(300px,calc(100vw - 30px))}.dashboard-switcher-button{padding:8px 10px}.dashboard-switcher-button #classSwitcherLabel{display:none}}

.library-launch-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin:24px 0 0;padding:18px;border:1px solid #bfdbfe;border-radius:18px;background:linear-gradient(135deg,#f8faff,#eff6ff)}.library-launch-card h2{margin:3px 0 4px;font-size:1.25rem}.library-launch-card p{margin:0;color:var(--muted);line-height:1.45}.library-launch-mark{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#dbeafe;color:#2563eb;font-size:1.5rem;font-weight:900}.library-overlay{z-index:1300}.library-modal{width:min(820px,100%);max-height:min(760px,calc(100vh - 36px));overflow:auto;padding:24px;border-radius:24px;background:#fff;box-shadow:0 28px 80px rgba(15,23,42,.24)}.library-modal .modal-head{margin-bottom:12px}.library-modal h2{margin:4px 0 5px;font-size:1.8rem;letter-spacing:-.04em}.library-modal .modal-head p{margin:0;color:var(--muted);line-height:1.45}.library-count{margin:0 0 18px;color:var(--muted);font-size:.82rem;font-weight:800}.library-section{padding:18px 0;border-top:1px solid var(--border,#e2e8f0)}.library-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}.library-section-heading h3{margin:4px 0;font-size:1.15rem}.library-section-heading p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.4}.library-file-list{display:grid;gap:9px}.library-file-card{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid #dbe4ff;border-radius:14px;background:#fbfcff}.library-file-card:hover{border-color:#93c5fd;box-shadow:0 8px 20px rgba(37,99,235,.07)}.library-file-icon{display:grid;place-items:center;flex:0 0 42px;height:42px;border-radius:11px;background:#eff6ff;color:#2563eb;font-size:.64rem;font-weight:900;letter-spacing:.05em}.library-file-copy{display:grid;gap:3px;min-width:0;flex:1}.library-file-copy strong{overflow-wrap:anywhere}.library-file-copy small{color:var(--muted);line-height:1.3}.library-file-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.library-file-card .btn{white-space:nowrap;text-decoration:none}.library-status{padding:9px 10px;border-radius:10px;background:#ecfdf5;color:#166534;font-size:.75rem;font-weight:900}.library-empty{margin:0;padding:14px;border:1px dashed #cbd5e1;border-radius:12px;color:var(--muted);font-size:.9rem}.library-your-section{padding-bottom:0}.library-overlay[hidden]{display:none!important}
@media(max-width:620px){.library-launch-card{grid-template-columns:auto 1fr}.library-launch-card>.btn{grid-column:1/-1;width:100%}.library-modal{padding:18px}.library-section-heading{display:grid}.library-file-card{align-items:flex-start;flex-wrap:wrap}.library-file-copy{min-width:calc(100% - 58px)}.library-file-card>.btn,.library-file-actions{width:100%;justify-content:stretch}.library-file-actions .btn{flex:1}.library-modal .modal-head{align-items:flex-start}}
.library-file-card{padding:14px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.library-file-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(37,99,235,.09)}.library-file-icon{flex-basis:48px;height:48px;border-radius:13px;font-size:.62rem}
@media (prefers-reduced-motion: reduce){
      .feedback.flash-good,.feedback.flash-bad{animation:none}
      .analytics-card,.analytics-card:hover{transition:none; transform:none}
      .session-stat-streak.streak-flare strong,.session-stat-streak.streak-flare::before,.session-stat-streak.streak-flare::after,.session-stats.streak-active,.session-stats.streak-active::before,.session-stats.streak-active::after{animation:none}
}
.tally-return-notice{position:fixed;top:18px;left:50%;z-index:2000;display:flex;align-items:center;gap:16px;width:min(560px,calc(100vw - 28px));padding:14px 16px;border:1px solid #86d2b8;border-radius:16px;background:#effaf5;color:#145d52;box-shadow:0 18px 42px rgba(15,42,67,.2);transform:translateX(-50%);animation:modalIn .22s ease}.tally-return-notice strong{flex:1;font-size:.92rem}.tally-return-notice button{width:28px;height:28px;border:0;border-radius:9px;background:transparent;color:inherit;font-size:1.25rem;cursor:pointer}.tally-return-notice button:hover,.tally-return-notice button:focus-visible{background:#d8f2e7;outline:none}

    /* Focused practice refresh */
    :root{
      --bg:#f1f5f9;
      --surface:#ffffff;
      --surface-2:#f8fafc;
      --border:#dbe4f0;
      --primary:#2563eb;
      --primary-2:#1d4ed8;
      --focus:#93c5fd;
      --radius:18px;
      --shadow:0 18px 45px rgba(30,41,59,.12);
    }
    body{
      background:
        radial-gradient(900px 500px at 5% -10%, rgba(129,140,248,.26), transparent 62%),
        radial-gradient(900px 500px at 100% 10%, rgba(45,212,191,.14), transparent 60%),
        var(--bg);
      padding-top:24px;
    }
    .app{max-width:920px; gap:18px}
    .topbar{padding:16px 18px; border-radius:20px; border-color:#d8e0ee}
    .brand .title{display:flex; align-items:center; gap:8px; font-size:1.28rem}
    .brand-separator{color:#94a3b8; font-weight:600}
    #headerLevel{color:#64748b; font-weight:750}
    .brand-mark{
      width:30px;height:30px; object-fit:contain; vertical-align:middle;
      display:inline-block;
    }
    .brand .subtitle{font-size:.92rem}
    .top-actions{gap:8px}
    .chip{padding:8px 12px; font-size:.92rem}
    .card{padding:24px; border-radius:22px; box-shadow:0 20px 55px rgba(30,41,59,.11)}
    .practice-header{
      display:flex; justify-content:space-between; align-items:flex-start; gap:18px;
      margin:2px 0 22px;
    }
    .eyebrow{margin:0 0 6px; color:var(--primary); text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; font-weight:950}
    h1{margin:0; font-size:clamp(1.55rem, 3vw, 2.2rem); line-height:1.05; letter-spacing:-.035em}
    .practice-intro{margin:8px 0 0; color:var(--muted); max-width:52ch}
    .session-note{display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.82rem; white-space:nowrap; padding-top:4px}
    .session-note-dot{width:8px; height:8px; border-radius:50%; background:#10b981; box-shadow:0 0 0 4px #d1fae5}
    .only-row-wrap{margin-bottom:20px; padding:14px; border:1px solid #e5e7eb; background:#fafbff; border-radius:16px}
    .filter-label{margin-bottom:8px; color:var(--muted); font-size:.76rem; font-weight:950; letter-spacing:.08em; text-transform:uppercase}
    .only-row{display:none}
    .only-row-wrap::before,.only-row-wrap::after{display:none}
    .only-row-mobile{display:flex; margin:0; width:100%}
    .only-row-mobile select{flex:1; min-width:0; border:1px solid var(--border); border-radius:12px; background:#fff; color:var(--text); padding:11px 12px; font:inherit; font-weight:800}
    .only-row-mobile .btn{display:none}
    .key-hint-strip{border-radius:14px; background:#f5f7ff; border-color:#dbe4ff; color:#475569; margin-bottom:20px}
    .never-row{margin:0 0 12px}
    .never-row .btn{color:#64748b; font-weight:700}
    #numbersSection,#qaSection{padding:4px 2px 0}
    #numbersSection h2,#qaSection h2{font-size:1.35rem; letter-spacing:-.02em}
    .display{font-size:clamp(3rem, 8vw, 5rem); min-height:150px; display:grid; place-items:center; margin:18px 0 12px; border:0; background:linear-gradient(135deg,#eff6ff,#f8fafc); color:#0f172a}
    .spanish{font-size:1.2rem; color:var(--primary-2)}
    .controls{margin-top:14px}
    .controls .btn,.actions .btn{min-width:128px; justify-content:center}
    .btn{border-radius:13px; transition:transform .16s ease, box-shadow .16s ease, background .16s ease}
    .btn:hover{box-shadow:0 6px 14px rgba(30,41,59,.08)}
    .btn.primary{box-shadow:0 8px 18px rgba(37,99,235,.2)}
    .hint{line-height:1.5}
    .keys{padding:10px 12px; border-radius:10px; background:#f8fafc; font-size:.82rem}
    .footer{font-size:.8rem; padding-top:0}
    .modal-head #settingsTitle{font-size:1.35rem!important; letter-spacing:-.025em}
    #settingsOverlay .modal{width:min(780px,100%); padding:20px}
    #settingsOverlay .modal-head{padding-bottom:14px; margin-bottom:14px}
    .summary-note{float:right; color:#64748b; font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase}
    .settings-accordion > summary{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px 14px}
    .settings-accordion > summary .summary-note{float:none; margin-left:auto}
    #settingsOverlay .settings-accordion:not([open]) > summary{border-bottom:0}
    #settingsOverlay .settings-accordion:first-of-type > summary{color:var(--primary-2)}
    .summer-prep-settings{border-color:#bfdbfe; background:#eff6ff}
    .summer-prep-settings > summary{color:var(--primary-2)}
    .settings-section-intro{margin:0 0 10px; color:var(--muted); font-size:.86rem; line-height:1.4}
    .summer-summary{display:block; margin-top:12px; color:var(--primary-2); font-weight:850}
    .welcome-steps{display:grid; gap:10px; margin:18px 0 20px}
    .welcome-step{display:flex; gap:12px; align-items:flex-start; padding:13px 14px; border:1px solid color-mix(in srgb,var(--primary) 18%,#e5e7eb); border-radius:16px; background:linear-gradient(135deg,var(--surface-2,#fafbff),#fff); box-shadow:0 5px 14px rgba(15,23,42,.04)}
    .welcome-step > span{display:grid; place-items:center; flex:0 0 29px; height:29px; border-radius:10px; background:var(--brand-soft,#eef2ff); color:var(--primary-2,var(--primary)); font-weight:950}
    .welcome-step strong{display:block; margin:1px 0 4px; color:var(--text,#172033); line-height:1.25}
    .welcome-step small{display:block; color:var(--muted); line-height:1.5}
    .welcome-step b{color:var(--primary-2,var(--primary)); font-weight:850}
    #firstRunOverlay .row{justify-content:space-between; align-items:center; gap:10px}
    .help-details{margin:0 0 18px; border:1px solid #e5e7eb; border-radius:14px; background:#fafbff; overflow:hidden}
    .help-details > summary{display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; list-style:none; padding:11px 13px; color:#334155; font-size:.88rem; font-weight:900}
    .help-details > summary::-webkit-details-marker{display:none}
    .help-details[open] > summary{background:#f1f5ff; color:var(--primary-2); border-bottom:1px solid #e0e7ff}
    .help-content{padding:10px 12px}
    .help-details .key-hint-strip{margin:0; padding:0; border:0; background:transparent; font-size:.82rem}
    .module-help{margin-top:20px; margin-bottom:0; background:#fff}
    .module-help .help-content{padding:0 12px 12px}
    .module-help .keys{margin-top:0}
    .module-help .btn{margin-top:12px}
    @media (max-width:700px){
      body{padding:12px 12px 22px}
      .practice-header{display:block}
      .session-note{margin-top:12px}
      .card{padding:18px}
      .top-actions .chip{max-width:160px; overflow:hidden}
      .chip .meta{display:none}
    }
    @media (max-width:520px){
      .brand .subtitle{display:block; font-size:.82rem}
      .topbar{padding:13px 14px}
      .practice-intro{font-size:.92rem}
      .only-row-wrap{padding:12px}
      .controls .btn,.actions .btn{flex:1; min-width:0}
      #settingsOverlay .modal{padding:16px}
    }

    /* Home dashboard and focused practice mode */
    .home-card{display:block}
    .practice-card{display:none}
    .footer{display:none}
    .home-hero{display:flex; justify-content:space-between; gap:24px; align-items:flex-start; padding:8px 4px 26px}
    .home-hero h1{max-width:620px}
    .home-intro{margin:12px 0 0; color:var(--muted); font-size:1.05rem; max-width:54ch}
    .home-mark{display:block; width:74px; height:74px; border-radius:24px; object-fit:contain}
    .home-actions{display:flex; gap:12px; flex-wrap:wrap; padding-bottom:28px; border-bottom:1px solid #e5e7eb}
    .home-start-btn{min-width:235px; justify-content:center; font-size:1rem; padding:13px 16px}
    .home-settings-btn{justify-content:center; padding:13px 16px}
    .level-switch{display:flex; gap:6px; margin:4px 0 20px; padding:5px; width:max-content; border:1px solid #e2e8f0; border-radius:13px; background:#f8fafc}
    .level-tab{border:0; border-radius:9px; padding:9px 13px; background:transparent; color:#64748b; cursor:pointer; font:inherit; font-weight:900}
    .level-tab span{display:block; margin-top:2px; font-size:.68rem; font-weight:700; color:#94a3b8}
    .level-tab.is-active{background:#fff; color:var(--primary-2); box-shadow:0 3px 9px rgba(30,41,59,.08)}
    .level-tab:focus-visible{outline:3px solid var(--focus); outline-offset:2px}
    .home-focus-card{display:grid; grid-template-columns:auto minmax(220px, 1fr) auto; gap:10px 14px; align-items:center; margin-top:20px; padding:14px 16px; border:1px solid #e5e7eb; border-radius:16px; background:#fafbff}
    .home-focus-card label{font-size:.78rem; font-weight:950; letter-spacing:.08em; text-transform:uppercase; color:#475569}
    .home-focus-card select{width:100%; border:1px solid var(--border); border-radius:11px; background:#fff; padding:10px 12px; color:var(--text); font:inherit; font-weight:800}
    .home-focus-card small{color:var(--muted); font-size:.78rem}
    .home-overview{display:grid; grid-template-columns:1.4fr 1fr; gap:12px; margin-top:20px}
    .home-overview-card{display:flex; flex-direction:column; gap:7px; padding:16px; border:1px solid #e0e7ff; border-radius:16px; background:#f7f8ff}
    .home-overview-card strong{font-size:1rem; line-height:1.35}
    .home-overview-card small{color:var(--muted); line-height:1.4}
    .home-overview-card-muted{border-color:#e5e7eb; background:#fafafa}
    .home-overview-label{color:var(--primary-2); font-size:.72rem; font-weight:950; letter-spacing:.08em; text-transform:uppercase}
    .home-overview-card-muted .home-overview-label{color:#64748b}
    .dashboard-analytics,.session-history{margin-top:20px; padding-top:18px; border-top:1px solid #e2e8f0}
    .dashboard-section-heading{display:flex; justify-content:space-between; align-items:end; gap:12px; margin-bottom:12px}
    .dashboard-section-heading h2{margin:4px 0 0; font-size:1.05rem}
    .dashboard-section-heading small{color:var(--muted); font-size:.76rem}
    .analytics-grid{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px}
    .analytics-card{position:relative; display:flex; flex-direction:column; gap:3px; min-height:92px; padding:13px 14px 12px; border:1px solid var(--card-border,#e0e7ff); border-radius:16px; background:linear-gradient(145deg,var(--card-tint,#fbfcff),#fff 82%); box-shadow:0 3px 10px rgba(15,23,42,.035); overflow:hidden; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease}
    .analytics-card:hover{transform:translateY(-3px); border-color:var(--card-border,#c7d2fe); box-shadow:0 12px 24px rgba(15,23,42,.09)}
    .analytics-card span{color:#64748b; font-size:.7rem; font-weight:900; letter-spacing:.06em; text-transform:uppercase}
    .analytics-card strong{font-size:1.45rem; line-height:1.1; color:#0f172a}
    .analytics-card small{color:var(--muted); font-size:.72rem; line-height:1.2}
    .analytics-card-accuracy{--card-tint:#f4fcf6;--card-border:#d1f3db}
    .analytics-card-correct{--card-tint:#f5fcf7;--card-border:#d1f3db}
    .analytics-card-streak{--card-tint:#fffaf2;--card-border:#fce5c1}
    .analytics-card-best{--card-tint:#fffaf4;--card-border:#f8d9b5}
    .analytics-card-sessions{--card-tint:#eff6ff;--card-border:#bfdbfe}
    .analytics-card-accuracy strong,.analytics-card-correct strong{color:#15803d}
    .analytics-card-streak strong,.analytics-card-best strong{color:#c2410c}
    .analytics-card-sessions strong{color:#2563eb}
    .session-history-list{display:grid; gap:8px}
    .session-history-empty{margin:0; color:var(--muted); font-size:.86rem}
    .session-history-row{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:12px 14px; border:1px solid #e2e8f0; border-radius:14px; background:#fff; transition:transform .18s ease, box-shadow .18s ease}
    .session-history-row:hover{transform:translateY(-2px); box-shadow:0 8px 16px rgba(15,23,42,.07)}
    .session-history-main,.session-history-result{display:flex; flex-direction:column; gap:3px; min-width:0}
    .session-history-main strong{font-size:.9rem}
    .session-history-row small{color:var(--muted); font-size:.74rem; line-height:1.3}
    .session-history-result{text-align:right; flex:0 0 auto}
    .session-history-result strong{font-size:1.05rem; color:var(--primary-2)}
    .session-stats{position:relative; isolation:isolate; display:none; grid-template-columns:repeat(5,minmax(0,1fr)) auto; align-items:center; gap:8px; margin:4px 0 14px; padding:11px; border:1px solid #e3e7f7; border-radius:18px; background:linear-gradient(135deg,#fafbff,#fff 70%); box-shadow:0 5px 16px rgba(79,70,229,.05); overflow:visible}
    .session-stats.streak-active{animation:streakHalo 1.8s ease-out both}
    .session-stats.streak-active::before,.session-stats.streak-active::after{position:absolute; z-index:6; pointer-events:none; opacity:0; font-family:system-ui,sans-serif; font-size:1.45rem; line-height:1; filter:drop-shadow(0 3px 4px rgba(234,88,12,.28))}
    .session-stats.streak-active::before{content:"🔥  🔥   🔥  🔥"; left:12%; bottom:-22px; font-size:1.15rem; letter-spacing:3px; animation:fireRise 1.35s ease-out both}
    .session-stats.streak-active::after{content:"🔥    🔥   🔥"; left:31%; bottom:-20px; font-size:1.7rem; letter-spacing:14px; animation:fireRise 1.5s ease-out .08s both}
    .session-stat{display:flex; flex-direction:column; justify-content:center; gap:4px; min-width:0; min-height:72px; padding:10px 12px; border-right:1px solid #e2e8f0}
    .session-stat span{color:#64748b; font-size:.67rem; font-weight:900; letter-spacing:.05em; text-transform:uppercase}
    .session-stat strong{font-size:1.05rem; color:#0f172a}
    .session-stat-correct{background:#f4fcf6; border-radius:12px; border-right-color:#d7f1de}
    .session-stat-incorrect{background:#fff7f7; border-radius:12px; border-right-color:#f6d6d6}
    .session-stat-accent{background:#eff6ff; border-radius:12px}
    .session-stat-streak{position:relative; z-index:2; min-height:88px; background:#fffaf3; border-radius:12px}
    .session-stat-correct strong{color:#15803d}
    .session-stat-incorrect strong{color:#dc2626}
    .session-stat-streak strong{color:#c2410c}
    .session-stat-accent strong{color:var(--primary-2)}
    .session-stat-streak.streak-flare{z-index:1}
    .session-stat-streak.streak-flare strong{display:inline-block; animation:streakPop 1.65s cubic-bezier(.2,.9,.25,1) both}
    .session-stat-streak.streak-flare::before,.session-stat-streak.streak-flare::after{content:""; position:absolute; pointer-events:none; opacity:0; border-radius:55% 45% 55% 45%; transform-origin:center bottom}
    .session-stat-streak.streak-flare::before{width:18px; height:27px; right:10px; top:-25px; background:linear-gradient(165deg,#fde047 8%,#fb923c 55%,#ef4444 100%); box-shadow:0 0 0 3px rgba(251,146,60,.1),-9px 8px 0 -4px #facc15; animation:flameRise .9s ease-out both}
    .session-stat-streak.streak-flare::after{width:9px; height:16px; right:15px; top:-18px; background:#fff7ed; transform:rotate(18deg); animation:flameCore .9s ease-out both}
    @keyframes streakPop{0%{font-size:1.05rem; transform:rotate(0); text-shadow:none}20%{font-size:2rem; transform:rotate(0); text-shadow:0 7px 22px rgba(234,88,12,.28)}36%{font-size:2rem; transform:rotate(-7deg)}42%{font-size:2rem; transform:rotate(7deg)}48%{font-size:2rem; transform:rotate(-5deg)}54%{font-size:2rem; transform:rotate(4deg)}70%{font-size:1.35rem; transform:rotate(0)}100%{font-size:1.05rem; transform:rotate(0); text-shadow:none}}
    @keyframes streakHalo{0%{box-shadow:0 5px 16px rgba(79,70,229,.05)}20%{box-shadow:0 0 0 7px rgba(251,146,60,.1),0 0 42px 12px rgba(249,115,22,.32)}58%{box-shadow:0 0 0 3px rgba(251,146,60,.06),0 0 22px 6px rgba(249,115,22,.16)}100%{box-shadow:0 5px 16px rgba(79,70,229,.05)}}
    @keyframes fireRise{0%{opacity:0; transform:translateY(18px) scale(.65)}18%{opacity:1}70%{opacity:1; transform:translateY(-42px) scale(1.08)}100%{opacity:0; transform:translateY(-78px) scale(.9)}}
    .end-session-btn{white-space:nowrap; color:#475569}
    .end-session-modal{width:min(500px,100%)}
    .end-session-summary{margin:16px 0; padding:16px; border:1px solid #dbe4ff; border-radius:14px; background:#f8f9ff; color:#334155; line-height:1.5}
    .spanish2-panel{display:flex; align-items:center; gap:18px; min-height:178px; padding:24px; border:1px solid #dbe4ff; border-radius:18px; background:linear-gradient(135deg,#f7f8ff,#f0fdfa)}
    .spanish2-panel h2{margin:6px 0 5px; font-size:1.25rem}
    .spanish2-panel p{margin:0; color:var(--muted); line-height:1.5; max-width:58ch}
    .spanish2-icon{display:grid; place-items:center; flex:0 0 52px; height:52px; border-radius:16px; background:#fff; color:var(--primary); font-size:1.6rem; box-shadow:0 6px 15px rgba(37,99,235,.1)}
    .home-help{margin-top:18px; border:1px solid #e5e7eb; border-radius:14px; background:#fafbff; overflow:hidden}
    .home-help summary{cursor:pointer; padding:11px 13px; color:#334155; font-size:.88rem; font-weight:900}
    .home-help p{margin:0; padding:0 13px 13px; color:var(--muted); line-height:1.5; max-width:65ch}
    .back-home-btn{border:0; background:transparent; padding:0; margin:0 0 16px; color:#64748b; cursor:pointer; font:inherit; font-size:.82rem; font-weight:850}
    .back-home-btn:hover{color:var(--primary-2)}
    .practice-card .only-row-wrap,.practice-card > .practice-shortcuts{display:none!important}
    .practice-card .practice-header{margin:0 0 10px; padding:0; min-height:30px}
    .practice-card .practice-intro,.practice-card .practice-header h1,.practice-card .session-note{display:none}
    .practice-card .back-home-btn{margin:0}
    .practice-card .never-row{margin:0 0 8px}
    #moduleSettingsSection > .accordion-inner{display:block}
    .level-spanish2 #settingsOverlay #moduleSettingsSection,
    .level-spanish2 #settingsOverlay #practiceBehaviorSettings{display:none}
    .level-spanish1 #settingsOverlay #summerPrepSettings{display:none}
    .module-group{border:1px solid #e5e7eb; border-radius:14px; margin:0 0 8px; overflow:hidden; background:#fff}
    .module-group > summary{cursor:pointer; list-style:none; padding:12px 14px; font-weight:950; color:#334155; background:#fafbff}
    .module-group > summary::-webkit-details-marker{display:none}
    .module-group[open] > summary{background:#f1f5ff; color:var(--primary-2); border-bottom:1px solid #e0e7ff}
    .module-group-content{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:10px}
    .module-group-content > .toggle{margin:0; min-height:64px; padding:9px 10px}
    .module-group-content > .mayo-madness-panel{grid-column:1/-1; margin:0}
    #moduleSettingsSection .toggle .desc{font-size:.78rem; line-height:1.25}
    .practice-card.is-entering{animation:practiceEnter .26s ease both}
    @keyframes practiceEnter{from{opacity:.35; transform:translateY(6px)}to{opacity:1; transform:none}}
    .home-mode .activeModuleChip{display:none}
    .home-mode #activeModuleChip{display:none}
    .home-mode .banner{display:none!important}
    .practice-mode .banner{display:none!important}
    /* Soft glass surfaces: translucent, calm, and still readable. */
    .topbar,.card,.modal,.home-focus-card,.home-overview-card,.spanish2-panel,.session-history-row,.settings-accordion,.module-group,.key-hint-strip{
      background-color:rgba(255,255,255,.72);
      backdrop-filter:blur(16px) saturate(115%);
      -webkit-backdrop-filter:blur(16px) saturate(115%);
    }
    .card{border-color:rgba(203,213,225,.78); box-shadow:0 18px 42px rgba(15,23,42,.075), inset 0 1px 0 rgba(255,255,255,.8)}
    .modal{background:rgba(255,255,255,.86); border-color:rgba(203,213,225,.85); box-shadow:0 24px 65px rgba(15,23,42,.24), inset 0 1px 0 rgba(255,255,255,.9)}
    .home-overview-card,.home-overview-card-muted{background-color:rgba(248,250,252,.65)}
    .home-focus-card,.spanish2-panel{background-color:rgba(248,250,252,.62)}
    .settings-accordion,.module-group{background-color:rgba(255,255,255,.58)}
    .btn,.icon-btn,.chip,.level-switch{background-color:rgba(255,255,255,.72)}
    .btn.primary{background-color:var(--primary)}
    .btn.primary:hover{background-color:var(--primary-2)}
    @media (max-width:700px){
      .home-hero{padding-bottom:20px}
      .home-mark{width:58px; height:58px; border-radius:18px}
      .home-intro{font-size:.95rem}
      .home-overview{grid-template-columns:1fr}
      .level-switch{width:100%}
      .level-tab{flex:1}
      .spanish2-panel{align-items:flex-start; padding:18px}
      .home-focus-card{grid-template-columns:1fr; gap:7px}
      .home-focus-card small{margin-top:2px}
      .module-group-content{grid-template-columns:1fr}
      .module-group-content > .mayo-madness-panel{grid-column:auto}
      .analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .session-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
      .session-stat:nth-child(3){border-right:0}
      .session-stats .end-session-btn{grid-column:1/-1; justify-self:stretch}
    }
    @media (max-width:520px){
      .home-hero{gap:12px}
      .home-hero h1{font-size:1.8rem}
      .home-actions{display:grid}
      .home-start-btn,.home-settings-btn{width:100%}
      .dashboard-section-heading{align-items:flex-start; flex-direction:column; gap:3px}
      .session-history-row{align-items:flex-start; flex-direction:column; gap:8px}
      .session-history-result{text-align:left}
    }
  
/* Premium modal parity: same Vertex structure and rhythm, Claro palette only. */
.claro-premium-modal{width:min(540px,100%);padding:20px;border-radius:20px;background:#fff;box-shadow:0 24px 60px rgba(0,0,0,.28)}
.claro-premium-modal .modal-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:13px;border-bottom:1px solid #dbe4ff}
.claro-premium-modal .modal-heading h2{margin:0;color:#111827;font-size:1.45rem;letter-spacing:-.03em}.claro-premium-modal .modal-heading p{margin:6px 0 0;color:#475569;font-size:1rem}
.claro-premium-modal .icon-button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #c7d2fe;border-radius:12px;background:#fff;color:#111827;font-size:1.45rem;cursor:pointer;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.claro-premium-modal .icon-button:hover{transform:translateY(-2px);background:#eff6ff;box-shadow:0 10px 20px rgba(79,70,229,.12)}
.claro-premium-modal .premium-form{display:grid;gap:12px;margin:16px 0 0}.claro-premium-modal .premium-field{display:grid;gap:6px;color:#334155;font-size:.78rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.claro-premium-modal .premium-field input{width:100%;padding:12px 13px;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc;color:#111827;font:inherit;font-size:1rem;letter-spacing:0;text-transform:none;outline:none;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}.claro-premium-modal .premium-field input:focus{border-color:#818cf8;background:#fff;box-shadow:0 0 0 4px rgba(79,70,229,.14)}
.claro-premium-modal .modal-actions{display:flex;justify-content:flex-end;margin-top:2px}.claro-premium-modal .modal-actions .btn{min-width:180px;justify-content:center}.claro-premium-modal #premiumFeedback{margin:10px 0 0;padding:13px 14px;border-radius:14px;background:#eef2ff;color:#3730a3}.claro-premium-modal .premium-request-form{background:#f8f9ff;border-color:#dbe4ff}.claro-premium-modal .premium-request-form .btn{justify-content:center}
.premium-badge{display:inline-grid;place-items:center;width:1.45rem;height:1.45rem;margin-left:.35rem;padding:0;border:1px solid transparent;border-radius:999px;font-size:.78rem;line-height:1;vertical-align:middle;cursor:help;outline:none}.premium-badge-locked{background:#fff0f0;color:#b42318;border-color:#f3b7b2}.premium-badge-reduced{background:#fff8df;color:#8a5a00;border-color:#ead28b}.premium-badge:hover,.premium-badge:focus-visible{transform:translateY(-1px);box-shadow:0 0 0 3px rgba(37,99,235,.25)}#premiumOverlay{z-index:1400!important}