@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap");

:root {
  --bg: #080a0d;
  --panel: #11141a;
  --panel-soft: rgba(18, 21, 27, .92);
  --text: #f4f6f7;
  --muted: rgba(244, 246, 247, .58);
  --border: rgba(255,255,255,.12);
  --cyan: #28efd1;
  --yellow: #ffd55d;
  --purple: #a98cff;
  --red: #ff657d;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); }
body { font-family: "DM Sans", "Noto Sans SC", sans-serif; }
button, input { font: inherit; color: inherit; }
button { border: 0; cursor: pointer; }

.stage {
  min-height: 100dvh; display: grid; grid-template-columns: minmax(370px, 510px) minmax(390px, 455px);
  justify-content: center; align-items: center; gap: clamp(60px, 9vw, 150px); padding: 34px 5vw;
  background: radial-gradient(circle at 73% 48%, rgba(40,239,209,.08), transparent 28%), #080a0d;
}
.story-panel { align-self: center; max-width: 510px; }
.brand-lockup { display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:15px;font-weight:700;letter-spacing:.02em; }.brand-home{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.app-nav{display:flex;gap:15px}.app-nav a{color:var(--muted);font-size:11px;font-weight:500;text-decoration:none}.app-nav a:hover{color:var(--text)}
.brand-mark,.auth-mark { display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--cyan);color:#05110e;font-weight:800;box-shadow:0 0 30px rgba(40,239,209,.18); }
.eyebrow { margin:54px 0 14px;color:var(--cyan);font-size:11px;letter-spacing:.22em;font-weight:700; }
.story-panel h1 { margin:0;font-size:clamp(48px,5vw,68px);line-height:1.08;letter-spacing:-.055em; }
.story-copy { max-width:460px;margin:24px 0 34px;font-size:16px;line-height:1.8;color:var(--muted); }
.journey { border-top:1px solid var(--border); }
.journey-step { display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:center;padding:17px 0;border-bottom:1px solid var(--border); }
.journey-step>b { color:var(--muted);font-size:12px;letter-spacing:.12em; }
.journey-step.active>b { color:var(--cyan); }
.journey-step span { font-size:14px;font-weight:600; }
.journey-step small { display:block;margin-top:4px;color:var(--muted);font-size:11px;font-weight:400; }
.privacy-note { display:flex;align-items:center;gap:12px;margin-top:24px;padding:15px 17px;border:1px solid rgba(40,239,209,.15);background:rgba(40,239,209,.05);border-radius:16px; }
.privacy-note>span { display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(40,239,209,.13);color:var(--cyan); }
.privacy-note p { margin:0; }.privacy-note b,.privacy-note small{display:block}.privacy-note b{font-size:12px}.privacy-note small{margin-top:3px;color:var(--muted);font-size:10px}

.phone {
  position:relative;width:min(100%,410px);aspect-ratio:390/844;max-height:calc(100dvh - 46px);
  border-radius:38px;overflow:hidden;background:#06070a;
  box-shadow:0 40px 100px rgba(0,0,0,.58),0 0 0 8px #1a1b21,0 0 0 9px rgba(255,255,255,.12);
}
.scene { position:absolute;inset:0;overflow:hidden;background:#151218;outline:none; }
.scene>img,.scene>video { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center; }
.scene>img { transform:scale(1.04); }
.scene>video.front-camera { transform:scaleX(-1); }
.scene>[hidden] { display:none; }
.scene-vignette { position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.58),transparent 24%,transparent 56%,rgba(0,0,0,.88));pointer-events:none; }
.scene-grain { position:absolute;inset:0;opacity:.09;pointer-events:none;mix-blend-mode:overlay;background-image:repeating-radial-gradient(circle at 23% 37%,rgba(255,255,255,.35) 0 1px,transparent 1px 4px);background-size:41px 37px; }

.player-header { position:absolute;z-index:12;left:0;right:0;top:0;padding:28px 15px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px; }
.source-badge { max-width:76px;overflow:hidden;text-overflow:ellipsis;padding:7px 9px;border-radius:10px;background:rgba(8,10,14,.58);border:1px solid var(--border);backdrop-filter:blur(12px);font-size:9px;color:rgba(255,255,255,.75);white-space:nowrap; }
.header-actions { display:flex;gap:6px;align-items:center; }
.language-pill,.level-pill,.header-button,.camera-button,.library-button,.blacklist-button,.logout-button { height:32px;padding:0 7px;border-radius:11px;background:rgba(8,10,14,.63);border:1px solid var(--border);backdrop-filter:blur(12px);font-size:8px;font-weight:700;white-space:nowrap; }
.camera-button{color:var(--cyan)}
.library-button{color:#fff;background:rgba(40,239,209,.16)}.library-button span{display:inline-grid;place-items:center;min-width:14px;height:14px;margin-left:2px;border-radius:7px;background:var(--cyan);color:#06110e;font-size:7px}
.language-pill i,.level-pill i { margin-left:3px;font-style:normal;color:var(--muted); }
.blacklist-button{color:rgba(255,255,255,.72)}
.logout-button { padding:0 8px;color:var(--muted); }

.pause-affordance { position:absolute;z-index:5;left:50%;top:45%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;background:none;opacity:0;transition:.22s; }
.scene:hover .pause-affordance,.pause-affordance:focus-visible { opacity:1; }
.pause-affordance span { display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:rgba(6,8,11,.58);border:1px solid rgba(255,255,255,.26);backdrop-filter:blur(12px);font-weight:800; }
.pause-affordance small { padding:5px 9px;border-radius:10px;background:rgba(6,8,11,.65);font-size:8px; }
.scene.paused .pause-affordance { display:none; }

.welcome-tip { position:absolute;z-index:4;left:18px;right:18px;bottom:124px;display:flex;align-items:center;gap:11px;padding:13px;border-radius:16px;background:rgba(14,17,22,.73);border:1px solid var(--border);backdrop-filter:blur(16px);transition:.25s; }
.welcome-tip.hidden{opacity:0;transform:translateY(8px);pointer-events:none}.welcome-tip>span{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--cyan);color:#06110f}.welcome-tip b,.welcome-tip small{display:block}.welcome-tip b{font-size:11px}.welcome-tip small{margin-top:3px;font-size:8px;color:var(--muted)}

.analysis-state { position:absolute;z-index:14;left:22px;right:22px;top:43%;transform:translateY(-50%);display:none;grid-template-columns:31px 1fr;gap:11px;align-items:center;padding:14px;border-radius:16px;background:rgba(11,14,18,.9);border:1px solid var(--border);backdrop-filter:blur(18px);box-shadow:0 18px 45px rgba(0,0,0,.34); }
.analysis-state.visible { display:grid;animation:fadeIn .2s ease; }
.analysis-state.error .analysis-spinner{animation:none;border:0}.analysis-state.error .analysis-spinner:before{content:"!";display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:rgba(255,101,125,.17);color:var(--red);font-weight:800}
.analysis-spinner { width:29px;height:29px;border:2px solid rgba(255,255,255,.14);border-top-color:var(--cyan);border-radius:50%;animation:spin .8s linear infinite; }
.analysis-state b,.analysis-state small{display:block}.analysis-state b{font-size:11px}.analysis-state small{margin-top:3px;font-size:8px;line-height:1.4;color:var(--muted);word-break:break-word}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{from{opacity:0}}

.tags-layer { position:absolute;z-index:8;inset:82px 0 145px;pointer-events:none; }
.word-tag { position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:flex-start;padding:7px 10px 7px 21px;border-radius:12px;background:rgba(8,11,15,.82);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(11px);white-space:nowrap;pointer-events:auto;box-shadow:0 9px 22px rgba(0,0,0,.28);animation:tagIn .3s both; }
.word-tag b{font-size:11px;line-height:1.15}.word-tag small{margin-top:3px;font-size:8px;color:rgba(255,255,255,.62)}.word-tag .pin{position:absolute;left:8px;top:11px;width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 3px rgba(40,239,209,.17)}
.word-tag.verb .pin,.word-tag.phrase .pin{background:var(--yellow);box-shadow:0 0 0 3px rgba(255,213,93,.17)}.word-tag.person .pin{background:var(--purple);box-shadow:0 0 0 3px rgba(169,140,255,.17)}.word-tag[hidden]{display:none}
@keyframes tagIn{from{opacity:0;transform:translate(-50%,-40%) scale(.9)}}

.language-menu,.level-menu { position:absolute;z-index:30;right:14px;top:67px;width:185px;padding:7px;border-radius:15px;background:rgba(18,21,27,.98);border:1px solid var(--border);box-shadow:0 18px 45px rgba(0,0,0,.35);opacity:0;transform:translateY(-7px) scale(.96);pointer-events:none;transition:.18s; }
.level-menu{right:73px;width:220px}.language-menu.open,.level-menu.open{opacity:1;transform:none;pointer-events:auto}.language-menu button,.level-menu button{width:100%;display:grid;grid-template-columns:1fr auto;align-items:center;padding:10px;border-radius:10px;background:none;text-align:left}.language-menu button:hover,.level-menu button:hover{background:rgba(255,255,255,.06)}.language-menu b,.language-menu small,.level-menu b,.level-menu small{display:block}.language-menu b,.level-menu b{font-size:11px}.language-menu small,.level-menu small{font-size:8px;color:var(--muted);margin-top:2px}.language-menu i,.level-menu i{font-style:normal;color:var(--cyan)}

.player-controls { position:absolute;z-index:10;left:0;right:0;bottom:0;padding:28px 15px max(16px,env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(5,7,9,.97) 34%);transition:.25s; }
.player-controls.hidden{opacity:0;transform:translateY(10px);pointer-events:none}.timeline-row{display:grid;grid-template-columns:34px 1fr 34px;gap:8px;align-items:center}.timeline-row span{font-size:8px;color:rgba(255,255,255,.7);font-variant-numeric:tabular-nums}.timeline-row span:last-child{text-align:right}
#timeline{width:100%;height:3px;appearance:none;border-radius:4px;background:linear-gradient(to right,var(--cyan) var(--progress,0%),rgba(255,255,255,.25) var(--progress,0%));cursor:pointer}#timeline::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:white;box-shadow:0 0 0 3px rgba(40,239,209,.2)}
.control-row{display:flex;align-items:center;justify-content:space-between;margin-top:12px}.control-row button{padding:7px 9px;border-radius:10px;background:rgba(255,255,255,.09);font-size:8px}.control-row button span{color:var(--cyan);margin-right:5px}.control-row small{font-size:8px;color:var(--muted)}
.camera-live{display:flex;align-items:center;justify-content:center;gap:7px;min-height:28px;color:rgba(255,255,255,.72);font-size:8px}.camera-live[hidden]{display:none}.camera-live span{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(255,101,125,.12)}.camera-live b{font-weight:500}.camera-live button{min-height:28px;padding:0 9px;border-radius:9px;background:rgba(40,239,209,.12);color:var(--cyan);font-size:8px;font-weight:700}.camera-live button[hidden]{display:none}

.learning-toolbar { position:absolute;z-index:11;left:0;right:0;bottom:0;display:none;padding:28px 15px max(15px,env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(5,7,9,.98) 25%); }
.learning-toolbar.visible{display:block;animation:toolbarIn .25s ease}@keyframes toolbarIn{from{opacity:0;transform:translateY(8px)}}.learning-status{display:flex;align-items:center;gap:9px;margin-bottom:10px}.paused-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px rgba(40,239,209,.12)}.learning-status b,.learning-status small{display:block}.learning-status b{font-size:10px}.learning-status small{font-size:8px;color:var(--muted);margin-top:2px}.filter-row{display:flex;gap:6px;margin-bottom:10px;overflow:auto}.filter-row button{padding:7px 9px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid var(--border);font-size:8px;white-space:nowrap}.filter-row button.active{background:var(--cyan);border-color:var(--cyan);color:#07110e;font-weight:700}.paused-actions{display:flex;gap:8px}.retry-button,.continue-button{height:43px;border-radius:13px;font-size:10px;font-weight:700}.retry-button{flex:0 0 105px;background:rgba(255,255,255,.1)}.continue-button{flex:1;background:var(--cyan);color:#06110e}.continue-button span{margin-right:6px}

.word-sheet{position:absolute;z-index:40;left:0;right:0;bottom:0;display:flex;max-height:min(78dvh,680px);min-height:48%;flex-direction:column;padding:12px 18px max(14px,env(safe-area-inset-bottom));overflow:hidden;background:rgba(16,19,24,.985);border-top:1px solid var(--border);border-radius:25px 25px 0 0;box-shadow:0 -24px 50px rgba(0,0,0,.4);transform:translateY(105%);transition:transform .34s cubic-bezier(.2,.8,.2,1)}
.word-sheet.open{transform:none}.sheet-handle{flex:0 0 auto;width:38px;height:4px;margin:0 auto 12px;border-radius:5px;background:rgba(255,255,255,.2)}.sheet-close{position:absolute;z-index:2;right:12px;top:12px;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.09);font-size:25px}.word-heading{display:flex;flex:0 0 auto;align-items:flex-start;justify-content:space-between;gap:48px;margin:4px 0 14px}.word-type{color:var(--cyan);font-size:9px;letter-spacing:.14em;font-weight:700}.word-heading h2{max-width:255px;margin:7px 0 5px;overflow-wrap:anywhere;font-size:clamp(30px,8vw,44px);line-height:1;letter-spacing:-.04em}.phonetic-row{display:flex;min-height:40px;align-items:center;gap:8px;margin:0;color:var(--muted);font-size:13px}.speak-button{flex:0 0 40px;width:40px;height:40px;border-radius:50%;background:rgba(40,239,209,.13);color:var(--cyan);font-size:17px}.word-sheet-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-bottom:4px}.word-actions{display:flex;flex-direction:column;gap:6px;align-items:stretch;padding-top:44px}.block-word{min-height:40px;padding:7px 10px;border-radius:12px;background:rgba(255,101,125,.1);color:#ff8ca0;font-size:9px}
.meaning-card{padding:14px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07)}.meaning-label{display:flex;align-items:center;justify-content:space-between}.meaning-label>span{font-size:9px;color:var(--muted)}.speak-example{min-height:36px;padding:0 10px;border-radius:10px;background:rgba(40,239,209,.1);color:var(--cyan);font-size:9px}.meaning-card strong{display:block;margin:4px 0 10px;font-size:15px}.meaning-card p{margin:0 0 6px;overflow-wrap:anywhere;font-size:13px;line-height:1.7}.meaning-card small{display:block;overflow-wrap:anywhere;font-size:11px;line-height:1.5;color:var(--muted)}.meaning-card #contextText{margin:-3px;padding:5px 0}.context-token{display:inline;padding:1px 2px;border-radius:5px;background:transparent;color:inherit;font-size:inherit;line-height:inherit;text-align:left;touch-action:manipulation}.context-token:hover,.context-token:focus-visible,.context-token.active{background:rgba(40,239,209,.16);color:#72ffe9;outline:none}.context-hint{margin:9px 0 0!important;padding-top:8px!important;border-top:1px solid rgba(255,255,255,.07);color:rgba(255,255,255,.42);font-size:8px!important}.retry-detail{width:100%;min-height:40px;margin-top:12px;border-radius:11px;background:rgba(255,255,255,.09);font-size:10px;font-weight:700}.context-explorer{margin-top:10px;padding:13px;border-radius:16px;background:linear-gradient(145deg,rgba(40,239,209,.1),rgba(169,140,255,.08));border:1px solid rgba(40,239,209,.2)}.context-explorer[hidden],.context-explorer-result[hidden],.context-explorer-error[hidden],.context-explorer-loading[hidden]{display:none}.context-explorer>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}.context-explorer>header span{color:var(--cyan);font-size:8px;font-weight:700;letter-spacing:.12em}.context-explorer>header button{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.08);font-size:17px}.context-explorer-loading b,.context-explorer-loading small{display:block}.context-explorer-loading b{font-size:11px}.context-explorer-loading small{margin-top:5px;color:var(--muted);font-size:8px}.context-word-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.context-word-row b,.context-word-row small{display:block}.context-word-row b{font-size:22px}.context-word-row small{margin-top:3px;color:var(--muted);font-size:10px}.context-word-row button{width:38px;height:38px;border-radius:50%;background:rgba(40,239,209,.13);color:var(--cyan);font-size:16px}.context-explorer-result>strong{display:block;margin:12px 0 7px;font-size:13px}.context-explorer-result>p{margin:0 0 5px;font-size:10px;line-height:1.55}.context-explorer-result>small{display:block;color:var(--muted);font-size:9px;line-height:1.5}.save-context-word{width:100%;min-height:42px;margin-top:12px;border-radius:12px;background:var(--cyan);color:#06110e;font-size:9px;font-weight:700}.save-context-word.saved{background:rgba(40,239,209,.14);color:var(--cyan)}.context-explorer-error p{margin:0 0 9px;font-size:9px;color:#ffc0ca}.context-explorer-error button{width:100%;height:38px;border-radius:10px;background:rgba(255,255,255,.08);font-size:9px}.collocation-row{display:flex;gap:7px;overflow:auto;margin:12px 0}.collocation-row button{min-height:36px;padding:7px 10px;border-radius:9px;background:rgba(169,140,255,.12);color:#cbbfff;font-size:9px;white-space:nowrap}.speech-note{margin:0;color:rgba(255,255,255,.4);font-size:8px;text-align:center}.word-sheet-footer{display:grid;flex:0 0 auto;grid-template-columns:.8fr 1.2fr;gap:8px;padding-top:12px}.word-sheet-footer button{min-height:48px;border-radius:14px;font-size:11px;font-weight:700}.dismiss-word{background:rgba(255,255,255,.09)}.save-word{background:var(--cyan);color:#06110e}.save-word.saved{background:rgba(40,239,209,.16);color:var(--cyan)}.save-word:disabled{opacity:.5;cursor:wait}

.toast{position:absolute;z-index:70;left:50%;bottom:82px;transform:translate(-50%,12px);max-width:82%;padding:9px 12px;border-radius:16px;background:rgba(255,255,255,.94);color:#11151a;font-size:9px;font-weight:600;opacity:0;pointer-events:none;transition:.2s;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}

.blacklist-panel{position:absolute;z-index:55;inset:0;padding:29px 16px 18px;background:#0e1116;transform:translateX(105%);transition:transform .35s cubic-bezier(.2,.8,.2,1);overflow:auto}.blacklist-panel.open{transform:none}.blacklist-panel header{display:flex;align-items:center;gap:10px;margin-bottom:18px}.blacklist-panel header>button{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.07);font-size:27px;line-height:25px}.blacklist-panel header b,.blacklist-panel header small{display:block}.blacklist-panel header b{font-size:14px}.blacklist-panel header small{margin-top:3px;font-size:8px;color:var(--muted)}.blacklist-list{display:grid;gap:8px}.blacklist-item{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:12px;border-radius:14px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07)}.blacklist-item b,.blacklist-item small{display:block}.blacklist-item b{font-size:11px}.blacklist-item small{margin-top:3px;font-size:8px;color:var(--muted)}.blacklist-item button{padding:7px 9px;border-radius:10px;background:rgba(40,239,209,.11);color:var(--cyan);font-size:8px}.blacklist-empty{display:flex;min-height:360px;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted)}.blacklist-empty>span{display:grid;place-items:center;width:46px;height:46px;border-radius:16px;background:rgba(255,255,255,.06);font-size:20px}.blacklist-empty b{margin-top:12px;color:white;font-size:12px}.blacklist-empty small{margin-top:5px;font-size:8px}.clear-blacklist{width:100%;margin-top:14px;padding:11px;border-radius:13px;background:rgba(255,101,125,.1);color:#ff8ca0;font-size:9px}

.library-panel,.review-panel{position:absolute;z-index:60;inset:0;padding:29px 16px 18px;background:#0e1116;transform:translateX(105%);transition:transform .35s cubic-bezier(.2,.8,.2,1);overflow:auto}.library-panel.open,.review-panel.open{transform:none}.library-panel header,.review-panel header{display:flex;align-items:center;gap:10px;margin-bottom:18px}.library-panel header>button,.review-panel header>button{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.07);font-size:27px;line-height:25px}.library-panel header b,.library-panel header small,.review-panel header b,.review-panel header small{display:block}.library-panel header b,.review-panel header b{font-size:14px}.library-panel header small,.review-panel header small{margin-top:3px;font-size:8px;color:var(--muted)}
.library-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:10px}.library-metrics>div{padding:11px 8px;border-radius:13px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);text-align:center}.library-metrics strong,.library-metrics small{display:block}.library-metrics strong{color:var(--cyan);font-size:18px}.library-metrics small{margin-top:4px;color:var(--muted);font-size:7px}.start-review{width:100%;height:40px;margin-bottom:13px;border-radius:13px;background:var(--cyan);color:#07110e;font-size:10px;font-weight:700}.start-review:disabled{opacity:.42;cursor:not-allowed}.library-state{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;margin:8px 0 13px;padding:13px;border-radius:15px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09)}.library-state>span{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(40,239,209,.12);color:var(--cyan);font-size:18px}.library-state b,.library-state small{display:block}.library-state b{font-size:10px}.library-state small{margin-top:4px;color:var(--muted);font-size:8px;line-height:1.5}.library-state>button{grid-column:1/-1;height:40px;border-radius:12px;background:rgba(40,239,209,.14);color:var(--cyan);font-size:9px;font-weight:700}.library-list{display:grid;gap:9px}.library-card{display:grid;grid-template-columns:75px 1fr;gap:10px;padding:8px;border-radius:15px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);text-align:left}.library-card img{width:75px;height:77px;border-radius:10px;object-fit:cover;background:rgba(255,255,255,.07)}.library-card b,.library-card small{display:block}.library-card b{font-size:12px}.library-card small{margin-top:4px;color:var(--muted);font-size:8px;line-height:1.35}.library-card .card-status{color:var(--cyan)}.library-card .review-now{margin-top:7px;padding:8px 9px;min-height:36px;border-radius:9px;background:rgba(40,239,209,.12);color:var(--cyan);font-size:8px}.library-empty{display:flex;min-height:285px;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted)}.library-empty>span{display:grid;place-items:center;width:46px;height:46px;border-radius:16px;background:rgba(255,255,255,.06);font-size:20px}.library-empty b{margin-top:12px;color:white;font-size:12px}.library-empty small{max-width:220px;margin-top:5px;font-size:8px;line-height:1.6}.library-empty button{margin-top:16px;padding:10px 13px;min-height:42px;border-radius:12px;background:var(--cyan);color:#07110e;font-size:9px;font-weight:700}
.library-state[hidden],.library-empty[hidden]{display:none}
.review-panel{z-index:65}.review-panel header{margin-bottom:14px}.review-panel>img{width:100%;height:285px;border-radius:20px;object-fit:cover;background:rgba(255,255,255,.06)}.review-copy{padding:17px 4px}.review-copy span{color:var(--cyan);font-size:8px;letter-spacing:.14em;font-weight:700}.review-copy p{margin:8px 0;color:var(--muted);font-size:11px;line-height:1.5}.review-copy h2{margin:0;font-size:24px;line-height:1.15;letter-spacing:-.04em}.review-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.review-actions button{height:46px;border-radius:14px;font-size:10px;font-weight:700}.review-actions .again{background:rgba(255,255,255,.1)}.review-actions .remember{background:var(--cyan);color:#07110e}.review-result{padding:13px;border-radius:15px;background:rgba(40,239,209,.08);border:1px solid rgba(40,239,209,.2)}.review-result p{margin:0 0 10px;color:#d8fff8;font-size:9px;line-height:1.5}.review-result .review-example{margin:10px 0 4px;color:#fff;font-size:10px}.review-result .review-translation{display:block;margin-bottom:11px;color:var(--muted);font-size:8px;line-height:1.5}.review-result>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.review-result button{height:43px;border-radius:12px;background:rgba(255,255,255,.08);font-size:8px;font-weight:700}.review-result .review-finish{grid-column:1/-1;background:var(--cyan);color:#07110e}

.auth-modal{position:fixed;z-index:100;inset:0;display:none;place-items:center;padding:24px;background:rgba(3,5,7,.72);backdrop-filter:blur(12px)}.auth-modal.open{display:grid;animation:fadeIn .2s}.auth-card{position:relative;width:min(100%,380px);padding:28px;border-radius:24px;background:#15181f;border:1px solid var(--border);box-shadow:0 34px 90px rgba(0,0,0,.5)}.auth-close{position:absolute;right:16px;top:16px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.07);font-size:19px}.auth-card .eyebrow{margin:20px 0 8px}.auth-card h2{font-size:27px;margin:0}.auth-card>p:not(.eyebrow){margin:9px 0 22px;color:var(--muted);font-size:12px;line-height:1.6}.auth-card label{display:block;margin-bottom:7px;font-size:10px;color:var(--muted)}.auth-card input{width:100%;height:46px;padding:0 13px;border-radius:12px;border:1px solid var(--border);outline:0;background:rgba(255,255,255,.05)}.auth-card input:focus{border-color:var(--cyan)}.auth-error{display:block;min-height:18px;padding-top:6px;color:var(--red);font-size:9px}.auth-submit{width:100%;height:46px;border-radius:13px;background:var(--cyan);color:#06110e;font-weight:700}.auth-submit:disabled{opacity:.55;cursor:wait}

@media(max-width:860px){.stage{display:block;padding:0}.story-panel{display:none}.phone{width:100vw;height:100dvh;max-height:none;aspect-ratio:auto;border-radius:0;box-shadow:none}}
@media(min-width:861px) and (max-height:760px){.phone{max-height:calc(100dvh - 30px);width:auto}.story-panel h1{font-size:48px}.eyebrow{margin-top:32px}.story-copy{margin:18px 0 22px}.journey-step{padding:11px 0}.privacy-note{margin-top:16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}