:root{--paper: rgba(248, 240, 224, .93);--paper-solid: #f8f0e0;--ink: #43331f;--ink-soft: #6d5a3e;--gold: #c69a52;--gold-bright: #e8c37a;--warm: #ffb765;--accent: #b8563f;--blue: #2b4a7a;--shadow-lg: 0 18px 48px rgba(12, 8, 4, .5);--shadow-sm: 0 4px 14px rgba(12, 8, 4, .35);--serif: "Songti SC", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;--sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, -apple-system, sans-serif}:root{--sc-navy: #1d2649;--sc-navy-deep: #141a33;--sc-ink: #2c2a3e;--sc-paper: #f3e8cf;--sc-cream: #f8f0dd;--sc-gold: #e6bd66;--sc-brown: #3d2a17;--sc-brown-soft: #6b5740;--sc-accent: #a5642f;--sc-accent-deep: #8d4f1f;--sc-tan: #d4b982;--font-sc: "Fredoka", "Baloo 2", "Chalkboard SE", "PingFang SC", "Hiragino Sans GB", system-ui, sans-serif;--font-reading: "Andika", "Fredoka", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif}:root{--font-text: var(--font-reading);--font-title: var(--font-sc);--font-ui: var(--font-sc);--font-en: var(--font-sc)}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#0d0a07;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}#app{position:relative;width:100vw;height:100vh}#statusbar{position:absolute;top:0;left:0;right:0;height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;gap:16px;background:linear-gradient(180deg,#0a0704c7,#0a070400);pointer-events:none;z-index:5}#statusbar>*{pointer-events:auto}.sb-left{display:flex;align-items:baseline;gap:8px}.brand-mark{font-size:15px}.brand-word{font-family:var(--font-sc);font-size:15px;font-weight:700;letter-spacing:2.4px;color:var(--sc-gold)}.brand-sep{color:#f8f0dd66}.sb-title{font-family:var(--font-title);font-size:20px;letter-spacing:2px;color:var(--gold-bright);text-shadow:0 2px 10px rgba(0,0,0,.7)}.sb-sub{font-size:11px;letter-spacing:1.4px;color:#f0dcb48c;text-transform:uppercase}.sb-center{flex:1;display:flex;justify-content:center}.dots{display:flex;gap:7px;align-items:center}.dot{width:9px;height:9px;border-radius:50%;background:#f0dcb438;border:1px solid rgba(240,220,180,.35);transition:all .3s ease}.dot.active{background:var(--gold-bright);box-shadow:0 0 10px #e8c37ad9;transform:scale(1.25)}.sb-right{display:flex;align-items:center;gap:10px}.counter{display:flex;align-items:center;gap:5px;padding:4px 11px;border-radius:999px;background:#140e0899;border:1px solid rgba(232,195,122,.35);color:var(--gold-bright);font-size:13px;font-variant-numeric:tabular-nums}.star-glyph{font-size:12px;filter:drop-shadow(0 0 6px rgba(255,220,140,.8))}.icon-btn{width:32px;height:32px;border-radius:10px;border:1px solid rgba(232,195,122,.3);background:#140e0894;color:var(--gold-bright);font-size:14px;cursor:pointer;transition:all .2s ease}.icon-btn:hover{background:#c69a5247;transform:translateY(-1px)}.icon-btn.off{opacity:.45}.icon-btn.wide{width:38px;font-family:var(--font-title);font-size:15px;font-weight:700}#article{position:absolute;left:30px;top:74px;bottom:108px;width:clamp(360px,31vw,552px);display:flex;flex-direction:column;padding:30px 34px 24px 32px;border-radius:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23p)' opacity='0.09'/%3E%3C/svg%3E"),repeating-linear-gradient(180deg,rgba(150,116,66,.045) 0px,rgba(150,116,66,.045) 1px,transparent 1px,transparent 5px),repeating-linear-gradient(92deg,rgba(186,152,96,.03) 0px,rgba(186,152,96,.03) 2px,transparent 2px,transparent 9px),radial-gradient(120% 90% at 18% 10%,#fff7e18c,#fff7e100 58%),linear-gradient(168deg,#eee1c6,#e6d6b6 48%,#ddcaa5);border:2px solid #E6D5B8;box-shadow:inset 0 0 26px #e6be6e33,inset 0 1px #fffaee99,0 2px 5px #4e361e14,0 10px 25px #00000026,0 26px 56px #34241424;z-index:6;transition:opacity .4s ease,transform .4s ease}.corner{position:absolute;width:40px;height:40px;pointer-events:none;opacity:.92}.corner svg{width:100%;height:100%;display:block}.corner-tl{top:8px;left:9px}.corner-br{bottom:8px;right:9px;transform:rotate(180deg)}.art-head{padding-bottom:12px;border-bottom:1px solid rgba(165,100,47,.28);margin-bottom:10px}.art-page-label{font-family:var(--font-ui);font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#b87333;margin-bottom:6px}#art-title{margin:0;font-family:var(--font-title);font-size:clamp(26px,1.85vw,30px);font-weight:800;letter-spacing:.5px;line-height:1.3;color:#8b4513}#art-title-en{margin:5px 0 0;font-family:var(--font-ui);font-size:13.5px;letter-spacing:.4px;color:var(--sc-brown-soft)}.art-hint{flex:0 0 100%;margin:0 0 4px;font-family:var(--font-ui);font-size:11.5px;line-height:1.5;text-align:center;text-transform:lowercase;letter-spacing:.2px;color:#a08c75}.art-body{flex:1;overflow-y:auto;padding-right:6px;scrollbar-width:thin}.art-body::-webkit-scrollbar{width:6px}.art-body::-webkit-scrollbar-thumb{background:#96744259;border-radius:3px}.sentence{position:relative;margin:0 0 20px;padding:11px 14px 12px 15px;border-left:3px solid transparent;border-radius:10px;font-family:var(--font-text);font-size:clamp(18px,1.28vw,20px);line-height:1.82;letter-spacing:.2px;color:var(--sc-ink);transition:background .25s ease,border-color .25s ease,transform .2s ease}.sentence ruby{ruby-position:over;-webkit-ruby-position:before}.sentence rt{font-family:var(--font-ui);font-size:.52em;font-weight:500;letter-spacing:.4px;color:var(--sc-accent);opacity:.78;font-feature-settings:"tnum"}.sentence ruby.vocab .word{color:var(--sc-accent-deep)}.sentence:hover{background:#c69a5224}.sentence.active{background:linear-gradient(90deg,#e6bd6666,#e6bd6614);border-left-color:var(--sc-gold);box-shadow:inset 0 0 0 1px #e6bd6666}.word{cursor:pointer;border-radius:4px;border-bottom:2px dotted #C4B097;transition:background .15s ease,color .15s ease,border-color .15s ease}.word:hover{background:#f8d06b47;color:#8b4513;border-bottom-color:#c9973c}.play-chip{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:6px;padding:0;vertical-align:1px;border-radius:50%;border:1px solid rgba(165,100,47,.45);background:#fffdf7e6;color:var(--sc-accent);font-size:10px;line-height:1;cursor:pointer;transition:all .18s ease}.play-chip:hover{background:var(--sc-gold);color:var(--sc-brown);transform:scale(1.1)}.word.reading{background:#f8d06b;color:#8b4513;border-radius:6px;border-bottom-color:transparent;box-shadow:0 0 0 3px #f8d06b,0 1px 2px #8b45132e}.sentence .alt{display:block;margin-top:7px;font-family:var(--font-ui);font-size:14px;line-height:1.5;color:var(--sc-brown-soft)}.art-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:12px;margin-top:8px;border-top:1px solid #E0D3BC}.mini-btn{padding:9px 15px;border-radius:999px;border:1px solid rgba(165,100,47,.5);background:linear-gradient(180deg,#f4e9d3,#e9dcbe);color:var(--sc-brown);font-family:var(--font-ui);font-size:14.5px;font-weight:600;cursor:pointer;box-shadow:0 3px 8px #3d2a1729,0 0 0 3px #fff9ec99 inset;transition:all .2s ease}.mini-btn:hover{transform:translateY(-1px);border-color:var(--sc-accent)}.mini-btn.done{background:linear-gradient(180deg,var(--sc-gold),#d8a94e);color:var(--sc-brown)}.mini-btn.done.checked{background:linear-gradient(180deg,#a9d18a,#86b46a);color:#23361c}.tts-state{font-family:var(--font-ui);font-size:13px;color:var(--sc-brown-soft);width:100%}#controlbar{position:absolute;left:0;right:0;bottom:16px;display:flex;align-items:flex-end;justify-content:space-between;padding:0 22px;gap:12px;pointer-events:none;z-index:6;transition:opacity .5s ease}#controlbar.idle{opacity:.34}#controlbar.idle:hover{opacity:1}.dock-main{margin:0 auto;display:flex;align-items:flex-end;gap:12px;padding:0;background:none;border:none;box-shadow:none;backdrop-filter:none}.dock{display:flex;align-items:flex-end;gap:12px;pointer-events:auto}.dock-main{margin:0 auto}.dock-side{position:absolute;right:22px;bottom:4px}.wood-btn{position:relative;display:inline-flex;padding:4px;border-radius:999px;min-height:46px;border:none;background:repeating-linear-gradient(92deg,#eacc9cfa,#e0be8afa,#f1d6aafa 6px,#dcba86fa 10px);box-shadow:inset 0 1.5px #fffaecd9,inset 0 -2px #7e542a4d,0 8px 16px #3c261238,0 16px 30px #341e0c24;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}.wood-btn .face{display:inline-flex;align-items:center;gap:9px;padding:6px 16px 7px;border-radius:999px;height:100%;background:linear-gradient(180deg,#fffdf7,#f3e9d4);color:#5b3a1c;box-shadow:inset 0 2px 3px #fffffff2,inset 0 -3px 6px #966c3a42}.wood-btn .face-coral{background:linear-gradient(180deg,#f0775f,#d9523c);color:#fffaf0;box-shadow:inset 0 2px 3px #fff6,inset 0 -3px 6px #78281a59}.wood-btn .ic{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;flex:0 0 auto}.wood-btn .ic svg{width:100%;height:100%;fill:none;stroke:#5b3a1c;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 1px rgba(120,84,42,.35))}.wood-btn.wing .ic svg{stroke:#3a8fc4}.wood-btn.again .ic svg{stroke:#c9871a}.wood-btn.quiz .ic svg{stroke:#7a5fc7}.wood-btn.anchor .ic svg{stroke:#fffaf0;filter:drop-shadow(0 1px 1px rgba(120,40,26,.45))}.wood-btn .ic .i-pause .bar{stroke-width:3.4}.wood-btn .ic .i-pause,.wood-btn.playing .ic .i-ear{display:none}.wood-btn.playing .ic .i-pause{display:block}.wood-btn .txt{display:inline-flex;flex-direction:column;align-items:flex-start;line-height:1.16}.wood-btn .lbl{font-size:13.5px;font-weight:700}.wood-btn em{font-style:normal;font-size:9px;letter-spacing:.7px;text-transform:uppercase;color:#5b3a1ccc;font-weight:600}.wood-btn.anchor em{color:#fffaf0d9}.wood-btn.anchor{transform:translateY(-8px);min-height:58px}.wood-btn.anchor .face{padding:7px 20px 8px;gap:11px}.wood-btn.anchor .ic{width:26px;height:26px}.wood-btn.anchor .lbl{font-size:15px}.wood-btn.wing{width:48px;height:48px;min-height:48px;padding:4px;border-radius:50%;justify-content:center}.wood-btn.wing .face{width:100%;height:100%;padding:0;border-radius:50%;justify-content:center}.wood-btn.mid .face{min-width:118px}.wood-btn:hover{transform:translateY(-3px);filter:brightness(1.03);box-shadow:inset 0 1.5px #fffaece6,inset 0 -2px #7e542a4d,0 12px 20px #3c261242,0 24px 44px #341e0c2e}.wood-btn.anchor:hover{transform:translateY(-11px)}.wood-btn:active{transform:translateY(-1px) scale(.97)}.wood-btn.playing .face-coral{background:linear-gradient(180deg,#f5937c,#dd6048)}.wood-btn.playing .face{animation:faceBreath 2.4s ease-in-out infinite}@keyframes faceBreath{0%,to{box-shadow:inset 0 2px 3px #fff6,inset 0 -3px 6px #78281a59,0 0 #e984678c}50%{box-shadow:inset 0 2px 3px #fff6,inset 0 -3px 6px #78281a59,0 0 0 8px #e9846700}}.wood-btn:disabled{opacity:.42;cursor:default;transform:none;filter:saturate(.5)}.chip{width:44px;height:44px;display:inline-flex;padding:4px;border-radius:50%;border:none;background:repeating-linear-gradient(92deg,#eacc9cfa,#e0be8afa,#f1d6aafa 6px);box-shadow:inset 0 1.5px #fffaecd9,inset 0 -2px #7e542a4d,0 8px 16px #3c261238,0 16px 30px #341e0c24;cursor:pointer;transition:transform .16s ease,filter .16s ease}.chip .face{width:100%;height:100%;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(180deg,#fffdf7,#f3e9d4);box-shadow:inset 0 2px 3px #fffffff2,inset 0 -3px 6px #966c3a42}.chip .ic{display:inline-flex;width:20px;height:20px}.chip .ic svg{width:100%;height:100%;fill:none;stroke:#5b3a1c;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.chip:hover{transform:translateY(-2px);filter:brightness(1.04)}.chip.on .face{background:linear-gradient(180deg,#f6d98d,#e0b055)}.chip.on .ic svg{stroke:#4a2f14}.actiondock{position:absolute;right:18px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:7;pointer-events:none}.act-btn{pointer-events:auto;position:relative;width:60px;height:60px;padding:0;border-radius:20px;border:1px solid rgba(255,238,206,.38);background:linear-gradient(180deg,#fffbf04d,#60442847);box-shadow:0 2px 4px #301e0e33,0 10px 24px #26180c42,inset 0 1px #fffaec73;backdrop-filter:blur(8px);cursor:pointer;transition:transform .18s cubic-bezier(.2,.9,.3,1.4),filter .18s ease;filter:drop-shadow(0 6px 14px rgba(10,6,3,.45))}.act-btn img{width:100%;height:100%;display:block}.act-btn:hover{transform:translateY(-3px) scale(1.08);filter:drop-shadow(0 10px 20px rgba(10,6,3,.5)) brightness(1.06)}.act-btn:active{transform:translateY(-1px) scale(1)}.act-btn .act-tip{position:absolute;right:calc(100% + 10px);top:50%;transform:translateY(-50%) scale(.94);padding:5px 10px;border-radius:8px;background:#26180adb;color:#ffeccd;font-size:12px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}.act-btn:hover .act-tip{opacity:1;transform:translateY(-50%) scale(1)}.act-btn.pop{animation:actPop .42s cubic-bezier(.2,.9,.3,1.6)}@keyframes actPop{0%{transform:scale(1)}40%{transform:scale(1.22) rotate(-4deg)}to{transform:scale(1)}}@media (max-width: 900px){.actiondock{right:8px;gap:8px}.act-btn{width:48px;height:48px}}.quiz-overlay{position:absolute;inset:0;z-index:9;display:flex;align-items:center;justify-content:center;background:radial-gradient(at 50% 40%,#1b2450f0,#05081af7);transition:opacity .35s ease}.quiz-overlay.hidden{opacity:0;pointer-events:none}.quiz-inner{width:min(560px,90vw);max-height:86vh;display:flex;flex-direction:column;padding:24px 26px 20px;border-radius:14px;background:linear-gradient(180deg,var(--sc-paper),#ecdfc0);box-shadow:0 0 0 1px var(--sc-tan),0 0 0 6px #fff9ec8c inset,0 26px 60px #03051099}.quiz-overlay .panel-head h3{color:var(--sc-brown);font-family:var(--font-title);font-size:21px}.quiz-overlay .q-text{color:var(--sc-ink);font-family:var(--font-text);font-size:18px;line-height:1.65}.quiz-overlay .opt{font-family:var(--font-text);font-size:16.5px}.quiz-overlay .panel-foot{color:var(--sc-brown-soft);font-family:var(--font-ui)}.sc-pill{padding:10px 30px;border-radius:999px;border:none;background:linear-gradient(180deg,var(--sc-gold),#cf9c3f);color:var(--sc-ink);font-family:var(--font-ui);font-size:19px;font-weight:600;cursor:pointer;box-shadow:0 6px 10px #05081a70;transition:transform .18s ease,filter .18s ease}.sc-pill:hover{transform:translateY(-2px);filter:brightness(1.05)}.sc-pill.ghost{background:#2c2a3e1a;box-shadow:0 4px 10px #05081a33;color:var(--sc-ink)}.quiz-actions{display:flex;gap:12px;justify-content:center;padding-top:14px;flex-wrap:wrap}.quiz-overlay .panel-body{max-height:44vh}.panel{position:absolute;right:22px;top:78px;width:330px;max-height:calc(100vh - 200px);display:flex;flex-direction:column;border-radius:16px;background:linear-gradient(180deg,#fffaeef5,#eee2caf0);box-shadow:var(--shadow-lg),inset 0 0 0 1px #c69a5280;z-index:7;transform-origin:top right;transition:opacity .3s ease,transform .3s ease}.panel.hidden{opacity:0;transform:scale(.94) translateY(-8px);pointer-events:none}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 10px;border-bottom:1px dashed rgba(150,116,66,.4)}.panel-head h3{margin:0;font-family:var(--font-title);font-size:19px;letter-spacing:.6px;color:#3d2e24}.panel-body{padding:14px 16px;overflow-y:auto}.q-text{font-family:var(--font-text);font-size:17px;line-height:1.7;color:#3d2e24;margin:0 0 12px}.opt{display:block;width:100%;text-align:left;margin-bottom:8px;padding:11px 14px;border-radius:10px;border:1px solid rgba(196,165,120,.55);background:#fffdf8;color:#3d2e24;font-family:var(--font-text);font-size:16px;cursor:pointer;transition:all .2s ease}.opt:hover{background:#eed8b0e6;transform:translate(3px)}.opt.correct{background:linear-gradient(90deg,#bedcae,#dcecd0);border-color:#7fae63}.opt.wrong{background:linear-gradient(90deg,#e6bdb2,#f2dcd4);border-color:#c0705c}.opt:disabled{cursor:default}.feedback{margin-top:10px;padding:9px 11px;border-radius:9px;font-size:13px;line-height:1.55;background:#c69a5224;color:#5a4425}.panel-foot{display:flex;align-items:center;justify-content:space-between;padding:10px 16px 14px;border-top:1px dashed rgba(150,116,66,.4);font-size:12px;color:var(--ink-soft)}.toast{position:absolute;left:50%;bottom:96px;transform:translate(-50%,14px);padding:10px 18px;border-radius:999px;background:#18110adb;border:1px solid rgba(232,195,122,.4);color:#f6e7c8;font-size:13px;opacity:0;pointer-events:none;transition:opacity .28s ease,transform .28s ease;z-index:8;max-width:70vw;text-align:center}.toast.show{opacity:1;transform:translate(-50%)}.hud{position:absolute;right:22px;bottom:96px;width:232px;padding:12px 14px;border-radius:12px;background:#0c0905d1;border:1px solid rgba(232,195,122,.3);color:#e8dcc0;font-size:11.5px;font-variant-numeric:tabular-nums;line-height:1.7;opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:8}.hud[data-visible="1"]{opacity:1}.hud-row{display:flex;justify-content:space-between;gap:10px}.hud-row span{color:#e8dcc099}.hud-row b{color:var(--gold-bright);font-weight:600}.hud-row b.bad{color:#ff8f7a}.hud-row b.good{color:#9ad48a}.errorbar{position:absolute;left:0;right:0;bottom:0;display:none;padding:8px 14px;background:#96281eeb;color:#fff1e8;font-size:12px;z-index:20}.intro{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 30% 35%,rgba(255,183,101,.16),transparent 60%),#080604eb;z-index:15;transition:opacity .8s ease,visibility .8s}.intro.gone{opacity:0;visibility:hidden}.intro-inner{text-align:center;padding:0 24px;max-width:520px}.intro-kicker{margin:0 0 12px;font-family:var(--font-sc);font-size:12.5px;font-weight:600;letter-spacing:3.4px;text-transform:uppercase;color:var(--sc-gold)}.intro h1{margin:0;font-family:var(--font-title);font-size:clamp(38px,7vw,62px);letter-spacing:8px;color:#f4dcae;text-shadow:0 0 40px rgba(255,183,101,.45)}.intro-en{margin:10px 0 30px;font-family:var(--font-ui);font-size:13px;letter-spacing:2.4px;text-transform:uppercase;color:#f0dcb480}.open-btn{font-family:var(--font-ui);padding:14px 42px;border-radius:999px;border:1px solid rgba(255,236,200,.7);background:linear-gradient(180deg,#f0c37a,#cf9843);color:#3c2a10;font-size:15.5px;font-weight:600;letter-spacing:2px;cursor:pointer;box-shadow:0 14px 40px #d29b4766;transition:transform .25s ease,box-shadow .25s ease}.open-btn:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 20px 50px #d29b478c}.intro-tip{margin:26px 0 0;font-size:12px;line-height:1.9;color:#f0dcb46b}@media (max-width: 900px){#article{inset:auto 12px 132px;width:auto;max-height:33vh;padding:14px}#article.collapsed{transform:translateY(calc(100% + 140px));opacity:0}.sb-sub{display:none}.panel{left:12px;right:12px;width:auto;top:70px}#controlbar{bottom:8px;padding:0 10px}.wood-btn{padding:6px 10px 7px;font-size:12px}.wood-btn em{display:none}.dock-side{right:10px;bottom:0}.toast{bottom:150px}.hud{display:none}}@media (prefers-reduced-motion: reduce){*{transition-duration:.01ms!important}}body{background:var(--sc-navy-deep)}#stage{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}body.wand,body.wand *{cursor:var(--wand-cursor, auto)!important}body.wand input,body.wand textarea{cursor:text}#wand-layer{position:absolute;inset:0;width:100%;height:100%;z-index:8;pointer-events:none}body[data-view=pricing] #stage{display:none}#reader{position:absolute;inset:0;pointer-events:none}#reader[aria-hidden=true]{display:none}#reader #article,#reader #intro,#reader #quiz:not(.hidden){pointer-events:auto}.view{position:absolute;inset:0;overflow-y:auto;display:none;color:var(--sc-cream);background:radial-gradient(1200px 700px at 70% -10%,#2b3a68,#2b3a6800 60%),linear-gradient(180deg,var(--sc-navy) 0%,var(--sc-navy-deep) 100%)}body[data-view=shelf] #view-shelf,body[data-view=pricing] #view-pricing{display:block}body.shelf3d[data-view=shelf] #view-shelf{display:none}.view-inner{max-width:1180px;margin:0 auto;padding:26px 28px 60px}.shelf-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.shelf-brand{display:flex;align-items:center;cursor:pointer}.brand-wordmark{height:34px;width:auto;display:block}.brand-symbol{width:22px;height:22px;object-fit:contain}.shelf-top-right{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.shelf-head{margin:26px 0 18px}.shelf-title{margin:0;font-family:var(--font-title);font-size:clamp(30px,3.4vw,44px);font-weight:700;letter-spacing:.5px;color:var(--sc-cream)}.shelf-sub{margin:8px 0 0;font-family:var(--font-ui);font-size:15px;color:#f8f0dda8}.shelf-foot{margin:22px 0 0;font-family:var(--font-ui);font-size:13.5px;color:#f8f0dd80}.langbar{display:flex;align-items:center;gap:6px}.lang-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px 5px 6px;border-radius:999px;border:1px solid rgba(230,189,102,.32);background:#141a3399;color:var(--sc-cream);font-family:var(--font-ui);font-size:13px;cursor:pointer;transition:all .18s ease}.lang-chip img{width:22px;height:16px;border-radius:3px;object-fit:cover;display:block}.lang-chip:hover{border-color:var(--sc-gold);transform:translateY(-1px)}.lang-chip.on{background:linear-gradient(180deg,var(--sc-gold),#cf9c3f);color:var(--sc-brown);border-color:#fff0c8;font-weight:600}.langbar.compact .lang-chip{padding:4px 6px}.langbar.compact .lang-chip img{width:20px;height:14px}.lang-label{line-height:1}.shelf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}.story-card{position:relative;border-radius:16px;overflow:hidden;background:linear-gradient(180deg,#fffbf0f7,#f3e8cff2);box-shadow:0 2px #ffffff80 inset,0 14px 30px #04061473,0 0 0 1px #d4b982b3;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.story-card:hover{transform:translateY(-4px);box-shadow:0 2px #ffffff8c inset,0 20px 40px #0406148c,0 0 0 1px var(--sc-gold)}.story-card.locked{filter:saturate(.75)}.card-cover{position:relative;aspect-ratio:16 / 10.5;overflow:hidden}.card-cover img{width:100%;height:100%;display:block;object-fit:cover}.card-badge{position:absolute;top:10px;left:10px;display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:26px;padding:0 9px;border-radius:999px;font-family:var(--font-ui);font-size:12.5px;font-weight:600;box-shadow:0 4px 10px #04061466}.card-badge.ready{background:var(--sc-gold);color:var(--sc-brown)}.card-badge.lock{background:#2c2a3ee6;color:#ffe9c0}.card-badge.soon{background:#f8f0dde6;color:var(--sc-brown)}.card-body{padding:14px 16px 16px}.card-title{margin:0 0 6px;font-family:var(--font-title);font-size:19px;font-weight:700;color:var(--sc-brown)}.card-meta{margin:0 0 10px;font-family:var(--font-ui);font-size:12.5px;color:var(--sc-brown-soft)}.card-progress{height:6px;border-radius:999px;background:#3d2a1729;overflow:hidden}.card-progress i{display:block;height:100%;width:0%;background:linear-gradient(90deg,var(--sc-gold),#cf9c3f);border-radius:999px}.card-status{margin:9px 0 0;font-family:var(--font-ui);font-size:13px;font-weight:600;color:var(--sc-accent)}.plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin:8px 0 22px}.plan-card{padding:22px 22px 20px;border-radius:16px;background:linear-gradient(180deg,#fffbf0f7,#f3e8cff2);box-shadow:0 2px #ffffff80 inset,0 14px 30px #04061473,0 0 0 1px #d4b982b3;display:flex;flex-direction:column;gap:8px}.plan-card.on{box-shadow:0 0 0 2px var(--sc-gold),0 16px 34px #04061480}.plan-name{margin:0;font-family:var(--font-title);font-size:22px;color:var(--sc-brown)}.plan-price{margin:0;font-family:var(--font-ui);font-size:26px;font-weight:700;color:var(--sc-accent-deep)}.plan-note{margin:0 0 8px;font-family:var(--font-ui);font-size:13px;color:var(--sc-brown-soft)}.gate-note{margin:0 0 18px;padding:14px 18px;border-radius:14px;background:#e6bd6624;border:1px solid rgba(230,189,102,.45);font-family:var(--font-text);color:var(--sc-cream)}.gate-note strong{display:block;font-family:var(--font-title);font-size:17px;margin-bottom:4px}.gate-note p{margin:0;font-size:15px;opacity:.88}.perk-list{margin:6px 0 0;padding-left:22px;font-family:var(--font-text);font-size:15.5px;line-height:1.9;color:#f8f0dddb}.sc-pill.small{padding:8px 18px;font-size:15px}.nav-home{display:inline-flex;align-items:center;gap:7px;padding:5px 12px 5px 8px;border-radius:999px;border:1px solid rgba(230,189,102,.35);background:#141a338c;color:var(--sc-cream);font-family:var(--font-ui);font-size:13px;cursor:pointer;transition:all .18s ease}.nav-home:hover{border-color:var(--sc-gold);transform:translateY(-1px)}.nav-home-text{line-height:1}.intro-wordmark{height:42px;width:auto;display:block;margin:0 auto 18px;opacity:.95}.load-block{width:min(420px,78vw);margin:22px auto 6px}.load-bar{height:8px;border-radius:999px;background:#f8f0dd29;overflow:hidden}.load-bar i{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--sc-gold),#cf9c3f);transition:width .25s ease}.load-text{margin:10px 0 0;font-family:var(--font-ui);font-size:12.5px;letter-spacing:.3px;color:#f8f0dd99}@media (max-width: 900px){.view-inner{padding:18px 14px 90px}.shelf-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}.lang-label{display:none}}#shelf-ui{position:absolute;inset:0;display:none;z-index:6;pointer-events:none}body[data-view=shelf] #shelf-ui{display:block}#shelf-ui>*:not(.shelf-tip):not(.shelf-toast){pointer-events:auto}#shelf-tip,#shelf-toast{pointer-events:none}#shelf-topbar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:62px;padding:12px 20px;background:linear-gradient(180deg,#090c1cd1,#090c1c00)}.st-left,.st-right{display:flex;align-items:center;gap:12px}.st-wordmark{height:30px;width:auto;display:block;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}.st-stat{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:#0e132ab8;border:1px solid rgba(230,189,102,.36);color:var(--sc-cream);font-family:var(--font-ui);font-size:13.5px}.st-stat b{color:var(--sc-gold);font-variant-numeric:tabular-nums}.st-star{color:var(--sc-gold);filter:drop-shadow(0 0 6px rgba(230,189,102,.7))}.st-medal{filter:drop-shadow(0 1px 3px rgba(0,0,0,.4))}.st-icon{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;border:1px solid rgba(230,189,102,.32);background:#0e132ab3;color:var(--sc-cream);font-size:16px;cursor:pointer;transition:all .18s ease}.st-icon:hover{border-color:var(--sc-gold);transform:translateY(-1px)}.st-icon.off{opacity:.45}.st-otto{width:46px;height:46px;padding:0;border-radius:50%;border:2px solid rgba(230,189,102,.55);background:radial-gradient(circle at 35% 30%,#3b4a7d,#1a2242);overflow:hidden;cursor:pointer;box-shadow:0 6px 16px #04061480;transition:transform .2s ease}.st-otto:hover{transform:translateY(-2px) scale(1.04)}.st-otto img{width:100%;height:100%;display:block;object-fit:cover}.shelf-tip{position:absolute;transform:translate(-50%,-100%) scale(.92);padding:5px 12px;border-radius:999px;background:#141a34eb;border:1px solid rgba(230,189,102,.55);color:var(--sc-cream);font-family:var(--font-ui);font-size:13px;line-height:1;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;box-shadow:0 6px 18px #03051080}.shelf-tip.show{opacity:1;transform:translate(-50%,-100%) scale(1)}.shelf-toast{position:absolute;left:50%;bottom:352px;transform:translate(-50%,12px);padding:10px 20px;border-radius:999px;background:#0e132ae6;border:1px solid rgba(230,189,102,.45);color:var(--sc-cream);font-family:var(--font-text);font-size:15px;opacity:0;pointer-events:none;transition:opacity .26s ease,transform .26s ease}.shelf-toast.show{opacity:1;transform:translate(-50%)}.shelf-points{display:flex;align-items:center;gap:14px;padding:5px 14px;border-radius:999px;background:linear-gradient(180deg,#fffcf4f0,#f4ead6e6);border:1px solid rgba(196,162,106,.5);box-shadow:0 2px 5px #46301829,0 10px 24px #34221033;font-family:var(--font-ui);color:var(--sc-brown);pointer-events:auto}.pt-item{display:inline-flex;align-items:center;gap:5px;font-size:13px}.pt-item b{font-size:14.5px;color:var(--sc-accent);font-variant-numeric:tabular-nums}.pt-item em{font-style:normal;font-size:11.5px;opacity:.62}.pt-icon{filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}.pt-xp{gap:8px}.pt-bar{width:86px;height:7px;border-radius:999px;background:#785c3638;overflow:hidden;box-shadow:inset 0 1px 2px #46301840}.pt-bar i{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,#e6bd66,#f0d79a);transition:width .5s ease}#shelf-picker{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:center;gap:10px;padding:0 14px 8px;pointer-events:none}.pick-panel{pointer-events:auto;width:min(700px,92vw);padding:10px 16px 9px;border-radius:22px 22px 18px 18px;background:linear-gradient(180deg,#f3e8d2,#e8dabc);border:1px solid rgba(176,142,88,.55);box-shadow:0 2px 4px #46301824,0 16px 34px #301e0e42,0 30px 60px #1e140a38,inset 0 1px #ffffff73;text-align:center}.picker-head{display:flex;align-items:baseline;justify-content:center;gap:10px;margin-bottom:7px}.picker-title{font-family:var(--font-title);font-size:20px;font-weight:700;color:var(--sc-brown);letter-spacing:.5px}.picker-hint{font-family:var(--font-ui);font-size:12px;color:#3d2a178c}.picker-row{display:flex;align-items:center;gap:10px}.pick-arrow{pointer-events:auto;flex:0 0 auto;margin-bottom:46px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(196,162,106,.6);background:linear-gradient(180deg,#f3e8d2,#e6d7b8);color:var(--sc-brown);font-size:22px;line-height:1;cursor:pointer;box-shadow:0 2px 4px #46301829,0 10px 22px #301e0e38;transition:all .16s ease}.pick-arrow:hover{transform:translateY(-2px);border-color:var(--sc-accent);color:var(--sc-accent)}.pick-cards{display:flex;gap:12px;justify-content:center}.pick-card{flex:1 1 0;max-width:232px;display:flex;align-items:center;gap:9px;padding:8px 10px;border:2px solid rgba(196,162,106,.45);border-radius:14px;background:#efe3c9;overflow:hidden;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;position:relative;box-shadow:0 2px 5px #4630181f;text-align:left}.pick-card img{width:42px;height:56px;flex:none;display:block;object-fit:cover;border-radius:5px;box-shadow:0 1px 3px #46301840}.pick-card .pc-body{flex:1 1 auto;min-width:0;display:block}.pick-card .pc-name{display:block;padding:0 0 1px;font-family:var(--font-title);font-size:12.5px;font-weight:700;line-height:1.25;color:var(--sc-brown);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pick-card .pc-meta{display:block;padding:0;font-family:var(--font-ui);font-size:10.5px;color:#3d2a1799}.pick-card .pc-tools{display:flex;gap:6px;padding:4px 0 0}.pick-card .pc-tool{width:20px;height:20px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;line-height:1;background:#e0c89c52;color:var(--sc-accent)}.pick-card .pc-tool.off{opacity:.35}.pick-card .pc-tool.fav{background:#d8645c2e;color:#c0392b}.pick-card:hover{transform:translateY(-3px);box-shadow:0 10px 22px #301e0e33}.pick-card.on{border-color:var(--sc-gold);box-shadow:0 0 0 3px #e6bd6652,0 0 22px #e6bd6659,0 12px 26px #301e0e38;transform:translateY(-4px)}.pick-card.on .pc-name{color:var(--sc-accent-deep)}.pick-open.pick-open-active{background:linear-gradient(180deg,#f6d98d,#e0b055);color:#4a3212;box-shadow:0 0 0 3px #e6bd6647,0 2px 4px #4630183d,0 10px 22px #301e0e3d}.pick-open{margin-top:9px;box-shadow:0 1px 3px #46301838,0 8px 18px #301e0e33}@media (max-width: 900px){#shelf-picker{padding:10px 12px 12px}.pick-card{flex-basis:46%}.pick-card:nth-child(n+3){display:none}.shelf-toast{bottom:250px}}@media (prefers-reduced-motion: reduce){#wand-layer{display:none}}#detail-ui{position:absolute;inset:0;display:none;z-index:6;pointer-events:none}body[data-view=detail] #detail-ui{display:block}body[data-view=detail] #shelf-topbar{display:flex}body[data-view=detail] #shelf-picker,body[data-view=detail] #shelf-points{display:none}.detail-peek{position:absolute;left:50%;top:-14px;transform:translate(-50%);display:flex;gap:14px;filter:blur(.6px);opacity:.9;pointer-events:none}.detail-peek img{width:116px;height:76px;object-fit:cover;border-radius:10px 10px 0 0;border:1px solid rgba(196,162,106,.5);border-bottom:none;box-shadow:0 -4px 18px #1e140a59}#detail-dock{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:center;padding:0 14px 8px;pointer-events:none}.detail-card{text-align:center}.detail-title{margin:0;font-family:var(--font-title);font-size:clamp(23px,1.75vw,28px);font-weight:800;letter-spacing:.6px;color:var(--sc-brown);text-shadow:0 1px 0 rgba(255,255,255,.7)}.detail-sub{margin:3px 0 7px;font-family:var(--font-ui);font-size:13.5px;letter-spacing:.5px;color:var(--sc-accent)}.detail-blurb{margin:0 auto 12px;max-width:46ch;font-family:var(--font-text);font-size:14.5px;line-height:1.6;color:#3d2a17d1}.detail-progress{margin-bottom:12px}.dp-bar{height:8px;border-radius:999px;background:#785c362e;box-shadow:inset 0 1px 2px #46301847;overflow:hidden}.dp-bar i{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,#e6bd66,#f4dea6);transition:width .45s ease}.dp-text{display:flex;justify-content:space-between;margin-top:6px;font-family:var(--font-ui);font-size:12px;color:#3d2a179e}.detail-actions{display:flex;flex-direction:column;align-items:center;gap:7px}.detail-open{min-width:252px;padding:9px 20px;background:linear-gradient(180deg,#f7dc94,#e2b357);color:#4a3212;font-weight:700;box-shadow:0 1px #fff9 inset,0 2px 5px #4630183d,0 12px 26px #301e0e42}.detail-open:hover{transform:translateY(-2px)}.detail-open[disabled]{opacity:.55;filter:grayscale(.4);cursor:not-allowed}.detail-back{min-width:178px;padding:7px 16px}.st-coin{font-size:13px;line-height:1}.st-coin.blue{color:#3f8fd8;text-shadow:0 0 6px rgba(63,143,216,.55)}.st-coin.red{color:#d8564a;text-shadow:0 0 6px rgba(216,86,74,.5)}@media (max-width: 1180px){.shelf-points .pt-item em{display:none}.shelf-points{gap:10px;padding:4px 10px}}.pc-name-alt,.detail-title-zh{display:block;font-family:var(--font-ui);color:var(--sc-brown-soft);font-weight:500;letter-spacing:.3px}.pc-name-alt{margin-top:2px;font-size:11.5px;opacity:.85}.detail-title-zh{margin:4px 0 0;font-size:15px;opacity:.9}.detail-blurb-zh{margin:6px 0 0;font-family:var(--font-body, var(--font-ui));font-size:13.5px;line-height:1.65;color:var(--sc-brown-soft);opacity:.85}.product-lane{margin:18px 0 6px;display:flex;flex-direction:column;gap:12px}.lane-title{font-family:var(--font-title);font-size:19px;color:var(--sc-brown);margin:0 0 2px}.lane-series{border-left:4px solid var(--lane-accent, #c39a62);background:#fffaf0b8;border-radius:12px;padding:10px 14px}.lane-name{font-family:var(--font-title);font-size:15px;margin:0 0 2px;color:var(--sc-brown)}.lane-pos{font-family:var(--font-body, var(--font-ui));font-size:12.5px;color:var(--sc-brown-soft);margin:0 0 7px;line-height:1.6}.lane-books{display:flex;flex-wrap:wrap;gap:6px}.lane-book{font-family:var(--font-ui);font-size:11.5px;color:#4a3a26;background:#e2cda880;border-radius:999px;padding:3px 10px}.lane-packs{display:flex;flex-direction:column;gap:6px;margin-top:4px}.lane-pack{display:flex;align-items:baseline;gap:9px;font-family:var(--font-ui);font-size:12px}.lane-tier{font-weight:700;font-size:10.5px;letter-spacing:.5px;border-radius:5px;padding:1px 7px;flex:none}.tier-free{background:#cfe3cd;color:#2f5a34}.tier-member{background:#e6d3a8;color:#6a4c1e}.tier-iap{background:#f0cdb4;color:#7a3f1d}.lane-pack-name{color:var(--sc-brown);font-weight:600;flex:none}.lane-pack-desc{color:var(--sc-brown-soft)}.parent-report{max-width:860px;margin:0 auto}.report-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:14px 0}.report-card{background:#fffaf0c7;border:1px solid rgba(196,162,106,.4);border-radius:12px;padding:12px 14px}.report-value{font-family:var(--font-title);font-size:26px;color:var(--sc-accent-deep, #8b4513);line-height:1.1}.report-label{font-family:var(--font-ui);font-size:12.5px;color:var(--sc-brown);margin-top:2px}.report-hint{font-family:var(--font-ui);font-size:11px;color:var(--sc-brown-soft);margin-top:4px;line-height:1.5}.report-retention,.report-books{margin-top:14px}.report-days{display:flex;gap:8px;margin-top:6px}.report-day{font-family:var(--font-ui);font-size:12px;padding:4px 10px;border-radius:999px;background:#e2cda873;color:var(--sc-brown-soft)}.report-day.on{background:#cfe3cd;color:#2f5a34}.report-book{display:flex;justify-content:space-between;gap:10px;font-family:var(--font-ui);font-size:12.5px;padding:6px 2px;border-bottom:1px dashed rgba(196,162,106,.3)}.report-book-name{color:var(--sc-brown)}.report-book-stat{color:var(--sc-brown-soft);flex:none}