:root{font-family:ui-rounded,SF Pro Rounded,Nunito,system-ui,-apple-system,sans-serif;color:#f9f4e7;background:#07152f;font-synthesis:none;text-rendering:optimizeLegibility;--navy: #07152f;--navy-soft: #10264e;--panel: rgba(18, 42, 81, .86);--cream: #fff7df;--gold: #f6d98a;--gold-deep: #d6a34f;--muted: #b9c4db;--danger: #ff8d8d}*{box-sizing:border-box}html{min-height:100%;background:var(--navy)}body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible{outline:3px solid #ffdf78;outline-offset:3px}.library-page,.auth-page,.player-screen{position:relative;min-height:100vh;min-height:100dvh;overflow:hidden;background:radial-gradient(circle at 80% -5%,rgba(90,120,186,.38),transparent 36rem),linear-gradient(160deg,#0c2146,#07152f 55%,#050e22)}.library-page{padding:max(24px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));overflow-y:auto}.stars{position:absolute;inset:0;pointer-events:none;opacity:.75;overflow:hidden}.stars i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff4be;box-shadow:0 0 10px #fff4be}.stars i:nth-child(3n){width:5px;height:5px;opacity:.65}.stars i:nth-child(1){left:8%;top:7%}.stars i:nth-child(2){left:20%;top:19%}.stars i:nth-child(3){left:35%;top:5%}.stars i:nth-child(4){left:47%;top:15%}.stars i:nth-child(5){left:63%;top:8%}.stars i:nth-child(6){left:78%;top:18%}.stars i:nth-child(7){left:92%;top:9%}.stars i:nth-child(8){left:13%;top:35%}.stars i:nth-child(9){left:29%;top:29%}.stars i:nth-child(10){left:72%;top:37%}.stars i:nth-child(11){left:88%;top:31%}.stars i:nth-child(12){left:4%;top:55%}.stars i:nth-child(13){left:23%;top:65%}.stars i:nth-child(14){left:48%;top:51%}.stars i:nth-child(15){left:68%;top:62%}.stars i:nth-child(16){left:94%;top:57%}.stars i:nth-child(17){left:11%;top:82%}.stars i:nth-child(18){left:38%;top:90%}.stars i:nth-child(19){left:58%;top:78%}.stars i:nth-child(20){left:83%;top:88%}.stars i:nth-child(21){left:17%;top:48%}.stars i:nth-child(22){left:53%;top:32%}.stars i:nth-child(23){left:76%;top:51%}.stars i:nth-child(24){left:31%;top:76%}.stars i:nth-child(25){left:97%;top:76%}.stars i:nth-child(26){left:42%;top:43%}.stars i:nth-child(27){left:67%;top:94%}.stars i:nth-child(28){left:2%;top:22%}.library-header,.library-page>section,.library-page>footer,.library-page>.demo-pill,.library-page>.error-banner{position:relative;z-index:1;max-width:1080px;margin-left:auto;margin-right:auto}.library-header{display:flex;justify-content:space-between;align-items:center}.brand-row{display:flex;align-items:center;gap:12px}.mini-logo{display:grid;place-items:center;width:52px;height:52px;color:#3b2b0b;background:var(--gold);border-radius:17px;box-shadow:0 10px 35px #00000040}.mini-logo svg{width:29px}.eyebrow{margin:0 0 2px;color:var(--gold);font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.library-header h1{margin:0;font-size:clamp(1.75rem,6vw,2.35rem);line-height:1;letter-spacing:-.04em}.icon-button{display:inline-grid;place-items:center;width:50px;height:50px;border:0;border-radius:50%;color:var(--cream);background:#ffffff14;cursor:pointer}.icon-button:hover{background:#ffffff29}.settings-button{opacity:.74}.welcome{display:flex;align-items:center;gap:12px;margin-top:30px;padding:16px 19px;border:1px solid rgba(246,217,138,.24);border-radius:20px;color:#dce5f5;background:#0b1f42ad;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.welcome svg{flex:0 0 auto;color:var(--gold)}.welcome p{margin:0;font-size:.98rem;line-height:1.45}.demo-pill{width:fit-content;margin-top:14px;padding:7px 12px;color:#132341;background:var(--gold);border-radius:999px;font-size:.78rem;font-weight:800}.story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:22px}.story-card{position:relative;border:1px solid rgba(255,255,255,.12);border-radius:23px;overflow:hidden;background:#0f264cdb;box-shadow:0 18px 40px #0003;cursor:pointer;transition:transform .2s ease}.story-card:active{transform:scale(.98)}.story-main{width:100%;padding:0;border:0;color:inherit;text-align:left;background:none;cursor:pointer}.cover-frame{position:relative;aspect-ratio:1;overflow:hidden;background:#142d5a}.cover-frame img{width:100%;height:100%;object-fit:cover}.cover-placeholder{display:grid;place-items:center;width:100%;height:100%;color:var(--gold);background:radial-gradient(circle,#284c83,#10264e)}.cover-placeholder svg{width:35%;height:35%;opacity:.7}.offline-badge{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:4px;padding:6px 8px;color:#113625;background:#c7f2c8;border-radius:999px;font-size:.65rem;font-weight:900;text-transform:uppercase;box-shadow:0 4px 14px #00000038}.offline-badge svg{width:13px;height:13px}.story-copy{padding:14px 46px 16px 14px;min-height:91px}.story-copy h2{margin:0 0 8px;display:-webkit-box;overflow:hidden;font-size:1.03rem;line-height:1.18;letter-spacing:-.02em;-webkit-line-clamp:2;-webkit-box-orient:vertical}.story-copy span{color:var(--muted);font-size:.78rem}.download-button{position:absolute;right:9px;bottom:12px;display:grid;place-items:center;width:38px;min-height:38px;padding:0;border:0;border-radius:13px;color:var(--gold);background:#ffffff14;cursor:pointer}.download-button svg{width:20px}.download-button.downloading{width:auto;padding:0 8px;gap:2px;font-size:.62rem}.download-button.ready{color:#b5c5de}.download-button.error{color:var(--danger)}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.library-loading,.empty-library{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:260px;gap:12px;color:var(--muted);text-align:center}.library-loading{flex-direction:row}.empty-library svg{width:58px;height:58px;color:var(--gold)}.empty-library h2{margin:8px 0 0;color:var(--cream)}.empty-library p{margin:0;max-width:300px}.library-page footer{padding:36px 0 6px;color:#8e9dbb;text-align:center;font-size:.84rem}.library-page footer span{color:#e78686}.modal-backdrop{position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:20px;background:#020917cc;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.modal{position:relative;width:min(100%,390px);padding:36px 28px 28px;border:1px solid rgba(255,255,255,.14);border-radius:28px;text-align:center;background:#10264e;box-shadow:0 30px 90px #00000080}.modal-close{position:absolute;top:12px;right:12px}.modal-icon{width:44px;height:44px;margin-bottom:14px;color:var(--gold)}.modal h2{margin:8px 0 18px;font-size:1.7rem}.math-question{margin-bottom:12px;font-size:2rem;font-weight:900}.answer-input{width:130px!important;margin:0 auto 14px;text-align:center;font-size:1.8rem!important}.primary-button,.secondary-button{display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:54px;padding:0 22px;border:0;border-radius:16px;color:#1d2941;background:var(--gold);font-weight:900;cursor:pointer;box-shadow:0 10px 28px #f6d98a2b}.primary-button{width:100%}.primary-button:disabled{opacity:.6;cursor:wait}.secondary-button{background:#dbe7ff;box-shadow:none}.text-button{margin-top:17px;border:0;color:var(--gold);background:none;cursor:pointer}.form-error{margin:6px 0 12px;color:#ffc1c1;font-size:.88rem}.form-notice{margin:8px 0;color:#c7f2c8;font-size:.9rem}.error-banner{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:15px;padding:13px 16px;border:1px solid #9b5555;border-radius:15px;color:#ffd7d7;background:#4c222d}.error-banner button{border:0;color:#fff;background:none;text-decoration:underline}.auth-page{display:grid;place-items:center;padding:24px}.auth-card{position:relative;z-index:1;width:min(100%,430px);padding:34px 28px;border:1px solid rgba(255,255,255,.13);border-radius:30px;text-align:center;background:#0e2347de;box-shadow:0 25px 80px #00000059;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.brand-mark{position:relative;display:grid;place-items:center;width:82px;height:82px;margin:0 auto 19px;border-radius:25px;color:#35270c;background:var(--gold)}.brand-mark>svg:first-child{width:42px;height:42px}.brand-mark>svg:last-child{position:absolute;top:-8px;right:-9px;width:27px;color:var(--cream);filter:drop-shadow(0 3px 4px rgba(0,0,0,.35))}.auth-card h1{margin:4px 0;font-size:2.5rem;letter-spacing:-.06em}.auth-subtitle{margin:0 0 28px;color:var(--muted)}.stack-form{display:grid;gap:15px;text-align:left}.stack-form label{display:grid;gap:7px;color:#dfe7f6;font-size:.84rem;font-weight:800}.stack-form input,.inline-form input{width:100%;min-height:52px;padding:0 14px;border:1px solid rgba(255,255,255,.17);border-radius:14px;color:#fff;background:#040f258c}.player-screen{display:grid;place-items:center;padding:max(66px,env(safe-area-inset-top)) 24px max(28px,env(safe-area-inset-bottom));overflow-y:auto}.player-close{position:fixed;z-index:2;top:max(14px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left))}.player-content{width:min(100%,470px);text-align:center}.player-cover{display:grid;place-items:center;width:min(78vw,360px);aspect-ratio:1;margin:0 auto 28px;overflow:hidden;border:1px solid rgba(255,255,255,.18);border-radius:34px;color:var(--gold);background:#132e61;box-shadow:0 28px 65px #0006}.player-cover img{width:100%;height:100%;object-fit:cover}.player-cover>svg{width:30%;height:30%}.player-content h1{margin:5px 0 24px;font-size:clamp(1.7rem,7vw,2.5rem);line-height:1.1}.player-error{color:#ffc1c1}.timeline input{width:100%;accent-color:var(--gold)}.timeline>div{display:flex;justify-content:space-between;color:var(--muted);font-size:.78rem}.player-controls{display:flex;justify-content:center;align-items:center;gap:25px;margin-top:23px}.player-controls button{position:relative;display:grid;place-items:center;width:56px;height:56px;border:0;border-radius:50%;color:#fff;background:#ffffff14;cursor:pointer}.player-controls button small{position:absolute;font-size:.65rem;font-weight:900}.player-controls .play-button{width:82px;height:82px;color:#2b2515;background:var(--gold);box-shadow:0 12px 35px #f6d98a42}.play-button svg{width:34px;height:34px}.admin-page{min-height:100vh;padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(40px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));color:#1d2941;background:#f3f0e8}.admin-header,.admin-panel,.demo-banner,.install-note,.logout-button{max-width:760px;margin-left:auto;margin-right:auto}.admin-header{display:flex;align-items:center;gap:13px;margin-bottom:22px}.admin-header .icon-button{color:#1d2941;background:#fff;box-shadow:0 5px 20px #182a491a}.admin-header h1{margin:1px 0 0;font-size:clamp(1.5rem,5vw,2rem)}.admin-header .eyebrow{color:#8a651f}.admin-panel{margin-bottom:18px;padding:20px;border:1px solid #e5dfd0;border-radius:23px;background:#fff;box-shadow:0 8px 24px #2f30290f}.panel-heading{display:flex;align-items:center;gap:13px;margin-bottom:17px}.panel-heading>svg{flex:0 0 auto;padding:9px;width:44px;height:44px;border-radius:14px;color:#76571e;background:#fff2c9}.panel-heading h2,.compact-panel h2{margin:0 0 3px;font-size:1.08rem}.panel-heading p,.compact-panel p{margin:0;color:#667085;font-size:.85rem}.admin-page .stack-form label{color:#3b4659}.admin-page .stack-form input,.admin-page .inline-form input{border-color:#d8d8d2;color:#192238;background:#fafaf8}.file-field input{position:absolute;width:1px!important;height:1px;opacity:0}.file-field span{display:flex;align-items:center;min-height:52px;padding:0 14px;border:1px dashed #b7b7ac;border-radius:14px;color:#526078;background:#fafaf8;cursor:pointer}.admin-page .primary-button{color:#fff;background:#173869}.demo-banner{margin-bottom:18px;padding:14px 17px;border-radius:16px;color:#54420c;background:#fff0b9}.admin-story-list{display:grid;gap:8px}.admin-story{display:grid;grid-template-columns:48px minmax(70px,1fr) 40px 40px 40px;align-items:center;gap:6px;padding:8px;border-radius:15px;background:#f7f7f4}.admin-story>div{width:48px;height:48px;overflow:hidden;border-radius:11px;background:#dce3ee}.admin-story img{width:100%;height:100%;object-fit:cover}.admin-story p{min-width:0;margin:0}.admin-story strong,.admin-story small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-story small{margin-top:3px;color:#758096}.admin-story .icon-button{width:40px;height:40px;color:#42516b;background:#e9edf3}.admin-story .danger{color:#a23838;background:#fde4e4}.cancel-button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:46px;border:0;color:#566176;background:transparent;cursor:pointer}.inline-form{display:flex;gap:9px}.compact-panel{display:flex;align-items:center;gap:14px}.compact-panel>svg{color:#76571e}.install-note{margin-top:23px;padding:0 5px}.install-note h2{font-size:1rem}.install-note p{color:#5d687a;line-height:1.55}.logout-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;margin-top:22px;border:0;color:#923b3b;background:none;cursor:pointer}.splash{display:grid;place-items:center;align-content:center;gap:18px;min-height:100vh;color:var(--gold);background:var(--navy)}.splash>svg:first-child{width:65px;height:65px}.splash span{color:#fff;font-size:1.5rem;font-weight:900}@media(min-width:700px){.library-page{padding-left:32px;padding-right:32px}.story-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.story-copy{padding:17px 52px 18px 17px}.story-copy h2{font-size:1.15rem}}@media(min-width:980px){.story-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}