:root{--safe-bottom:env(safe-area-inset-bottom,0px);--bg:#eef3f7;--panel:#fff;--panel2:#f8fafc;--text:#0f172a;--muted:#64748b;--line:#dbe3ee;--brand:#2563eb;--brand2:#7c3aed;--accent:#f59e0b;--good:#16a34a;--danger:#dc2626;--shadow:0 20px 55px rgba(15,23,42,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at top left,rgba(37,99,235,.12),transparent 28%),linear-gradient(180deg,#f7fbff,#e7edf5);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}body.dark{--bg:#08111f;--panel:#111827;--panel2:#0b1220;--text:#f8fafc;--muted:#cbd5e1;--line:#243246;--shadow:0 20px 55px rgba(0,0,0,.35);background:linear-gradient(180deg,#020617,#111827)}body.large{font-size:18px}body.contrast{--brand:#0047ff;--accent:#ff9900;--line:#111827}a{color:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:300px 1fr;grid-template-rows:76px 1fr;grid-template-areas:"top top" "side main"}.topbar{grid-area:top;position:sticky;top:0;z-index:35;background:rgba(255,255,255,.82);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 24px}body.dark .topbar{background:rgba(15,23,42,.86)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{width:50px;height:50px;border-radius:18px;background:linear-gradient(135deg,var(--brand),var(--brand2));display:grid;place-items:center;color:white;font-weight:1000;box-shadow:0 14px 28px rgba(37,99,235,.25)}.brand strong{display:block;font-size:18px}.brand small{display:block;color:var(--muted);font-weight:800}.top-hud{display:flex;align-items:center;gap:8px}.hud-chip{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:9px 12px;box-shadow:0 8px 18px rgba(15,23,42,.06);font-weight:900}.hud-chip small{display:block;color:var(--muted);font-size:11px}.icon-btn{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:14px;width:44px;height:44px;display:grid;place-items:center;font-weight:900}.sidebar{grid-area:side;position:sticky;top:76px;height:calc(100vh - 76px);overflow:auto;padding:18px 16px 100px;border-right:1px solid var(--line);background:rgba(255,255,255,.62);backdrop-filter:blur(12px)}body.dark .sidebar{background:rgba(15,23,42,.6)}.profile-card,.panel,.stat-card,.tree-card,.mini-card,.chapter-card,.zone-card,.quest-card,.badge-card,.shop-card{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:26px}.profile-card{padding:16px;margin-bottom:16px}.avatar-ring{width:86px;height:86px;border-radius:28px;background:linear-gradient(135deg,rgba(37,99,235,.14),rgba(124,58,237,.14));display:grid;place-items:center;font-size:46px;margin:auto auto 12px}.profile-card label{display:block;font-size:13px;font-weight:900;margin:8px 0 6px}.profile-card input,.bank-tools input,.bank-tools select,.large-note,.question-note,.teacher-grid input{width:100%;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:16px;padding:12px 14px;outline:none}.avatar-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}.avatar-picker button{border:1px solid var(--line);background:var(--panel2);border-radius:14px;padding:10px;font-size:23px;cursor:pointer}.avatar-picker button.active{outline:3px solid rgba(37,99,235,.25);border-color:var(--brand);background:rgba(37,99,235,.08)}.profile-mini{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.profile-mini span{background:var(--panel2);border-radius:14px;padding:10px;text-align:center;color:var(--muted)}.profile-mini b{color:var(--text)}.nav-list{display:grid;gap:6px}.nav-item{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--muted);font-weight:900;border-radius:16px;padding:12px 13px}.nav-item:hover,.nav-item.active{background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(124,58,237,.10));color:var(--brand)}.main{grid-area:main;padding:24px 28px 120px;max-width:1360px;width:100%;margin:0 auto}.panel{padding:22px;margin-bottom:22px}.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:center;min-height:410px;overflow:hidden}.eyebrow{display:inline-flex;align-items:center;gap:7px;border-radius:999px;background:rgba(37,99,235,.10);color:var(--brand);padding:7px 11px;font-weight:1000;font-size:12px}.hero h1{font-size:clamp(34px,5vw,64px);line-height:.98;margin:14px 0;letter-spacing:-.055em}.hero p,.section-note{color:var(--muted);line-height:1.65}.hero-actions,.button-row{display:flex;gap:10px;flex-wrap:wrap}.primary-btn,.secondary-btn,.ghost-btn,.danger-btn{border:0;border-radius:17px;padding:13px 17px;font-weight:1000;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.primary-btn{background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff}.secondary-btn{background:var(--panel2);color:var(--text);border:1px solid var(--line)}.ghost-btn{background:transparent;color:var(--muted);border:1px dashed var(--line)}.danger-btn{background:rgba(220,38,38,.12);color:var(--danger);border:1px solid rgba(220,38,38,.22)}.compact{padding:9px 12px;border-radius:13px;font-size:13px}.primary-btn:disabled,.secondary-btn:disabled{opacity:.5;cursor:not-allowed}.mission-strip{margin-top:18px;border:1px solid var(--line);background:var(--panel2);border-radius:20px;padding:13px 15px;display:grid;gap:3px}.mission-strip span,.mission-strip small{color:var(--muted)}.campus-visual{position:relative;min-height:360px}.floating-campus{position:absolute;inset:12%;border-radius:34px;background:linear-gradient(150deg,#dbeafe,#fde68a);box-shadow:0 28px 80px rgba(37,99,235,.22);transform:rotate(-2deg);overflow:hidden}.floating-campus:after{content:"";position:absolute;inset:auto -20px 15%;height:54px;background:rgba(255,255,255,.72);transform:rotate(-9deg)}.block{position:absolute;border-radius:14px;background:linear-gradient(180deg,#fff,#bfdbfe);box-shadow:0 12px 20px rgba(15,23,42,.16)}.b1{left:12%;bottom:27%;width:70px;height:86px}.b2{left:31%;bottom:38%;width:90px;height:128px}.b3{right:26%;bottom:28%;width:74px;height:96px}.b4{right:8%;bottom:36%;width:84px;height:146px}.b5{left:48%;bottom:22%;width:80px;height:76px}.locked-tower:before{content:"🔒";position:absolute;top:-22px;right:-10px;font-size:24px}.campus-road{position:absolute;left:15%;right:10%;bottom:18%;height:18px;background:#334155;border-radius:99px}.avatar-hero,.tree-hero,.companion{position:absolute;z-index:3}.avatar-hero{left:20%;bottom:16%;font-size:58px;animation:floaty 3s ease-in-out infinite}.tree-hero{right:22%;bottom:19%;font-size:70px}.companion{right:10%;top:14%;font-size:44px}.cloud{position:absolute;background:rgba(255,255,255,.75);border-radius:999px}.c1{left:5%;top:10%;width:110px;height:36px}.c2{right:5%;top:18%;width:86px;height:30px}.sky-dot{position:absolute;border-radius:50%;background:var(--brand);opacity:.45}.s1{left:20%;top:10%;width:8px;height:8px}.s2{right:20%;top:8%;width:10px;height:10px}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.stat-card{padding:18px}.stat-card span{color:var(--muted);font-weight:900}.stat-card strong{display:block;font-size:34px;margin-top:4px}.stat-card small{color:var(--muted)}.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.section-head h2{margin:4px 0 0;font-size:30px;letter-spacing:-.025em}.story-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.chapter-card{position:relative;padding:18px;overflow:hidden}.chapter-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(37,99,235,.14),transparent 45%);pointer-events:none}.chapter-card.locked{filter:grayscale(.45);opacity:.68}.chapter-no{position:absolute;right:16px;top:14px;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-weight:1000}.chapter-icon{font-size:44px}.chapter-card h3,.mini-card h3,.zone-card h3,.quest-card h3,.badge-card h3,.shop-card h3{margin:8px 0 6px}.chapter-card p,.mini-card p,.zone-card p,.quest-card p,.tree-card p,.badge-card p,.shop-card p,.teacher-grid p,.report-grid p{color:var(--muted);line-height:1.5}.play-zone{border:0;background:var(--brand);color:#fff;border-radius:14px;padding:10px 12px;font-weight:1000;cursor:pointer;margin-top:12px}.play-zone:disabled{background:#94a3b8;cursor:not-allowed}.mini-progress{display:grid;gap:8px;margin:8px 0 16px}.mini-grid,.zone-grid,.quest-grid,.badge-grid,.shop-grid,.report-grid,.tree-grid,.teacher-grid,.settings-grid{display:grid;gap:16px}.mini-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.mini-card{padding:16px;cursor:pointer;position:relative;overflow:hidden;min-height:218px}.mini-card:hover{transform:translateY(-2px)}.mini-card.locked{opacity:.62;filter:grayscale(.35);cursor:not-allowed}.mini-card.locked:hover{transform:none}.mini-card .icon{font-size:38px}.mini-card small{display:inline-flex;margin-top:8px;color:var(--brand);font-weight:1000}.lock-ribbon{position:absolute;right:12px;top:12px;background:#111827;color:white;border-radius:999px;padding:6px 9px;font-weight:1000;font-size:12px}.unlock-req{font-size:12px;color:var(--muted);background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:8px;margin-top:10px}.arcade-screen{margin-top:16px;min-height:280px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,var(--panel2),rgba(219,234,254,.55));padding:18px}.arcade-empty{text-align:center;padding:50px 20px;color:var(--muted)}.arcade-game{display:grid;gap:14px}.arcade-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.arcade-score{display:flex;gap:8px;flex-wrap:wrap}.arcade-pill{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-weight:1000}.arcade-question,.challenge-box{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:18px}.arcade-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.arcade-options button,.memory-card{border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--text);padding:14px;cursor:pointer;font-weight:900;text-align:left}.arcade-options button.correct{border-color:rgba(22,163,74,.55);background:rgba(22,163,74,.12)}.arcade-options button.wrong{border-color:rgba(220,38,38,.55);background:rgba(220,38,38,.12)}.memory-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.memory-card{min-height:82px;text-align:center;font-size:28px;display:grid;place-items:center}.memory-card span{display:none}.memory-card.open span,.memory-card.done span{display:block}.memory-card.done{background:rgba(22,163,74,.12);border-color:rgba(22,163,74,.4)}.tree-grid{grid-template-columns:1.25fr .9fr .9fr}.tree-card{padding:18px}.big-tree-card{text-align:center}.tree-stage{font-size:96px;line-height:1.1}.owl-face{font-size:70px}.progress{height:12px;background:var(--panel2);border-radius:999px;overflow:hidden;border:1px solid var(--line)}.progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--good),var(--accent));transition:width .35s}.need-list{display:grid;gap:8px;margin-top:12px}.need-list span,.quest-card small,.badge-card small,.shop-card small{color:var(--muted)}.quest-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.quest-card{padding:16px}.quest-card.done{background:linear-gradient(135deg,rgba(22,163,74,.12),var(--panel))}.zone-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.zone-card{position:relative;overflow:hidden;padding:18px;cursor:pointer}.zone-card .zone-icon{font-size:36px}.zone-card .zone-meta{display:flex;justify-content:space-between;gap:10px;margin-top:12px;font-weight:1000}.bank-tools{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:10px;margin-bottom:16px}.question-list{display:grid;gap:10px;max-height:620px;overflow:auto;padding-right:4px}.question-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:18px;background:var(--panel2)}.question-row h3{margin:0 0 6px;font-size:16px}.question-row p{margin:0;color:var(--muted);font-size:13px}.badge-grid,.shop-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:16px}.badge-card,.shop-card{padding:16px}.badge-card.locked{opacity:.58;filter:grayscale(1)}.badge-icon,.shop-icon{font-size:42px}.shop-card.owned{background:linear-gradient(135deg,rgba(22,163,74,.1),var(--panel))}.teacher-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.large-note{min-height:180px;resize:vertical}.notebook-list{display:grid;gap:10px;margin-top:14px}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--panel2);font-weight:1000}.question-modal{border:0;background:transparent;padding:16px;width:min(780px,100%)}.question-modal::backdrop{background:rgba(2,6,23,.62);backdrop-filter:blur(5px)}.question-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:28px;padding:24px;box-shadow:var(--shadow);max-height:calc(100vh - 40px);overflow:auto}.close-btn{position:absolute;right:14px;top:14px;border:0;width:38px;height:38px;border-radius:14px;background:var(--panel2);color:var(--text);font-size:24px;cursor:pointer}.question-top{display:flex;gap:8px;align-items:center;margin-right:50px}.zone-pill,.difficulty{display:inline-flex;border-radius:999px;padding:8px 12px;background:var(--panel2);border:1px solid var(--line);font-weight:1000}.scenario{background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(124,58,237,.08));border:1px solid var(--line);border-radius:18px;padding:15px;line-height:1.6;color:var(--muted)}.options{display:grid;gap:10px}.option-btn{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:18px;padding:14px;text-align:left;font-weight:900;cursor:pointer;line-height:1.4}.option-btn.correct{background:rgba(22,163,74,.12);border-color:rgba(22,163,74,.5)}.option-btn.wrong{background:rgba(220,38,38,.12);border-color:rgba(220,38,38,.5)}.hint-box{display:none;margin:10px 0;padding:13px;border-radius:16px;border:1px dashed rgba(245,158,11,.55);background:rgba(245,158,11,.12);color:var(--text)}.hint-box.show{display:block}.feedback{margin-top:12px;border-radius:18px;padding:0;max-height:0;overflow:hidden;transition:.24s}.feedback.show{padding:14px;max-height:260px;border:1px solid var(--line);background:var(--panel2)}.note-inline{display:block;margin:14px 0 6px;font-weight:1000}.question-note{min-height:72px;resize:vertical}.question-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:14px;flex-wrap:wrap}.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#111827;color:#fff;border-radius:18px;padding:13px 16px;font-weight:1000;z-index:60;opacity:0;pointer-events:none;transition:.25s;box-shadow:0 20px 40px rgba(0,0,0,.25)}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.bottom-nav{position:fixed;left:10px;right:10px;bottom:calc(10px + var(--safe-bottom));z-index:30;background:rgba(255,255,255,.9);border:1px solid var(--line);border-radius:24px;padding:8px;box-shadow:var(--shadow);backdrop-filter:blur(16px);display:grid;grid-template-columns:repeat(5,1fr)}body.dark .bottom-nav{background:rgba(17,24,39,.92)}.bottom-link{text-decoration:none;color:var(--muted);display:grid;place-items:center;gap:2px;border-radius:18px;padding:7px;font-weight:1000;font-size:18px}.bottom-link span{font-size:11px}.bottom-link.active{background:linear-gradient(135deg,rgba(37,99,235,.14),rgba(124,58,237,.14));color:var(--brand)}.mobile-only{display:none}@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}body.reduce-motion *,body.reduce-motion *::before,body.reduce-motion *::after{animation:none!important;transition:none!important}@media(max-width:1120px){.app-shell{grid-template-columns:1fr;grid-template-areas:"top" "main"}.sidebar{position:fixed;left:12px;top:86px;bottom:86px;width:min(330px,calc(100vw - 24px));height:auto;z-index:40;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);transform:translateX(calc(-100% - 30px));transition:.25s}.sidebar.open{transform:translateX(0)}.mobile-only{display:grid}.hero{grid-template-columns:1fr}.campus-visual{min-height:280px}.mini-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.story-map,.zone-grid,.quest-grid,.tree-grid,.badge-grid,.shop-grid,.teacher-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bank-tools{grid-template-columns:1fr 1fr}.main{padding:16px 14px 110px}.topbar{padding:10px 12px}.player-chip{display:none}.brand-mark{width:44px;height:44px}}@media(max-width:680px){.brand small{display:none}.top-hud{gap:5px}.hud-chip{padding:7px 9px}.hero{min-height:unset;padding:18px}.hero h1{font-size:30px}.hero p{font-size:15px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:10px}.stat-card{padding:14px}.stat-card strong{font-size:28px}.panel{padding:16px;border-radius:22px}.section-head{align-items:stretch;flex-direction:column}.mini-grid,.story-map,.zone-grid,.quest-grid,.tree-grid,.badge-grid,.shop-grid,.teacher-grid,.settings-grid,.report-grid{grid-template-columns:1fr}.bank-tools{grid-template-columns:1fr}.arcade-options{grid-template-columns:1fr}.memory-grid{grid-template-columns:repeat(3,1fr)}.question-row{grid-template-columns:1fr}.question-card{padding:18px;border-radius:22px}.topbar{height:70px}.app-shell{grid-template-rows:70px 1fr}.sidebar{top:78px}.campus-visual{min-height:240px}.floating-campus{width:86%}.tree-stage{font-size:82px}}@media print{.topbar,.sidebar,.bottom-nav,.hero,.button-row,.primary-btn,.secondary-btn,.ghost-btn{display:none!important}.app-shell{display:block}.main{padding:0}.panel{box-shadow:none;border:1px solid #ddd;break-inside:avoid}.question-list,.arcade-screen{max-height:none;overflow:visible}}


/* ===== v7 professional polish + overflow fix ===== */
:root{--bg:#eef4ff;--panel:#ffffff;--panel2:#f7faff;--line:#d9e5f5;--shadow:0 20px 55px rgba(15,23,42,.08),0 6px 18px rgba(15,23,42,.05);--brand:#2563eb;--accent:#7c3aed;--text:#0f172a;--muted:#52607a}
body{background:radial-gradient(circle at top left,rgba(99,102,241,.10),transparent 24%),radial-gradient(circle at top right,rgba(14,165,233,.10),transparent 22%),linear-gradient(180deg,#f8fbff 0%,#eef4ff 100%)}
body.dark{--bg:#09111f;--panel:#0f172a;--panel2:#131d31;--line:#243145;--shadow:0 22px 60px rgba(2,6,23,.52);--text:#e5eefc;--muted:#9fb0cb}
.app-shell{background:transparent}
.topbar{backdrop-filter:blur(14px);background:rgba(255,255,255,.82);border-bottom:1px solid var(--line);box-shadow:0 10px 35px rgba(15,23,42,.05)}
body.dark .topbar{background:rgba(9,17,31,.84)}
.sidebar{overflow-x:hidden;padding-right:8px;background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(247,250,255,.9));backdrop-filter:blur(12px)}
body.dark .sidebar{background:linear-gradient(180deg,rgba(12,19,35,.92),rgba(15,23,42,.95))}
.sidebar::-webkit-scrollbar,.question-list::-webkit-scrollbar{width:10px}.sidebar::-webkit-scrollbar-thumb,.question-list::-webkit-scrollbar-thumb{background:#c6d5ee;border-radius:999px;border:2px solid transparent;background-clip:content-box}
body.dark .sidebar::-webkit-scrollbar-thumb,body.dark .question-list::-webkit-scrollbar-thumb{background:#32425f;border-radius:999px;border:2px solid transparent;background-clip:content-box}
.profile-card{padding:18px 16px 14px;overflow:hidden}
.avatar-ring{width:88px;height:88px;border-radius:28px;margin:0 auto 12px;background:linear-gradient(135deg,rgba(37,99,235,.18),rgba(124,58,237,.16));box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 10px 24px rgba(37,99,235,.14)}
#playerName{height:48px;border-radius:16px;background:var(--panel2);border:1px solid var(--line);padding:0 14px;font-size:15px}
.avatar-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%;overflow:hidden}
.avatar-picker button{min-width:0;width:100%;aspect-ratio:1/1;border-radius:18px;border:1px solid var(--line);background:linear-gradient(180deg,var(--panel),var(--panel2));display:grid;place-items:center;font-size:28px;line-height:1;box-shadow:0 4px 14px rgba(15,23,42,.05);padding:0;overflow:hidden}
.avatar-picker button.active{border-color:rgba(37,99,235,.6);box-shadow:0 0 0 3px rgba(37,99,235,.15),0 10px 20px rgba(37,99,235,.12);transform:translateY(-1px)}
.profile-mini{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.profile-mini span{display:block;text-align:center;padding:12px;border-radius:16px;background:var(--panel2);border:1px solid var(--line)}
.nav-list{gap:8px}.nav-item{border-radius:16px;padding:12px 14px}.nav-item:hover{background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(124,58,237,.08));color:var(--brand)}
.hero{background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(242,247,255,.95));border:1px solid rgba(255,255,255,.6)}
body.dark .hero{background:linear-gradient(135deg,rgba(15,23,42,.95),rgba(17,24,39,.98))}
.hero h1{max-width:15ch;font-size:clamp(32px,4vw,52px);letter-spacing:-.03em}
.hero p{max-width:64ch;font-size:16px;color:var(--muted)}
.panel,.stat-card,.tree-card,.mini-card,.zone-card,.quest-card,.badge-card,.shop-card,.question-row,.question-card,.toggle-row,.arcade-screen,.arcade-question,.challenge-box{box-shadow:var(--shadow)}
.stat-card{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line)}
.stat-card strong{font-size:44px;letter-spacing:-.03em}
.section-head h2{letter-spacing:-.02em}
.section-note{color:var(--muted);font-size:15px}
.chapter-card,.mini-card,.zone-card,.quest-card,.tree-card,.badge-card,.shop-card{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line)}
.chapter-card.locked,.mini-card.locked{background:linear-gradient(180deg,rgba(148,163,184,.16),rgba(226,232,240,.6))}
body.dark .chapter-card.locked,body.dark .mini-card.locked{background:linear-gradient(180deg,rgba(100,116,139,.18),rgba(51,65,85,.35))}
.mini-card{min-height:236px;border-radius:22px}.mini-card .icon{font-size:42px}.mini-card h3{line-height:1.25;margin:10px 0 8px;font-size:20px}
.unlock-req{line-height:1.45}
.lock-ribbon{box-shadow:0 8px 18px rgba(15,23,42,.12)}
.arcade-screen{border-radius:26px}
.arcade-question,.challenge-box,.tree-card,.zone-card,.quest-card,.question-row{border-radius:22px}
button.primary-btn,button.secondary-btn,button.ghost-btn,.play-zone{transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
button.primary-btn:hover,button.secondary-btn:hover,button.ghost-btn:hover,.play-zone:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(37,99,235,.15)}
#storyMap{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.story-map .chapter-card{padding:18px;border-radius:22px;position:relative;overflow:hidden}
.story-map .chapter-card::after{content:'';position:absolute;inset:auto -20% -35% auto;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.12),transparent 62%)}
#miniGameGrid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
#zoneGrid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
#questGrid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
#reportGrid,#teacherGrid,#settingsGrid,#treePanel .tree-grid,#badgesPanel .badge-grid,#shopPanel .shop-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.bank-tools input,.bank-tools select,textarea.large-note,.question-note{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px 14px;color:var(--text)}
.bottom-nav{background:rgba(255,255,255,.92);border:1px solid var(--line);box-shadow:0 18px 38px rgba(15,23,42,.1)}
body.dark .bottom-nav{background:rgba(9,17,31,.95)}
.bottom-link{min-height:58px}
@media(max-width:1120px){.sidebar{padding-right:6px}.profile-card{max-width:100%}.avatar-picker button{font-size:26px}}
@media(max-width:680px){.profile-card{padding:16px 12px}.avatar-ring{width:80px;height:80px}.avatar-picker{gap:8px}.avatar-picker button{border-radius:16px;font-size:24px}.mini-card{min-height:214px}.hero h1{max-width:100%}.topbar{backdrop-filter:none}}


/* ===== v8 audience modes + guided route ===== */
.audience-box{margin-top:18px;padding:14px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(239,246,255,.8));box-shadow:0 14px 30px rgba(15,23,42,.05)}
body.dark .audience-box{background:linear-gradient(135deg,rgba(15,23,42,.72),rgba(30,41,59,.8))}
.audience-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.audience-head small{color:var(--muted);font-weight:700}.audience-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.audience-card{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:18px;padding:12px;text-align:left;cursor:pointer;display:grid;gap:5px;min-height:116px}.audience-card span{font-size:28px}.audience-card strong{font-size:15px}.audience-card small{color:var(--muted);line-height:1.35}.audience-card.active{border-color:rgba(37,99,235,.6);box-shadow:0 0 0 3px rgba(37,99,235,.12);background:linear-gradient(135deg,rgba(37,99,235,.1),var(--panel))}
.progress-hub{position:relative;overflow:hidden}.progress-hub::before{content:'';position:absolute;right:-80px;top:-100px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(124,58,237,.14),transparent 70%);pointer-events:none}.rank-layout{display:grid;grid-template-columns:1fr 1.35fr;gap:16px;align-items:stretch}.rank-card,.next-unlock{border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,var(--panel),var(--panel2));padding:18px;display:flex;gap:14px;align-items:center}.rank-medal{width:76px;height:76px;display:grid;place-items:center;border-radius:24px;background:linear-gradient(135deg,rgba(245,158,11,.16),rgba(37,99,235,.12));font-size:38px;flex:0 0 auto}.rank-card strong,.next-unlock strong{font-size:22px;display:block}.rank-card p,.next-unlock p{margin:6px 0 0;color:var(--muted);line-height:1.45}.next-unlock{align-items:flex-start;flex-direction:column}.next-unlock span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--brand);font-weight:1000}.next-unlock small{color:var(--muted);font-weight:800}.roadmap{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(126px,1fr);gap:10px;overflow:auto;padding:14px 2px 2px;margin-top:16px}.road-step{border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--text);padding:12px 10px;cursor:pointer;display:grid;gap:4px;text-align:left;min-height:102px}.road-step span{font-size:24px}.road-step b{font-size:18px}.road-step small{font-size:12px;line-height:1.25;color:var(--muted)}.road-step.done{background:linear-gradient(135deg,rgba(22,163,74,.13),var(--panel));border-color:rgba(22,163,74,.35)}.road-step.open{background:linear-gradient(135deg,rgba(37,99,235,.13),var(--panel));border-color:rgba(37,99,235,.35)}.road-step.locked{opacity:.62;filter:grayscale(.2);cursor:not-allowed}
body.audience-cocuk .hero h1::after{content:' 🎈';font-size:.72em}body.audience-cocuk .mini-card .icon,body.audience-cocuk .avatar-picker button{filter:saturate(1.16)}body.audience-genc .hero{background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(124,58,237,.10)),var(--panel)}body.audience-genc .lock-ribbon{background:linear-gradient(135deg,#111827,#2563eb)}body.audience-yetiskin .hero,body.audience-yetiskin .audience-box{background:linear-gradient(135deg,var(--panel),var(--panel2))}body.audience-yetiskin .mini-card .icon{font-size:36px}body.audience-yetiskin .hero h1{letter-spacing:-.02em}
@media(max-width:900px){.rank-layout{grid-template-columns:1fr}.audience-grid{grid-template-columns:1fr}.audience-head{display:block}.audience-head small{display:block;margin-top:6px}.roadmap{grid-auto-columns:minmax(118px,45%)}}
@media(max-width:520px){.audience-card{min-height:auto}.rank-card,.next-unlock{border-radius:20px;padding:14px}.rank-medal{width:62px;height:62px;font-size:32px}.road-step{min-height:96px}.progress-hub .section-head{gap:8px}}


/* ===== v9 responsive fix: link panels + no horizontal overflow ===== */
html,body{width:100%;max-width:100%;overflow-x:hidden}
body{overscroll-behavior-x:none}.app-shell{width:100%;max-width:100vw;grid-template-columns:minmax(260px,300px) minmax(0,1fr);overflow-x:hidden}.main{min-width:0;max-width:100%;width:100%;overflow-x:hidden}.topbar,.sidebar,.panel,.stats-grid,.progress-hub,.hero{min-width:0;max-width:100%}.topbar{width:100%;overflow:hidden}.brand{min-width:0}.brand span:last-child{min-width:0}.brand strong,.brand small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-hud{min-width:0;flex-shrink:0}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.stat-card{min-width:0}.stat-card strong{overflow-wrap:anywhere}.bottom-nav{display:none}.roadmap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}.road-step{min-width:0}.rank-layout,.audience-grid,.mini-grid,.zone-grid,.quest-grid,.story-map,.tree-grid,.badge-grid,.shop-grid,.report-grid,.teacher-grid,.settings-grid{min-width:0}.avatar-picker{max-width:100%;overflow:hidden}.avatar-picker button{max-width:100%;min-width:0;line-height:1;overflow:hidden}.profile-card{max-width:100%;overflow:hidden}.question-modal{max-width:100vw}.arcade-head,.section-head{min-width:0}.arcade-head>*,.section-head>*{min-width:0}.arcade-options button,.option-btn{overflow-wrap:anywhere}
@media(max-width:1280px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1fr}.campus-visual{min-height:300px}.main{padding:20px 20px 118px}}
@media(max-width:1120px){.app-shell{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:70px 1fr;grid-template-areas:"top" "main"}.main{padding:16px 14px calc(112px + var(--safe-bottom));max-width:100vw}.bottom-nav{display:grid}.sidebar{position:fixed;left:12px;top:82px;bottom:calc(88px + var(--safe-bottom));width:min(330px,calc(100vw - 24px));height:auto;z-index:45;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);transform:translateX(calc(-100% - 32px));transition:.25s;overflow-x:hidden}.sidebar.open{transform:translateX(0)}.mobile-only{display:grid}.topbar{height:70px;padding:8px 10px}.brand-mark{width:42px;height:42px;border-radius:15px}.brand strong{font-size:16px}.brand small{font-size:11px}.player-chip{display:none}.hud-chip{padding:7px 9px}.hero{grid-template-columns:1fr}.story-map,.mini-grid,.zone-grid,.quest-grid,.tree-grid,.badge-grid,.shop-grid,.teacher-grid,.settings-grid,.report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat-card{padding:14px;border-radius:20px}.stat-card strong{font-size:30px}.hero h1{font-size:clamp(28px,8vw,38px);max-width:100%;line-height:1.03}.hero p{font-size:14px}.panel{padding:16px;border-radius:22px}.audience-grid{grid-template-columns:1fr}.rank-layout{grid-template-columns:1fr}.bottom-nav{left:8px;right:8px;bottom:calc(8px + var(--safe-bottom));border-radius:22px}.bottom-link{font-size:18px;padding:8px 4px;min-width:0}.bottom-link span{font-size:10px}.roadmap{grid-auto-columns:minmax(108px,42%)}.bank-tools{grid-template-columns:1fr}.arcade-options{grid-template-columns:1fr}.memory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.question-row{grid-template-columns:1fr}.section-head{flex-direction:column;align-items:stretch}.button-row{width:100%}.button-row .secondary-btn{flex:1}}
@media(max-width:560px){.main{padding-left:10px;padding-right:10px}.top-hud .hud-chip{font-size:12px}.stats-grid,.story-map,.mini-grid,.zone-grid,.quest-grid,.tree-grid,.badge-grid,.shop-grid,.teacher-grid,.settings-grid,.report-grid{grid-template-columns:1fr}.profile-card{padding:14px}.avatar-ring{width:78px;height:78px;font-size:40px}.avatar-picker{gap:7px}.avatar-picker button{border-radius:15px;font-size:23px}.bottom-link{min-height:54px}.campus-visual{display:none}.hero{min-height:auto}.hero-actions .primary-btn,.hero-actions .secondary-btn{width:100%}.rank-card,.next-unlock{padding:14px}.rank-medal{width:60px;height:60px;font-size:30px}}


/* ===== v10 fixed desktop menu + no horizontal overflow ===== */
@media (min-width:1121px){
  html,body{height:100%;max-height:100%;overflow:hidden!important;}
  body{position:relative;}
  .app-shell{
    height:100vh!important;
    min-height:100vh!important;
    max-height:100vh!important;
    display:grid!important;
    grid-template-columns:minmax(270px,300px) minmax(0,1fr)!important;
    grid-template-rows:76px minmax(0,1fr)!important;
    grid-template-areas:"top top" "side main"!important;
    overflow:hidden!important;
    width:100vw!important;
    max-width:100vw!important;
  }
  .topbar{
    grid-area:top!important;
    position:relative!important;
    top:auto!important;
    z-index:50!important;
    width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  .sidebar{
    grid-area:side!important;
    position:relative!important;
    top:auto!important;
    left:auto!important;
    bottom:auto!important;
    transform:none!important;
    width:300px!important;
    max-width:300px!important;
    height:calc(100vh - 76px)!important;
    max-height:calc(100vh - 76px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:24px!important;
    align-self:stretch!important;
    z-index:20!important;
  }
  .main{
    grid-area:main!important;
    height:calc(100vh - 76px)!important;
    max-height:calc(100vh - 76px)!important;
    min-width:0!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:24px 28px 80px!important;
    scroll-behavior:smooth;
  }
  .main::-webkit-scrollbar{width:12px}
  .main::-webkit-scrollbar-thumb{background:#c6d5ee;border-radius:999px;border:3px solid transparent;background-clip:content-box}
  body.dark .main::-webkit-scrollbar-thumb{background:#334155;border:3px solid transparent;background-clip:content-box}
  .main > *{max-width:100%;min-width:0;}
  .hero,.stats-grid,.progress-hub,.panel,.story-map,.mini-grid,.zone-grid,.quest-grid,.tree-grid,.badge-grid,.shop-grid,.report-grid,.teacher-grid,.settings-grid{max-width:100%;min-width:0;}
  .stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  .bottom-nav{display:none!important;}
}

@media (max-width:1120px){
  html,body{height:auto;max-height:none;overflow-x:hidden!important;overflow-y:auto!important;}
  .app-shell{height:auto!important;max-height:none!important;overflow-x:hidden!important;overflow-y:visible!important;}
  .main{height:auto!important;max-height:none!important;overflow:visible!important;}
  .sidebar{overflow-y:auto!important;overflow-x:hidden!important;}
}

@media (max-width:760px){
  .topbar{position:sticky!important;top:0!important;}
  .main{padding-bottom:calc(116px + var(--safe-bottom))!important;}
}


/* ===== v11: Akıl Koçu + professional guided path ===== */
.coach-panel{background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(244,248,255,.98));}
body.dark .coach-panel{background:linear-gradient(135deg,rgba(15,23,42,.98),rgba(17,24,39,.98));}
.coach-layout{display:grid;grid-template-columns:1.3fr .9fr .9fr;gap:16px;align-items:stretch}.coach-card{border:1px solid var(--line);background:linear-gradient(180deg,var(--panel),var(--panel2));border-radius:24px;padding:18px;box-shadow:var(--shadow)}.main-coach{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center}.coach-avatar{width:86px;height:86px;border-radius:26px;background:linear-gradient(135deg,rgba(37,99,235,.18),rgba(124,58,237,.16));display:grid;place-items:center;font-size:42px;box-shadow:inset 0 1px 0 rgba(255,255,255,.75)}.coach-label{display:inline-flex;background:rgba(37,99,235,.10);color:var(--brand);border-radius:999px;padding:6px 10px;font-weight:1000;font-size:12px;letter-spacing:.04em;text-transform:uppercase}.coach-card h3{margin:10px 0 8px;font-size:28px;line-height:1.1}.coach-card p{color:var(--muted);line-height:1.55}.coach-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.skill-bars{display:grid;gap:12px;margin-top:14px}.skill-row{display:grid;gap:7px}.skill-row>div:first-child{display:flex;justify-content:space-between;gap:10px;align-items:center}.skill-row small{color:var(--muted);font-weight:900}.coach-checklist{display:grid;gap:10px;margin-top:14px}.check-item{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;border:1px solid var(--line);background:var(--panel2);border-radius:16px;padding:11px}.check-item.done{background:rgba(22,163,74,.11);border-color:rgba(22,163,74,.28)}.check-item small{color:var(--muted);font-weight:900}.milestone-lane{display:flex;gap:10px;margin-top:16px;overflow-x:auto;padding:4px 4px 12px;scrollbar-width:thin}.mile{min-width:170px;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:18px;padding:12px;text-align:left;cursor:pointer;box-shadow:0 8px 18px rgba(15,23,42,.05)}.mile span{display:block;font-size:24px;margin-bottom:6px}.mile b{display:block;font-size:13px;line-height:1.25}.mile.locked{opacity:.58;filter:grayscale(.45);cursor:not-allowed}.mile.done{border-color:rgba(22,163,74,.35);background:rgba(22,163,74,.10)}.mile.open{border-color:rgba(37,99,235,.35);background:rgba(37,99,235,.08)}@media(max-width:1120px){.coach-layout{grid-template-columns:1fr 1fr}.main-coach{grid-column:1/-1}}@media(max-width:680px){.coach-layout{grid-template-columns:1fr}.main-coach{grid-template-columns:1fr;text-align:left}.coach-avatar{width:72px;height:72px;font-size:36px}.coach-card h3{font-size:23px}.milestone-lane{margin-left:-4px;margin-right:-4px}.mile{min-width:148px}.bottom-nav{grid-template-columns:repeat(5,1fr)}}
