:root{--ink:#18202a;--muted:#68717e;--bg:#f6f7fb;--panel:#fff;--line:#e5e7ee;--purple:#6c4bf4;--purple-dark:#5134d7;--lav:#eeeaff;--coral:#ff775f;--mint:#31b883;--yellow:#f3bd3b;--shadow:0 18px 50px rgba(36,31,72,.08);--radius:20px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.55 "DM Sans",sans-serif}button,input,select{font:inherit}button{cursor:pointer}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Manrope,sans-serif;letter-spacing:-.035em}h1{font-size:clamp(2rem,4vw,3.25rem);line-height:1.06;margin-bottom:.65rem}h2{font-size:1.3rem}p{color:var(--muted)}
.app-shell{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:#17152a;color:#fff;padding:28px 20px;display:flex;flex-direction:column;z-index:20}.logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit;font:800 1.1rem Manrope}.logo>span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--purple);color:#fff}.sidebar nav{display:grid;gap:7px;margin-top:42px}.nav-item{border:0;background:transparent;color:#aaa6bf;display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:11px;text-align:left}.nav-item i{font-style:normal;width:25px;text-align:center}.nav-item.active,.nav-item:hover{background:#2a2741;color:#fff}.nav-item.active{box-shadow:inset 3px 0 var(--purple)}.sidebar-card{margin-top:auto;background:#242139;border:1px solid #38344d;border-radius:15px;padding:15px}.sidebar-card span{display:block;font-size:.76rem;color:#bbb6ce}.sidebar-card select{width:100%;margin:7px 0;background:#17152a;color:#fff;border:1px solid #49455d;border-radius:9px;padding:8px}.sidebar-card small,.data-note{font-size:.68rem;color:#89849c}.data-note{margin-top:18px;line-height:1.5}
main{min-width:0}.mobile-header{display:none}.view{display:none;max-width:1280px;margin:auto;padding:48px 46px 80px}.view.active{display:block}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:32px}.page-heading>div{max-width:760px}.page-heading p{font-size:1.05rem;margin-bottom:0}.page-heading.compact{align-items:center}.kicker{display:block;color:var(--purple);font-size:.72rem;font-weight:800;letter-spacing:.14em;margin-bottom:8px}.primary,.secondary,.text-button{border:0;border-radius:11px;padding:11px 16px;font-weight:700}.primary{background:var(--purple);color:#fff;box-shadow:0 8px 22px rgba(108,75,244,.22)}.primary:hover{background:var(--purple-dark)}.secondary{background:#fff;color:var(--ink);border:1px solid var(--line)}.text-button{background:transparent;color:var(--purple);padding-left:0}.primary:disabled{opacity:.6;cursor:wait}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px}.stat small{display:block;color:var(--muted);font-size:.73rem}.stat strong{display:block;font:800 1.8rem Manrope;margin-top:3px}.stat i{font-style:normal;color:var(--mint);font-size:.73rem}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr .75fr;gap:18px}.feature-card,.today-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}.grammar-feature{background:linear-gradient(145deg,#fff,#f0edff)}.corpus-feature{background:linear-gradient(145deg,#fff,#fff2ee)}.card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-weight:800}.icon.violet{background:var(--lav);color:var(--purple)}.icon.coral{background:#ffe9e5;color:var(--coral)}.level-pill{border-radius:99px;background:var(--purple);color:#fff;padding:5px 10px;font-size:.72rem;font-weight:800}.subtle{color:var(--muted);font-size:.76rem}.progress-track{height:7px;background:#ddd8f8;border-radius:9px;overflow:hidden;margin:25px 0 12px}.progress-track i{display:block;width:28%;height:100%;background:var(--purple);border-radius:9px}.quick-add{display:flex;gap:8px}.quick-add input{min-width:0;flex:1}.quick-add .primary{padding:9px 12px}.recent-words{display:flex;gap:6px;flex-wrap:wrap;margin-top:15px}.word-chip{background:#fff;border:1px solid #f0d8d3;border-radius:99px;padding:4px 8px;font-size:.7rem}.today-card{background:#222039;color:#fff}.today-card p,.today-card .kicker{color:#aaa5c3}.today-card ol{padding:0;list-style:none;display:grid;gap:12px;margin:23px 0}.today-card li{border-bottom:1px solid #3a3650;padding-bottom:11px}.today-card b{color:#a895ff;margin-right:8px}
.grammar-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,.7fr);gap:24px;align-items:start}.section-label{display:flex;justify-content:space-between;align-items:center}.section-label span{color:var(--muted);font-size:.76rem}.lesson-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.lesson-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;text-align:left;color:var(--ink);position:relative;transition:.2s}.lesson-card:hover,.lesson-card.active{border-color:#bdb0ff;transform:translateY(-2px);box-shadow:var(--shadow)}.lesson-card.active{background:#f5f2ff}.lesson-card .lesson-num{font-size:.68rem;color:var(--purple);font-weight:800}.lesson-card h3{margin:8px 0 4px}.lesson-card p{font-size:.78rem;margin:0}.lesson-card .tiny-level{position:absolute;right:13px;top:13px}.tiny-level,.tag{background:var(--lav);color:var(--purple-dark);font-size:.64rem;font-weight:800;padding:3px 6px;border-radius:5px}.lesson-panel{position:sticky;top:28px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:23px;box-shadow:var(--shadow)}.empty-panel{text-align:center;padding:35px 12px}.empty-panel>span{font-size:2rem;color:var(--purple)}.formula{background:#17152a;color:#fff;border-radius:12px;padding:15px;font-weight:700;margin:15px 0}.example{border-left:3px solid var(--purple);padding:7px 11px;background:#f8f7ff;margin:7px 0;font-size:.86rem}.note-list{padding-left:18px;color:var(--muted);font-size:.82rem}.lesson-panel .primary{width:100%;margin-top:10px}
.word-form{display:grid;grid-template-columns:1fr auto;gap:12px;background:#1c1930;padding:20px;border-radius:18px;color:#fff}.word-form label{display:block;font-size:.72rem;color:#a9a4bd;margin-bottom:5px}.word-form input{width:100%;border:0;background:#fff;border-radius:10px;padding:12px 14px;outline:0}.word-form .primary{align-self:end}.filter-row{display:flex;align-items:center;justify-content:space-between;margin:22px 0 14px}.segmented{display:flex;background:#e9eaf0;border-radius:10px;padding:3px}.segmented button,.practice-tabs button{border:0;background:transparent;border-radius:8px;padding:7px 12px;color:var(--muted);font-weight:700}.segmented button.active,.practice-tabs button.active{background:#fff;color:var(--purple);box-shadow:0 2px 10px rgba(0,0,0,.06)}#corpusStatus{font-size:.76rem;color:var(--muted)}.word-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.word-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;position:relative}.word-card h3{font-size:1.15rem;margin:0}.word-card .phonetic{color:var(--muted);font-size:.75rem}.word-card .definition{font-size:.82rem;margin:15px 0 8px;color:var(--ink)}.word-card .word-example{font-size:.75rem;font-style:italic;color:var(--muted)}.word-meta{display:flex;gap:5px;flex-wrap:wrap}.word-card .delete-word{position:absolute;right:10px;top:10px;border:0;background:transparent;color:#aaa;font-size:1rem}.mastery{margin-top:14px;height:5px;background:#ececf1;border-radius:4px;overflow:hidden}.mastery i{display:block;height:100%;background:var(--mint)}.empty-state{grid-column:1/-1;text-align:center;background:#fff;border:1px dashed #cfd2dd;border-radius:18px;padding:52px;color:var(--muted)}
.practice-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);padding-bottom:10px}.practice-tabs button.active{background:var(--lav)}.practice-area{max-width:820px;margin:30px auto}.flashcard{min-height:340px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);display:grid;place-items:center;text-align:center;padding:40px;cursor:pointer;position:relative}.flashcard .front-word{font:800 2.7rem Manrope}.flashcard .flip-hint{position:absolute;bottom:20px;color:var(--muted);font-size:.74rem}.flashcard .back{display:none}.flashcard.flipped .front{display:none}.flashcard.flipped .back{display:block}.rating-row{display:flex;justify-content:center;gap:8px;margin-top:14px}.rating-row button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 13px}.context-card,.challenge-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px;box-shadow:var(--shadow)}.context-prompt,.exercise-prompt{font:700 1.35rem/1.5 Manrope;margin:20px 0}.answer-row{display:flex;gap:8px}.answer-row input{flex:1;border:1px solid var(--line);border-radius:11px;padding:11px 13px}.feedback{margin-top:14px;padding:13px;border-radius:11px}.feedback.good{background:#e9f8f2;color:#08744e}.feedback.bad{background:#fff0ed;color:#a13e2d}
dialog{border:0;padding:0;background:transparent;width:min(680px,calc(100% - 28px))}dialog::backdrop{background:rgba(16,14,29,.62);backdrop-filter:blur(5px)}.exercise-modal{position:relative;background:#fff;border-radius:22px;padding:30px}.close{position:absolute;right:14px;top:12px;border:0;background:#eff0f4;width:34px;height:34px;border-radius:9px;font-size:1.3rem}.exercise-head{display:flex;gap:7px;align-items:center}.options{display:grid;gap:8px;margin:18px 0}.option{border:1px solid var(--line);background:#fff;border-radius:11px;padding:11px;text-align:left}.option.selected{border-color:var(--purple);background:var(--lav)}.exercise-actions{display:flex;justify-content:space-between;gap:10px;margin-top:20px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#17152a;color:#fff;padding:10px 16px;border-radius:11px;z-index:100;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1050px){.dashboard-grid{grid-template-columns:1fr 1fr}.today-card{grid-column:1/-1}.word-grid{grid-template-columns:1fr 1fr}.grammar-layout{grid-template-columns:1fr}.lesson-panel{position:static}}
@media(max-width:760px){.app-shell{display:block}.sidebar{position:fixed;transform:translateX(-100%);transition:.2s;width:240px}.sidebar.open{transform:none}.mobile-header{display:flex;align-items:center;justify-content:space-between;background:#17152a;color:#fff;padding:12px 16px;position:sticky;top:0;z-index:15}.mobile-header button{border:0;background:transparent;color:#fff;font-size:1.5rem}.view{padding:30px 16px 60px}.page-heading{display:block}.page-heading>.primary{margin-top:18px}.stats{grid-template-columns:1fr 1fr}.dashboard-grid,.lesson-grid,.word-grid{grid-template-columns:1fr}.today-card{grid-column:auto}.word-form{grid-template-columns:1fr}.word-form .primary{width:100%}.filter-row{align-items:flex-start;gap:12px;flex-direction:column}.segmented{max-width:100%;overflow:auto}.answer-row{display:grid}.practice-tabs{overflow:auto}.grammar-layout{display:block}.lesson-panel{margin-top:16px}}
.word-card .correction{margin:2px 0 3px;color:var(--coral);font-size:.72rem}
