:root{--bg:#f6f8fb;--card:#fff;--text:#1f2937;--muted:#6b7280;--primary:#2563eb;--primary2:#1d4ed8;--danger:#dc2626;--success:#16a34a;--warning:#d97706;--border:#e5e7eb}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}a{color:var(--primary);text-decoration:none}.topbar{height:64px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:5}.brand{font-weight:800;color:var(--text)}.topbar nav{display:flex;gap:14px;align-items:center}.page{max-width:1180px;margin:0 auto;padding:28px 18px}.footer{text-align:center;color:var(--muted);padding:28px}.hero{display:grid;grid-template-columns:1.5fr .8fr;gap:24px;align-items:stretch;margin-bottom:28px}.hero>div{background:linear-gradient(135deg,#2563eb,#7c3aed);color:white;border-radius:26px;padding:42px;box-shadow:0 20px 50px #0001}.hero h1{font-size:42px;line-height:1.05;margin:0 0 14px}.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:0 12px 28px #0000000a;margin-bottom:20px}.grid{display:grid;gap:18px}.cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.two{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));align-items:end}.form-stack{display:grid;gap:16px}.book{color:var(--text);transition:.15s}.book:hover{transform:translateY(-2px);box-shadow:0 18px 35px #00000012}.btn,button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;background:var(--primary);color:#fff;padding:11px 16px;border-radius:12px;font-weight:700;cursor:pointer;margin:4px 6px 4px 0}.btn:hover,button:hover{background:var(--primary2)}.btn.secondary{background:#eef2ff;color:#1e40af}label{display:grid;gap:7px;font-weight:700;color:#374151}input,select,textarea{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:11px;background:#fff;font:inherit}textarea{min-height:86px}table{width:100%;border-collapse:collapse}th,td{padding:11px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}th{font-size:13px;color:var(--muted);text-transform:uppercase}.alert{padding:12px 14px;border-radius:12px;margin-bottom:16px;background:#e0f2fe}.alert.success{background:#dcfce7;color:#166534}.alert.danger{background:#fee2e2;color:#991b1b}.alert.warning{background:#fef3c7;color:#92400e}.auth-box{max-width:420px;margin:40px auto;background:#fff;border-radius:22px;padding:30px;border:1px solid var(--border);box-shadow:0 20px 50px #00000012}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;margin-bottom:24px}.stat{background:#fff;border:1px solid var(--border);border-radius:18px;padding:18px}.stat b{display:block;font-size:30px}.stat span{color:var(--muted)}.row-link{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--border);font-weight:700}.daily audio{width:100%;margin-top:10px}.flashcard-stage{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}.flashcard{min-height:220px;perspective:1000px;position:relative}.flashcard .front,.flashcard .back{background:#fff;border:1px solid var(--border);border-radius:20px;padding:22px;min-height:220px;box-shadow:0 12px 25px #0000000a;transition:.5s;backface-visibility:hidden}.flashcard .back{position:absolute;inset:0;transform:rotateY(180deg)}.flashcard:hover .front{transform:rotateY(180deg)}.flashcard:hover .back{transform:rotateY(360deg)}.option{display:block;font-weight:500;margin:8px 0}.muted{color:var(--muted)}code{display:block;background:#111827;color:#e5e7eb;border-radius:12px;padding:14px;overflow:auto}@media(max-width:760px){.hero,.two{grid-template-columns:1fr}.hero h1{font-size:30px}.topbar{height:auto;align-items:flex-start;gap:10px;flex-direction:column;padding:14px}.topbar nav{flex-wrap:wrap}table{font-size:14px;display:block;overflow:auto}}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:10px 0 14px}.setup-warning{border-color:#f59e0b}.error-card{border-color:#ef4444}.badge{display:inline-flex;padding:4px 9px;border-radius:999px;font-weight:800;font-size:12px}.badge.ok{background:#dcfce7;color:#166534}.badge.bad{background:#fee2e2;color:#991b1b}.book-cover{width:100%;height:150px;object-fit:cover;border-radius:14px;margin-bottom:12px;background:#eef2ff}.hero p{font-size:18px;opacity:.92;max-width:640px}.daily h2{margin:10px 0 6px}.daily span{font-size:12px;font-weight:800;text-transform:uppercase;color:#6b7280;letter-spacing:.08em}.hero .daily{margin-bottom:0}ol{padding-left:22px}li{margin:6px 0}

/* Interactive lesson player restored from the original GameWords workflow */
.lesson-shell{display:grid;grid-template-columns:320px 1fr;gap:24px;align-items:start}.lesson-sidebar{position:sticky;top:84px}.lesson-sidebar h1{font-size:26px;line-height:1.12;margin:12px 0}.back-link{display:inline-flex;margin-bottom:10px;font-weight:800}.lesson-meta{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 18px}.lesson-meta span{background:#eef2ff;color:#1e40af;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}.lesson-actions{display:grid;gap:8px;margin:16px 0}.btn.full{width:100%;margin:0}.btn.warning{background:#f59e0b;color:#fff}.btn.warning:hover{background:#d97706}.btn.success{background:#16a34a;color:#fff}.btn.success:hover{background:#15803d}.study-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}.study-stats div{background:#f8fafc;border:1px solid var(--border);border-radius:14px;padding:12px;text-align:center}.study-stats b{display:block;font-size:24px}.study-stats span{display:block;font-size:12px;color:var(--muted);font-weight:800;text-transform:uppercase}.lesson-main{min-width:0}.study-panel{max-width:720px;margin:0 auto}.study-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px;color:#475569;font-weight:800}.study-toolbar span{background:#fff;border:1px solid var(--border);border-radius:999px;padding:8px 12px}.single-flashcard{height:500px;perspective:1100px;cursor:pointer;outline:none}.single-flashcard-inner{position:relative;width:100%;height:100%;transition:transform .65s ease;transform-style:preserve-3d}.single-flashcard.is-flipped .single-flashcard-inner{transform:rotateY(180deg)}.single-flashcard-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:26px;padding:36px;background:#fff;border:1px solid var(--border);box-shadow:0 22px 55px #00000017;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.single-flashcard-front{background:linear-gradient(135deg,#ffffff,#f8fafc)}.single-flashcard-back{transform:rotateY(180deg);background:linear-gradient(135deg,#eef2ff,#ffffff)}.single-flashcard-face h2{font-size:48px;line-height:1.05;margin:12px 0;color:#0f172a}.face-label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#64748b;font-weight:900}.tap-hint{margin-top:22px;color:#64748b;font-size:14px}.flashcard-image{max-width:220px;max-height:160px;object-fit:contain;border-radius:16px;margin:12px 0}.single-flashcard audio{width:min(100%,360px);margin-top:14px}.study-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:18px}.write-test-card{text-align:center;padding:34px}.write-test-card h2{font-size:42px;margin:30px 0 8px}.big-answer-input{font-size:24px;text-align:center;padding:16px 18px;margin:20px auto 8px;max-width:520px}.answer-feedback{min-height:36px;margin-top:18px;font-weight:800;border-radius:14px;padding:12px}.answer-feedback.success{background:#dcfce7;color:#166534}.answer-feedback.danger{background:#fee2e2;color:#991b1b}.answer-feedback.warning{background:#fef3c7;color:#92400e}.answer-feedback.info{background:#dbeafe;color:#1e40af}.empty-state{text-align:center;max-width:620px;margin:0 auto}@media(max-width:900px){.lesson-shell{grid-template-columns:1fr}.lesson-sidebar{position:static}.single-flashcard{height:430px}.single-flashcard-face h2{font-size:36px}.study-toolbar{flex-direction:column;align-items:stretch;text-align:center}.write-test-card h2{font-size:32px}}@media(max-width:520px){.single-flashcard{height:380px}.single-flashcard-face{padding:22px}.single-flashcard-face h2{font-size:30px}.big-answer-input{font-size:20px}.study-buttons .btn,.study-buttons button{width:100%;margin:0}.study-stats{grid-template-columns:1fr 1fr 1fr}}

/* Sequential quiz player */
.quiz-player-card{max-width:860px;margin:0 auto 24px}.quiz-player-head,.quiz-result-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:22px}.quiz-player-head h1,.quiz-result-head h1{margin:4px 0 8px}.quiz-progress-box{background:#f8fafc;border:1px solid var(--border);border-radius:18px;padding:16px 20px;text-align:center;min-width:120px}.quiz-progress-box b{display:block;font-size:26px}.quiz-progress-box span{font-size:12px;text-transform:uppercase;color:var(--muted);font-weight:900}.quiz-progress-bar{height:12px;background:#e5e7eb;border-radius:999px;overflow:hidden;margin-bottom:22px}.quiz-progress-bar>div{height:100%;background:var(--primary);transition:width .25s ease}.quiz-step{border:0;margin:0;padding:0}.quiz-step legend{display:grid;gap:10px;font-size:28px;font-weight:900;line-height:1.18;margin-bottom:22px}.quiz-step legend span{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.quiz-option{display:flex;grid-template-columns:auto 1fr;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--border);border-radius:16px;background:#fff;margin:10px 0;cursor:pointer;font-weight:800}.quiz-option:hover{border-color:#bfdbfe;background:#f8fafc}.quiz-option input{width:auto;transform:scale(1.15)}.quiz-option span{flex:1}.quiz-wizard-buttons{justify-content:flex-start}.quiz-result-card{max-width:960px;margin:0 auto 24px}.quiz-score{border-radius:22px;padding:18px 24px;text-align:center;min-width:150px}.quiz-score b{display:block;font-size:38px;line-height:1}.quiz-score span{font-weight:900;text-transform:uppercase;font-size:12px}.quiz-score.passed{background:#dcfce7;color:#166534}.quiz-score.failed{background:#fee2e2;color:#991b1b}.quiz-review-list{display:grid;gap:14px}.quiz-review-item{border:1px solid var(--border);border-radius:18px;padding:18px;background:#fff}.quiz-review-item.correct{border-color:#bbf7d0}.quiz-review-item.wrong{border-color:#fecaca}.quiz-review-title{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:8px}.quiz-review-title span{font-size:12px;font-weight:900;text-transform:uppercase;border-radius:999px;padding:5px 9px}.quiz-review-item.correct .quiz-review-title span{background:#dcfce7;color:#166534}.quiz-review-item.wrong .quiz-review-title span{background:#fee2e2;color:#991b1b}.quiz-review-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.quiz-review-grid div{background:#f8fafc;border:1px solid var(--border);border-radius:14px;padding:12px}.quiz-review-grid small{display:block;color:var(--muted);font-weight:900;text-transform:uppercase;margin-bottom:5px}.quiz-builder-question{background:#fbfdff}.quiz-builder-question h3{margin-top:0}@media(max-width:700px){.quiz-player-head,.quiz-result-head{flex-direction:column}.quiz-progress-box,.quiz-score{width:100%}.quiz-step legend{font-size:22px}.quiz-review-grid{grid-template-columns:1fr}.quiz-wizard-buttons .btn,.quiz-wizard-buttons button{width:100%;margin:0}}


/* V6: compact quiz button and dashboard navigation in header */
.main-nav{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.main-nav a{font-weight:800;font-size:14px;padding:8px 10px;border-radius:10px;color:#1e40af}.main-nav a:hover{background:#eef2ff}.main-nav .nav-logout{color:#991b1b}.main-nav .nav-logout:hover{background:#fee2e2}.quiz-dropdown{position:relative}.quiz-dropdown summary{list-style:none}.quiz-dropdown summary::-webkit-details-marker{display:none}.quiz-dropdown summary::after{content:'▾';margin-left:8px;font-size:12px}.quiz-dropdown[open] summary::after{content:'▴'}.quiz-dropdown-menu{display:grid;gap:8px;background:#fff;border:1px solid var(--border);border-radius:16px;padding:10px;margin-top:8px;box-shadow:0 18px 36px #00000014}.quiz-dropdown-menu a{display:grid;gap:4px;padding:12px;border:1px solid var(--border);border-radius:12px;color:var(--text);background:#f8fafc}.quiz-dropdown-menu a:hover{border-color:#bfdbfe;background:#eef2ff}.quiz-dropdown-menu small{color:var(--muted);font-weight:700}.book-quiz-area{margin:-6px 0 20px}.book-quiz-dropdown{display:inline-block}.quiz-dropdown-menu.wide{min-width:min(620px,calc(100vw - 40px))}@media(max-width:760px){.main-nav{justify-content:flex-start}.main-nav a{font-size:13px;padding:7px 8px}.book-quiz-dropdown{display:block}.book-quiz-dropdown .btn{width:100%;margin:0}.quiz-dropdown-menu.wide{min-width:0}}
.actions-cell{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.inline-form{display:inline-flex;margin:0}.btn.small,button.small{padding:7px 10px;border-radius:10px;font-size:13px;margin:2px}.btn.danger,button.danger{background:var(--danger);color:#fff}.btn.danger:hover,button.danger:hover{background:#b91c1c}
.lesson-navigation-actions{display:grid;gap:8px;margin:14px 0 10px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.lesson-navigation-actions .btn{text-align:center}


/* ============================================================
   GameWords V12 - Single-page public player matching old design
   ============================================================ */
.public-topbar{display:none}
.public-page{max-width:none;margin:0;padding:0}
.public-page .footer{display:block}

.gw-one-page{
    min-height:calc(100vh - 54px);
    width:100%;
    display:flex;
    flex-direction:row;
    gap:20px;
    padding:28px;
    font-family:'Poppins',Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;
    background:linear-gradient(135deg,#e0f7fa,#80deea);
}

.gw-old-sidebar{
    width:320px;
    min-width:320px;
    max-height:calc(100vh - 56px);
    overflow-y:auto;
    background:#00796b;
    color:#fff;
    padding:28px;
    border-radius:20px 0 0 20px;
    box-shadow:0 20px 40px rgba(0,0,0,.18);
}


.gw-mobile-menu-toggle{
    display:none;
    width:100%;
    text-align:center;
    background:#004d40;
    color:#fff;
    border:0;
    border-radius:12px;
    padding:14px 16px;
    font-size:17px;
    font-weight:900;
    margin:0 0 12px;
}

.gw-sidebar-menu{
    display:block;
}

.gw-old-card.gw-no-transition .gw-old-card-inner{
    transition:none !important;
}

.gw-old-sidebar h2{
    font-size:24px;
    margin:0 0 18px;
    text-align:center;
    color:#fff;
}

.gw-old-content{
    flex:1;
    min-height:calc(100vh - 56px);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:40px;
    background:#f5f5f5;
    border-radius:0 20px 20px 0;
    box-shadow:0 20px 40px rgba(0,0,0,.18);
    overflow:auto;
}

.gw-daily-word{
    background:rgba(255,255,255,.18);
    padding:15px;
    border-radius:10px;
    margin-bottom:20px;
    color:#fff;
}

.gw-daily-word p{
    margin:6px 0;
}

.gw-daily-word audio{
    width:100%;
    margin-top:8px;
}

.gw-old-button,
.gw-title-header{
    width:100%;
    display:block;
    text-align:left;
    background:rgba(255,255,255,.20);
    color:#fff;
    padding:13px 14px;
    border:0;
    border-radius:8px;
    cursor:pointer;
    transition:background .25s ease, transform .2s ease;
    font-weight:700;
    margin:0 0 8px;
    text-decoration:none;
}

.gw-old-button:hover,
.gw-title-header:hover{
    background:rgba(255,255,255,.38);
    transform:translateX(5px);
    color:#fff;
}

.gw-swap-button{
    background:#ff9800;
    text-align:center;
    margin-bottom:18px;
}

.gw-swap-button:hover{
    background:#fb8c00;
}

.gw-title-header{
    position:relative;
    padding-left:32px;
    font-size:18px;
}

.gw-title-header::before{
    content:"▶";
    position:absolute;
    left:12px;
    top:13px;
    transition:transform .25s ease;
}

.gw-title-header.active::before{
    transform:rotate(90deg);
}

.gw-group-list{
    list-style:none;
    display:none;
    padding:0 0 0 12px;
    margin:0 0 12px;
}

.gw-group-list.active{
    display:block;
}

.gw-group-list li{
    margin:0 0 6px;
}

.gw-unit-title{
    color:#d9fff8;
    font-weight:800;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.05em;
    margin-top:12px !important;
}

.gw-lesson-link.selected{
    background:rgba(255,255,255,.45);
    color:#fff;
    transform:translateX(5px);
}

.gw-sidebar-separator{
    border-top:1px solid rgba(255,255,255,.25);
    margin:18px 0;
}

.gw-selected-lesson-info{
    display:grid;
    gap:4px;
    background:rgba(0,0,0,.12);
    padding:12px;
    border-radius:10px;
    margin-bottom:14px;
}

.gw-selected-lesson-info small{
    opacity:.9;
}

.gw-side-nav-buttons,
.gw-mode-buttons{
    display:grid;
    gap:8px;
    margin-bottom:14px;
}

.gw-test-button{
    background:#ff4081;
}

.gw-test-button:hover{
    background:#e73370;
}

.gw-nav-button{
    background:rgba(255,255,255,.15);
}

.gw-quiz-menu{
    position:relative;
}

.gw-quiz-menu summary{
    list-style:none;
    background:#2196f3;
    text-align:center;
}

.gw-quiz-menu summary::-webkit-details-marker{
    display:none;
}

.gw-quiz-list{
    display:grid;
    gap:8px;
    background:#fff;
    color:#1f2937;
    border-radius:10px;
    padding:10px;
    margin-top:8px;
}

.gw-quiz-list a{
    display:grid;
    gap:3px;
    padding:10px;
    border-radius:8px;
    color:#1f2937;
    background:#f3f4f6;
}

.gw-quiz-list a:hover{
    background:#e0f2fe;
}

.gw-quiz-list small{
    color:#6b7280;
}

.gw-old-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}

.gw-old-stats div{
    background:rgba(255,255,255,.16);
    border-radius:10px;
    padding:10px 6px;
    text-align:center;
}

.gw-old-stats b{
    display:block;
    font-size:22px;
}

.gw-old-stats span{
    font-size:12px;
}

.gw-lesson-title{
    text-align:center;
    margin:0 0 16px;
    color:#111827;
}

.gw-study-toolbar{
    width:350px;
    max-width:100%;
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin:0 auto 12px;
    color:#6b7280;
    font-size:14px;
    font-weight:700;
}

.gw-old-card{
    background:#fff;
    width:350px;
    height:500px;
    max-width:90vw;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.16);
    perspective:1000px;
    cursor:pointer;
    position:relative;
}

.gw-old-card-inner{
    width:100%;
    height:100%;
    position:relative;
    transform-style:preserve-3d;
    transition:transform .6s;
}

.gw-old-card.is-flipped .gw-old-card-inner{
    transform:rotateY(180deg);
}

.gw-card-face{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:30px;
    text-align:center;
    border-radius:20px;
    backface-visibility:hidden;
    overflow:auto;
}

.gw-card-front{
    background:linear-gradient(135deg,#ffffff,#f4fbff);
}

.gw-card-back{
    background:linear-gradient(135deg,#ffffff,#ecfdf5);
    transform:rotateY(180deg);
}

.gw-card-face h2{
    font-size:34px;
    line-height:1.15;
    margin:0 0 14px;
    color:#00796b;
}

.gw-card-face p{
    color:#374151;
    font-size:17px;
}

.gw-card-image{
    max-width:220px;
    max-height:150px;
    object-fit:contain;
    border-radius:12px;
    margin:14px 0;
}

.gw-card-back audio{
    width:100%;
    margin-top:12px;
}

.gw-hint,
.gw-muted{
    color:#6b7280 !important;
}

.gw-logo{
    max-width:150px;
    margin-bottom:20px;
}

.gw-default-card{
    cursor:default;
}

.gw-default-card .gw-card-face{
    position:static;
}

.gw-main-actions,
.gw-test-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    margin-top:18px;
}

.gw-next-card-button,
.gw-check-answer-button,
.gw-next-word-button,
.gw-show-answer-button{
    padding:11px 20px;
    color:#fff;
    border:0;
    border-radius:8px;
    cursor:pointer;
    font-weight:800;
    margin:0;
    transition:background .25s ease, transform .15s ease;
}

.gw-next-card-button{
    background:#00796b;
}

.gw-next-card-button:hover{
    background:#00695c;
    transform:translateY(-1px);
}

.gw-shuffle-button,
.gw-next-word-button{
    background:#4caf50;
}

.gw-shuffle-button:hover,
.gw-next-word-button:hover{
    background:#45a049;
}

.gw-check-answer-button{
    background:#ff4081;
}

.gw-check-answer-button:hover{
    background:#e73370;
}

.gw-show-answer-button{
    background:#2196f3;
}

.gw-show-answer-button:hover{
    background:#1e88e5;
}

.gw-test-section{
    width:min(700px,100%);
    text-align:center;
    background:#fff;
    padding:34px;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
}

.gw-test-question{
    font-size:32px;
    font-weight:800;
    color:#00796b;
    margin:20px 0;
}

.gw-test-input{
    width:min(520px,100%);
    padding:15px;
    font-size:18px;
    border:1px solid #d1d5db;
    border-radius:10px;
    text-align:center;
}

.gw-answer-feedback{
    margin-top:16px;
    font-size:18px;
    font-weight:800;
    min-height:28px;
}

.gw-answer-feedback.success{color:#16a34a}
.gw-answer-feedback.danger{color:#dc2626}
.gw-answer-feedback.warning{color:#d97706}
.gw-answer-feedback.info{color:#1d4ed8}

@media(max-width:900px){
    .gw-one-page{
        flex-direction:column;
        padding:0;
        gap:0;
    }
    .gw-old-sidebar{
        width:100%;
        min-width:0;
        max-height:none;
        border-radius:0;
        padding:12px;
        position:sticky;
        top:0;
        z-index:20;
    }
    .gw-mobile-menu-toggle{
        display:block;
    }
    .gw-sidebar-menu{
        display:none;
        max-height:70vh;
        overflow-y:auto;
        padding:12px;
        border-radius:14px;
        background:#00796b;
    }
    .gw-old-sidebar.is-open .gw-sidebar-menu{
        display:block;
    }
    .gw-old-content{
        min-height:70vh;
        border-radius:0;
        padding:24px 14px;
    }
    .gw-old-card{
        width:330px;
        height:460px;
    }
    .gw-study-toolbar{
        width:330px;
    }
}

@media(max-width:420px){
    .gw-old-card{
        width:300px;
        height:430px;
    }
    .gw-card-face h2{
        font-size:28px;
    }
    .gw-study-toolbar{
        width:300px;
        flex-direction:column;
        text-align:center;
    }
}

/* ============================================================
   GameWords Final UI Polish - Creative home + flashcard design
   ============================================================ */
.gw-premium-stage{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:
        radial-gradient(circle at 18% 18%, rgba(255,255,255,.75), transparent 24%),
        radial-gradient(circle at 82% 8%, rgba(124,58,237,.30), transparent 28%),
        radial-gradient(circle at 80% 92%, rgba(14,165,233,.28), transparent 26%),
        linear-gradient(135deg,#071a2f 0%,#0f766e 46%,#67e8f9 100%);
}
.gw-ambient{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}.gw-ambient span{position:absolute;width:210px;height:210px;border-radius:999px;background:rgba(255,255,255,.18);filter:blur(4px);animation:gwFloat 14s ease-in-out infinite}.gw-ambient span:nth-child(1){left:8%;top:10%;animation-delay:-1s}.gw-ambient span:nth-child(2){right:12%;top:18%;width:130px;height:130px;animation-delay:-4s}.gw-ambient span:nth-child(3){left:38%;bottom:8%;width:160px;height:160px;animation-delay:-7s}.gw-ambient span:nth-child(4){right:28%;bottom:28%;width:90px;height:90px;animation-delay:-10s}@keyframes gwFloat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(22px,-28px,0) scale(1.08)}}
.gw-premium-stage .gw-old-sidebar{background:rgba(4,47,46,.72);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.18);border-radius:28px;box-shadow:0 24px 80px rgba(0,0,0,.28)}
.gw-premium-stage .gw-old-content{position:relative;background:rgba(255,255,255,.72);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.55);border-radius:32px;box-shadow:0 24px 80px rgba(0,0,0,.24)}
.gw-premium-stage .gw-old-button,.gw-premium-stage .gw-title-header{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.gw-premium-stage .gw-old-button:hover,.gw-premium-stage .gw-title-header:hover{background:rgba(255,255,255,.28);transform:translateX(5px) translateY(-1px)}
.gw-player-shell{width:min(820px,100%);display:grid;gap:18px;justify-items:center}.gw-player-hero{width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 20px;border-radius:28px;background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(240,253,250,.82));border:1px solid rgba(255,255,255,.72);box-shadow:0 20px 45px rgba(15,23,42,.10)}.gw-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:950;color:#0f766e}.gw-kicker::before{content:"";width:8px;height:8px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 6px rgba(34,197,94,.12)}.gw-player-hero .gw-lesson-title{margin:6px 0 0;text-align:left;font-size:clamp(24px,3vw,36px);letter-spacing:-.04em;color:#0f172a}.gw-mini-progress{position:relative;width:82px;height:82px;display:grid;place-items:center;flex:0 0 auto}.gw-mini-progress svg{position:absolute;inset:0;transform:rotate(-90deg)}.gw-mini-progress circle{fill:none;stroke-width:10;stroke:rgba(15,118,110,.10)}.gw-mini-progress circle:last-child{stroke:#0f766e;stroke-linecap:round;stroke-dasharray:326.7;stroke-dashoffset:326.7;transition:stroke-dashoffset .45s ease}.gw-mini-progress strong{font-size:18px;color:#0f172a}.gw-progress-track{width:100%;height:10px;background:rgba(255,255,255,.58);border-radius:999px;overflow:hidden;box-shadow:inset 0 1px 5px rgba(15,23,42,.12)}.gw-progress-track span{display:block;width:0%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#14b8a6,#22c55e,#f59e0b);transition:width .45s cubic-bezier(.22,1,.36,1)}.gw-premium-card{width:min(440px,90vw);height:560px;border-radius:34px;background:transparent;box-shadow:none}.gw-card-glow{position:absolute;inset:-18px;border-radius:42px;background:conic-gradient(from 180deg,#22c55e,#38bdf8,#a78bfa,#f472b6,#22c55e);filter:blur(24px);opacity:.42;animation:gwSpin 8s linear infinite}@keyframes gwSpin{to{transform:rotate(360deg)}}.gw-premium-card .gw-old-card-inner{border-radius:34px}.gw-premium-card .gw-card-face{border-radius:34px;padding:34px;border:1px solid rgba(255,255,255,.80);box-shadow:0 30px 70px rgba(15,23,42,.26);overflow:hidden}.gw-premium-card .gw-card-face::after{content:"";position:absolute;inset:auto -30% -35% -30%;height:48%;background:radial-gradient(ellipse at center,rgba(255,255,255,.55),transparent 70%);pointer-events:none}.gw-premium-card .gw-card-front{background:linear-gradient(145deg,#ffffff 0%,#ecfeff 50%,#dcfce7 100%)}.gw-premium-card .gw-card-back{background:linear-gradient(145deg,#ffffff 0%,#eef2ff 45%,#fdf2f8 100%)}.gw-face-pill{position:absolute;top:22px;left:22px;z-index:2;padding:7px 11px;border-radius:999px;background:rgba(15,118,110,.10);color:#0f766e;font-size:12px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}.gw-face-pill.answer{background:rgba(124,58,237,.11);color:#6d28d9}.gw-premium-card .gw-card-face h2{font-size:clamp(34px,5vw,54px);letter-spacing:-.04em;color:#0f172a;text-wrap:balance}.gw-premium-card .gw-hint{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);width:max-content;max-width:80%;padding:8px 12px;border-radius:999px;background:rgba(15,23,42,.07);font-size:13px}.gw-card-image{box-shadow:0 14px 30px rgba(15,23,42,.14);background:#fff}.gw-glass-actions{padding:12px;border-radius:24px;background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.72);box-shadow:0 18px 40px rgba(15,23,42,.10)}.gw-glass-actions button{border-radius:16px;padding:13px 18px}.gw-primary-action{background:linear-gradient(135deg,#0f766e,#14b8a6)!important}.gw-keyboard-hints{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:12px}.gw-keyboard-hints span{font-size:12px;font-weight:800;color:#475569;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.74);padding:7px 10px;border-radius:999px}.gw-premium-test{background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(240,253,250,.88));border:1px solid rgba(255,255,255,.70);box-shadow:0 30px 70px rgba(15,23,42,.18)}.gw-premium-test .gw-test-input{border:2px solid rgba(20,184,166,.22);box-shadow:0 12px 25px rgba(15,23,42,.08)}.gw-welcome-card{position:relative;width:min(740px,100%);min-height:470px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:46px;border-radius:34px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(236,254,255,.86));border:1px solid rgba(255,255,255,.78);box-shadow:0 35px 80px rgba(15,23,42,.18);overflow:hidden}.gw-welcome-card::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 120deg,transparent,rgba(20,184,166,.18),transparent,rgba(124,58,237,.16),transparent);animation:gwSpin 16s linear infinite}.gw-welcome-card>*{position:relative}.gw-welcome-orb{position:absolute;width:180px;height:180px;border-radius:999px;background:radial-gradient(circle,#67e8f9,transparent 68%);top:28px;right:36px;filter:blur(2px);opacity:.65}.gw-welcome-card h2{font-size:clamp(34px,5vw,58px);line-height:1;letter-spacing:-.06em;margin:12px 0;color:#0f172a}.gw-welcome-card p{max-width:560px;color:#475569;font-size:18px;line-height:1.65}.gw-welcome-features{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:18px}.gw-welcome-features span{padding:10px 13px;border-radius:999px;background:#fff;border:1px solid rgba(15,118,110,.12);font-weight:900;color:#0f766e;box-shadow:0 10px 20px rgba(15,23,42,.06)}.gw-empty-card{min-height:360px}.gw-card-enter{animation:gwCardEnter .38s cubic-bezier(.22,1,.36,1)}@keyframes gwCardEnter{from{opacity:.15;transform:translateY(18px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.gw-confetti{position:fixed;width:9px;height:14px;border-radius:3px;top:-20px;z-index:9999;pointer-events:none;animation:gwConfettiFall 900ms ease-out forwards}@keyframes gwConfettiFall{to{transform:translateY(110vh) rotate(560deg);opacity:0}}
@media(max-width:900px){.gw-premium-stage .gw-old-sidebar{border-radius:0;border-left:0;border-right:0}.gw-premium-stage .gw-old-content{border-radius:0;box-shadow:none}.gw-player-hero{padding:14px;border-radius:22px}.gw-mini-progress{width:68px;height:68px}.gw-premium-card{width:min(350px,92vw);height:500px}.gw-keyboard-hints{display:none}.gw-welcome-card{border-radius:24px;min-height:430px;padding:32px 22px}.gw-glass-actions{border-radius:20px}.gw-glass-actions button{flex:1 1 140px}}@media(max-width:420px){.gw-premium-card{width:304px;height:440px}.gw-premium-card .gw-card-face{padding:26px 20px}.gw-player-hero{align-items:flex-start}.gw-mini-progress{display:none}.gw-progress-track{height:8px}.gw-welcome-card p{font-size:16px}}

/* ============================================================
   Fix long flashcard words: prevent overflow outside the card
   ============================================================ */
.gw-premium-card .gw-card-face{
    overflow: hidden;
}

.gw-premium-card .gw-card-face h2,
.gw-old-card .gw-card-face h2,
.single-flashcard-face h2{
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
    white-space: normal;
    line-height: 1.08;
    text-align: center;
}

.gw-premium-card .gw-card-face h2{
    font-size: clamp(26px, 4.2vw, 48px);
    padding: 0 10px;
}

@media (max-width: 520px){
    .gw-premium-card .gw-card-face h2{
        font-size: clamp(22px, 8vw, 34px);
        line-height: 1.12;
    }
}

.table-wrap{width:100%;overflow:auto;border:1px solid var(--border);border-radius:16px;background:#fff}.table-wrap table{margin:0;min-width:760px}.table-wrap th,.table-wrap td{white-space:nowrap}.table-wrap td:nth-child(3),.table-wrap td:nth-child(4){white-space:normal;min-width:160px}

/* ============================================================
   External public page: old GameWords look applied to GameWords3
   Keeps GameWords3 player, quiz, tracking and lesson features intact.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;700&display=swap');

body:has(.gw-one-page){
    margin:0;
    padding:0;
    background:linear-gradient(135deg,#e0f7fa,#80deea);
    overflow:hidden;
}

.gw-one-page{
    height:100vh;
    min-height:100vh;
    width:100%;
    display:flex;
    justify-content:flex-start;
    align-items:stretch;
    gap:0;
    padding:0;
    font-family:'Poppins',Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;
    background:linear-gradient(135deg,#e0f7fa,#80deea);
    overflow:hidden;
}

.gw-old-sidebar{
    width:300px;
    min-width:300px;
    height:100vh;
    max-height:100vh;
    overflow:hidden;
    background:#00796b;
    color:#fff;
    padding:30px;
    border-radius:0;
    box-shadow:none;
    display:flex;
    flex-direction:column;
    gap:20px;
}

.gw-sidebar-menu{
    display:flex;
    flex-direction:column;
    gap:0;
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    padding-right:4px;
}

.gw-old-sidebar h2{
    font-size:24px;
    margin:0;
    text-align:center;
    color:#fff;
}

.gw-daily-word{
    background:rgba(255,255,255,.2);
    padding:15px;
    border-radius:8px;
    margin-bottom:20px;
    color:#fff;
}

.gw-daily-word p{
    margin:5px 0;
}

.gw-title-header{
    background:transparent;
    box-shadow:none;
    border:0;
    border-radius:0;
    font-size:20px;
    margin-top:20px;
    margin-bottom:8px;
    color:#fff;
    cursor:pointer;
    position:relative;
    padding:0 0 0 25px;
    text-align:left;
    width:100%;
    transition:none;
}

.gw-title-header:hover{
    background:transparent;
    transform:none;
    color:#fff;
}

.gw-title-header::before{
    content:"\25B6";
    position:absolute;
    left:0;
    top:0;
    font-size:20px;
    transition:transform .3s;
}

.gw-title-header.active::before{
    transform:rotate(90deg);
}

.gw-group-list{
    list-style-type:none;
    padding-left:15px;
    display:none;
    margin:0;
}

.gw-group-list.active{
    display:block;
}

.gw-group-list li{
    margin-bottom:5px;
}

.gw-old-button,
.gw-lesson-link,
.gw-nav-button{
    background:rgba(255,255,255,.2);
    color:#fff;
    padding:15px;
    border:0;
    border-radius:8px;
    cursor:pointer;
    transition:background .3s ease, transform .2s;
    text-align:left;
    width:100%;
    display:block;
    font-weight:500;
    margin:0;
    text-decoration:none;
    box-shadow:none;
}

.gw-old-button:hover,
.gw-lesson-link:hover,
.gw-nav-button:hover{
    background:rgba(255,255,255,.4);
    transform:translateX(5px);
    color:#fff;
}

.gw-swap-button{
    margin-bottom:15px;
    background:#ff9800;
    text-align:center;
}

.gw-swap-button:hover{
    background:#fb8c00;
}

.gw-test-button{
    background:#ff4081;
    color:#fff;
    padding:12px;
    border:0;
    border-radius:5px;
    cursor:pointer;
    transition:background .3s ease;
    margin-top:10px;
}

.gw-test-button:hover{
    background:#e73370;
}

.gw-unit-title{
    color:#d9fff8;
    font-weight:700;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.04em;
    margin:10px 0 6px !important;
}

.gw-lesson-link.selected{
    background:rgba(255,255,255,.4);
    transform:translateX(5px);
}

.gw-old-content{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:40px;
    background:#f5f5f5;
    border-radius:0;
    box-shadow:none;
    height:100vh;
    min-height:0;
    overflow:auto;
    overscroll-behavior:contain;
}

.gw-player-shell{
    width:auto;
    max-width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:0;
}

.gw-lesson-title{
    display:block;
    margin:0 0 16px;
    color:#111827;
    text-align:center;
    font-size:24px;
    font-weight:700;
    letter-spacing:0;
}

.gw-progress-track{
    width:350px;
    max-width:90vw;
    height:8px;
    background:#e5e7eb;
    border-radius:999px;
    overflow:hidden;
    margin:0 0 12px;
    box-shadow:none;
}

.gw-progress-track span{
    display:block;
    width:0%;
    height:100%;
    background:#00796b;
    transition:width .3s ease;
}

.gw-study-toolbar{
    width:350px;
    max-width:90vw;
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin:0 auto 12px;
    color:#6b7280;
    font-size:14px;
    font-weight:700;
}

.gw-old-card{
    background:#fff;
    width:350px;
    height:500px;
    max-width:90vw;
    border-radius:20px;
    box-shadow:0 15px 30px rgba(0,0,0,.2);
    position:relative;
    transition:transform .6s ease, box-shadow .3s ease;
    perspective:1000px;
    border:2px solid #ddd;
    cursor:pointer;
}

.gw-old-card:hover{
    transform:scale(1.05);
    box-shadow:0 25px 45px rgba(0,0,0,.3);
}

.gw-old-card-inner{
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    transition:transform .8s;
    transform-style:preserve-3d;
    border-radius:20px;
}

.gw-old-card.is-flipped .gw-old-card-inner{
    transform:rotateY(180deg);
}

.gw-card-face{
    position:absolute;
    width:100%;
    height:100%;
    inset:0;
    backface-visibility:hidden;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:20px;
    border-radius:20px;
    box-sizing:border-box;
    text-align:center;
    overflow:auto;
}

.gw-card-front{
    background:#fff;
    color:#333;
    border:2px solid #ddd;
}

.gw-card-back{
    background:#dfdfdf;
    color:#034d6f;
    transform:rotateY(180deg);
    border:2px solid #ddd;
}

.gw-card-face h2{
    width:100%;
    max-width:100%;
    font-size:28px;
    line-height:1.15;
    margin:0;
    color:#333;
    overflow-wrap:anywhere;
    word-break:break-word;
    hyphens:auto;
}

.gw-card-back h2,
.gw-card-back p{
    color:#034d6f;
}

.gw-card-back p{
    margin:10px 0;
}

.gw-hint,
.gw-muted{
    color:#666 !important;
    font-size:15px;
}

.gw-logo{
    max-width:150px;
    margin-bottom:20px;
}

.gw-default-card{
    cursor:default;
}

.gw-default-card:hover{
    transform:none;
    box-shadow:0 15px 30px rgba(0,0,0,.2);
}

.gw-default-card .gw-card-face{
    position:static;
}

.gw-default-text{
    font-size:20px;
    color:#666;
    text-align:center;
    margin-top:10px;
}

.gw-main-actions,
.gw-test-actions{
    display:flex;
    gap:10px;
    justify-content:center;
    flex-wrap:wrap;
    margin-top:20px;
    padding:0;
    background:transparent;
    border:0;
    box-shadow:none;
}

.gw-next-card-button,
.gw-check-answer-button,
.gw-next-word-button,
.gw-show-answer-button{
    padding:12px 25px;
    color:#fff;
    border:0;
    border-radius:10px;
    cursor:pointer;
    margin:0;
    transition:background .3s ease;
    font-weight:700;
}

.gw-next-card-button{
    background:#007bff;
}

.gw-next-card-button:hover{
    background:#0069d9;
}

.gw-shuffle-button,
.gw-next-word-button{
    background:#4caf50;
}

.gw-shuffle-button:hover,
.gw-next-word-button:hover{
    background:#45a049;
}

.gw-check-answer-button{
    background:#ff4081;
}

.gw-check-answer-button:hover{
    background:#e73370;
}

.gw-show-answer-button{
    background:#2196f3;
}

.gw-show-answer-button:hover{
    background:#1e88e5;
}

.gw-test-section{
    display:block;
    background:#fff;
    padding:20px;
    border-radius:10px;
    box-shadow:0 10px 20px rgba(0,0,0,.1);
    text-align:center;
    width:min(700px,100%);
}

.gw-test-section[hidden]{
    display:none !important;
}

.gw-test-section h2{
    margin-top:0;
}

.gw-test-question{
    font-size:20px;
    margin-bottom:15px;
    color:#333;
}

.gw-test-input{
    padding:12px;
    width:80%;
    margin-bottom:15px;
    border:2px solid #ddd;
    border-radius:8px;
    text-align:center;
    font-size:16px;
}

.gw-answer-feedback{
    margin-top:10px;
    font-size:18px;
    font-weight:700;
    min-height:28px;
}

.gw-old-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}

.gw-old-stats div{
    background:rgba(255,255,255,.16);
    border-radius:8px;
    padding:8px 6px;
    text-align:center;
}

@media(max-width:900px){
    body:has(.gw-one-page){
        overflow:auto;
    }

    .gw-one-page{
        height:auto;
        min-height:100vh;
        overflow:visible;
        flex-direction:column;
        align-items:stretch;
    }

    .gw-old-sidebar{
        width:100%;
        min-width:0;
        height:auto;
        max-height:none;
        overflow:visible;
        padding:12px;
        position:sticky;
        top:0;
        z-index:20;
    }

    .gw-mobile-menu-toggle{
        display:block;
    }

    .gw-sidebar-menu{
        display:none;
        max-height:70vh;
        overflow-y:auto;
        padding:12px;
        border-radius:14px;
        background:#00796b;
    }

    .gw-old-sidebar.is-open .gw-sidebar-menu{
        display:flex;
    }

    .gw-old-content{
        height:auto;
        min-height:70vh;
        overflow:visible;
        padding:24px 14px;
    }

    .gw-old-card{
        width:330px;
        height:460px;
    }

    .gw-study-toolbar,
    .gw-progress-track{
        width:330px;
    }
}

@media(max-width:420px){
    .gw-old-card{
        width:300px;
        height:430px;
    }

    .gw-card-face h2{
        font-size:28px;
    }

    .gw-study-toolbar{
        width:300px;
        flex-direction:column;
        text-align:center;
    }

    .gw-test-input{
        width:100%;
    }
}

/* Elegant sidebar scroll line: keep the menu scrollable with a very small, clean drag indicator. */
.gw-sidebar-menu{
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.46) transparent;
    -ms-overflow-style:auto;
    padding-right:8px;
}
.gw-sidebar-menu::-webkit-scrollbar{
    width:5px;
    height:5px;
}
.gw-sidebar-menu::-webkit-scrollbar-track{
    background:transparent;
}
.gw-sidebar-menu::-webkit-scrollbar-thumb{
    background:rgba(255,255,255,.42);
    border-radius:999px;
}
.gw-sidebar-menu::-webkit-scrollbar-thumb:hover{
    background:rgba(255,255,255,.68);
}
.gw-old-sidebar{
    scrollbar-width:none;
    -ms-overflow-style:none;
}
.gw-old-sidebar::-webkit-scrollbar{
    width:0;
    height:0;
    display:none;
}

@media(min-width:901px){
    .gw-old-sidebar{
        overflow:hidden;
    }
    .gw-sidebar-menu{
        overflow-y:auto;
        overflow-x:hidden;
        margin-right:0;
        padding-right:0;
    }
}


/* Public game footer / copyright restored */
.public-page + .footer{
    display:block;
    width:100%;
    text-align:center;
    background:#ffffff;
    color:#607d8b;
    padding:16px 10px;
    font-size:13px;
    line-height:1.6;
    border-top:1px solid #e0e0e0;
    box-shadow:0 -4px 16px rgba(0,0,0,.04);
}
.public-page + .footer .footer-separator{
    display:inline-block;
    margin:0 8px;
    color:#90a4ae;
}
@media(max-width:600px){
    .public-page + .footer{
        font-size:12px;
        padding:12px 8px;
    }
    .public-page + .footer .footer-separator{
        display:block;
        margin:2px 0;
    }
}


/* Final copyright visibility fix: keep footer visible below the public player. */
body:has(.gw-one-page){
    overflow-y:auto !important;
    overflow-x:hidden !important;
}
.public-page{
    min-height:auto !important;
}
.gw-one-page{
    height:auto !important;
    min-height:calc(100vh - 58px) !important;
    overflow:visible !important;
}
.gw-old-content{
    height:auto !important;
    min-height:calc(100vh - 58px) !important;
}
.public-page + .footer,
.footer{
    display:block !important;
    position:relative !important;
    z-index:50 !important;
    width:100% !important;
    min-height:58px !important;
    background:#ffffff !important;
    color:#607d8b !important;
    text-align:center !important;
    padding:16px 10px !important;
    font-size:13px !important;
    line-height:1.6 !important;
    border-top:1px solid #e0e0e0 !important;
    box-shadow:0 -4px 16px rgba(0,0,0,.04) !important;
}
@media(min-width:901px){
    .gw-one-page{
        height:calc(100vh - 58px) !important;
        min-height:calc(100vh - 58px) !important;
        overflow:hidden !important;
    }
    .gw-old-sidebar{
        height:calc(100vh - 58px) !important;
        max-height:calc(100vh - 58px) !important;
    }
    .gw-old-content{
        height:calc(100vh - 58px) !important;
        min-height:0 !important;
        overflow:auto !important;
    }
}
@media(max-width:900px){
    .gw-one-page{
        min-height:calc(100vh - 58px) !important;
        padding-bottom:16px !important;
    }
    .gw-old-content{
        min-height:70vh !important;
    }
}

/* Footer placement fix: keep copyright only under the flashcard/content area, not under the sidebar. */
@media(min-width:901px){
    .public-page + .footer,
    body:has(.gw-one-page) > .footer{
        margin-left:300px !important;
        width:calc(100% - 300px) !important;
        max-width:none !important;
        box-sizing:border-box !important;
    }
}

@media(max-width:900px){
    .public-page + .footer,
    body:has(.gw-one-page) > .footer{
        margin-left:0 !important;
        width:100% !important;
    }
}

/* Final footer layout: copyright belongs to the flashcard/content column only. */
body:has(.gw-one-page) > .footer,
.public-page + .footer{
    display:none !important;
}

.gw-old-content{
    justify-content:flex-start !important;
}

.gw-old-content > .gw-player-shell,
.gw-old-content > .gw-old-card,
.gw-old-content > .gw-test-section{
    margin-top:auto !important;
    margin-bottom:auto !important;
}

.gw-content-footer{
    display:block !important;
    align-self:stretch !important;
    width:100% !important;
    max-width:none !important;
    margin:24px 0 0 !important;
    min-height:58px !important;
    background:#ffffff !important;
    color:#607d8b !important;
    text-align:center !important;
    padding:16px 10px !important;
    font-size:13px !important;
    line-height:1.6 !important;
    border-top:1px solid #e0e0e0 !important;
    box-shadow:0 -4px 16px rgba(0,0,0,.04) !important;
    box-sizing:border-box !important;
}

.gw-content-footer .footer-separator{
    display:inline-block;
    margin:0 8px;
    color:#90a4ae;
}

@media(min-width:901px){
    .gw-one-page{
        height:100vh !important;
        min-height:100vh !important;
        overflow:hidden !important;
    }

    .gw-old-sidebar{
        height:100vh !important;
        max-height:100vh !important;
    }

    .gw-old-content{
        height:100vh !important;
        min-height:0 !important;
        overflow:auto !important;
        padding-bottom:0 !important;
    }
}

@media(max-width:900px){
    .gw-content-footer{
        margin-top:18px !important;
        font-size:12px !important;
        padding:12px 8px !important;
    }

    .gw-content-footer .footer-separator{
        display:block;
        margin:2px 0;
    }
}

/* Removed arrow-style scroll hint. The sidebar now uses a thin elegant scrollbar line instead. */
.gw-sidebar-scroll-hint{
    display:none !important;
}

/* Final override: keep the sidebar scroll line visible and elegant on all layouts. */
.gw-sidebar-menu{
    padding-right:8px !important;
    scrollbar-width:thin !important;
    scrollbar-color:rgba(255,255,255,.48) transparent !important;
}
.gw-sidebar-menu::-webkit-scrollbar{
    width:5px !important;
    height:5px !important;
    display:block !important;
}
.gw-sidebar-menu::-webkit-scrollbar-track{
    background:transparent !important;
}
.gw-sidebar-menu::-webkit-scrollbar-thumb{
    background:rgba(255,255,255,.45) !important;
    border-radius:999px !important;
}
.gw-sidebar-menu::-webkit-scrollbar-thumb:hover{
    background:rgba(255,255,255,.70) !important;
}
.gw-sidebar-scroll-hint{
    display:none !important;
}


/* Anti-layout-flash fix: keep the lesson sidebar locked to the left while the browser is still parsing the content column. */
.gw-one-page{
    justify-content:flex-start !important;
}
.gw-old-sidebar{
    flex:0 0 300px;
}
.gw-old-content{
    flex:1 1 auto;
}
@media(max-width:900px){
    .gw-old-sidebar{
        flex:0 0 auto;
    }
}

/* Collapsible lesson chooser: open on the first page, closed after a lesson is selected. */
.gw-lesson-chooser{
    margin:0 0 14px;
    padding:0;
}

.gw-lesson-chooser-summary{
    width:100%;
    display:block;
    list-style:none;
    cursor:pointer;
    user-select:none;
    background:rgba(255,255,255,.24);
    color:#fff;
    border:1px solid rgba(255,255,255,.22);
    border-radius:12px;
    padding:14px 42px 14px 16px;
    font-weight:800;
    line-height:1.25;
    position:relative;
    box-shadow:0 10px 24px rgba(0,0,0,.12);
}

.gw-lesson-chooser-summary::-webkit-details-marker{
    display:none;
}

.gw-lesson-chooser-summary::after{
    content:"▾";
    position:absolute;
    right:16px;
    top:50%;
    transform:translateY(-50%) rotate(-90deg);
    transition:transform .2s ease;
    font-size:18px;
}

.gw-lesson-chooser[open] > .gw-lesson-chooser-summary::after{
    transform:translateY(-50%) rotate(0deg);
}

.gw-lesson-chooser-body{
    padding-top:12px;
}

.gw-lesson-chooser:not([open]){
    margin-bottom:18px;
}

.gw-lesson-chooser:not([open]) + .gw-sidebar-separator{
    margin-top:8px;
}