:root{--bg:#f3eee4;--bg-deep:#e7dfd1;--ink:#1c241f;--muted:#5b665f;--brand:#1f4d3a;--brand-soft:#2f6a51;--accent:#b4532a;--accent-soft:#f0d7c8;--card:#fffcf6e0;--line:#1c241f1f;--ok:#1f6b45;--bad:#9b2c2c;--shadow:0 18px 40px #1c241f14;--radius:18px;--font-display:"Fraunces", Georgia, serif;--font-body:"Source Sans 3", "Segoe UI", sans-serif;--sidebar-width:280px;--topbar-height:64px;color:var(--ink);background:radial-gradient(circle at 12% 10%, #2f6a511f, transparent 34%), radial-gradient(circle at 88% 0%, #b4532a1a, transparent 28%), linear-gradient(180deg, #f7f2e9 0%, var(--bg) 48%, #ebe3d6 100%);font-family:var(--font-body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{min-height:100%}html{-webkit-text-size-adjust:100%}body{margin:0;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input,select{font:inherit}img,svg,video{max-width:100%}.app-shell{grid-template-columns:var(--sidebar-width) minmax(0, 1fr);min-height:100dvh;display:grid}.mobile-topbar,.nav-backdrop{display:none}.sidebar{height:100dvh;padding:1.5rem 1.1rem;padding-bottom:max(1.5rem, env(safe-area-inset-bottom));background:linear-gradient(180deg, #17382b 0%, var(--brand) 55%, #163328 100%);color:#f4efe6;z-index:40;flex-direction:column;gap:1.4rem;display:flex;position:sticky;top:0;overflow:auto}.brand-block h1{font-family:var(--font-display);margin:.35rem 0 .4rem;font-size:clamp(1.35rem,1.1rem + .6vw,1.55rem);font-weight:700;line-height:1.15}.brand-block p{color:#f4efe6c7;margin:0;font-size:.92rem;line-height:1.4}.brand-kicker{letter-spacing:.08em;text-transform:uppercase;color:#d9c4a8;font-size:.72rem;display:inline-block}.nav-list{flex-direction:column;gap:.35rem;display:flex}.nav-link{color:#f4efe6e0;border-radius:12px;align-items:center;min-height:44px;padding:.78rem .9rem;transition:background .18s,color .18s;display:flex}.nav-link:hover,.nav-link.active{color:#fff;background:#ffffff1a}.sidebar-foot{color:#f4efe6a6;margin-top:auto;font-size:.8rem;line-height:1.4}.main{min-width:0;padding:1.6rem clamp(1rem,2vw,1.8rem) 2.5rem;padding-bottom:max(2.5rem, env(safe-area-inset-bottom))}.page-header{margin-bottom:1.4rem}.page-header h2{font-family:var(--font-display);overflow-wrap:anywhere;margin:0 0 .45rem;font-size:clamp(1.45rem,1.1rem + 1.5vw,2.3rem);line-height:1.15}.page-header p{color:var(--muted);max-width:62ch;margin:0;line-height:1.5}.grid-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem;margin-bottom:1.3rem;display:grid}.stat-card,.panel,.topic-card,.norm-card,.question-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.stat-card{min-width:0;padding:1rem 1.05rem}.stat-card .label{color:var(--muted);font-size:.84rem}.stat-card .value{font-family:var(--font-display);margin-top:.25rem;font-size:clamp(1.35rem,1.1rem + 1vw,1.7rem)}.panel{margin-bottom:1rem;padding:1.15rem 1.2rem}.panel h3,.topic-card h3,.norm-card h3{font-family:var(--font-display);overflow-wrap:anywhere;margin:0 0 .55rem;font-size:clamp(1.05rem,.95rem + .4vw,1.15rem)}.muted{color:var(--muted)}.topic-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:.9rem;display:grid}.topic-card,.norm-card{min-width:0;padding:1.05rem 1.1rem;transition:transform .15s,border-color .15s}@media (hover:hover){.topic-card:hover,.norm-card:hover{border-color:#1f4d3a59;transform:translateY(-2px)}}.topic-card .meta,.norm-card .meta{color:var(--muted);overflow-wrap:anywhere;margin-bottom:.45rem;font-size:.82rem}.progress-bar{background:var(--bg-deep);border-radius:999px;height:8px;margin-top:.7rem;overflow:hidden}.progress-bar>span{background:linear-gradient(90deg, var(--brand), var(--brand-soft));height:100%;display:block}.btn-row{flex-wrap:wrap;gap:.6rem;margin-top:1rem;display:flex}.btn{appearance:none;cursor:pointer;text-align:center;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;min-height:44px;padding:.72rem 1.1rem;font-weight:600;transition:transform .12s,background .12s,border-color .12s;display:inline-flex}@media (hover:hover){.btn:hover{transform:translateY(-1px)}}.btn-primary{background:var(--brand);color:#f7f2ea}.btn-primary:hover{background:var(--brand-soft)}.btn-secondary{color:var(--brand);background:0 0;border-color:#1f4d3a59}.btn-accent{background:var(--accent);color:#fff8f2}.btn-ghost{color:var(--muted);border-color:var(--line);background:0 0}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.search-row{flex-wrap:wrap;gap:.7rem;margin-bottom:1rem;display:flex}.search-row input,.search-row select{border:1px solid var(--line);background:#fffcf7;border-radius:12px;flex:220px;width:100%;min-width:0;min-height:48px;padding:.8rem .9rem}.norm-list{flex-direction:column;gap:.8rem;display:flex}.norm-card pre,.article-body{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;font-family:var(--font-body);color:#243028;margin:.5rem 0 0;font-size:clamp(.95rem,.9rem + .2vw,1rem);line-height:1.55}.pill{color:var(--brand);overflow-wrap:anywhere;background:#1f4d3a1a;border-radius:999px;align-items:center;gap:.3rem;max-width:100%;padding:.28rem .7rem;font-size:.78rem;display:inline-flex}.question-card{padding:clamp(.95rem,2vw,1.2rem)}.question-meta{flex-wrap:wrap;gap:.45rem;margin-bottom:.8rem;display:flex}.options{gap:.55rem;margin-top:.9rem;display:grid}.option{text-align:left;border:1px solid var(--line);cursor:pointer;overflow-wrap:anywhere;background:#fffcf7;border-radius:14px;min-height:48px;padding:.9rem .95rem}.option.selected{border-color:var(--brand);background:#1f4d3a14}.option.correct{border-color:var(--ok);background:#1f6b451f}.option.wrong{border-color:var(--bad);background:#9b2c2c1a}.feedback{background:var(--accent-soft);overflow-wrap:anywhere;border:1px solid #b4532a33;border-radius:14px;margin-top:1rem;padding:.9rem 1rem}.feedback.ok{background:#1f6b451a;border-color:#1f6b4540}.feedback.bad{background:#9b2c2c14;border-color:#9b2c2c33}.attempt-list{flex-direction:column;gap:.55rem;display:flex}.attempt-item{border:1px solid var(--line);background:#fffcf7;border-radius:12px;justify-content:space-between;align-items:flex-start;gap:1rem;padding:.75rem .85rem;display:flex}.empty-state{border-radius:var(--radius);color:var(--muted);background:#fffcf68c;border:1px dashed #1c241f33;padding:1.4rem}.norm-expand{margin-top:.85rem}.norm-expand-toggle{width:100%}.norm-expand-panel{flex-direction:column;gap:.7rem;margin-top:.75rem;display:flex}.norm-expand-card{border:1px solid var(--line);background:#fffcf7;border-radius:14px;padding:.85rem .95rem}.norm-expand-card h4{font-family:var(--font-display);margin:.2rem 0 .45rem;font-size:1.02rem;line-height:1.25}.norm-expand-card .meta{color:var(--muted);font-size:.8rem}.norm-expand-note,.norm-expand-empty{margin:.55rem 0 0;font-size:.9rem}.login-page{place-items:center;min-height:100dvh;padding:1.2rem;display:grid}.login-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);width:min(100%,420px);box-shadow:var(--shadow);flex-direction:column;gap:.85rem;padding:1.4rem 1.25rem 1.3rem;display:flex}.login-card h1{font-family:var(--font-display);margin:0;font-size:1.55rem;line-height:1.15}.login-field{flex-direction:column;gap:.35rem;font-size:.92rem;font-weight:600;display:flex}.login-field input{border:1px solid var(--line);background:#fffcf7;border-radius:12px;min-height:48px;padding:.8rem .9rem;font-weight:500}.login-password-wrap{position:relative}.login-password-wrap input{width:100%;padding-right:3rem}.login-eye{color:#5f574c;cursor:pointer;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;width:2.25rem;height:2.25rem;padding:0;display:inline-flex;position:absolute;top:50%;right:.55rem;transform:translateY(-50%)}.login-eye:hover,.login-eye:focus-visible{color:var(--ink);background:#0000000d;outline:none}.sidebar-user{flex-direction:column;gap:.45rem;margin-bottom:.75rem;display:flex}.sidebar-logout{width:100%;color:#f4efe6!important;border-color:#ffffff40!important}@media (width<=1100px){.grid-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=900px){.app-shell{grid-template-rows:auto 1fr;grid-template-columns:1fr}.mobile-topbar{z-index:50;min-height:var(--topbar-height);padding:.7rem .9rem;padding-top:max(.7rem, env(safe-area-inset-top));background:linear-gradient(180deg, #17382b 0%, var(--brand) 100%);color:#f4efe6;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;gap:.75rem;display:flex;position:sticky;top:0}.mobile-brand{flex-direction:column;gap:.1rem;min-width:0;display:flex}.mobile-brand strong{font-family:var(--font-display);white-space:nowrap;text-overflow:ellipsis;font-size:1rem;line-height:1.2;overflow:hidden}.menu-toggle{cursor:pointer;background:#ffffff14;border:1px solid #ffffff2e;border-radius:12px;flex-shrink:0;place-content:center;gap:5px;width:44px;height:44px;padding:0;display:grid}.menu-toggle span{background:#f4efe6;border-radius:999px;width:18px;height:2px;transition:transform .18s,opacity .18s;display:block}.menu-open .menu-toggle span:first-child{transform:translateY(7px)rotate(45deg)}.menu-open .menu-toggle span:nth-child(2){opacity:0}.menu-open .menu-toggle span:nth-child(3){transform:translateY(-7px)rotate(-45deg)}.nav-backdrop{z-index:35;background:#121c1773;border:0;padding:0;display:block;position:fixed;inset:0}.nav-backdrop[hidden]{display:none}.sidebar{width:min(86vw,320px);height:100dvh;padding-top:max(1.3rem, env(safe-area-inset-top));transition:transform .22s;position:fixed;top:0;left:0;transform:translate(-105%);box-shadow:12px 0 40px #0003}.menu-open .sidebar{transform:translate(0)}.main{padding:1rem .9rem 2rem;padding-bottom:max(2rem, env(safe-area-inset-bottom))}.btn-row .btn,.btn-row a.btn{text-align:center;flex:100%;justify-content:center}.attempt-item{flex-direction:column;gap:.35rem}.topic-grid{grid-template-columns:1fr}}@media (width<=520px){.grid-stats{grid-template-columns:1fr 1fr;gap:.65rem}.stat-card{padding:.85rem .8rem}.panel,.topic-card,.norm-card,.question-card{border-radius:14px}.page-header{margin-bottom:1rem}.brand-block p,.sidebar-foot{font-size:.86rem}}@media (width<=360px){.grid-stats{grid-template-columns:1fr}.mobile-brand strong{font-size:.92rem}}@media (width>=901px){.mobile-topbar,.nav-backdrop{display:none!important}}