*{box-sizing:border-box;margin:0;padding:0}html,body,#app{color:#e8ecff;background:#0b1026;width:100%;height:100%;font-family:system-ui,sans-serif;overflow:hidden}canvas{display:block}:root{--ink:#eef2fa;--muted:#b6c4d8;--gold:#f1cf91;--panel:#101d30;--line:#637a96;--radius:22px}button,select,input{font:inherit}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.lesson-overlay{z-index:36;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:radial-gradient(at 50% 20%,#29476388,#0000 70%),#07111ce8;place-items:center;padding:24px;display:grid;position:fixed;inset:0;overflow-y:auto}.lesson-card{border-radius:var(--radius);width:min(100%,600px);color:var(--ink);background:radial-gradient(at 0 0,#40546b33,#0000 70%),linear-gradient(145deg,#1b2c40f5,#0d1929fa);border:1px solid #b8c9d338;flex-direction:column;gap:18px;padding:clamp(24px,5vw,44px);display:flex;box-shadow:inset 0 1px #ffffff0a,0 24px 100px #0006}.lesson-card h1{letter-spacing:-.02em;font:500 clamp(26px,4vw,38px)/1.15 Georgia,serif}.lesson-card p{line-height:1.6}.lesson-eyebrow{color:var(--gold);text-transform:uppercase;letter-spacing:.15em;font-size:11px;font-weight:650}.lesson-stats{color:var(--muted);font-size:13px}.lesson-actions{flex-wrap:wrap;gap:10px;display:flex}.lesson-button{min-height:44px;color:var(--ink);cursor:pointer;background:#1c3046;border:1px solid #7891aa66;border-radius:11px;padding:10px 16px;transition:background .15s,border-color .15s}.lesson-button:hover{border-color:var(--gold);background:#2c455f}.lesson-button.primary{background:var(--gold);color:#1a2532;border-color:var(--gold);font-weight:650}.lesson-guidance{z-index:14;pointer-events:none;text-align:center;background:linear-gradient(90deg,#0b172480,#0b1724e8,#0b172480);border:1px solid #9aafc31c;border-radius:12px;width:min(76vw,740px);padding:8px 14px;position:fixed;top:64px;left:50%;transform:translate(-50%)}.lesson-objective{color:var(--muted);font-size:13px;line-height:1.45}.lesson-feedback{color:var(--gold);min-height:20px;margin-top:4px;font-size:14px}.lesson-setting{color:var(--muted);gap:8px;font-size:14px;display:grid}.lesson-setting select,.lesson-setting input{min-height:44px;color:var(--ink);border:1px solid var(--line);background:#102238;border-radius:8px;padding:8px}@media (width<=600px){.lesson-overlay{padding:14px}.lesson-guidance{width:86vw;top:58px}.lesson-objective{font-size:12px}.lesson-actions .lesson-button{flex:45%}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}html[data-reduced-motion=true] *,html[data-reduced-motion=true] :before,html[data-reduced-motion=true] :after{transition:none!important;animation:none!important}.lesson-pause{z-index:16;min-height:36px;padding:6px 12px;font-size:12px;position:fixed;top:122px;right:18px}.scene-icon{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#102033b8;border:1px solid #9aafc333;border-radius:14px;place-items:center;width:44px;height:44px;padding:8px;transition:background .15s,border-color .15s;display:grid;box-shadow:inset 0 1px #ffffff0a,0 4px 16px #0002}.scene-icon:hover{background:#23384be8;border-color:#f1cf9180}.scene-icon img{opacity:.9}.lesson-button.primary:hover{background:#f8dfb1;border-color:#f8dfb1}