@import url('./design-system.css');
/* Eight vocabulary references, normalized from 853px to a 426px viewport.
   Images are decorative LayerLab crops; content and controls remain native DOM. */
.vocabulary-screen{--voc-muted:#7b89b1;--voc-blue:#0971ff;padding:20px 21px 24px;min-height:100dvh;overflow-wrap:anywhere;background:radial-gradient(ellipse at 120% 25%,#e6f4ffb0 0,transparent 50%),linear-gradient(130deg,#f5fbff,#eef8ff);position:relative;color:#060e34;isolation:isolate}
.vocabulary-screen:before{content:'';position:absolute;z-index:-1;pointer-events:none;right:-55px;top:-35px;width:280px;height:440px;border:42px solid #e0f0ff66;border-radius:48%;transform:rotate(-36deg)}
.voc-header{min-height:39px;display:flex;align-items:center;gap:15px;margin-bottom:24px;position:relative}
.voc-header h1{font-size:21px;line-height:1.3;letter-spacing:-.6px;font-weight:750;flex:1}
.voc-header.centered h1{position:absolute;left:40px;right:40px;text-align:center;pointer-events:none}
.voc-header.centered>button:last-of-type:not(:first-child),.voc-header.centered .voc-quiz-kind{margin-left:auto;z-index:1}
.voc-icon{display:inline-flex;align-items:center;justify-content:center;padding:0;min-width:24px;min-height:36px;flex-shrink:0;color:#111e49}
.voc-sample{font-size:10px;background:#fff8d7;color:#846c16;border-radius:5px;padding:2px 4px;position:absolute;right:0;top:-13px}
.voc-hero{position:relative;min-height:132px;padding-top:7px;margin-bottom:13px}
.voc-hero h2{font-size:28px;line-height:1.34;letter-spacing:-1px;font-weight:790;position:relative;z-index:1}
.voc-hero p{font-size:16px;line-height:1.5;color:#7480a5;margin-top:8px;letter-spacing:-.3px;position:relative;z-index:1}
.voc-robot{display:block;object-fit:contain;mix-blend-mode:multiply;user-select:none;pointer-events:none}
.voc-hero>.voc-robot{position:absolute;right:-4px;bottom:-12px;width:143px;max-height:166px;object-position:bottom}
.route-vocabulary-history .voc-hero{min-height:113px;padding-top:7px;margin-bottom:0}
.route-vocabulary-history .voc-hero h2{font-size:28px;line-height:1.4}
.route-vocabulary-history .voc-hero>.voc-robot{width:123px;right:1px;bottom:-5px}
.route-vocabulary-book .voc-header{margin-bottom:22px}
.route-vocabulary-book .voc-hero{min-height:121px}
.route-vocabulary-book .voc-hero>.voc-robot{width:146px;right:4px;bottom:-10px}
.route-vocabulary-review .voc-header{margin-bottom:36px}
.route-vocabulary-review .voc-hero{min-height:130px;margin-bottom:12px}
.route-vocabulary-review .voc-hero h2{font-size:26px;line-height:1.45;letter-spacing:-1px}
.route-vocabulary-review .voc-hero p{font-size:17px}
.route-vocabulary-review .voc-hero>.voc-robot{width:136px;right:-2px;bottom:-13px}
.voc-search{height:49px;border:1px solid #d6e4f7;border-radius:17px;background:#ffffffba;display:flex;align-items:center;gap:11px;padding:0 16px;color:var(--voc-muted);margin:12px 0 9px}
.voc-search input{min-width:0;flex:1;border:0;outline:none;background:transparent;color:#172348;font-size:16px;padding:8px 0;box-shadow:none}
.voc-search input::placeholder{color:#8b98ba}
.voc-search:focus-within{outline:2px solid #2580ff;outline-offset:2px}
.route-vocabulary-history .voc-search{height:50px;border:0;border-radius:30px;margin:7px 0 19px;background:white}
.voc-language-tabs{display:flex;align-items:center;background:#ffffff80;border:1px solid #d7e4f5;border-radius:22px;padding:3px;margin-bottom:11px;gap:0}
.voc-language-tabs button{flex:1;padding:9px 0;border-radius:20px;font-weight:650;font-size:16px;color:#7985aa;min-width:0}
.voc-language-tabs button.active{background:linear-gradient(120deg,#1a80ff,#0670ff);color:white}
.voc-language-tabs.counted{border:0;background:transparent;padding:0;gap:8px;margin-bottom:17px}
.voc-language-tabs.counted button{border:1px solid #e1eaf9;background:#ffffffcc;font-size:15px;height:38px}
.voc-language-tabs.counted button.active{border-color:transparent;background:#dfedff;color:#076bff}
.voc-list-heading{display:flex;justify-content:space-between;align-items:center;margin:17px 0 10px;gap:8px}
.voc-list-heading h2{font-size:19px;font-weight:750;line-height:1.4;letter-spacing:-.4px}
.voc-list-heading>span{color:#8895b9;font-size:14px}
.voc-history-card{background:white;border-radius:23px;padding:14px 15px 15px;display:flex;gap:11px;align-items:center;justify-content:space-between;margin-bottom:10px;min-height:126px;box-shadow:0 6px 18px #4589bd03}
.voc-history-card>div{min-width:0;flex:1}
.voc-history-meta{display:flex;align-items:center;gap:9px;margin-bottom:3px}
.voc-language{display:inline-flex;align-items:center;justify-content:center;color:#076bff;background:#e1f0ff;border-radius:11px;padding:4px 11px;font-size:13px;font-weight:650;line-height:1.3;white-space:nowrap}
.voc-language.ko{background:#dcf7ef;color:#029879}
.route-vocabulary-history .voc-language.en,.voc-review-languages .en,.voc-question-card .voc-language.en{background:#d7f7ea;color:#009c7e}
.route-vocabulary-history .voc-language.ko{background:#efebff;color:#8251ef}
.voc-history-card small{color:#8592b5;font-size:13px;line-height:1.6;display:block}
.voc-title-button{display:block;font-size:23px;font-weight:760;line-height:1.35;text-align:left;padding:0;letter-spacing:-.3px}
.voc-history-card p{font-size:16px;line-height:1.6;margin:1px 0 3px}
.voc-save{border:1px solid #1277ff;color:#0670ff;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:8px 11px;font-size:14px;font-weight:650;flex-shrink:0}
.voc-save.saved{background:#dff8f0;color:#009981;border-color:transparent}
.voc-save.saved:not(.compact) svg{background:#00a68c;color:white;border-radius:50%;padding:3px;width:20px;height:20px}
.voc-save.compact{border:0;border-radius:0;min-height:26px;padding:0;background:transparent;color:#0873ff}
.voc-save.compact.saved svg{fill:#167bff;stroke:#066eff;stroke-width:1.2}
.voc-note{background:#e4f2ffcc;border:1px solid #dcebfd;border-radius:16px;display:flex;align-items:center;gap:18px;padding:13px 17px;color:#0771ff;margin:16px 0 7px}
.voc-note svg{flex-shrink:0}
.voc-note p{line-height:1.5;font-size:14px;color:#8492b7}
.voc-note b{display:block;color:#0c1941;font-weight:650}
.voc-note span{display:block}
.voc-primary,.voc-secondary{display:flex;justify-content:center;align-items:center;gap:11px;width:100%;min-height:50px;padding:11px 16px;border-radius:16px;font-size:17px;line-height:1.4;font-weight:650;text-align:center;letter-spacing:-.3px}
.voc-primary{background:linear-gradient(110deg,#117cff,#0967ff);color:white;box-shadow:0 4px 10px #0874ff0b}
.voc-primary>svg:last-child:not(:first-child){margin-left:auto}
.voc-primary>svg:last-child:not(:first-child)+span{margin-right:auto}
.voc-secondary{background:#ffffffee;border:1px solid #bcdcff;color:#1176ff;margin-top:10px;font-weight:500}
.voc-primary:disabled{cursor:default;opacity:.5}
.voc-stats{background:white;border-radius:17px;display:flex;justify-content:space-evenly;padding:18px 0;margin:12px 0}
.voc-stats>div{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;border-right:1px solid #e0eaf8}
.voc-stats>div:last-child{border:0}
.voc-stats span{font-size:13px;color:#7784a9;line-height:1.5}
.voc-stats b{font-size:28px;line-height:1.2;letter-spacing:-.6px}
.voc-stats b.blue{color:#0c74ff}
.voc-stats b small{font-size:20px}
.voc-hide-row{background:#ffffffef;border-radius:13px;display:flex;align-items:center;justify-content:space-between;min-height:38px;padding:7px 13px;margin-bottom:12px;font-size:15px;position:relative;cursor:pointer}
.voc-hide-row input{position:absolute;right:13px;top:7px;width:44px;height:24px;opacity:0;cursor:pointer;z-index:1;margin:0}
.voc-switch{width:43px;height:24px;border-radius:20px;background:#c5cfe4;position:relative}
.voc-switch:before{content:'';width:20px;height:20px;position:absolute;left:2px;top:2px;border-radius:50%;background:white;transition:transform .15s}
.voc-hide-row input:checked+.voc-switch{background:#1176ff}
.voc-hide-row input:checked+.voc-switch:before{transform:translateX(19px)}
.voc-hide-row input:focus-visible+.voc-switch{outline:2px solid #267bff;outline-offset:3px}
.voc-word-card{background:white;border-radius:18px;padding:13px 15px 12px;margin-bottom:12px;box-shadow:0 5px 15px #2985ce04}
.voc-word-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:3px}
.voc-word-line{display:flex;align-items:center;gap:11px;min-width:0}
.voc-word-line .voc-title-button{font-size:25px;line-height:1.35}
.voc-speak{color:#7a86ad;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:3px;min-height:30px;flex-shrink:0}
.voc-speak.with-label{color:#0775ff;font-size:15px;font-weight:650;gap:8px}
.voc-word-meaning{font-size:16px;line-height:1.5;color:#7885aa;margin:1px 0 5px}
.voc-example{background:#eff7ff;border-radius:12px;padding:9px 12px;color:#7a87aa;font-size:14px;line-height:1.5;margin:6px 0 8px}
.voc-example strong{color:#0874ff;font-weight:650}
.voc-word-card footer{display:flex;align-items:center;justify-content:space-between;gap:5px;min-height:26px}
.voc-word-card footer small{min-width:0;flex:1;line-height:1.4;font-size:11px;color:#7f8eb0}
.voc-word-card footer>div{display:flex;align-items:center;gap:7px;flex-shrink:0}
.voc-word-card footer button{font-size:12px;color:#7381a6;padding:4px 0;display:flex;align-items:center;gap:4px}
.voc-due{border-radius:20px;padding:4px 10px;background:#e5f3ff;color:#0677ff;font-size:11px;font-weight:600;white-space:nowrap}
.voc-due.later{background:#eef3f8;color:#7b89a3}
.voc-reveal{font-size:14px;color:#0b74fc;display:flex;align-items:center;gap:7px;margin:4px 0 6px;padding:2px 0;min-height:24px}
.voc-review-summary{background:#fff;border-radius:24px;padding:24px 13px 17px;margin:12px 0 25px}
.voc-review-main{display:flex;align-items:center;gap:12px;padding:1px 4px 18px}
.voc-book-circle{display:grid;place-items:center;width:73px;height:73px;background:#e4f2ff;color:#1380ff;border-radius:50%;flex-shrink:0}
.voc-book-circle img{width:37px;height:36px;object-fit:contain}
.voc-review-main h2{font-size:17px;letter-spacing:-.3px;font-weight:700}
.voc-review-main p{font-size:22px;font-weight:650;line-height:1.2;margin-top:5px;white-space:nowrap}
.voc-review-main strong{font-size:50px;color:#0874ff;letter-spacing:-2px;line-height:1}
.voc-review-languages{display:flex;flex-direction:column;gap:9px;margin-left:auto}
.voc-review-languages .voc-language{min-width:76px;font-size:14px;border-radius:20px;padding:5px 10px}
.voc-review-languages .ko{color:#6b77a5;background:#ecefff}
.voc-review-meta{display:flex;align-items:center;border-top:1px solid #e3ebf7;padding-top:18px;gap:10px}
.voc-review-meta span{display:flex;align-items:center;justify-content:center;gap:9px;flex:1;font-size:15px;font-weight:650;white-space:nowrap;color:#6777a2}
.voc-review-meta span:first-child{border-right:1px solid #e1eaf6;color:#0b173d}
.voc-review-meta svg{width:25px;height:25px;color:#6576a6}
.voc-section-title{font-size:21px;line-height:1.4;margin:0 0 13px}
.voc-mode-options{display:grid;gap:12px}
.voc-mode{display:flex;align-items:center;gap:20px;border:1.5px solid transparent;background:white;border-radius:18px;min-height:82px;padding:15px 17px;text-align:left;box-shadow:0 5px 12px #6aa6ce05}
.voc-mode.selected{background:#eef8ffb0;border-color:#0b76ff;box-shadow:0 0 0 .5px #0b76ff}
.voc-radio{width:24px;height:24px;border:1.5px solid #aab4c6;border-radius:50%;position:relative;flex-shrink:0;background:white}
.voc-mode.selected .voc-radio{border-color:#0074ff}
.voc-mode.selected .voc-radio:after{content:'';position:absolute;inset:4px;background:#067aff;border-radius:50%}
.voc-mode-art{width:57px;height:48px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#207afa}
.voc-mode-art img{max-width:57px;max-height:48px;mix-blend-mode:multiply;object-fit:contain}
.voc-mode strong{display:block;font-size:18px;line-height:1.4;margin-bottom:3px;letter-spacing:-.4px}
.voc-mode small{font-size:14px;line-height:1.5;color:#7282aa;display:block;letter-spacing:-.3px}
.voc-mode-mixed{display:flex;align-items:center;position:relative;width:57px;height:45px}
.voc-mode-mixed b{display:grid;place-items:center;width:32px;height:40px;color:#255fa2;background:#cfeaff;border-radius:7px;transform:rotate(-12deg);font-size:23px;position:absolute;left:0;top:0}
.voc-mode-mixed b+b{left:27px;top:7px;background:#b5f2ee;color:#0d7773;transform:rotate(10deg)}
.voc-pencil{font-size:51px;line-height:1;color:#1177fc}
.voc-tip{display:flex;align-items:center;gap:10px;background:#deecff99;border-radius:22px;width:fit-content;padding:9px 12px;color:#63749f;font-size:14px;font-weight:550;margin:16px 0 21px}
.voc-tip svg{color:#167bfc}
.voc-resume{background:#e7f3ff;border-radius:15px;padding:10px;margin-bottom:12px;text-align:center}
.voc-resume p{font-size:13px;margin-bottom:7px;color:#6c80a5}
.voc-quiz-kind{font-size:14px;line-height:1.5;color:#1375ff;font-weight:600;border-radius:20px;background:#dfeeff;padding:5px 13px;white-space:nowrap}
.route-vocabulary-quiz .voc-header{margin-bottom:18px}
.voc-progress{display:flex;align-items:center;gap:11px;min-height:16px;margin-bottom:36px}
.voc-progress progress{height:11px;flex:1;min-width:0;border:0;border-radius:20px;overflow:hidden;appearance:none;background:#dce7f4}
.voc-progress progress::-webkit-progress-bar{background:#dce7f4;border-radius:20px}
.voc-progress progress::-webkit-progress-value{background:#0d78ff;border-radius:20px}
.voc-progress progress::-moz-progress-bar{background:#0d78ff;border-radius:20px}
.voc-progress>span{font-size:14px;white-space:nowrap;color:#7485ac}
.voc-question-title{font-size:26px;font-weight:760;letter-spacing:-.8px;line-height:1.4;text-align:center;margin-bottom:20px}
.voc-question-card{background:white;border-radius:19px;padding:15px 15px 14px;margin-bottom:15px;box-shadow:0 3px 11px #398bf319}
.voc-question-card>.voc-language{border-radius:15px;min-height:27px}
.voc-question-card h3{text-align:center;font-size:51px;font-weight:760;line-height:1.2;margin:10px 0 9px;letter-spacing:-1px;overflow-wrap:anywhere}
.voc-question-card>.voc-speak{display:flex;margin:11px auto 22px}
.voc-question-example{background:#f0f8ff;border-radius:13px;padding:18px 19px 13px;margin-top:13px}
.voc-question-example p{font-size:19px;line-height:1.5;color:#0f1c48;letter-spacing:-.2px}
.voc-question-example strong{background:#deedff;border-radius:5px;padding:3px 4px}
.voc-question-example small{display:block;font-size:12px;color:#8294b5;line-height:1.5;margin-top:11px}
.voc-answers{display:grid;gap:10px}
.voc-answer{background:#ffffffee;border:1px solid #d4e4f9;border-radius:15px;display:flex;align-items:center;gap:17px;min-height:60px;padding:12px 15px;text-align:left;color:#0b173e;font-size:18px;line-height:1.5;letter-spacing:-.4px}
.voc-answer.selected{background:#e4f3ff;border:1.5px solid #0577ff;box-shadow:0 0 0 .5px #0577ff}
.voc-answer:disabled{opacity:1}
.voc-choice-number{flex-shrink:0;display:grid;place-items:center;width:28px;height:28px;border:1px solid #d5dce8;background:#f7f9fb;border-radius:50%;font-size:17px;font-weight:600;color:#525e7c}
.voc-answer.selected .voc-choice-number{border-color:#1c80ff;background:#dfedff;color:#0078ff}
.voc-choice-check{margin-left:auto;border:2px solid #cbd3e1;border-radius:50%;width:25px;height:25px;display:grid;place-items:center;flex-shrink:0}
.voc-answer.selected .voc-choice-check{background:#0077ff;border-color:#0077ff;color:white}
.voc-quiz-help{position:relative;display:flex;align-items:flex-start;gap:16px;min-height:102px;padding:9px 20px 0}
.voc-quiz-help .voc-robot{width:84px;height:96px;object-position:top}
.voc-quiz-help p{font-size:13px;line-height:1.5;color:#798bb0;background:white;border-radius:18px;padding:10px 16px;position:relative;margin-top:13px}
.voc-quiz-help p:before{content:'';position:absolute;left:-8px;top:14px;border-top:8px solid transparent;border-bottom:8px solid transparent;border-right:9px solid white}
.voc-skip{color:#8392b4;text-decoration:underline;text-underline-offset:3px;display:block;margin:3px auto 14px;padding:7px;font-size:14px;font-weight:600;line-height:1.5}
.voc-quiz-actions .voc-primary{min-height:53px;border-radius:16px;font-size:18px}
.voc-question-card.input{border:1px solid #ddecff;padding:15px 17px 17px;margin-top:-4px}
.voc-question-card.input h3{font-size:28px;margin:10px 0 9px;line-height:1.4;letter-spacing:-.6px}
.voc-question-card.input .voc-part{text-align:center;font-size:15px;margin:0 0 14px;color:#8697b7}
.voc-question-card.input .voc-question-example{padding:15px 17px;margin-top:8px;text-align:center}
.voc-question-card.input .voc-question-example p{color:#697da6;font-size:17px;line-height:1.5}
.voc-input-hint{display:flex;justify-content:center;align-items:center;gap:9px;color:#46628f;font-size:15px;font-weight:550;background:#e2f0ff;border-radius:22px;padding:9px 15px;width:fit-content;margin:16px auto 12px}
.voc-input-hint svg{color:#f0af0b}
.voc-answer-form{margin:11px 0 13px}
.voc-answer-form label{font-size:14px;font-weight:550;color:#8090b3;display:block;line-height:1.4;margin-bottom:6px}
.voc-answer-form input{height:49px;border:1.5px solid #2987ff;border-radius:15px;width:100%;background:white;padding:10px 16px;font-size:21px;color:#16264c;box-shadow:0 2px 7px #388aff0d;outline:none}
.voc-answer-form input:focus{box-shadow:0 0 0 1px #1681ff}
.voc-answer-form p{font-size:12px;color:#8898bb;margin-top:5px}
.voc-answer-form+.voc-quiz-actions .voc-primary{min-height:48px}
.voc-feedback{background:#e2f8f0;border:1px solid #b8e9d4;border-radius:16px;padding:15px;margin:17px 0 14px}
.voc-feedback h2{display:flex;align-items:center;gap:8px;font-size:19px;color:#04947a;line-height:1.4}
.voc-feedback p{font-size:16px;margin-top:8px;line-height:1.6}
.voc-feedback small{display:block;color:#64867e;font-size:13px;line-height:1.5;margin-top:4px}
.voc-feedback.incorrect{background:#fff3e9;border-color:#f7dec5}.voc-feedback.incorrect h2{color:#c17a29}
.voc-pending-note{font-size:12px;color:#7c87a3;margin-top:6px;text-align:center}
.voc-result-hero{text-align:center;margin-top:-5px;margin-bottom:18px}
.voc-result-hero .voc-robot{width:231px;height:145px;object-fit:contain;margin:0 auto 3px}
.voc-result-hero h2{font-size:26px;line-height:1.4;font-weight:750;letter-spacing:-.8px;margin-top:0}
.voc-result-hero p{font-size:16px;line-height:1.5;color:#8a99b9;margin-top:6px}
.voc-result-score{background:white;border-radius:24px;text-align:center;padding:19px 16px 18px;margin-bottom:22px}
.voc-result-score h3{font-size:18px;font-weight:650;line-height:1.4}
.voc-result-score>p{font-size:60px;color:#0975ff;font-weight:760;line-height:1.15;letter-spacing:-2px;margin:4px 0 12px}
.voc-result-score>p>span{font-size:40px;letter-spacing:-1px;margin-left:2px}
.voc-result-score .voc-stats{border-top:1px solid #e0eafb;border-radius:0;margin:0;padding:14px 0 0}
.voc-result-score .voc-stats span{font-size:14px}
.voc-result-score .voc-stats b{font-size:26px;line-height:1.35}
.voc-result-score .voc-stats b small{font-size:22px}
.voc-list-heading>.voc-count{font-size:14px;color:#0b173e;background:#dfeeff;border-radius:20px;padding:5px 14px;line-height:1.5}
.voc-result-words{display:grid;gap:8px}
.voc-result-words article{display:flex;align-items:flex-start;gap:19px;border-radius:19px;background:white;padding:13px 15px;min-height:65px}
.voc-result-words article>.voc-language{margin-top:0;padding:6px 11px}
.voc-result-words article strong{font-size:20px;font-weight:650;line-height:1.4}
.voc-result-words article p{font-size:14px;color:#8493b4;line-height:1.4;margin-top:1px}
.voc-result-words .voc-speak{color:#348cff;min-height:22px}
.voc-note.result{margin:16px 0 15px;padding:13px 18px;gap:20px}
.voc-note.result p{font-size:14px}
.voc-note.result span{font-size:12px;margin-top:2px}
.voc-empty{background:#ffffffd9;border-radius:19px;text-align:center;padding:32px 18px;margin:18px 0;color:#6d83a7}
.voc-empty>svg{color:#187dff;margin-bottom:10px}
.voc-empty h2{font-size:20px;color:#243c61;line-height:1.4;margin-bottom:10px}
.voc-empty p{font-size:14px;line-height:1.6}
.voc-error{border:1px solid #efd7c5;background:#fff8f2;border-radius:13px;padding:13px;margin:12px 0;color:#a76726;font-size:14px}
.voc-error p{line-height:1.6}.voc-error button{font-size:14px;color:#0d6ce8;padding:7px 0 0;font-weight:600}
.voc-close-overlay{position:fixed;z-index:120;inset:0;background:#18274744;display:flex;align-items:center;justify-content:center;padding:24px}
.voc-close-overlay>section{width:100%;max-width:345px;background:white;border-radius:22px;padding:24px;text-align:center;box-shadow:0 20px 60px #21365433}
.voc-close-overlay h2{font-size:22px;margin-bottom:12px}.voc-close-overlay p{font-size:15px;color:#7c8ba8;margin-bottom:23px}
/* The reader remains visible behind the lookup sheet; nothing rasterizes the text. */
.voc-lookup-overlay{position:fixed;z-index:110;inset:0;margin:auto;max-width:426px;display:flex;align-items:flex-end;background:#8dbcf812;pointer-events:auto;color:#09143c}
.voc-lookup-sheet{width:100%;max-height:min(76dvh,690px);overflow:auto;overscroll-behavior:contain;background:white;border-radius:25px 25px 0 0;padding:13px 22px calc(19px + env(safe-area-inset-bottom));box-shadow:0 -5px 24px #377bbe09;outline:none}
.voc-handle{display:block;width:49px;height:5px;border-radius:5px;background:#d7dce6;margin:0 auto 14px}
.voc-lookup-sheet>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.voc-lookup-sheet>header h2{font-size:23px;font-weight:750;line-height:1.4}
.voc-lookup-language{margin-bottom:9px}
.voc-lookup-language .voc-language{font-size:14px;min-height:28px;border-radius:20px;padding:5px 14px;background:#e3f0ff;color:#0877ff}
.voc-lookup-wordline{display:flex;align-items:center;gap:16px}
.voc-lookup-wordline h3{font-size:35px;line-height:1.2;letter-spacing:-.7px;font-weight:770;min-width:0;overflow-wrap:anywhere}
.voc-lookup-wordline .voc-speak{font-size:15px;gap:8px;white-space:nowrap;padding:0}
.voc-lookup-wordline .voc-speak svg{width:25px;height:25px}
.voc-selected-original{font-size:13px;color:#99a4bf;margin-top:5px;line-height:1.6}
.voc-part{font-size:14px;color:#8a97b3;margin:16px 0 6px;line-height:1.4}
.voc-pronunciation{font-size:12px;color:#92a0b9;margin:4px 0 -8px;line-height:1.4}
.voc-definition{font-size:27px;font-weight:730;line-height:1.4;letter-spacing:-.6px;margin-bottom:12px}
.voc-context-meaning{border-radius:17px;background:linear-gradient(110deg,#eef7ff,#ecf6ff);padding:14px 19px 13px;margin-top:11px}
.voc-context-meaning b{display:flex;align-items:center;gap:10px;font-size:14px;line-height:1.4;color:#0873ff;font-weight:650;margin-bottom:8px}
.voc-context-meaning b>span{background:#d7eaff;border-radius:20px;padding:5px 12px;margin-bottom:0}
.voc-context-meaning p{font-size:20px;line-height:1.5;letter-spacing:-.2px}
.voc-context-meaning small{display:block;border-top:1px solid #dbe6f1;margin-top:10px;padding-top:7px;font-size:12px;line-height:1.4;color:#8c99b3}
.voc-lookup-source{font-size:12px;line-height:1.4;color:#98a4bc;border-top:1px solid #e5edf8;margin-top:14px;padding-top:7px}
.voc-autosave{display:flex;align-items:center;gap:8px;color:#919db7;font-size:13px;line-height:1.5;padding:15px 0 13px;text-align:left}
.voc-autosave svg{flex-shrink:0}
.voc-lookup-sheet .voc-primary{border-radius:16px;min-height:55px;font-size:17px}
.voc-lookup-sheet .voc-primary.is-saved{background:#ddf8ef;color:#00947c;box-shadow:none}
.voc-lookup-sheet .voc-error{margin:0 0 12px}
.voc-dictionary-source{font-size:10px;color:#9aa6bc;margin:8px 0 0;line-height:1.3}
@media(max-width:380px){.vocabulary-screen{padding-left:16px;padding-right:16px}.voc-hero h2,.route-vocabulary-history .voc-hero h2{font-size:25px}.voc-hero p{font-size:14px}.voc-hero>.voc-robot{width:121px}.route-vocabulary-book .voc-hero>.voc-robot{width:123px}.route-vocabulary-review .voc-hero h2{font-size:23px}.route-vocabulary-review .voc-hero p{font-size:14px}.route-vocabulary-review .voc-hero>.voc-robot{width:119px}.voc-mode{gap:13px;padding-left:15px;padding-right:12px}.voc-mode strong{font-size:17px}.voc-mode small{font-size:12px}.voc-review-main{gap:9px}.voc-book-circle{width:59px;height:59px}.voc-review-main h2{font-size:15px}.voc-review-main strong{font-size:43px}.voc-review-main p{font-size:19px}.voc-review-languages .voc-language{font-size:12px;min-width:66px;padding:5px 7px}.voc-review-meta span{font-size:13px;gap:6px}.voc-question-title{font-size:23px}.voc-answer{font-size:16px;gap:12px}.voc-word-card footer{align-items:flex-start;gap:7px}.voc-word-card footer small{font-size:10px}.voc-word-card footer>div{gap:5px}.voc-word-card footer button{font-size:10px}.voc-due{font-size:10px;padding:4px 6px}.voc-lookup-wordline{gap:10px}.voc-lookup-wordline h3{font-size:30px}.voc-lookup-wordline .voc-speak{font-size:13px}.voc-definition{font-size:24px}.voc-context-meaning p{font-size:18px}.voc-lookup-sheet{padding-left:20px;padding-right:20px}.voc-note{gap:13px;padding-left:14px;padding-right:14px}.voc-note p{font-size:12px}.voc-result-hero h2{font-size:24px}}
@media(prefers-reduced-motion:reduce){.voc-switch:before{transition:none}}
.voc-source-icon{display:block;object-fit:contain;mix-blend-mode:multiply;flex-shrink:0}
.vocabulary-screen:has(.voc-question-card.input) .voc-question-title{text-align:left;font-size:23px;margin-bottom:20px}
.vocabulary-screen:has(.voc-question-card.input) .voc-progress{margin-bottom:25px}
.vocabulary-screen{overflow:clip}
.voc-batch-note{font-size:12px;line-height:1.5;color:#7788aa;margin:-13px 0 18px}
.voc-resume-note{font-size:12px;line-height:1.5;color:#7188af;margin:0 0 12px;text-align:center}
.voc-mode:disabled{opacity:.75;cursor:default}.voc-mode.selected:disabled{opacity:1}
/* Preserve the silhouette while fading the empty corners of opaque source crops. */
.voc-hero>.voc-robot,.voc-quiz-help>.voc-robot{--antenna-x:57%;mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent),radial-gradient(ellipse 62% 49% at 52% 63%,#000 94%,transparent 100%),radial-gradient(ellipse 9% 18% at var(--antenna-x) 12%,#000 85%,transparent 100%),radial-gradient(ellipse 20% 18% at 13% 31%,#000 70%,transparent 100%);mask-composite:intersect,add,add;-webkit-mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent),radial-gradient(ellipse 62% 49% at 52% 63%,#000 94%,transparent 100%),radial-gradient(ellipse 9% 18% at var(--antenna-x) 12%,#000 85%,transparent 100%),radial-gradient(ellipse 20% 18% at 13% 31%,#000 70%,transparent 100%);-webkit-mask-composite:source-in,source-over,source-over}
.route-vocabulary-book .voc-hero>.voc-robot{--antenna-x:50%}
.route-vocabulary-review .voc-hero>.voc-robot{--antenna-x:61%}
.route-vocabulary-history .voc-hero>.voc-robot{--antenna-x:61%}
.voc-result-hero>.voc-robot{mask-image:radial-gradient(ellipse 66% 61% at 50% 53%,#000 68%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 66% 61% at 50% 53%,#000 68%,transparent 100%)}