:root{font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;color:#253c34;background:#f7f8f2;font-synthesis:none;--green:#2a6951;--muted:#8a958e;--border:#e4e8de}
*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible{outline:3px solid #dca365;outline-offset:5px}button{color:inherit}a{color:inherit;text-decoration:none}[hidden]{display:none!important}
.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#f0f3e9;border-right:1px solid var(--border);padding:38px 25px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:750;letter-spacing:-1px}.brand-icon{background:#2c644e;color:#fff;border-radius:12px;width:38px;height:38px;text-align:center;line-height:32px;font:italic bold 31px Georgia}.brand-dot{font-size:9px;color:#dfad69;align-self:flex-start;margin:7px 0 0 -4px}.workspace-label{font-size:11px;letter-spacing:2px;color:#9ba391;margin:51px 12px 17px}.nav-item{display:flex;align-items:center;gap:14px;width:100%;padding:15px 17px;margin:5px 0;border:0;border-radius:9px;background:transparent;font-size:14px;color:#798477;text-align:left}.nav-item>span:first-child{font-size:21px;line-height:20px}.nav-item.active{color:#285c44;background:#e0e8d7;font-weight:650}.nav-count{margin-left:auto;font-size:11px;background:#ccdac2;border-radius:5px;padding:2px 7px}.side-note{margin-top:auto;padding:40px 13px}.plant{font-size:47px;color:#8d9d78}.side-note h3{font-size:14px;font-weight:500;margin:17px 0 12px}.side-note p{font-size:12px;color:#929a87;line-height:2}.note-line{width:25px;height:1px;background:#bbc4b0;margin:22px 0 14px}.side-note small{font-size:8px;color:#9ba68e;letter-spacing:2px}.connection{border:0;border-top:1px solid #dfe4d7;padding:22px 5px 0;background:none;display:flex;align-items:center;gap:9px;font-size:12px;color:#7c8976}.connection>span:last-child{margin-left:auto}.status-dot{width:6px;height:6px;background:#80a477;border-radius:50%}
main{max-width:1480px;margin-left:248px;padding:0 58px}header{height:88px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;color:#99a095;font-size:12px}header strong{font-weight:500;color:#596859}.slash{margin:0 15px;color:#c6ccbf}.header-note{font-size:11px;letter-spacing:1px}.header-note span{font-size:23px;color:#8a9b6f;margin-left:12px}.page-heading{display:flex;align-items:center;justify-content:space-between;margin:39px 0 29px}.eyebrow{font-size:9px;letter-spacing:2.2px;color:#8b9a80;font-weight:650}h1{font-size:31px;letter-spacing:1px;font-weight:600;margin:11px 0 10px}h1>span{color:#b5bb8f}.page-heading p{font-size:12px;color:#8f978a;margin:0}.button{border:1px solid var(--border);border-radius:8px;padding:11px 18px;font-size:12px}.secondary{background:#fffefa}.primary{background:var(--green);color:white;border-color:var(--green)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:34px}.stats>div{border:1px solid var(--border);border-radius:11px;padding:19px 20px;display:flex;align-items:center;background:#fcfcf8;gap:15px}.stat-icon{width:39px;height:39px;display:grid;place-items:center;border-radius:12px;font-size:20px}.amber{background:#f5ecda;color:#b5904d}.green{background:#e8efdf;color:#789464}.violet{background:#eceaf2;color:#a097b6}.stats small{display:block;font-size:11px;color:#8f9788;margin-bottom:3px}.stats strong{font-size:26px;font-weight:550}.stat-meta{font-size:9px;margin-left:auto;color:#a7ac9f;align-self:flex-end;margin-bottom:5px;white-space:nowrap}.session-heading{display:flex;justify-content:space-between;align-items:center}.session-heading h2{font-size:14px;font-weight:550;margin:0}.session-heading h2 span{font-size:10px;font-weight:400;color:#8fa080;margin-left:12px;background:#eaf0e2;border-radius:4px;padding:4px 7px}.session-heading>span{font-size:11px;color:#92a084;font-variant-numeric:tabular-nums}.progress-track{height:3px;border-radius:5px;background:#e5eada;margin-top:15px;overflow:hidden}#progress-bar{height:100%;background:#9aad83;transition:width .3s;width:0}.study-stage{position:relative;max-width:654px;margin:29px auto 0;padding-bottom:10px;perspective:1400px}.card-shadow{position:absolute;inset:16px 12px 0;background:#eceee1;border:1px solid #e0e5d6;border-radius:18px;transform:rotate(1.2deg)}.flashcard{position:relative;width:100%;min-height:326px;display:flex;flex-direction:column;align-items:stretch;border:1px solid #e4e6d9;border-radius:15px;background:#fffffc;padding:25px 30px 20px;box-shadow:0 12px 25px #3b512108;touch-action:pan-y;user-select:none;transition:transform .18s,background .18s;opacity:1!important}.flashcard.flipped{background:#f4f8ed}.card-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;color:#a0ac95}.card-top>span:last-child{letter-spacing:0;font-variant-numeric:tabular-nums}.card-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px 0;gap:12px;overflow-wrap:anywhere}#card-word{font-family:Georgia,"Microsoft YaHei",serif;font-size:47px;letter-spacing:-1px;color:#294837}#card-phonetic{font-family:Georgia,serif;color:#929c8c;font-size:16px}#card-meaning{font-size:22px;line-height:1.5;color:#336445}#card-example{font-family:Georgia,serif;font-size:16px;color:#86907f;line-height:1.6;max-width:510px}#card-translation{font-size:12px;line-height:1.8;color:#7b8a70}.flip-hint{align-self:center;border-top:1px solid #edf0e4;padding:14px 30px 0;font-size:10px;color:#9aa78b;letter-spacing:1px}.review-controls{display:flex;justify-content:center;gap:17px;margin:24px auto 0;max-width:520px}.review-button{display:flex;align-items:center;justify-content:center;gap:27px;flex:1;border-radius:10px;padding:15px 22px;text-align:left;border:1px solid #e8dfce}.review-button>span{font-size:22px;font-weight:300}.review-button div{font-size:14px}.review-button small{display:block;font-size:9px;margin-top:6px;font-weight:400;opacity:.65;letter-spacing:.3px}.forgot{background:#f7f0e4;color:#aa8651}.remember{background:#2d6951;border-color:#2d6951;color:#fff}.keyboard-tip{text-align:center;font-size:10px;color:#a3aa9a;margin:22px 0 31px;line-height:2}.keyboard-tip>span{margin:0 9px}kbd{background:#f0f2e9;border:1px solid #dfe4d6;border-radius:3px;padding:2px 5px;font-size:9px;color:#909d80}.learning-note{border:1px solid #e2e8d7;background:#f0f4e8;border-radius:9px;display:flex;align-items:center;padding:15px 20px;gap:14px}.learning-note>span:first-child{font-size:28px;color:#94a273}.learning-note p{font-size:10px;color:#95a184;margin:0;line-height:1.8}.learning-note strong{display:block;font-size:11px;color:#728560;font-weight:500;margin-bottom:2px}.note-decoration{margin-left:auto;font-size:30px;color:#b8c4a6}footer{display:flex;justify-content:space-between;font-size:9px;color:#a4ad99;letter-spacing:.4px;padding:30px 0 24px}footer>span:last-child{font-size:8px;letter-spacing:1.6px}.empty-actions{display:flex;gap:12px;justify-content:center;margin-top:22px}.list-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.list-toolbar h2{font-size:18px}.list-toolbar>span{font-size:12px;color:var(--muted)}input,textarea{background:#fff;border:1px solid #dbe2d4;border-radius:7px;padding:11px 12px;color:#314d3c;outline-color:#89a570}.word-list{border:1px solid var(--border);border-radius:12px;background:#fffefa;overflow:hidden}.word-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:19px 23px;border-bottom:1px solid #edf0e6}.word-row:last-child{border-bottom:0}.word-row strong{font:23px Georgia,serif;overflow-wrap:anywhere}.word-row p{font-size:12px;color:#839079;line-height:1.7;margin:7px 0 0;overflow-wrap:anywhere}.word-row small{font-size:10px;color:#98a28d}.badge{border-radius:5px;background:#e9f1e2;color:#728a60;padding:6px 9px;font-size:10px;white-space:nowrap}.badge.retry{background:#f7ecda;color:#a48652}.empty-list{padding:50px;text-align:center;color:#91a083;font-size:14px}.more{display:block;margin:20px auto}dialog{border:1px solid #dfe5d6;border-radius:17px;width:460px;max-width:calc(100% - 30px);padding:28px;box-shadow:0 30px 100px #1e382b33;color:#304b3b;background:#fafbf6}dialog::backdrop{background:#20352766;backdrop-filter:blur(3px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.dialog-heading h2{font-size:20px;margin:0}.close-dialog{background:none;border:none;font-size:25px;color:#9aa58f}form label{display:block;font-size:12px;margin:14px 0;color:#74846a}form input,form textarea{display:block;width:100%;margin-top:7px}form .primary{width:100%;margin-top:10px}form p{font-size:12px;line-height:1.8;color:#849079}form code{display:block;background:#eaf0e3;padding:15px;border-radius:8px;font-size:12px;line-height:2}.form-error{color:#ac6046}#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:#2d4f3e;color:#fff;padding:13px 23px;border-radius:10px;font-size:13px;box-shadow:0 8px 30px #23382922;z-index:10;max-width:90%}
@media(min-width:1500px){main{margin-right:auto;margin-left:max(248px,calc((100vw - 1240px)/2 + 200px));max-width:1120px}}
@media(max-width:1100px){.sidebar{width:205px;padding:30px 17px}main{margin-left:205px;padding:0 30px}.stat-meta{display:none}.stats>div{padding:16px}.brand{font-size:21px}.header-note{display:none}}
@media(max-width:720px){.sidebar{position:static;width:100%;height:auto;padding:18px 20px 0;border-right:0;border-bottom:1px solid var(--border)}.brand{font-size:21px}.brand-icon{width:32px;height:32px;font-size:27px}.workspace-label,.side-note{display:none}.sidebar nav{display:flex;margin-top:16px;gap:5px}.nav-item{justify-content:center;padding:12px 8px;font-size:12px;gap:7px;border-radius:8px 8px 0 0;margin-bottom:0}.nav-item>span:first-child{font-size:17px}.nav-count{margin-left:0}.connection{position:absolute;right:20px;top:22px;border:0;padding:0;font-size:10px}.connection>span:last-child{display:none}main{margin:0;padding:0 20px}header{height:48px;font-size:10px}.page-heading{margin:25px 0 22px;gap:12px}h1{font-size:24px}.eyebrow{font-size:8px;letter-spacing:1.5px}.page-heading p{font-size:10px;line-height:1.8}.button{font-size:11px;padding:10px 12px;white-space:nowrap}.stats{gap:8px;margin-bottom:26px}.stats>div{gap:9px;padding:12px 9px}.stat-icon{width:27px;height:30px;font-size:16px;border-radius:8px}.stats small{font-size:9px}.stats strong{font-size:21px}.session-heading h2{font-size:12px}.session-heading h2 span{font-size:8px;margin-left:7px}.study-stage{margin-top:23px}.flashcard{min-height:315px;padding:21px 20px}#card-word{font-size:38px}#card-meaning{font-size:19px}#card-example{font-size:14px}.review-controls{gap:12px;margin-top:20px}.review-button{gap:15px;padding:15px 12px}.keyboard-tip{font-size:9px;margin:17px 0 24px}.keyboard-tip>span{margin:0 4px}.swipe-tip{display:none}.learning-note{padding:13px}.learning-note p{font-size:9px}.learning-note strong{font-size:10px}.note-decoration{display:none}footer{font-size:8px;padding-top:24px}footer>span:last-child{font-size:7px;letter-spacing:1px}.list-toolbar{gap:12px}.list-toolbar input{width:160px;font-size:12px}.list-toolbar h2{font-size:16px}.word-row{padding:16px;gap:12px}.word-row strong{font-size:21px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

#card-definition { line-height: 1.5; }
#card-pos { font-size: 16px; color: #789264; margin-right: 5px; }
.related-words { display: grid; gap: 12px; width: 100%; text-align: left; border-top: 1px solid #dfe7d6; margin-top: 8px; padding-top: 16px; }
.related-section { display: grid; gap: 7px; font-size: 12px; line-height: 1.8; color: #77896b; }
.related-section strong { color: #49683d; font-size: 11px; }
#settings-dialog > p, .agent-prompt-label { font-size: 12px; line-height: 1.8; color: #74846a; }
.agent-links { display: flex; flex-wrap: wrap; gap: 15px; margin: 18px 0; font-size: 12px; }
.agent-links a { color: #2a6951; text-decoration: underline; text-underline-offset: 4px; }
#agent-prompt { width: 100%; margin: 8px 0 12px; font-size: 12px; line-height: 1.8; }
#word-dialog, #settings-dialog { max-height: calc(100dvh - 40px); overflow-y: auto; }

.account-actions { display: flex; align-items: center; gap: 12px; min-width: 0; }
#account-email { max-width: 180px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #71816a; }
.auth-tabs { display: flex; gap: 12px; }
.auth-tabs .primary { width: auto; margin-top: 0; }
.token-panel { border-top: 1px solid #dfe5d7; margin-top: 22px; padding-top: 10px; }
.token-panel h3 { font-size: 14px; }
.token-panel p, #token-result label { font-size: 12px; line-height: 1.8; color: #74846a; }
#token-result input { display: block; width: 100%; margin: 10px 0; }
#token-result { margin-top: 15px; }
@media(max-width:720px) { #account-email { max-width: 110px; font-size: 10px; } .account-actions { gap: 7px; } }

.flashcard { cursor: pointer; text-align: center; }
.flashcard:focus-visible { outline: 3px solid #dca365; outline-offset: 4px; }
.pronunciation-row { display: flex; align-items: center; justify-content: center; gap: 12px; }
#card-phonetic { font-family: "Segoe UI", "Arial", sans-serif; color: #64765e; }
.speak-button { border: 1px solid #d6e3cc; border-radius: 16px; padding: 5px 10px; color: #386b4d; background: #edf4e7; font-size: 11px; }
.related-line { display: block; }
.related-entry { display: inline-block; position: relative; }
.related-word { border: 0; border-bottom: 1px dashed #91a580; padding: 0 2px; background: none; color: #2f6143; font-size: 14px; }
.related-speaker { margin-left: 6px; padding: 2px 7px; font-size: 10px; }
.phonetic-tooltip { display: none; position: absolute; z-index: 3; left: 0; bottom: calc(100% + 5px); background: #2d4f3e; color: white; border-radius: 7px; padding: 7px 11px; font: 14px/1.5 "Segoe UI", sans-serif; white-space: nowrap; max-width: 260px; overflow-wrap: anywhere; box-shadow: 0 4px 16px #20352722; }
.related-entry:hover .phonetic-tooltip, .related-entry:focus-within .phonetic-tooltip, .related-entry.is-open .phonetic-tooltip { display: block; }
.related-words:empty { display: none; }

.study-options { display: flex; align-items: center; gap: 18px; }
.auto-speak-label { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #49683d; cursor: pointer; white-space: nowrap; }
.auto-speak-label input { width: 16px; height: 16px; margin: 0; accent-color: #386b4d; }
.example-word { display: inline; border: 0; border-bottom: 1px dotted #91a580; padding: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.example-word:hover, .example-word:focus-visible { color: #2f6143; background: #e7eedf; border-radius: 3px; }
#lookup-dialog { width: min(380px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); overflow-y: auto; }
#lookup-dialog h2 { overflow-wrap: anywhere; }
#lookup-phonetic { color: #64765e; font: 16px/1.6 "Segoe UI", sans-serif; }
#lookup-meaning { white-space: pre-line; font-size: 15px; line-height: 1.8; }
#lookup-source { font-size: 11px; }
@media(max-width:540px) { .study-options { gap: 10px; } .session-heading { flex-wrap: wrap; gap: 10px; } }