.vocabulary-shell{--vocab-ink:#f5f2ff;color:#f5f2ff;background:#151224;height:100dvh;font-family:Inter,sans-serif;overflow:hidden}.vocabulary-shell :is(button,a,select,input):focus-visible{outline-offset:4px;outline:3px solid}.vocabulary-shell button{cursor:pointer}.vocabulary-shell button:disabled{opacity:.4;cursor:default}.vocab-toolbar{z-index:50;top:max(12px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));color:#fff;position:fixed}.vocab-toolbar-row,.vocab-toolbar-actions,.vocab-card-heading,.vocab-card-actions,.vocab-scroll-nav{align-items:center;gap:12px;display:flex}.vocab-toolbar-row{justify-content:space-between}.vocab-brand{text-shadow:0 2px 14px #0009;letter-spacing:-1px;font-size:22px;font-weight:800;line-height:1.2}.vocab-brand>span{color:#bbf7d0}.vocab-brand small{color:#ffffffb3;letter-spacing:.04em;margin-top:4px;font-size:10px;font-weight:400;display:block}.vocab-icon-button{border:1px solid color-mix(in srgb,currentColor 25%,transparent);color:#fff;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#12101d40;border-radius:50%;flex-shrink:0;place-items:center;width:44px;height:44px;display:inline-grid}.vocab-icon-button:hover:not(:disabled){background:color-mix(in srgb,currentColor 10%,transparent)}.vocab-options{width:min(100%,520px);max-height:calc(100dvh - 110px - env(safe-area-inset-top));background:#252136;border:1px solid #58506e;border-radius:22px;margin-top:14px;margin-left:auto;padding:22px;overflow-y:auto;box-shadow:0 20px 60px #0008}.vocab-options-summary{color:#d4cfe2;font-size:12px;line-height:1.7}.vocab-select-grid{grid-template-columns:1fr 1fr;gap:16px;margin:18px 0;display:grid}.vocab-select-grid label{flex-direction:column;gap:8px;font-size:12px;font-weight:600;display:flex}.vocab-select-grid select{color:#f5f2ff;background:#181426;border:1px solid #665d7a;border-radius:10px;width:100%;min-width:0;min-height:44px;padding:10px}.vocab-autoplay{align-items:center;gap:10px;min-height:44px;font-size:13px;display:flex}.vocab-autoplay input{accent-color:#bbf7d0;width:20px;height:20px}.vocab-site-links{flex-wrap:wrap;gap:16px;margin-top:16px;font-size:13px;display:flex}.vocab-site-links>*{text-underline-offset:4px;align-items:center;min-height:44px;text-decoration:underline;display:flex}.vocab-viewport{overscroll-behavior-y:contain;scroll-snap-type:y mandatory;overflow-anchor:none;scrollbar-width:none;touch-action:pan-y;height:100dvh;overflow-y:auto}.vocab-viewport::-webkit-scrollbar{display:none}.vocab-viewport:focus-visible{outline-offset:-3px;outline:2px solid #bbf7d0}.vocab-virtual-track{width:100%;position:relative}.vocab-slot{scroll-snap-align:start;scroll-snap-stop:always;box-sizing:border-box;justify-content:center;width:100%;display:flex;position:absolute;top:0;left:0}.vocab-card{isolation:isolate;width:100%;height:100%;position:relative;overflow:hidden}.vocab-backdrop{pointer-events:none;z-index:-1;position:absolute;inset:0;overflow:hidden}.vocab-backdrop:after{content:"";background:linear-gradient(#0005,#0000 28% 65%,#0005);position:absolute;inset:0}.vocab-card-heading{z-index:3;top:max(80px,calc(env(safe-area-inset-top) + 68px));left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));color:#fff;gap:6px;position:absolute}.vocab-chip{border:1px solid color-mix(in srgb,currentColor 25%,transparent);text-transform:uppercase;letter-spacing:.07em;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#12101d40;border-radius:50px;padding:5px 9px;font-size:10px}.vocab-theme-name{text-align:right;margin-left:auto;font-family:Inter,sans-serif;font-size:10px}.vocab-caption{display:none}.vocab-stage{position:absolute;inset:0}.vocab-stage>.vocab-eyebrow{top:max(124px,calc(env(safe-area-inset-top) + 112px));left:max(24px,env(safe-area-inset-left));color:#fff;text-shadow:0 2px 10px #0008;position:absolute}.vocab-stage>.vocab-translation{bottom:max(160px,calc(env(safe-area-inset-bottom) + 150px));text-align:center;color:#fff;text-shadow:0 2px 12px #000b;position:absolute;left:8%;right:8%}.vocab-eyebrow{letter-spacing:.16em;text-transform:uppercase;color:var(--vocab-accent,#bbf7d0);flex-shrink:0;font-family:Inter,sans-serif;font-size:10px}.vocab-stage-text{pointer-events:none;position:absolute;inset:0}.vocab-reveal-details{top:56%;bottom:max(154px,calc(env(safe-area-inset-bottom) + 144px));overscroll-behavior-y:contain;scrollbar-width:thin;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;background:#12101d66;border-radius:16px;width:min(680px,84%);padding:14px 18px;font-family:Inter,sans-serif;font-size:clamp(14px,1.6vw,18px);line-height:1.6;position:absolute;left:50%;overflow-y:auto;transform:translate(-50%)}.vocab-pronunciation{color:#fff;margin-bottom:18px;font-size:14px}.vocab-example{border-top:1px solid color-mix(in srgb,currentColor 22%,transparent);margin-top:18px;padding-top:14px}.vocab-translation{margin-top:10px;font-family:Inter,sans-serif;font-size:14px;line-height:1.65}.vocab-progress{z-index:3;bottom:max(128px,calc(env(safe-area-inset-bottom) + 118px));gap:5px;width:min(440px,100% - 48px);display:flex;position:absolute;left:50%;transform:translate(-50%)}.vocab-progress span{background:#ffffff40;border-radius:4px;flex:1;height:3px;overflow:hidden}.vocab-progress span[data-complete=true]{background:#fff}.vocab-progress i{transform-origin:0;background:#fff;width:100%;height:100%;animation:linear forwards vocab-page-progress;display:block;transform:scaleX(0)}@keyframes vocab-page-progress{to{transform:scaleX(1)}}.vocab-card-actions{z-index:3;bottom:max(60px,calc(env(safe-area-inset-bottom) + 50px));justify-content:space-between;gap:10px;width:min(360px,100% - 48px);position:absolute;left:50%;transform:translate(-50%)}.vocab-reveal-button{background:var(--vocab-ink);color:#252136;border-radius:30px;flex:1;justify-content:center;align-items:center;gap:8px;min-height:46px;font-family:Inter,sans-serif;font-size:13px;font-weight:700;display:inline-flex}.vocab-card .vocab-reveal-button:focus-visible{outline-color:var(--vocab-ink)}.vocab-reveal-button{color:var(--vocab-button-ink,#252136)}.vocab-card-footer{bottom:max(22px,env(safe-area-inset-bottom));left:max(24px,env(safe-area-inset-left));color:#fff;text-shadow:0 2px 10px #0008;flex-direction:column;gap:4px;font-family:Inter,sans-serif;font-size:10px;display:flex;position:absolute}.vocab-scroll-nav{z-index:20;bottom:max(8px,env(safe-area-inset-bottom));color:#fff;text-shadow:0 2px 10px #0008;justify-content:space-between;width:min(490px,100% - 44px);font-size:11px;position:fixed;left:50%;transform:translate(-50%)}.vocab-scroll-nav .vocab-icon-button{width:40px;height:40px}.vocab-empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:20px;height:100dvh;padding:100px 28px;display:flex}.vocab-empty h1{font-size:clamp(24px,5vw,38px);font-weight:700}.vocab-empty>p:not(.vocab-eyebrow){color:#c9c3dd;max-width:360px;font-size:14px;line-height:1.7}.vocab-light-button{color:#17231b;background:#bbf7d0;border-radius:40px;padding:14px 24px;font-weight:700}.vocab-stream-status{z-index:30;bottom:max(66px,calc(env(safe-area-inset-bottom) + 58px));color:#fff;background:#282237;border:1px solid #6b607f;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;width:min(480px,100% - 36px);padding:14px 18px;font-size:12px;display:flex;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0005}.vocab-stream-status button{min-height:44px;font-weight:700;text-decoration:underline}@media(max-width:760px){.vocab-card-footer{display:none}}@media(max-width:380px){.vocab-brand small{display:none}.vocab-toolbar-actions{gap:6px}.vocab-card-heading{flex-wrap:wrap}.vocab-theme-name{font-size:9px}}@media(max-height:620px){.vocab-caption,.vocab-card-footer,.vocab-stage>.vocab-eyebrow{display:none}.vocab-reveal-details{padding:8px 12px;top:50%}}@media(prefers-reduced-motion:reduce){.vocabulary-shell *,.vocabulary-shell :before,.vocabulary-shell :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}