:root{--deep-ocean: #071E3D;--abyss: #0A2540;--turquoise: #14C8D4;--lagoon: #0FB5BA;--lagoon-deep: #077F8C;--aqua: #22D3EE;--coral: #FF7A59;--coral-hot: #FF6B5E;--purple: #8B5CF6;--indigo: #6366F1;--sun: #FFD166;--seagrass: #2EC486;--pearl: #E8FBFF;--bg: #E7F6F9;--bg-deep: #D6EFF4;--ink: #093043;--ink-soft: #3E6B77;--line: rgba(9, 48, 67, .12);--glass: rgba(255, 255, 255, .62);--glass-strong: rgba(255, 255, 255, .8);--glass-border: rgba(255, 255, 255, .75);--surface: #FFFFFF;--surface-2: rgba(255, 255, 255, .5);--shape-sm: 14px;--shape-md: 20px;--shape-lg: 24px;--shape-xl: 28px;--shape-hero: 32px;--radius: var(--shape-lg);--radius-sm: var(--shape-sm);--elev-1: 0 2px 10px rgba(7, 30, 61, .08);--elev-2: 0 6px 22px rgba(7, 30, 61, .12);--elev-3: 0 12px 32px rgba(7, 30, 61, .16);--elev-4: 0 18px 44px rgba(7, 30, 61, .22);--shadow: var(--elev-2);--shadow-lift: var(--elev-3);--dur-fast: .15s;--dur-base: .25s;--dur-slow: .4s;--ease-standard: cubic-bezier(.2, 0, 0, 1);--ease-emph: cubic-bezier(.05, .7, .1, 1);--font-display: "Poppins", "Noto Sans Thaana", sans-serif;--font-body: "Nunito", "Noto Sans Thaana", sans-serif;--font-kids: "Baloo 2", "Noto Sans Thaana", cursive;--nav-h: 72px;--rail-w: 92px}[data-theme=dark]{--bg: #071E3D;--bg-deep: #051629;--ink: #E8FBFF;--ink-soft: #8FC3CE;--line: rgba(232, 251, 255, .14);--glass: rgba(13, 42, 68, .55);--glass-strong: rgba(13, 42, 68, .78);--glass-border: rgba(126, 214, 223, .22);--surface: #0D2A44;--surface-2: rgba(13, 42, 68, .45);--elev-1: 0 2px 10px rgba(0, 0, 0, .3);--elev-2: 0 6px 22px rgba(0, 0, 0, .38);--elev-3: 0 12px 32px rgba(0, 0, 0, .46);--elev-4: 0 18px 44px rgba(0, 0, 0, .55)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font-body);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;overscroll-behavior-y:none;transition:background var(--dur-slow) var(--ease-standard),color var(--dur-slow) var(--ease-standard)}[dir=rtl]{font-family:"Noto Sans Thaana",var(--font-body)}h1,h2,h3,.display{font-family:var(--font-display);letter-spacing:-.015em;font-weight:700}button{font-family:inherit;cursor:pointer;border:none}input,select,textarea{font-family:inherit}a{color:inherit;text-decoration:none}.app-shell{min-height:100dvh;padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom) + 12px)}.page{max-width:680px;margin:0 auto;padding:22px 20px 36px;animation:pageIn var(--dur-slow) var(--ease-emph) both}.page-wide{max-width:1080px}@keyframes pageIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@media (min-width: 800px){.bottom-nav{display:none}.app-shell{padding-bottom:28px;padding-inline-start:var(--rail-w)}.page{max-width:880px;padding:30px 32px 44px}.page-wide{max-width:1080px}.grid-3t{grid-template-columns:repeat(3,1fr)!important}.grid-4t{grid-template-columns:repeat(4,1fr)!important}.dash-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;align-items:start}.story-spread{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch}.story-spread .card{margin-bottom:0!important}}.ocean-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;background:radial-gradient(1300px 560px at 85% -12%,rgba(34,211,238,.22),transparent 60%),radial-gradient(1000px 480px at 8% 112%,rgba(139,92,246,.12),transparent 60%),radial-gradient(900px 420px at 45% 118%,rgba(15,181,186,.18),transparent 55%),var(--bg)}.ocean-bg .ray{position:absolute;top:-12%;width:22vw;height:130%;background:linear-gradient(180deg,rgba(255,255,255,.16),transparent 65%);transform:skew(-14deg);filter:blur(6px);animation:rayShift 9s ease-in-out infinite alternate;pointer-events:none}[data-theme=dark] .ocean-bg .ray{background:linear-gradient(180deg,rgba(126,214,223,.1),transparent 65%)}@keyframes rayShift{0%{opacity:.5;transform:skew(-14deg) translate(0)}to{opacity:1;transform:skew(-14deg) translate(3vw)}}.ocean-bg .bubble{position:absolute;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ffffffa6,#ffffff0d);animation:rise linear infinite;opacity:.5}@keyframes rise{0%{transform:translateY(112vh) scale(.75)}to{transform:translateY(-16vh) scale(1.15)}}.card{background:var(--glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:var(--shape-lg);border:1px solid var(--glass-border);box-shadow:var(--elev-2);padding:20px;transition:box-shadow var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard)}@supports not (backdrop-filter: blur(1px)){.card{background:var(--surface)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-display);font-weight:600;font-size:16px;min-height:52px;padding:14px 26px;border-radius:999px;position:relative;overflow:hidden;transition:transform var(--dur-fast) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard),filter var(--dur-fast) var(--ease-standard);-webkit-user-select:none;user-select:none}.btn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:currentColor;opacity:0;transition:opacity var(--dur-fast) var(--ease-standard)}.btn:hover:after{opacity:.08}.btn:active{transform:scale(.96)}.btn:active:after{opacity:.12}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--turquoise),var(--lagoon-deep));color:#fff;box-shadow:0 8px 22px #14c8d461}.btn-coral{background:linear-gradient(135deg,#FF9A76,var(--coral));color:#fff;box-shadow:0 8px 22px #ff7a5961}.btn-ghost{background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--ink);border:1.5px solid var(--line);box-shadow:var(--elev-1)}.btn-block{width:100%}.field{margin-bottom:16px}.field label{display:block;font-weight:800;font-size:13.5px;margin-bottom:7px;color:var(--ink-soft);letter-spacing:.02em}.field input,.field select,.field textarea{width:100%;min-height:52px;padding:14px 18px;border-radius:var(--shape-sm);border:1.5px solid var(--line);background:var(--glass-strong);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--ink);font-size:16px;transition:border-color var(--dur-fast),box-shadow var(--dur-fast)}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--turquoise);box-shadow:0 0 0 4px #14c8d42e}.error-msg{background:#ff6b5e24;color:#e5533d;border:1px solid rgba(255,107,94,.35);border-radius:var(--shape-sm);padding:13px 15px;font-size:14px;font-weight:700;margin-bottom:14px}[data-theme=dark] .error-msg{color:#ff9a88}.ok-msg{background:#2ec48624;color:#1b9a68;border:1px solid rgba(46,196,134,.35);border-radius:var(--shape-sm);padding:13px 15px;font-size:14px;font-weight:700;margin-bottom:14px}[data-theme=dark] .ok-msg{color:#6fe3b4}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:50;height:calc(var(--nav-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--glass-strong);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-top:1px solid var(--glass-border);display:flex;justify-content:space-around;align-items:center;box-shadow:0 -8px 28px #071e3d1a}.nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11.5px;font-weight:800;color:var(--ink-soft);padding:8px 12px;border-radius:16px;transition:color var(--dur-fast),transform var(--dur-fast);min-width:60px;min-height:52px;justify-content:center}.nav-item .nav-icon{font-size:23px;line-height:1;transition:transform var(--dur-base) var(--ease-emph)}.nav-item.active{color:var(--lagoon-deep)}[data-theme=dark] .nav-item.active{color:var(--aqua)}.nav-item.active .nav-icon{transform:translateY(-2px) scale(1.18)}.nav-item:active{transform:scale(.92)}.side-rail{display:none}@media (min-width: 800px){.side-rail{position:fixed;inset-inline-start:0;top:0;bottom:0;z-index:50;width:var(--rail-w);display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 0;background:linear-gradient(180deg,var(--deep-ocean),#0B2E52 60%,#123A5C);box-shadow:6px 0 28px #03142859}.side-rail .rail-logo{width:50px;height:50px;border-radius:15px;margin-bottom:12px;box-shadow:var(--elev-2)}.side-rail .nav-item{color:#9dc3d8;width:72px;padding:10px 0;border-radius:18px;position:relative}.side-rail .nav-item .nav-icon{font-size:25px}.side-rail .nav-item.active{color:#fff;background:linear-gradient(135deg,#14c8d447,#8b5cf63d);box-shadow:inset 0 0 0 1px #7ed6df4d}}.top-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:10px}.top-bar h1{font-size:26px}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:999px;padding:7px 13px;font-weight:800;font-size:13px;box-shadow:var(--elev-1)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.stack{display:flex;flex-direction:column;gap:14px}.row{display:flex;align-items:center;gap:10px}.spread{display:flex;align-items:center;justify-content:space-between}.muted{color:var(--ink-soft)}.small{font-size:13.5px}.spinner{width:44px;height:44px;border-radius:50%;border:4px solid var(--line);border-top-color:var(--turquoise);animation:spin .8s linear infinite;margin:64px auto}@keyframes spin{to{transform:rotate(360deg)}}.wave-divider{height:26px;opacity:.55;margin:8px 0}.hero{border-radius:var(--shape-hero);padding:24px;color:#fff;background:radial-gradient(460px 200px at 92% -24%,rgba(255,255,255,.28),transparent 60%),linear-gradient(120deg,var(--aqua),var(--turquoise) 40%,var(--lagoon-deep) 85%,#0B5568);box-shadow:var(--elev-3);margin-bottom:20px;position:relative;overflow:hidden}.hero h1{color:#fff}.hero .hero-mascot{position:absolute;inset-inline-end:18px;bottom:-8px;font-size:82px;animation:kgFloat 3.2s var(--ease-standard) infinite alternate;filter:drop-shadow(0 8px 12px rgba(0,0,0,.28))}.hero .chip{background:#ffffff38;border-color:#ffffff59;color:#fff}.subject-tile{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:20px 16px;border-radius:var(--shape-lg);background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:var(--elev-2);transition:transform var(--dur-base) var(--ease-emph),box-shadow var(--dur-base);position:relative;overflow:hidden;min-height:52px}.subject-tile:hover{transform:translateY(-4px);box-shadow:var(--elev-3)}.subject-tile:active{transform:scale(.97)}.subject-tile .tile-emoji{font-size:32px}.subject-tile .tile-accent{position:absolute;top:0;left:0;right:0;height:5px}.subject-tile.vivid{border:none;color:#fff;align-items:center;text-align:center;padding:24px 12px;border-radius:var(--shape-xl)}.subject-tile.vivid .muted{color:#ffffffe0}.subject-tile.vivid b{font-family:var(--font-display);font-size:16px}.subject-tile.vivid .tile-emoji{font-size:42px;animation:kgFloat 2.8s var(--ease-standard) infinite alternate;filter:drop-shadow(0 5px 8px rgba(0,0,0,.22))}.kg-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:26px 12px;border-radius:var(--shape-hero);border:none;color:#fff;font-family:var(--font-kids);font-weight:800;font-size:18px;box-shadow:var(--elev-3);transition:transform var(--dur-fast) var(--ease-standard);text-align:center;min-height:52px}.kg-tile:active{transform:scale(.94)}.kg-tile .kg-emoji{font-size:48px;animation:kgFloat 2.6s var(--ease-standard) infinite alternate;filter:drop-shadow(0 6px 8px rgba(0,0,0,.22))}@keyframes kgFloat{0%{transform:translateY(0) rotate(-3deg)}to{transform:translateY(-8px) rotate(3deg)}}.trace-cell{aspect-ratio:1;display:grid;place-items:center;border-radius:var(--shape-md);background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid var(--glass-border);font-family:var(--font-kids);font-size:32px;font-weight:800;color:var(--ink);box-shadow:var(--elev-1);position:relative;transition:transform var(--dur-fast) var(--ease-standard);min-height:52px}.trace-cell:active{transform:scale(.9)}.trace-cell .trace-done{position:absolute;top:-7px;inset-inline-end:-7px;font-size:19px}.note-paper{position:relative;width:100%;border-radius:var(--shape-lg);border:1px solid var(--glass-border);background-color:var(--surface);box-shadow:var(--elev-2);overflow:hidden}.note-paper.tpl-lined{background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 31px,var(--line) 31px,var(--line) 32px)}.note-paper.tpl-grid{background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 23px,var(--line) 23px,var(--line) 24px),repeating-linear-gradient(to right,transparent 0,transparent 23px,var(--line) 23px,var(--line) 24px)}.note-paper.tpl-dotted{background-image:radial-gradient(var(--line) 1.6px,transparent 1.6px);background-size:24px 24px}.note-paper.tpl-cornell{background-image:linear-gradient(to right,transparent 0,transparent 95px,var(--coral) 95px,var(--coral) 97px,transparent 97px),repeating-linear-gradient(to bottom,transparent 0,transparent 31px,var(--line) 31px,var(--line) 32px)}.note-text{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;background:transparent;border:none;outline:none;resize:none;padding:18px 20px;font-family:var(--font-body);color:var(--ink);line-height:32px;z-index:1}.tpl-cornell .note-text{padding-left:110px}.note-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:2;touch-action:none}.note-canvas.pass-through{pointer-events:none}.tool-btn{width:48px;height:48px;display:grid;place-items:center;border-radius:var(--shape-sm);background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1.5px solid var(--line);font-size:18px;transition:transform var(--dur-fast) var(--ease-standard)}.tool-btn:active{transform:scale(.9)}.tool-btn.on{background:linear-gradient(135deg,var(--turquoise),var(--lagoon-deep));border-color:transparent}.color-dot{width:30px;height:30px;border-radius:50%;border:2.5px solid var(--surface);box-shadow:0 0 0 1.5px var(--line)}.color-dot.on{box-shadow:0 0 0 3px var(--turquoise)}@media (prefers-reduced-motion: reduce){.hero-mascot,.kg-emoji,.tile-emoji,.bubble,.ray{animation:none!important}*{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media print{.no-print,.bottom-nav,.side-rail,.ocean-bg{display:none!important}.note-paper{border:none;box-shadow:none;border-radius:0}body{background:#fff}}
