:root{--bg-0: #0f141f;--bg-1: #151d2f;--bg-2: #1f2a3f;--surface: rgba(255, 255, 255, .08);--surface-strong: rgba(255, 255, 255, .14);--surface-border: rgba(255, 255, 255, .25);--text-main: #eff4ff;--text-subtle: rgba(239, 244, 255, .72);--accent: #72b6ff;--accent-strong: #3d95ff;--success: #67d9a2;--danger: #ff8b8b;--shadow-soft: 0 16px 32px rgba(4, 8, 15, .3);--shadow-hard: 0 24px 56px rgba(3, 7, 14, .5);--radius-xl: 28px;--radius-lg: 18px;--radius-md: 12px;--spacing-xl: 1.75rem;--spacing-lg: 1.2rem;--spacing-md: .85rem;--spacing-sm: .56rem;--dur-fast: .22s;--dur-mid: .42s;--dur-slow: .76s}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{color:var(--text-main);font-family:Avenir Next,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:linear-gradient(160deg,var(--bg-0) 0%,var(--bg-1) 55%,var(--bg-2) 100%)}button{font:inherit}.app-shell{position:relative;min-height:100vh;padding:1.4rem 1rem 2.2rem;overflow-x:clip}.scene-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;overflow:hidden}.orb{position:absolute;width:min(46vw,410px);aspect-ratio:1;border-radius:50%;opacity:.38;filter:blur(6px);will-change:transform}.orb-1{top:-12%;left:-8%;background:radial-gradient(circle,#72b6ff61,#72b6ff00 72%)}.orb-2{top:14%;right:-12%;background:radial-gradient(circle,#ffffff3d,#fff0 74%)}.orb-3{bottom:-18%;left:24%;background:radial-gradient(circle,#5c8fff4a,#5c8fff00 70%)}.grid-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:36px 36px;-webkit-mask-image:radial-gradient(circle at center,black 25%,transparent 78%);mask-image:radial-gradient(circle at center,black 25%,transparent 78%)}.spot-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 18%,rgba(255,255,255,.13),transparent 42%)}.app-content{position:relative;z-index:2;margin:0 auto;max-width:1020px;display:grid;gap:var(--spacing-lg)}.app-content.quiz-layout{max-width:920px;gap:.95rem}.quiz-layout .hero-panel{padding:.95rem 1.1rem}.quiz-layout .hero-kicker{font-size:.76rem}.quiz-layout .hero-panel h1{margin-top:.32rem;font-size:clamp(1.5rem,3.2vw,2.35rem)}.hero-panel{border:1px solid var(--surface-border);background:linear-gradient(165deg,#ffffff1f,#ffffff08);border-radius:var(--radius-xl);padding:1.25rem 1.35rem;box-shadow:var(--shadow-hard);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hero-kicker{margin:0;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-subtle)}.hero-panel h1{margin:.45rem 0 0;font-size:clamp(1.8rem,3.6vw,3rem);line-height:1.06}.hero-subtitle{margin:.58rem 0 0;color:var(--text-subtle)}.hero-meta{margin-top:1rem;display:flex;gap:.5rem;flex-wrap:wrap}.hero-chip{border-radius:999px;border:1px solid rgba(255,255,255,.25);background:#ffffff14;color:var(--text-main);padding:.38rem .7rem;font-size:.82rem}.entry-panel,.session-bar{border:1px solid var(--surface-border);background:linear-gradient(165deg,#ffffff1f,#ffffff08);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.entry-panel{border-radius:var(--radius-xl);padding:1.2rem 1.25rem;display:grid;gap:.8rem}.entry-kicker{margin:0;color:var(--text-subtle);letter-spacing:.08em;text-transform:uppercase;font-size:.8rem}.entry-title{margin:0;font-size:clamp(1.5rem,3vw,2.25rem)}.entry-copy{margin:0;max-width:56ch;color:var(--text-subtle)}.entry-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.entry-card{border:1px solid rgba(255,255,255,.22);border-radius:var(--radius-lg);background:#ffffff14;color:var(--text-main);text-align:left;padding:1rem;display:grid;gap:.38rem;cursor:pointer}.entry-card-static{cursor:default}.entry-card span{color:var(--text-subtle);font-size:.82rem;letter-spacing:.08em;text-transform:uppercase}.entry-card strong{font-size:1.15rem}.entry-card p{margin:0;color:var(--text-subtle);line-height:1.45}.entry-mini-actions{display:flex;gap:.5rem;margin-top:.3rem}.entry-mini-btn{flex:1;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:#72b6ff1f;color:var(--text-main);padding:.58rem .8rem;cursor:pointer;transition:background var(--dur-fast) ease,transform var(--dur-fast) ease,border-color var(--dur-fast) ease}.entry-mini-btn:hover{transform:translateY(-1px);background:#72b6ff2e;border-color:#72b6ff73}.session-bar{border-radius:999px;padding:.45rem .52rem .45rem .8rem;display:flex;justify-content:space-between;align-items:center;gap:.75rem}.quiz-layout .session-bar{padding:.4rem .46rem .4rem .72rem}.session-badge{color:var(--text-subtle);font-size:.9rem}.mode-tabs{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:.35rem;padding:.3rem;border-radius:999px;border:1px solid var(--surface-border);background:#ffffff17;overflow:clip}.tab-indicator{position:absolute;top:.3rem;width:calc(50% - .4rem);bottom:.3rem;border-radius:999px;background:#72b6ff38;pointer-events:none;z-index:0}.tab-btn{position:relative;z-index:1;border:0;border-radius:999px;background:transparent;color:var(--text-subtle);cursor:pointer;padding:.66rem .9rem;transition:color var(--dur-fast) ease}.tab-btn.active{color:var(--text-main);font-weight:600}.stats-ribbon{display:grid;gap:.58rem;grid-template-columns:repeat(4,minmax(0,1fr))}.stat-tile{border:1px solid var(--surface-border);background:var(--surface);border-radius:var(--radius-md);padding:.62rem .72rem;display:grid;gap:.22rem;min-height:68px}.stat-tile span{color:var(--text-subtle);font-size:.76rem}.stat-tile strong{font-size:1rem;letter-spacing:.01em}.streak-tile strong{color:#d6ecff}.stage-panel{position:relative;overflow:clip;border:1px solid var(--surface-border);background:linear-gradient(180deg,#ffffff21,#ffffff0d);border-radius:var(--radius-xl);padding:1.2rem;box-shadow:var(--shadow-hard);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;gap:var(--spacing-md)}.quiz-stage{scroll-margin-top:.75rem}.stage-head{display:flex;justify-content:space-between;align-items:center;gap:.75rem;flex-wrap:wrap}.stage-head-actions{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;justify-content:flex-end}.direction-toggle{display:inline-flex;align-items:center;gap:.32rem;padding:.24rem;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:#ffffff0f}.direction-btn{border:0;border-radius:999px;background:transparent;color:var(--text-subtle);padding:.34rem .7rem;cursor:pointer;transition:background var(--dur-fast) ease,color var(--dur-fast) ease,transform var(--dur-fast) ease}.direction-btn.active{background:#72b6ff38;color:var(--text-main)}.stage-label{color:var(--text-subtle);font-size:.9rem}.stage-tip{color:#eff4ff9e;font-size:.8rem}.text-btn{border:1px solid rgba(255,255,255,.26);border-radius:999px;background:#ffffff14;color:var(--text-main);padding:.33rem .7rem;cursor:pointer}.stage-word{margin:0;font-size:clamp(1.8rem,5.2vw,2.7rem);letter-spacing:.01em;text-wrap:balance}.stage-answer{margin:0;font-size:clamp(1.05rem,2.6vw,1.35rem);color:#d9ebff;transform-origin:top}.tilt-shell{will-change:transform;transform-style:preserve-3d}.flip-wrap{perspective:1200px}.flip-inner{position:relative;min-height:220px;transform-style:preserve-3d;will-change:transform}.flip-face{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-lg);border:1px solid rgba(255,255,255,.2);background:#ffffff14;display:grid;place-content:center;padding:.9rem;gap:.7rem;backface-visibility:hidden}.flip-back{transform:rotateY(180deg)}.face-kicker{margin:0;color:var(--text-subtle);letter-spacing:.08em;text-transform:uppercase;font-size:.77rem}.reduced-card{border:1px solid rgba(255,255,255,.2);background:#ffffff14;border-radius:var(--radius-lg);padding:.95rem;display:grid;gap:.55rem}.stage-actions,.stage-nav,.quiz-feedback{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.cta-btn,.ghost-btn{border-radius:var(--radius-md);border:1px solid rgba(255,255,255,.24);cursor:pointer;padding:.62rem .92rem;color:var(--text-main);transition:transform var(--dur-fast) ease,background var(--dur-fast) ease}.cta-btn{background:linear-gradient(160deg,var(--accent),var(--accent-strong));border-color:#90c8fff2;color:#f7fbff}.cta-btn.success{background:linear-gradient(160deg,#53c692,#47b17f);border-color:#b2ffddeb}.cta-btn.danger{background:linear-gradient(160deg,#f98d8d,#f06c6c);border-color:#ffd8d8eb}.ghost-btn{background:#ffffff14}.cta-btn:hover,.ghost-btn:hover,.text-btn:hover,.tab-btn:hover,.quiz-option:hover{transform:translateY(-1px)}.quiz-options{display:grid;gap:.52rem}.quiz-content{display:grid;gap:var(--spacing-md)}.quiz-form{display:grid;gap:.72rem}.quiz-field{display:grid;gap:.42rem}.quiz-field span{color:var(--text-subtle);font-size:.86rem}.quiz-input{width:100%;border:1px solid rgba(255,255,255,.22);border-radius:var(--radius-md);background:#060c1470;color:var(--text-main);padding:.78rem .88rem;outline:0;transition:border-color var(--dur-fast) ease,box-shadow var(--dur-fast) ease}.quiz-input:focus{border-color:#72b6ffe6;box-shadow:0 0 0 3px #72b6ff24}.quiz-input::placeholder{color:#eff4ff61}.quiz-option{border:1px solid rgba(255,255,255,.24);border-radius:var(--radius-md);background:#ffffff14;color:var(--text-main);text-align:left;padding:.7rem .85rem;cursor:pointer}.quiz-option:disabled{cursor:not-allowed}.quiz-option.selected{outline:1px solid rgba(255,255,255,.35);outline-offset:1px}.quiz-option.right{border-color:#67d9a2f2;background:#67d9a229}.quiz-option.wrong{border-color:#ff8b8bf2;background:#ff8b8b29}.quiz-feedback{border:1px solid rgba(255,255,255,.22);border-radius:var(--radius-md);padding:.6rem .74rem;background:#ffffff14;align-items:center}.quiz-feedback p{margin:0;font-weight:600}.feedback-icon{width:26px;height:26px;border-radius:999px;display:grid;place-content:center;font-weight:700;font-size:.95rem}.feedback-icon.ok{background:#67d9a233;color:#9ef0c7}.feedback-icon.bad{background:#ff8b8b33;color:#ffc1c1}.quiz-feedback.ok{border-color:#67d9a2b3}.quiz-feedback.bad{border-color:#ff8b8bb3}.overview-stage{gap:.9rem}.overview-head{display:flex;justify-content:space-between;align-items:center;gap:.75rem;flex-wrap:wrap}.overview-count{color:var(--text-subtle);font-size:.84rem}.overview-scroll{max-height:min(70vh,820px);overflow-y:auto;padding-right:.2rem}.overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.72rem}.overview-item{border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-lg);background:#ffffff14;padding:.82rem .88rem;display:grid;gap:.38rem;align-content:start;min-height:124px}.overview-index{color:var(--text-subtle);font-size:.76rem;letter-spacing:.08em}.overview-item h3,.overview-item p{margin:0}.overview-item h3{font-size:1rem;line-height:1.3}.overview-item p{color:#d9ebff;line-height:1.42}.app-hint{margin:.25rem 0 0;text-align:center;color:var(--text-subtle);font-size:.84rem}.empty-state{border:1px solid var(--surface-border);background:var(--surface);border-radius:var(--radius-lg);padding:1rem}@media(max-width:1080px){.entry-grid,.overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:860px){.stats-ribbon,.entry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.app-shell{padding:.88rem .72rem 1.45rem}.quiz-layout{gap:.7rem}.hero-panel,.entry-panel,.stage-panel{border-radius:18px;padding:.92rem}.quiz-layout .hero-panel{padding:.72rem .82rem}.quiz-layout .hero-kicker{font-size:.68rem}.quiz-layout .hero-panel h1{margin-top:.26rem;font-size:clamp(1.3rem,7vw,1.75rem)}.stats-ribbon{grid-template-columns:1fr 1fr}.stage-actions,.stage-nav,.quiz-feedback{display:grid;grid-template-columns:1fr}.session-bar{border-radius:18px;padding:.75rem .92rem;display:grid;grid-template-columns:1fr}.quiz-layout .session-bar{padding:.62rem .78rem;gap:.55rem}.quiz-layout .stage-panel{padding:.82rem;gap:.82rem}.quiz-layout .quiz-content,.quiz-layout .quiz-form{gap:.62rem}.quiz-layout .stage-word{font-size:clamp(1.45rem,7vw,1.95rem)}.quiz-layout .quiz-input{padding:.86rem .88rem;font-size:1rem}.overview-scroll{max-height:66vh}.overview-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.overview-item{min-height:116px;padding:.72rem .76rem}.cta-btn,.ghost-btn,.quiz-option,.tab-btn,.entry-card,.entry-mini-btn{width:100%}.entry-mini-actions{display:grid;grid-template-columns:1fr}.entry-grid{grid-template-columns:1fr}.tab-indicator{width:calc(50% - .4rem)}}@keyframes tilePulse{0%,to{box-shadow:0 0 #72b6ff1f}50%{box-shadow:0 0 0 8px #72b6ff05}}@keyframes shimmer{0%{opacity:.35}50%{opacity:.7}to{opacity:.35}}@keyframes optionPulse{0%{box-shadow:0 0 #67d9a273}75%{box-shadow:0 0 0 14px #67d9a200}to{box-shadow:0 0 #67d9a200}}@keyframes optionShake{0%{transform:translate(0)}22%{transform:translate(-5px)}45%{transform:translate(5px)}70%{transform:translate(-3px)}to{transform:translate(0)}}.stat-tile{animation:tilePulse 5.2s ease-in-out infinite}.hero-chip{animation:shimmer 4s ease-in-out infinite}.quiz-option.pulse{animation:optionPulse .42s ease-out}.quiz-option.shake{animation:optionShake .3s ease}.motion-reduced .stat-tile,.motion-reduced .hero-chip,.motion-reduced .quiz-option.pulse,.motion-reduced .quiz-option.shake{animation:none!important}.motion-reduced .orb{filter:none;opacity:.22}@media(prefers-reduced-motion:reduce){.stat-tile,.hero-chip,.quiz-option.pulse,.quiz-option.shake{animation:none!important}}