*{box-sizing:border-box}:root{color:#16201d;background:#f4f7f5;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{margin:0;min-width:320px}button,input,select{font:inherit}button{border:0;cursor:pointer}.login-shell{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,rgba(24,93,77,.12),transparent 42%),linear-gradient(315deg,rgba(245,164,66,.16),transparent 46%),#f3f7f4}.login-panel{width:min(440px,100%);background:#fff;border:1px solid #dde5df;border-radius:8px;padding:28px;box-shadow:0 20px 60px #23332d1f}.brand-mark{width:54px;height:54px;display:grid;place-items:center;color:#fff;background:#1f6f5e;border-radius:8px;margin-bottom:18px}h1,h2,h3,p{margin-top:0}.login-panel h1{margin-bottom:8px;font-size:28px;line-height:1.18}.login-panel p,.study-head p,.empty-state p{color:#5c6b65}label{display:grid;gap:8px;color:#34443e;font-size:14px}input,select{min-height:44px;border:1px solid #ccd8d1;border-radius:8px;padding:0 12px;color:#14211d;background:#fff;outline:0}input:focus{border-color:#1f6f5e;box-shadow:0 0 0 3px #1f6f5e1f}.segmented{display:grid;grid-auto-flow:column;gap:6px;padding:4px;background:#e9efec;border-radius:8px;margin:20px 0}.segmented.compact{margin-top:-8px}.segmented button{min-height:38px;border-radius:6px;color:#53645d;background:transparent}.segmented button.active{color:#fff;background:#1f6f5e}.primary,.secondary,.ghost,.icon-text,.danger,.link-button{min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:8px;padding:0 14px;font-weight:700}.primary{width:100%;color:#fff;background:#1f6f5e}.secondary{color:#1b5f51;background:#e0f1eb}.ghost{color:#394943;background:#eef3f0}.icon-text{color:#24352f;background:#eef3f0}.danger{color:#9f2f2f;background:#f8e5e3}.demo-users{display:grid;gap:6px;margin-top:18px;color:#68756f;font-size:12px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);border-radius:8px;padding:12px 16px;color:#fff;background:#9f2f2f}.sync-badge{position:fixed;right:16px;bottom:16px;z-index:20;border:3px solid #18213a;padding:8px 10px;color:#18213a;background:#ffd84d;box-shadow:4px 4px #18213a;font-size:12px;font-weight:900}.sync-badge.offline{color:#fff;background:#ff5b57}.app-shell{width:min(1180px,100%);min-height:100vh;margin:0 auto;padding:22px}.student-shell{width:min(520px,100%);padding:14px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.topbar h2{margin-bottom:0}.eyebrow{display:block;color:#1f6f5e;font-size:12px;font-weight:800;letter-spacing:0}.section-band{background:#fff;border:1px solid #dde5df;border-radius:8px;padding:18px;margin-bottom:16px}.admin-upload{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:start}.admin-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.link-button{text-decoration:none}.admin-upload p{color:#63736c}.class-manager{grid-column:1 / -1;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;border-radius:8px;padding:12px;background:#f7faf8;border:1px solid #e1e9e4}.admin-upload .wide,.admin-upload .upload-box,.admin-upload p{grid-column:1 / -1}.upload-box{min-height:112px;display:grid;place-items:center;border:1px dashed #9bb7ad;border-radius:8px;color:#1f6f5e;background:#f6fbf8;cursor:pointer}.upload-box input{display:none}.success{color:#1f6f5e}.error{color:#9f2f2f}.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.section-title h2{margin-bottom:0}.section-title span{color:#6a766f}.list-table,.student-table,.word-preview,.quiz-list{display:grid;gap:10px}.list-row,.student-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;border:1px solid #e2e9e5;border-radius:8px;padding:12px;background:#fbfdfc}.list-row span,.student-row span,.wordlist-card span{display:block;color:#6a766f;font-size:13px}.filters{display:flex;flex-wrap:wrap;gap:8px}.filters label{display:flex;align-items:center;gap:6px}.filters input{min-height:38px}.student-row{grid-template-columns:1.2fr 160px repeat(4,minmax(90px,1fr))}.inline-select{font-size:12px}.inline-select select{min-height:34px}.metric{min-height:74px;display:grid;align-content:center;gap:6px;border:1px solid #dfe8e3;border-radius:8px;padding:12px;background:#fbfdfc}.metric span{color:#6a766f;font-size:12px}.metric strong{font-size:24px;color:#17231f}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.hero-stats{position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at top right,rgba(255,207,92,.82),transparent 28%),linear-gradient(135deg,#7758ff,#1d9b8f 54%,#0f382f);border-color:transparent}.hero-stats:after{content:"";position:absolute;right:-28px;bottom:-28px;width:140px;height:140px;border:16px solid rgba(255,255,255,.16);border-radius:999px}.hero-stats h1{position:relative;margin:6px 0 18px;font-size:26px}.hero-stats .eyebrow,.hero-stats .metric span,.hero-stats .metric strong{color:#fff}.hero-stats .metric{background:#ffffff1f;border-color:#ffffff2e}.quick-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}.action-tile{min-height:110px;display:grid;justify-items:start;align-content:space-between;border-radius:8px;padding:14px;color:#16201d;background:linear-gradient(145deg,#ffffffeb,#f6fffaf0),#fff;border:1px solid #dde5df;text-align:left;font-weight:800}.action-tile svg{color:#7758ff}.action-tile span{justify-self:end;min-width:26px;height:26px;display:grid;place-items:center;border-radius:999px;color:#fff;background:#d46b27;font-size:12px}.wordlist-grid{display:grid;gap:10px}.wordlist-card{display:grid;gap:6px;width:100%;min-height:78px;border:1px solid #dde5df;border-radius:8px;padding:14px;color:#16201d;background:#fbfdfc;text-align:left}.wordlist-card.selected{border-color:#1f6f5e;box-shadow:inset 0 0 0 1px #1f6f5e}.back-button{display:inline-flex;align-items:center;gap:4px;height:40px;color:#1f6f5e;background:transparent;font-weight:800}.study-head{margin:8px 0 18px}.study-head h1{margin-bottom:6px;font-size:28px}.word-card{min-height:560px;display:grid;align-content:center;gap:18px;border-radius:8px;padding:24px;background:radial-gradient(circle at top left,rgba(255,204,87,.24),transparent 32%),#fff;border:1px solid #dde5df;box-shadow:0 14px 38px #23332d14}.word-card h2{margin-bottom:0;font-size:48px;line-height:1}.choice-grid{display:grid;gap:10px}.countdown{display:grid;grid-template-columns:auto auto;gap:8px 12px;align-items:center;border:3px solid #dce6e1;border-radius:8px;padding:10px;background:#f7faf8;font-weight:900}.countdown span{color:#6a766f;font-size:12px}.countdown strong{justify-self:end;font-size:20px}.countdown div{grid-column:1 / -1;height:10px;overflow:hidden;border-radius:999px;background:#dfe8e3}.countdown i{display:block;height:100%;border-radius:inherit;background:#1f6f5e;transition:width .25s linear}.countdown.danger-time i{background:#c84646}.choice-grid button{min-height:58px;border:1px solid #dce6e1;border-radius:8px;padding:12px 14px;color:#17231f;background:#f7faf8;font-weight:800;text-align:left}.choice-grid button:hover:not(:disabled){border-color:#7758ff;box-shadow:0 8px 20px #7758ff21}.choice-grid .right-choice,.options .right-choice{color:#fff;background:#1f9d69;border-color:#1f9d69}.choice-grid .wrong-choice,.options .wrong-choice{color:#fff;background:#c84646;border-color:#c84646}.feedback{min-height:50px;display:flex;align-items:center;gap:8px;border-radius:8px;padding:0 14px;font-weight:900}.feedback.correct{color:#0f5f42;background:#dff8ed}.feedback.incorrect{color:#8f2d2d;background:#ffe9e7}.audio-button{justify-self:start;min-height:40px;display:inline-flex;align-items:center;gap:8px;border-radius:8px;padding:0 12px;color:#1f6f5e;background:#e0f1eb;font-weight:800}.phonetic{margin-bottom:0;color:#6a766f;font-size:18px}.meaning{margin-bottom:0;font-size:24px;font-weight:800}blockquote{margin:0;border-left:4px solid #f0b15d;padding-left:14px;color:#55635e;line-height:1.6}.card-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.modal-backdrop{position:fixed;inset:0;display:grid;place-items:center;padding:20px;background:#111b176b}.modal{width:min(720px,100%);max-height:min(760px,90vh);overflow:auto;border-radius:8px;padding:18px;background:#fff}.word-preview div{display:grid;gap:4px;border:1px solid #e2e9e5;border-radius:8px;padding:12px}.word-preview small{color:#64716b}.empty-state{min-height:360px;display:grid;place-items:center;align-content:center;gap:12px;border:1px solid #dde5df;border-radius:8px;padding:24px;text-align:center;background:#fff}.empty-mini{border:1px dashed #cbd9d2;border-radius:8px;padding:18px;color:#66756e;text-align:center}.quiz-card,.result-panel{display:grid;gap:12px;border:1px solid #dde5df;border-radius:8px;padding:16px;background:#fff}.quiz-card h3{margin-bottom:0;font-size:24px}.quiz-card>span{color:#6a766f;font-size:13px}.options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.options button{min-height:44px;border-radius:8px;padding:8px;color:#1c2a25;background:#eef3f0}.options button:disabled{cursor:default}.options button.selected-option{color:#fff;background:#1f6f5e}.wrong-list{display:grid;gap:6px;color:#9f2f2f}@media(max-width:760px){.app-shell{padding:14px}.admin-upload,.list-row,.student-row,.class-manager,.section-title,.filters{grid-template-columns:1fr}.section-title,.filters{display:grid}.stat-grid{grid-template-columns:1fr 1fr}.quick-actions{grid-template-columns:1fr}.action-tile{min-height:82px}.word-card{min-height:520px}.word-card h2{font-size:40px}}@media(max-width:420px){.login-panel{padding:22px}.topbar{align-items:flex-start}.topbar .icon-text{width:42px;padding:0;font-size:0}.metric{min-height:66px}.metric strong{font-size:21px}.options,.card-actions{grid-template-columns:1fr}}:root{--ink: #18213a;--panel: #fff9e8;--paper: #fffdf5;--line: #18213a;--cyan: #31d8ff;--mint: #42e6a4;--yellow: #ffd84d;--pink: #ff5aa5;--violet: #7c5cff;--red: #ff5b57;--shadow: #18213a;color:var(--ink);background:#f9eec9;font-family:Courier New,ui-monospace,SFMono-Regular,Menlo,monospace}body{background:linear-gradient(90deg,rgba(24,33,58,.08) 1px,transparent 1px),linear-gradient(rgba(24,33,58,.08) 1px,transparent 1px),linear-gradient(135deg,#fff3a8,#baf7ff 44%,#ffd0e5);background-size:18px 18px,18px 18px,100% 100%}button,input,select,.section-band,.login-panel,.metric,.word-card,.quiz-card,.result-panel,.wordlist-card,.action-tile,.modal,.list-row,.student-row{border-radius:0}button,input,select{border:3px solid var(--line)}button{text-transform:none}button:active{transform:translate(3px,3px);box-shadow:none}input,select{min-height:48px;color:var(--ink);background:#fff;box-shadow:4px 4px 0 var(--shadow)}input:focus,select:focus{border-color:var(--violet);box-shadow:4px 4px 0 var(--violet)}label{color:var(--ink);font-weight:900}.login-shell{background:linear-gradient(90deg,rgba(24,33,58,.12) 1px,transparent 1px),linear-gradient(rgba(24,33,58,.12) 1px,transparent 1px),linear-gradient(135deg,#ffe96b,#5ee7ff 52%,#ff8cc7);background-size:20px 20px,20px 20px,100% 100%}.login-panel,.section-band,.modal{border:4px solid var(--line);background:var(--panel);box-shadow:8px 8px 0 var(--shadow)}.login-panel{position:relative;width:min(480px,100%)}.login-panel:before{content:"LEVEL 01";position:absolute;top:-18px;right:18px;border:3px solid var(--line);padding:4px 8px;background:var(--yellow);box-shadow:4px 4px 0 var(--shadow);font-size:12px;font-weight:900}.brand-mark{border:3px solid var(--line);color:var(--ink);background:var(--cyan);border-radius:0;box-shadow:5px 5px 0 var(--shadow)}.login-panel h1{font-size:26px;letter-spacing:0}.login-panel p,.study-head p,.empty-state p,.admin-upload p{color:#4f5877;font-weight:700}.segmented{gap:8px;padding:6px;border:3px solid var(--line);border-radius:0;background:#fff;box-shadow:4px 4px 0 var(--shadow)}.segmented button{border:3px solid transparent;border-radius:0;color:var(--ink);background:transparent;box-shadow:none;font-weight:900}.segmented button.active{color:var(--ink);background:var(--yellow);border-color:var(--line)}.auth-choice{display:grid;grid-template-columns:1.35fr 1fr;gap:10px;margin:18px 0}.auth-choice button{min-height:54px;padding:0 12px;font-weight:900;text-align:center}.auth-primary{color:var(--ink);background:var(--mint);box-shadow:5px 5px 0 var(--shadow)}.auth-secondary{color:var(--ink);background:#fff;box-shadow:4px 4px 0 var(--shadow)}.auth-secondary.active{background:var(--pink);color:#fff}.auth-primary.active{background:var(--mint)}.form-hint{border:3px dashed var(--line);padding:10px;background:#fff;font-size:13px}.primary,.secondary,.ghost,.icon-text,.danger,.audio-button,.back-button,.link-button{border:3px solid var(--line);border-radius:0;font-weight:900;box-shadow:5px 5px 0 var(--shadow)}.primary{min-height:54px;color:var(--ink);background:var(--yellow)}.secondary{color:var(--ink);background:var(--cyan)}.ghost,.icon-text{color:var(--ink);background:#fff}.danger{color:#fff;background:var(--red)}.toast{border:3px solid var(--line);border-radius:0;color:#fff;background:var(--red);box-shadow:5px 5px 0 var(--shadow)}.student-shell{width:min(560px,100%)}.topbar{border:4px solid var(--line);padding:12px;background:#fff;box-shadow:6px 6px 0 var(--shadow)}.eyebrow{color:var(--violet);font-weight:900}.hero-stats{border:4px solid var(--line);color:var(--ink);background:linear-gradient(90deg,rgba(24,33,58,.12) 1px,transparent 1px),linear-gradient(rgba(24,33,58,.12) 1px,transparent 1px),linear-gradient(135deg,var(--cyan),var(--yellow) 58%,#ffb0d4);background-size:16px 16px,16px 16px,100% 100%;box-shadow:8px 8px 0 var(--shadow)}.hero-stats:after{content:"XP";right:16px;bottom:16px;width:auto;height:auto;border:4px solid var(--line);border-radius:0;padding:8px 10px;color:var(--ink);background:var(--pink);box-shadow:4px 4px 0 var(--shadow);font-weight:900}.hero-stats .eyebrow,.hero-stats .metric span,.hero-stats .metric strong{color:var(--ink)}.hero-stats .metric,.metric{border:3px solid var(--line);background:#fff;box-shadow:4px 4px 0 var(--shadow)}.action-tile{border:4px solid var(--line);color:var(--ink);background:#fff;box-shadow:6px 6px 0 var(--shadow)}.action-tile:nth-child(1){background:var(--mint)}.action-tile:nth-child(2){background:var(--yellow)}.action-tile:nth-child(3){background:#ffb0d4}.action-tile svg{color:var(--ink)}.action-tile span{border:3px solid var(--line);border-radius:0;color:#fff;background:var(--violet)}.wordlist-card,.list-row,.student-row,.quiz-card,.result-panel,.word-preview div,.empty-state,.empty-mini{border:3px solid var(--line);background:var(--paper);box-shadow:4px 4px 0 var(--shadow)}.wordlist-card.selected{border-color:var(--line);background:var(--cyan);box-shadow:6px 6px 0 var(--violet)}.back-button{color:var(--ink);background:#fff}.study-head{border:4px solid var(--line);padding:14px;background:var(--yellow);box-shadow:6px 6px 0 var(--shadow)}.word-card{border:4px solid var(--line);background:linear-gradient(90deg,rgba(24,33,58,.08) 1px,transparent 1px),linear-gradient(rgba(24,33,58,.08) 1px,transparent 1px),#fffdf5;background-size:18px 18px,18px 18px,100% 100%;box-shadow:8px 8px 0 var(--shadow)}.word-card h2{display:inline-block;width:fit-content;border:4px solid var(--line);padding:10px 14px;color:var(--ink);background:var(--cyan);box-shadow:5px 5px 0 var(--shadow)}.countdown{border:3px solid var(--line);border-radius:0;background:#fff;box-shadow:4px 4px 0 var(--shadow)}.countdown span{color:var(--violet)}.countdown div{border:3px solid var(--line);border-radius:0;background:#fff}.countdown i{border-radius:0;background:var(--mint)}.countdown.danger-time{background:#ffe2e8}.countdown.danger-time i{background:var(--red)}.choice-grid button,.options button{border:3px solid var(--line);border-radius:0;color:var(--ink);background:#fff;box-shadow:4px 4px 0 var(--shadow)}.choice-grid button:hover:not(:disabled),.options button:hover:not(:disabled){border-color:var(--line);background:var(--yellow);box-shadow:4px 4px 0 var(--violet)}.choice-grid .right-choice,.options .right-choice,.options button.selected-option{color:var(--ink);background:var(--mint);border-color:var(--line)}.choice-grid .wrong-choice,.options .wrong-choice{color:#fff;background:var(--red);border-color:var(--line)}.feedback{border:3px solid var(--line);border-radius:0;box-shadow:4px 4px 0 var(--shadow)}.feedback.correct{color:var(--ink);background:var(--mint)}.feedback.incorrect{color:#fff;background:var(--red)}.audio-button{color:var(--ink);background:#fff}.upload-box{border:4px dashed var(--line);color:var(--ink);background:#fff;box-shadow:5px 5px 0 var(--shadow)}.success{color:#087245;font-weight:900}.error,.wrong-list{color:#c12e44;font-weight:900}@media(max-width:520px){.auth-choice{grid-template-columns:1fr}.login-panel:before{right:12px}.hero-stats h1{max-width:280px}}