:root{--ink:#102653;--muted:#60708d;--blue:#0d5bd7;--blue-soft:#e3f0ff;--coral:#ff5b56;--green:#2fbd55;--surface:#fff;--bg:#eef7ff;--line:#dce5f0;--shadow:0 18px 40px rgba(22,67,125,.11);font-family:'DM Sans',sans-serif;color:var(--ink)}*{box-sizing:border-box}body{margin:0;background:var(--bg);min-height:100vh}.app-shell{display:flex;min-height:100vh;max-width:1500px;margin:auto;background:linear-gradient(120deg,#fff 0 21%,var(--bg) 21%)}.sidebar{width:280px;background:#fff;border-right:1px solid #edf0f5;padding:35px 24px 28px;display:flex;flex-direction:column}.brand{font-family:Pacifico,cursive;font-size:32px;letter-spacing:-1px;color:var(--ink);position:relative;margin:0 10px 50px}.brand i{font-family:inherit;color:var(--coral);font-style:normal;font-size:26px;margin-left:2px}.brand p{font-family:'DM Sans',sans-serif;font-size:16px;letter-spacing:0;color:#3d4e6f;margin:8px 0 0 20px}.nav-item{width:100%;border:0;background:transparent;border-radius:16px;color:var(--ink);font:600 16px 'DM Sans';padding:16px 16px;margin:4px 0;text-align:left;display:flex;align-items:center;gap:18px;cursor:pointer;transition:.2s}.nav-item:hover,.nav-item.active{background:var(--blue-soft);color:var(--blue)}.nav-icon{font-size:25px;width:26px;text-align:center}.level{margin-top:auto;display:flex;align-items:center;gap:12px;padding:15px 10px;color:var(--ink)}.flag{font-size:26px}.level strong,.level small{display:block}.level small{color:var(--muted);margin-top:3px}.main-content{flex:1;padding:58px 58px 46px;overflow:hidden}.hero{display:flex;justify-content:space-between;min-height:120px;position:relative}.hero h1{font-size:48px;line-height:1.1;letter-spacing:-1.8px;margin:0 0 12px}.hero p{font-size:18px;color:var(--muted);margin:0}.city-art{width:300px;position:relative;height:120px;overflow:hidden}.tower{color:#2e69bd;font-size:165px;line-height:.85;position:absolute;right:95px;top:5px;transform:scaleX(.65);opacity:.9}.cloud{position:absolute;background:#fff;width:80px;height:25px;border-radius:50px;opacity:.85}.cloud:before,.cloud:after{content:'';position:absolute;background:#fff;border-radius:50%}.cloud:before{width:35px;height:35px;left:15px;top:-17px}.cloud:after{width:45px;height:45px;right:10px;top:-23px}.cloud-one{right:10px;top:35px}.cloud-two{left:20px;top:75px;transform:scale(.7)}.stats{display:flex;gap:20px;margin:4px 0 34px}.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:15px 22px;display:flex;align-items:center;gap:16px;min-width:190px}.stat-icon{font-size:30px}.blue{color:var(--blue)}.coral{color:var(--coral)}.stat strong{font-size:21px;margin-right:6px}.stat span:not(.stat-icon){color:#344464}.dashboard-grid{display:grid;grid-template-columns:minmax(450px,1.35fr) minmax(280px,.8fr);gap:22px}.flashcard-wrap{background:#fff;border-radius:18px;padding:8px 24px 22px;box-shadow:var(--shadow)}.flashcard{min-height:310px;border:1px solid var(--line);border-radius:17px;margin-top:0;display:flex;flex-direction:column;justify-content:space-between;padding:20px 22px 18px;transition:transform .35s}.card-actions{display:flex;justify-content:space-between}.icon-button{border:0;background:transparent;color:#7183a0;font-size:23px;cursor:pointer;padding:5px}.icon-button:hover{color:var(--blue)}.word-block{text-align:center}.word-label{font-size:13px;text-transform:uppercase;letter-spacing:1.4px;color:#8a98ad}.word-block h2{font-size:52px;margin:12px 0 10px;letter-spacing:-1.8px}.word-block p{font-size:24px;color:#6b7890;margin:0}.card-hint{text-align:center;font-size:13px;color:#9ba8ba}.card-progress{padding:20px 0 15px;text-align:center;color:#1b2a48;font-size:14px}.progress-track{height:9px;background:#e3e9f0;border-radius:20px;margin-top:10px;overflow:hidden}.progress-fill{height:100%;width:8%;background:var(--green);border-radius:20px;transition:.3s}.answer-buttons{display:grid;grid-template-columns:1fr 1fr;gap:16px}.answer{border:0;border-radius:10px;padding:16px 12px;color:#fff;font:600 17px 'DM Sans';cursor:pointer;transition:transform .2s,filter .2s}.answer:hover,.start-button:hover{filter:brightness(1.06);transform:translateY(-2px)}.known{background:var(--green)}.repeat{background:var(--coral)}.start-button{border:0;border-radius:12px;background:var(--blue);color:#fff;font:700 19px 'DM Sans';padding:18px 24px;cursor:pointer;box-shadow:0 10px 18px rgba(13,91,215,.18);transition:.2s}.start-button span{font-size:25px;margin-left:15px}.study-column>.start-button{width:100%;margin-top:20px}.side-column{display:flex;flex-direction:column;gap:16px}.panel{background:#fff;border:1px solid var(--line);border-radius:17px;padding:21px 24px}.panel-heading{display:flex;align-items:center;justify-content:space-between}.panel h3{font-size:21px;margin:0}.link-button{border:0;background:transparent;color:var(--blue);font:500 13px 'DM Sans';cursor:pointer}.ring{width:150px;height:150px;border-radius:50%;background:conic-gradient(var(--blue) 0 65%,#e0e7ee 65%);display:grid;place-items:center;margin:18px auto 10px}.ring:before{content:'';position:absolute;width:116px;height:116px;background:#fff;border-radius:50%}.ring>div{z-index:1;text-align:center}.ring strong,.ring span{display:block}.ring strong{font-size:30px}.ring span{font-size:12px;color:var(--muted);margin-top:2px}.goal{text-align:center;margin:0;color:#233354;font-size:14px}.word-list{margin-top:15px}.word-row{display:flex;align-items:center;gap:12px;border-bottom:1px solid #edf0f4;padding:11px 0}.word-row:last-child{border:0}.word-emoji{font-size:22px;width:30px}.word-row strong,.word-row small{display:block}.word-row small{color:var(--muted);margin-top:2px}.check{margin-left:auto;color:var(--green);font-size:21px}.mobile-top,.other-view{display:none}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:13px 18px;border-radius:10px;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:0;border-radius:18px;padding:0;box-shadow:0 20px 70px rgba(16,38,83,.25);width:min(420px,calc(100% - 32px));color:var(--ink)}dialog::backdrop{background:rgba(16,38,83,.3)}#add-form{padding:28px;position:relative}#add-form h2{margin:0 0 8px;font-size:26px}#add-form p{color:var(--muted);margin:0 0 24px}label{display:block;font-size:14px;font-weight:600;margin:15px 0}input{display:block;width:100%;border:1px solid var(--line);border-radius:9px;padding:12px;margin-top:7px;font:16px 'DM Sans';color:var(--ink)}.dialog-close{position:absolute;right:18px;top:16px;border:0;background:transparent;font-size:26px;color:var(--muted);cursor:pointer}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:22px}.secondary-button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px 16px;font:600 15px 'DM Sans';color:var(--ink);cursor:pointer}
@media(max-width:900px){.app-shell{display:block;background:var(--bg)}.sidebar{display:none}.main-content{padding:20px 16px 32px}.mobile-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.brand.mini{font-size:24px;margin:0}.brand.mini i{font-size:20px}.hero{min-height:80px}.hero h1{font-size:34px;letter-spacing:-1px}.hero p{font-size:15px}.city-art{width:120px;height:85px}.tower{font-size:110px;right:12px}.stats{gap:10px;margin-bottom:22px;flex-wrap:wrap}.stat{flex:1;min-width:0;padding:12px 10px;gap:9px}.stat-icon{font-size:23px}.stat strong{font-size:18px}.stat span:not(.stat-icon){font-size:12px}.dashboard-grid{display:block}.flashcard-wrap{padding:8px 12px 16px}.flashcard{min-height:285px}.word-block h2{font-size:39px}.word-block p{font-size:20px}.answer{font-size:15px;padding:14px 5px}.side-column{margin-top:16px}.progress-panel{display:none}.vocab-panel{padding:17px}.study-column>.start-button{margin-top:14px}.panel-heading .link-button{font-size:12px}}.hidden{display:none!important}.language-picker{background:#fff;border:1px solid var(--line);border-radius:16px;padding:11px 14px;display:flex;align-items:center;gap:15px}.picker-label{font-size:13px;color:var(--muted);white-space:nowrap}.language-buttons{display:flex;gap:6px;flex-wrap:wrap}.language-button{border:1px solid transparent;background:#f3f7fb;border-radius:8px;color:var(--ink);font:600 13px 'DM Sans';padding:9px 12px;cursor:pointer}.language-button.active{background:var(--blue);color:#fff}.flashcard{width:100%;background:#fff;color:var(--ink);cursor:pointer;text-align:initial}.flashcard:focus-visible,.language-button:focus-visible,button:focus-visible{outline:3px solid rgba(13,91,215,.3);outline-offset:2px}.full-vocab{max-width:900px;margin:22px auto 0}.table-head,.table-row{display:grid;grid-template-columns:repeat(3,1fr) 90px;gap:16px;padding:13px 0;border-bottom:1px solid #edf0f4}.table-head{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:700}.table-row{font-size:15px}.filtered-table .table-row{grid-template-columns:1fr 1fr 90px}.edit-word{border:0;background:transparent;color:var(--blue);font:600 13px 'DM Sans';cursor:pointer;text-align:right}.learned-cell{color:var(--green);font-weight:700;background:#e9f8ed;border-radius:6px;padding-left:8px}.progress-definition{color:var(--muted);font-size:12px;line-height:1.45;margin:14px 0 0;text-align:center}.empty-state{text-align:center;padding:28px 0 10px}.empty-illustration{font-size:44px;color:var(--coral)}