:root{--ink:#17202a;--muted:#68717d;--paper:#fbfcfa;--surface:#fff;--line:#e2e5df;--green:#176b50;--green2:#dff1e8;--navy:#122d3b;--shadow:0 18px 50px rgba(23,32,42,.09)}*{box-sizing:border-box}html{scroll-behavior:smooth}html[data-theme=dark]{--ink:#edf3f0;--muted:#aeb8b3;--paper:#101715;--surface:#17201d;--line:#2d3935;--green:#70c9a7;--green2:#233b32;--navy:#0c242a;--shadow:0 18px 50px rgba(0,0,0,.24)}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;letter-spacing:0}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.shell{width:min(1180px,calc(100% - 40px));margin:auto}.site-header{height:74px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(16px);position:sticky;top:0;z-index:20}.nav-wrap{height:100%;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;font-family:Newsreader,serif;font-size:24px;font-weight:600}.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:var(--green);color:white;border-radius:50%}.brand-mark svg{width:18px}nav{display:flex;gap:34px}nav>a{font-size:14px;font-weight:600;color:var(--muted)}nav>a:hover{color:var(--green)}.nav-actions{display:flex;align-items:center;gap:10px}.icon-button{width:40px;height:40px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer}.icon-button svg{width:18px}.menu-button{display:none}.button{border:0;border-radius:6px;background:var(--green);color:white;padding:12px 20px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer}.button:hover{filter:brightness(1.08)}.button.small{padding:10px 16px;font-size:14px}.button.large{padding:15px 22px}.button svg,.text-link svg{width:18px}.hero{min-height:620px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:80px;padding-block:72px}.eyebrow{color:var(--green);text-transform:uppercase;font-size:12px;letter-spacing:1.3px;font-weight:700;display:inline-flex;align-items:center;gap:7px}.eyebrow svg{width:15px}.hero h1,.section h2,.method h2,.cta h2,.catalog-head h1{font:600 clamp(46px,5.4vw,76px)/.98 Newsreader,serif;letter-spacing:0;margin:24px 0}.hero h1 em{color:var(--green);font-style:italic}.hero-copy>p{font-size:19px;line-height:1.65;color:var(--muted);max-width:570px}.hero-actions{display:flex;align-items:center;gap:26px;margin:32px 0}.text-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--green)}.trust{display:flex;align-items:center;gap:14px;margin-top:55px}.avatar-stack{display:flex}.avatar-stack span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e6b88e;border:2px solid var(--paper);font-size:9px;font-weight:700;margin-left:-8px}.avatar-stack span:nth-child(2){background:#aecbd0}.avatar-stack span:nth-child(3){background:#d8c7ea}.trust p{font-size:12px;line-height:1.4;color:var(--muted)}.trust strong{color:var(--ink)}.hero-demo{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);padding:28px;border-radius:8px;transform:rotate(1deg);position:relative}.hero-demo:before{content:"";position:absolute;inset:12px -12px -12px 12px;border:1px solid var(--line);border-radius:8px;z-index:-1}.demo-top,.keyboard-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted)}.level{display:inline-flex;padding:5px 9px;border-radius:4px;background:var(--green2);color:var(--green);font-size:11px;font-weight:700}.wave{height:150px;display:flex;align-items:center;gap:16px}.play{width:46px;height:46px;border:0;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center}.play svg{width:18px;fill:currentColor}.wave-bars,.visualizer{display:flex;align-items:center;gap:3px;height:64px;flex:1}.wave-bars i,.visualizer i{height:var(--h);width:3px;min-height:4px;background:#8bc5b0;border-radius:3px}.wave>span{font-size:11px;color:var(--muted)}.hero-demo label,.answer-area label{font-weight:700;font-size:13px}.fake-input{height:54px;border:1px solid var(--green);border-radius:5px;margin:10px 0;display:flex;align-items:center;padding:0 14px}.fake-input i{height:20px;border-left:2px solid var(--green);margin-left:3px}.keyboard-row button{width:34px;height:34px;border:0;border-radius:4px;background:var(--green);color:white}.demo-progress{display:flex;gap:5px;margin-top:28px}.demo-progress i{height:3px;flex:1;background:var(--line)}.demo-progress i.active{background:var(--green)}.stats-band{background:var(--navy);color:#fff}.stats-band>.shell{min-height:120px;display:grid;grid-template-columns:repeat(4,1fr);align-items:center}.stats-band div div{display:flex;flex-direction:column;padding-left:35px;border-left:1px solid #ffffff2b}.stats-band div div:first-child{border:0}.stats-band strong{font:600 30px Newsreader,serif}.stats-band span{font-size:11px;color:#c3d1d2;text-transform:uppercase;margin-top:5px;letter-spacing:.7px}.section{padding-block:105px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:45px}.section h2,.method h2,.cta h2{font-size:52px;margin:16px 0 0}.topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.topic-card{border:1px solid var(--line);background:var(--surface);padding:25px;display:flex;gap:18px;border-radius:7px;min-height:175px}.topic-card:hover{border-color:var(--accent);transform:translateY(-2px)}.topic-icon,.list-icon{flex:0 0 45px;width:45px;height:45px;border-radius:6px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 13%,var(--surface));color:var(--accent)}.topic-icon svg,.list-icon svg{width:21px}.topic-card h3{margin:2px 0 8px;font:600 21px Newsreader,serif}.topic-card p{font-size:13px;color:var(--muted);line-height:1.55;margin:0 0 18px}.topic-card div>span{font-size:11px;font-weight:700;color:var(--green);display:flex;align-items:center;gap:6px}.topic-card div>span svg{width:13px}.method{background:#edf3ef;color:#18241f;padding:100px 0}.method-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:100px}.method-grid>div>p{color:#617069;line-height:1.7;max-width:430px}.method ol{margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:45px 60px;list-style:none}.method li{display:flex;gap:20px}.method li>span{font:600 16px Newsreader;color:#7ba08f}.method h3{font:600 22px Newsreader;margin:0 0 8px}.method li p{font-size:13px;line-height:1.6;color:#617069;margin:0}.exercise-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.exercise-card{padding:22px;border:1px solid var(--line);background:var(--surface);border-radius:7px}.exercise-card:hover{box-shadow:var(--shadow)}.exercise-card>div,.exercise-card footer{display:flex;justify-content:space-between;align-items:center}.topic-label{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:6px;font-weight:700}.topic-label svg{width:14px}.exercise-card h3{font:600 23px Newsreader;margin:24px 0 8px}.exercise-card p{color:var(--muted);font-size:13px;line-height:1.5;min-height:40px}.exercise-card footer{border:0!important;min-height:0;padding:20px 0 0;margin-top:20px;border-top:1px solid var(--line)!important;background:none}.exercise-card footer span{font-size:11px;color:var(--muted);display:flex;gap:6px}.exercise-card footer svg{width:15px}.cta{margin-bottom:100px;padding:75px;text-align:center;background:var(--green);color:white;border-radius:8px}.cta .eyebrow{color:#caeadc}.cta h2{font-size:55px;margin:20px 0 32px}.button.light{background:white;color:var(--green)}footer{border-top:1px solid var(--line);padding:28px 0}.footer-grid{display:flex;justify-content:space-between;align-items:center}.footer-grid p,.footer-grid>span{font-size:12px;color:var(--muted)}
.catalog-head{padding:70px 0;background:#eef4f0;border-bottom:1px solid var(--line);color:#18241f}.catalog-head h1{font-size:58px;margin:18px 0 10px}.catalog-head p{color:#617069}.search{margin-top:32px;max-width:600px;background:white;border:1px solid #d8dfda;border-radius:6px;padding:6px 6px 6px 15px;display:flex;align-items:center;gap:10px}.search svg{width:19px;color:#68717d}.search input{border:0;outline:0;flex:1;min-width:0}.catalog{display:grid;grid-template-columns:220px 1fr;gap:55px;padding-block:60px}.catalog aside{display:flex;flex-direction:column;gap:4px}.catalog aside h3{font-size:12px;text-transform:uppercase;letter-spacing:1px}.catalog aside a{display:flex;align-items:center;gap:10px;padding:10px;border-radius:5px;font-size:13px;color:var(--muted)}.catalog aside a.active{background:var(--green2);color:var(--green);font-weight:700}.catalog aside svg{width:16px}.catalog aside span{margin-left:auto;font-size:11px}.filter-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.filter-row h2{font:600 27px Newsreader;margin:0}.segments{display:flex;border:1px solid var(--line);border-radius:5px;padding:3px}.segments a{font-size:11px;padding:7px 10px;border-radius:3px;color:var(--muted)}.segments a.active{background:var(--green);color:white}.exercise-list{display:flex;flex-direction:column}.exercise-list>a{display:grid;grid-template-columns:50px 1fr 55px 65px 38px;gap:16px;align-items:center;padding:20px 8px;border-top:1px solid var(--line)}.exercise-list>a:hover{background:var(--surface)}.exercise-list>a .list-icon{--accent:var(--green)}.exercise-list h3{font:600 20px Newsreader;margin:3px 0}.exercise-list p,.exercise-list div>span{font-size:11px;color:var(--muted);margin:0}.time{font-size:11px;color:var(--muted);display:flex;gap:5px}.time svg{width:14px}.round-arrow{width:34px;height:34px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center}.round-arrow svg{width:15px}.empty{text-align:center;padding:80px}.empty svg{width:40px;color:var(--muted)}
.practice-shell{width:min(1100px,calc(100% - 40px));margin:auto;padding:28px 0 70px}.practice-breadcrumb{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);margin:8px 0 38px}.practice-breadcrumb svg{width:13px}.lesson-header{display:flex;justify-content:space-between;align-items:flex-start;border:0;padding:0}.lesson-header h1{font:600 43px Newsreader;margin:12px 0 8px}.lesson-header p{color:var(--muted);margin:0}.lesson-meta{display:flex;gap:12px;align-items:center}.lesson-meta>span:not(.level){display:flex;align-items:center;gap:5px;font-size:12px;color:var(--muted)}.lesson-meta svg{width:15px}.lesson-progress{margin:35px 0 22px}.lesson-progress>div:first-child{display:flex;justify-content:space-between;font-size:11px;margin-bottom:9px}.lesson-progress>div:last-child{height:5px;background:var(--line);border-radius:5px;overflow:hidden}.lesson-progress>div i{display:block;height:100%;background:var(--green);transition:.3s}.practice-grid{display:grid;grid-template-columns:1fr 310px;gap:20px}.trainer,.lesson-side{border:1px solid var(--line);background:var(--surface);border-radius:7px}.trainer{padding:32px 45px}.sentence-counter{text-align:center;font-size:12px;color:var(--muted)}.audio-stage{height:190px;display:flex;align-items:center;gap:22px}.main-play{width:58px;height:58px;flex:0 0 58px;border:0;background:var(--green);color:white;border-radius:50%;display:grid;place-items:center;cursor:pointer}.main-play svg{fill:currentColor}.visualizer.playing i{animation:pulse .65s infinite alternate}.visualizer i:nth-child(3n){animation-delay:.25s}@keyframes pulse{to{height:15%}}.speed{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:4px;padding:5px 8px;font-size:11px;cursor:pointer}.audio-help{text-align:center;color:var(--muted);font-size:11px;margin-top:-25px}.answer-area{margin-top:35px}.answer-area textarea{display:block;width:100%;resize:none;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:5px;padding:15px;margin-top:10px;outline:none;line-height:1.5}.answer-area textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--green2)}.answer-actions{display:flex;justify-content:space-between;margin-top:15px}.text-button{border:0;background:none;color:var(--muted);display:flex;align-items:center;gap:7px;cursor:pointer;font-size:12px}.text-button svg{width:16px}.feedback{padding:12px;margin-top:10px;border-radius:5px;font-size:13px}.feedback.correct{display:block;background:var(--green2);color:var(--green)}.feedback.wrong{display:block;background:#fee9e8;color:#a53f3b}.lesson-side{padding:22px}.side-tabs{display:flex;border-bottom:1px solid var(--line);margin:-5px 0 20px}.side-tabs button{flex:1;border:0;background:none;padding:12px;color:var(--muted);font-size:12px;cursor:pointer;border-bottom:2px solid transparent}.side-tabs button.active{color:var(--green);border-color:var(--green);font-weight:700}.tab-panel{display:none}.tab-panel.active{display:block}.tip{display:flex;gap:12px;margin:22px 0}.tip>svg{width:18px;color:var(--green);flex:0 0 18px}.tip h3{font-size:13px;margin:0 0 5px}.tip p{font-size:11px;line-height:1.5;color:var(--muted);margin:0}.shortcut{border-top:1px solid var(--line);margin-top:25px;padding-top:18px;display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}kbd{border:1px solid var(--line);border-bottom-width:2px;background:var(--paper);padding:2px 5px;border-radius:3px;font-size:9px}.transcript p{font-size:12px;line-height:1.5;color:var(--muted);display:flex;gap:10px}.transcript p span{color:var(--green);font-weight:700}.transcript p.current{color:var(--ink);font-weight:700}.lesson-nav{margin-top:25px;display:flex;justify-content:space-between}.lesson-nav a{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted)}.lesson-nav svg{width:17px}.lesson-nav small{display:block;font:600 16px Newsreader;color:var(--ink);margin-top:4px}.lesson-nav a:last-child{text-align:right}
@media(max-width:800px){.shell,.practice-shell{width:min(100% - 28px,1180px)}.site-header nav{display:none;position:absolute;top:74px;left:0;right:0;padding:20px;background:var(--surface);flex-direction:column}.site-header nav.open{display:flex}.menu-button{display:grid}.nav-actions>.button{display:none}.hero{grid-template-columns:1fr;gap:35px;padding-block:50px}.hero h1{font-size:52px}.trust{margin-top:35px}.stats-band>.shell{grid-template-columns:1fr 1fr;padding:18px 0}.stats-band div div{padding:14px;border:0}.topic-grid,.exercise-grid{grid-template-columns:1fr}.section{padding-block:70px}.section-heading{align-items:flex-start;gap:20px}.section h2,.method h2{font-size:42px}.method-grid{grid-template-columns:1fr;gap:45px}.method ol{grid-template-columns:1fr}.cta{padding:55px 20px;margin-bottom:60px}.cta h2{font-size:42px}.footer-grid{flex-direction:column;gap:10px;text-align:center}.catalog{grid-template-columns:1fr}.catalog aside{display:none}.filter-row{align-items:flex-start;gap:15px;flex-direction:column}.segments{max-width:100%;overflow:auto}.exercise-list>a{grid-template-columns:45px 1fr 40px}.exercise-list .time,.exercise-list .round-arrow{display:none}.practice-grid{grid-template-columns:1fr}.trainer{padding:25px 20px}.lesson-header{flex-direction:column;gap:20px}.lesson-header h1{font-size:36px}.lesson-side{order:2}.audio-stage{height:160px}.visualizer{gap:2px}.visualizer i{width:2px}.hero-actions{align-items:flex-start;flex-direction:column}.section-heading{flex-direction:column}.stats-band strong{font-size:24px}}

.admin-body{background:#f4f7f5}.admin-layout{min-height:100vh;display:grid;grid-template-columns:235px 1fr;color:#17202a}.admin-nav{position:sticky;top:0;height:100vh;background:#102d27;color:#d8e8e1;padding:28px 20px;display:flex;flex-direction:column}.admin-nav .brand{color:white;padding:0 8px;margin-bottom:55px}.admin-nav>div:not(.admin-nav-bottom){display:flex;flex-direction:column;gap:5px}.admin-nav>div>span{padding:0 10px 10px;text-transform:uppercase;font-size:9px;letter-spacing:1.2px;color:#769d8f}.admin-nav a,.admin-nav button{border:0;background:none;color:#a9c1b8;padding:11px 10px;border-radius:5px;display:flex;align-items:center;gap:10px;font-size:13px;text-align:left;width:100%;cursor:pointer}.admin-nav a:hover,.admin-nav button:hover{background:#ffffff12;color:white}.admin-nav svg{width:17px}.admin-nav-bottom{margin-top:auto;border-top:1px solid #ffffff18;padding-top:12px}.admin-main{padding:50px 55px;min-width:0}.admin-main.narrow{max-width:1050px}.admin-head{display:flex;justify-content:space-between;align-items:center;border:0;padding:0;margin-bottom:35px}.admin-head h1{font:600 42px Newsreader;margin:10px 0 6px}.admin-head p{font-size:13px;color:#68717d;margin:0}.admin-head .button svg{width:17px}.admin-back{display:inline-flex;align-items:center;gap:6px;color:#176b50;font-size:12px;font-weight:700;margin-bottom:5px}.admin-back svg{width:15px}.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px}.admin-stats>div{background:#fff;border:1px solid #e0e6e2;border-radius:7px;padding:21px;display:grid;grid-template-columns:30px 1fr;align-items:center}.admin-stats svg{grid-row:1/3;color:#176b50;width:20px}.admin-stats span{font-size:11px;color:#68717d}.admin-stats strong{font:600 27px Newsreader}.admin-panel{background:#fff;border:1px solid #e0e6e2;border-radius:7px;overflow:hidden}.panel-head{padding:22px 24px;display:flex;justify-content:space-between;align-items:center}.panel-head h2{font:600 22px Newsreader;margin:0}.panel-head p{font-size:11px;color:#68717d;margin:5px 0 0}.panel-head>a{display:flex;gap:6px;align-items:center;color:#176b50;font-size:12px;font-weight:700}.panel-head svg{width:15px}.admin-panel table{width:100%;border-collapse:collapse}.admin-panel th{padding:11px 20px;background:#f7f9f8;color:#78817d;text-align:left;text-transform:uppercase;font-size:9px;letter-spacing:.8px}.admin-panel td{padding:16px 20px;border-top:1px solid #e8ece9;font-size:12px;color:#54605b}.admin-panel td strong{display:block;color:#17202a;font-size:13px}.admin-panel td small{display:block;color:#8a938f;margin-top:4px;max-width:440px}.table-action{width:32px;height:32px;border:1px solid #dfe5e1;background:white;color:#52605a;border-radius:5px;display:grid;place-items:center;cursor:pointer}.table-action svg{width:14px}.table-action.danger{color:#b3423e}.row-actions{display:flex;justify-content:flex-end;gap:6px}.admin-topic{display:flex;align-items:center;gap:11px}.admin-topic>span{width:36px;height:36px;display:grid;place-items:center;border-radius:5px;background:color-mix(in srgb,var(--accent) 12%,white);color:var(--accent)}.admin-topic svg{width:17px}.color-chip{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--color);margin-right:6px;vertical-align:-1px}.admin-panel code{font-size:11px;background:#eef2ef;padding:4px 6px;border-radius:3px}.admin-alert{padding:12px 15px;border-radius:5px;margin-bottom:15px;display:flex;align-items:center;gap:8px;font-size:12px}.admin-alert svg{width:16px}.admin-alert.success{background:#dff1e8;color:#176b50}.admin-alert.error{background:#fee9e8;color:#a53f3b}.admin-form.editor{padding:28px;overflow:visible}.admin-form label{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:700;color:#39453f}.admin-form input,.admin-form textarea,.admin-form select{width:100%;border:1px solid #dce3df;background:white;color:#17202a;border-radius:5px;padding:11px 12px;outline:none;font-weight:400}.admin-form input:focus,.admin-form textarea:focus,.admin-form select:focus{border-color:#176b50;box-shadow:0 0 0 3px #dff1e8}.admin-form label>span,.validation{color:#b3423e;font-size:10px}.admin-form small{font-weight:400;color:#7d8782}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:20px}.form-grid.three{grid-template-columns:1.4fr .6fr .7fr}.editor>label{margin-bottom:20px}.sentence-editor{line-height:1.8}.form-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:20px;border-top:1px solid #e5e9e6}.secondary-button{border:1px solid #d9e0dc;background:#fff;color:#44514b;border-radius:5px;padding:11px 16px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;gap:7px}.secondary-button svg{width:15px}.color-input{display:grid;grid-template-columns:48px 1fr;gap:8px}.color-input input[type=color]{padding:4px;height:41px}.login-page{min-height:100vh;background:#edf3ef;display:grid;place-items:center;padding:20px;color:#17202a}.login-box{width:min(420px,100%);background:#fff;border:1px solid #dce3df;border-radius:8px;padding:38px;box-shadow:0 20px 60px #173a2e18}.login-box>.brand{margin-bottom:48px}.login-box h1{font:600 38px Newsreader;margin:12px 0 6px}.login-box>div>p{color:#68717d;font-size:13px;margin-bottom:28px}.login-box .admin-form{display:flex;flex-direction:column;gap:17px}.login-box .button{margin-top:5px}.back-site{display:flex;align-items:center;justify-content:center;gap:6px;color:#68717d;font-size:11px;margin-top:25px}.back-site svg{width:14px}
@media(max-width:850px){.admin-layout{grid-template-columns:1fr}.admin-nav{height:auto;position:static;flex-direction:row;align-items:center;padding:12px 15px;overflow:auto}.admin-nav .brand{margin:0 15px 0 0}.admin-nav>div:not(.admin-nav-bottom){flex-direction:row}.admin-nav>div>span,.admin-nav-bottom{display:none}.admin-nav a{white-space:nowrap}.admin-main{padding:30px 18px}.admin-stats{grid-template-columns:1fr 1fr}.admin-panel{overflow:auto}.admin-panel table{min-width:700px}.admin-head{align-items:flex-start;gap:18px}.form-grid,.form-grid.three{grid-template-columns:1fr}.login-box{padding:28px}}
.check-label{flex-direction:row!important;align-items:flex-start;gap:12px!important;margin:4px 0 22px}.check-label>input{width:17px;height:17px;margin-top:2px}.check-label>span{display:flex;flex-direction:column;gap:4px}.check-label strong{font-size:12px}.import-note{display:flex;gap:12px;background:#eef5f1;color:#53635b;padding:15px;border-radius:5px;margin-bottom:22px}.import-note svg{width:19px;flex:0 0 19px;color:#176b50}.import-note p{font-size:11px;line-height:1.55;margin:0}.import-note strong{display:block;color:#26372f;margin-bottom:3px}.import-result{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}.import-result>div{background:#fff;border:1px solid #dfe6e2;border-radius:6px;padding:15px;display:flex;flex-direction:column}.import-result strong{font:600 25px Newsreader;color:#176b50}.import-result span{font-size:10px;color:#75817b;text-transform:uppercase}.import-result .has-error strong{color:#b3423e}.admin-alert small{display:block;margin-top:5px;word-break:break-word}
.source-banner{display:flex;align-items:center;gap:12px;background:#e6f2ec;border:1px solid #cfe3d9;border-radius:6px;padding:14px 16px;margin-bottom:16px}.source-banner>svg{width:20px;color:#176b50}.source-banner div{display:flex;flex-direction:column}.source-banner strong{font-size:12px}.source-banner span{font-size:10px;color:#65736c;margin-top:2px}.source-banner a{margin-left:auto;display:flex;align-items:center;gap:6px;color:#176b50;font-size:11px;font-weight:700}.source-banner a svg{width:14px}.audio-manager{border-top:1px solid #e2e7e4;margin:10px -28px 25px;padding:25px 28px 0}.audio-manager-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.audio-manager-head h2{font:600 21px Newsreader;margin:0}.audio-manager-head p{font-size:11px;color:#748079;margin:4px 0 0}.audio-manager-head>span{font-size:10px;font-weight:700;color:#176b50;background:#e6f2ec;padding:6px 9px;border-radius:4px}.audio-list{border:1px solid #e1e6e3;border-radius:6px;max-height:430px;overflow:auto}.audio-row{display:grid;grid-template-columns:30px minmax(220px,1fr) 240px 76px;gap:12px;align-items:center;padding:12px;border-top:1px solid #e8ece9}.audio-row:first-child{border-top:0}.audio-position{width:26px;height:26px;border-radius:50%;background:#e6f2ec;color:#176b50;display:grid;place-items:center;font-size:10px;font-weight:700}.audio-row strong{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.audio-row code{display:block;color:#758079;background:none;padding:0;font-size:9px;margin-top:4px;word-break:break-all}.audio-row audio{width:240px;height:32px}.audio-missing,.audio-row small{font-size:10px;color:#b3423e}.audio-actions{display:flex;gap:5px;justify-content:flex-end}.audio-upload{width:32px;height:32px!important;border:1px solid #dfe5e1;border-radius:5px;display:grid!important;place-items:center;background:#fff;color:#52605a;cursor:pointer}.audio-upload:hover,.audio-upload.selected{border-color:#176b50;background:#e6f2ec;color:#176b50}.audio-upload.uploading{opacity:.55;pointer-events:none}.audio-upload.uploading svg{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.audio-upload svg{width:14px}.audio-upload input{display:none}.audio-row .table-action{justify-self:end}@media(max-width:850px){.audio-row{grid-template-columns:28px 1fr 76px}.audio-row audio{grid-column:2/4;width:100%}.source-banner{align-items:flex-start}.source-banner a{font-size:0}.audio-manager-head{align-items:flex-start}}
.practice-modes{display:flex;justify-content:center;gap:4px;margin:-12px auto 22px}.practice-modes button{border:1px solid var(--line);background:var(--surface);color:var(--muted);padding:8px 12px;font-size:11px;display:flex;align-items:center;gap:6px;cursor:pointer}.practice-modes button:first-child{border-radius:5px 0 0 5px}.practice-modes button:last-child{border-radius:0 5px 5px 0}.practice-modes button.active{background:var(--green2);border-color:var(--green);color:var(--green);font-weight:700}.practice-modes svg{width:14px}.sentence-skip{width:34px;height:34px;flex:0 0 34px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--muted);display:grid;place-items:center;cursor:pointer}.sentence-skip:disabled{opacity:.3;cursor:not-allowed}.sentence-skip svg{width:14px}.read-mode{text-align:center;margin-top:28px;padding:30px;background:var(--paper);border:1px solid var(--line);border-radius:6px}.read-mode>span{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--green);font-weight:700}.read-mode p{font:600 28px/1.35 Newsreader;margin:18px auto;max-width:580px}.read-mode .text-button{margin:auto}.full-audio{padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--line)}.full-audio span{display:block;font-size:11px;font-weight:700;margin-bottom:8px}.full-audio audio{width:100%;height:34px}@media(max-width:800px){.audio-stage{gap:8px}.sentence-skip{width:30px;height:30px;flex-basis:30px}.read-mode p{font-size:23px}}
.login-link,.account-link{font-size:12px;font-weight:700;color:var(--muted)}.account-link{display:flex;align-items:center;gap:7px}.account-link svg{width:18px;color:var(--green)}.account-page{min-height:calc(100vh - 74px);display:grid;place-items:center;padding:60px 20px;background:#edf3ef;color:#17202a}.account-panel{width:min(900px,100%);display:grid;grid-template-columns:.9fr 1.1fr;background:#fff;border:1px solid #dce4df;border-radius:8px;overflow:hidden;box-shadow:0 22px 70px #173a2e14}.account-intro{background:#12372f;color:#dcebe5;padding:55px 45px}.account-intro .eyebrow{color:#8ed0b5}.account-intro h1{font:600 43px/1.05 Newsreader;margin:20px 0}.account-intro>p{font-size:13px;line-height:1.65;color:#a9c5ba;margin-bottom:42px}.account-intro>div{display:flex;align-items:center;gap:11px;margin:17px 0;font-size:12px}.account-intro>div svg{width:17px;color:#76c2a3}.account-form-wrap{padding:48px}.account-form-wrap h2{font:600 32px Newsreader;margin:0}.account-form-wrap>p{font-size:12px;color:#748079;margin:8px 0 28px}.account-form{display:flex;flex-direction:column;gap:17px}.account-form .button{margin-top:5px}.account-switch{text-align:center!important;font-size:11px!important;margin:24px 0 0!important}.account-switch a{color:#176b50;font-weight:700}.learner-head{padding:55px 0;background:#edf3ef;color:#17202a}.learner-head>.shell{display:flex;justify-content:space-between;align-items:center}.learner-head h1{font:600 43px Newsreader;margin:12px 0 5px}.learner-head p{font-size:13px;color:#68756f;margin:0}.learner-dashboard{padding-block:42px 90px}.learner-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:35px}.learner-stats>div{background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:20px}.learner-stats span{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);text-transform:uppercase}.learner-stats span svg{width:15px;color:var(--green)}.learner-stats strong{display:inline-block;font:600 33px Newsreader;margin:15px 5px 0 0}.learner-stats small{font-size:10px;color:var(--muted)}.dashboard-grid{display:grid;grid-template-columns:1fr 250px;gap:25px}.dashboard-title{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.dashboard-title h2{font:600 27px Newsreader;margin:0}.dashboard-title p{font-size:11px;color:var(--muted);margin:5px 0}.dashboard-empty{text-align:center;border:1px dashed var(--line);padding:60px 20px;border-radius:7px}.dashboard-empty>svg{width:34px;color:var(--green)}.dashboard-empty h3{font:600 21px Newsreader}.dashboard-empty p{font-size:12px;color:var(--muted)}.dashboard-empty .button{margin-top:12px}.recent-learning{border:1px solid var(--line);border-radius:7px;background:var(--surface)}.recent-learning>a{display:grid;grid-template-columns:1fr 130px 20px;gap:20px;align-items:center;padding:17px;border-top:1px solid var(--line)}.recent-learning>a:first-child{border-top:0}.recent-learning span,.recent-learning small{font-size:9px;color:var(--muted)}.recent-learning h3{font:600 18px Newsreader;margin:4px 0}.recent-learning>a>svg{width:16px}.recent-progress strong{font-size:10px}.recent-progress>span{display:block;height:4px;background:var(--line);border-radius:4px;margin-top:7px}.recent-progress i{display:block;height:100%;background:var(--green)}.weekly-card{background:#12372f;color:white;border-radius:7px;padding:28px;height:max-content}.weekly-card .eyebrow{color:#86c9ae}.weekly-card h2{font:600 58px Newsreader;margin:25px 0 0}.weekly-card>p{font-size:11px;color:#a9c5ba;margin:0}.weekly-card>div{display:flex;gap:10px;border-top:1px solid #ffffff1c;margin-top:28px;padding-top:20px;color:#b7cdc4;font-size:11px;line-height:1.5}.weekly-card svg{width:17px;flex:0 0 17px;color:#86c9ae}@media(max-width:800px){.nav-actions .login-link{display:none}.account-link span{display:none}.account-panel{grid-template-columns:1fr}.account-intro{display:none}.account-form-wrap{padding:32px 25px}.learner-head>.shell{align-items:flex-start}.learner-head h1{font-size:36px}.learner-stats{grid-template-columns:1fr 1fr}.dashboard-grid{grid-template-columns:1fr}.recent-learning>a{grid-template-columns:1fr 90px 16px}}
.catalog-group-filters{display:flex;align-items:flex-end;gap:12px;padding:14px 0 22px;border-bottom:1px solid var(--line);margin-bottom:8px}.catalog-group-filters label{display:flex;flex-direction:column;gap:6px;min-width:220px}.catalog-group-filters label:nth-of-type(2){min-width:150px}.catalog-group-filters label>span{font-size:10px;text-transform:uppercase;font-weight:700;color:var(--muted);letter-spacing:.6px}.catalog-group-filters select{height:40px;border:1px solid var(--line);border-radius:5px;background:var(--surface);color:var(--ink);padding:0 34px 0 11px}.catalog-groups{display:flex;flex-direction:column}.catalog-group{border-bottom:1px solid var(--line)}.catalog-group>summary{list-style:none;min-height:64px;padding:0 8px;display:grid;grid-template-columns:1fr auto 20px;align-items:center;gap:14px;cursor:pointer}.catalog-group>summary::-webkit-details-marker{display:none}.catalog-group>summary>span{display:flex;align-items:center;gap:10px}.catalog-group>summary>span svg{width:18px;color:var(--green)}.catalog-group>summary strong{font:600 22px Newsreader,serif}.catalog-group>summary small{font-size:11px;color:var(--muted)}.catalog-group>summary>svg{width:17px;color:var(--muted);transition:transform .2s}.catalog-group[open]>summary>svg{transform:rotate(180deg)}.catalog-group .exercise-list{padding-left:22px;border-left:2px solid var(--green2);margin:0 0 18px 16px}.catalog-group .exercise-list>a:first-child{border-top:0}@media(max-width:800px){.catalog-group-filters{display:grid;grid-template-columns:1fr 1fr}.catalog-group-filters label,.catalog-group-filters label:nth-of-type(2){min-width:0}.catalog-group-filters .button{grid-column:1/-1}.catalog-group>summary{padding-inline:2px}.catalog-group>summary strong{font-size:19px}.catalog-group .exercise-list{padding-left:5px;margin-left:5px}.catalog-group .exercise-list>a{padding-inline:4px}}

/* Dashboard mock analytics: band chart + question-type accuracy */
.dashboard-analytics{margin-bottom:35px}
.analytics-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:25px}
.analytics-card{background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:20px}
.analytics-card h3{font:600 18px Newsreader;margin:0 0 14px}
.analytics-empty{font-size:12px;color:var(--muted);margin:0}
.analytics-meter{display:grid;grid-template-columns:120px 1fr 40px;gap:10px;align-items:center;font-size:11px;margin-bottom:10px}
.analytics-meter .track{height:6px;background:var(--line);border-radius:4px;overflow:hidden}
.analytics-meter .track i{display:block;height:100%;background:var(--green)}
.analytics-meter.low .track i{background:#c0392b}
.analytics-meter b{text-align:right}
.analytics-insight{display:flex;gap:8px;align-items:flex-start;font-size:11px;color:var(--muted);border-top:1px solid var(--line);padding-top:12px;margin:4px 0 0}
.analytics-insight svg{width:14px;flex:0 0 14px;color:var(--green)}
.band-chart{width:100%;height:auto;display:block}
.band-chart text{font-size:9px;fill:var(--muted)}
.band-chart .band-grid{stroke:var(--line);stroke-width:1}
.band-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:10px;color:var(--muted);margin-top:8px}
.band-legend span{display:flex;align-items:center;gap:5px}
.band-legend i{width:8px;height:8px;border-radius:50%;display:inline-block}
@media(max-width:800px){.analytics-grid{grid-template-columns:1fr}.analytics-meter{grid-template-columns:100px 1fr 36px}}

/* Modern Pro Header & Navbar Improvements */
.site-header { height: 70px; border-bottom: 1px solid var(--line, #e2e8f0); background: rgba(255, 255, 255, 0.88); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); position: sticky; top: 0; z-index: 100; }
html[data-theme="dark"] .site-header { background: rgba(16, 23, 21, 0.88); }
.nav-wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.main-nav { display: flex; align-items: center; gap: 16px; }
.main-nav > a { display: inline-flex; align-items: center; gap: 6px; font-size: 0.88rem; font-weight: 600; color: var(--ink); padding: 6px 12px; border-radius: 8px; transition: all 0.2s ease; }
.main-nav > a:hover { background: var(--green2, #dff1e8); color: var(--green, #176b50); }
.nav-ai-badge { background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 100%); color: #b45309 !important; border: 1px solid #fde68a; font-weight: 700 !important; }
html[data-theme="dark"] .nav-ai-badge { background: linear-gradient(135deg, #451a03 0%, #78350f 100%); color: #fef08a !important; border-color: #92400e; }
.nav-dropdown-group { display: flex; gap: 10px; border-left: 1px solid var(--line, #e2e8f0); border-right: 1px solid var(--line, #e2e8f0); padding: 0 10px; }
.nav-dropdown-group a { font-size: 0.85rem; font-weight: 600; color: var(--muted); padding: 4px 8px; border-radius: 6px; }
.nav-dropdown-group a:hover { color: var(--green); background: rgba(23, 107, 80, 0.06); }
/* AI tools grouped into one dropdown. Selectors are scoped under .main-nav so they outrank
   .nav-dropdown-toggle / .nav-dropdown in account-menu.css, which loads after this file. */
.main-nav .ai-nav-menu > .nav-dropdown-toggle { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 8px; font-size: 0.88rem; font-weight: 700; white-space: nowrap; cursor: pointer; background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 100%); color: #b45309; border: 1px solid #fde68a; transition: filter 0.2s ease; }
.main-nav .ai-nav-menu > .nav-dropdown-toggle:hover { filter: brightness(0.97); }
.main-nav .ai-nav-menu > .nav-dropdown-toggle > svg { width: 16px; height: 16px; }
.main-nav .ai-nav-menu > .nav-dropdown-toggle > svg:last-child { width: 13px; height: 13px; transition: transform 0.2s ease; }
.main-nav .ai-nav-menu.open > .nav-dropdown-toggle > svg:last-child { transform: rotate(180deg); }
html[data-theme="dark"] .main-nav .ai-nav-menu > .nav-dropdown-toggle { background: linear-gradient(135deg, #451a03 0%, #78350f 100%); color: #fef08a; border-color: #92400e; }
.main-nav .ai-dropdown { left: 0; right: auto; width: 254px; }
.main-nav .ai-dropdown svg { color: #b45309; }
html[data-theme="dark"] .main-nav .ai-dropdown svg { color: #fbbf24; }
@media (max-width: 800px) {
  .main-nav .ai-nav-menu { width: 100%; }
  .main-nav .ai-nav-menu > .nav-dropdown-toggle { width: 100%; justify-content: flex-start; }
  /* account-menu.css hides .nav-dropdown-toggle span here to shrink the account buttons
     in the cramped actions bar. This button sits in the full-width nav panel, so keep its label. */
  .main-nav .ai-nav-menu > .nav-dropdown-toggle span { display: inline; }
  .main-nav .ai-dropdown { position: static; width: 100%; margin-top: 8px; box-shadow: none; }
}
.nav-actions { display: flex; align-items: center; gap: 12px; }
.nav-avatar-circle { width: 28px; height: 28px; border-radius: 50%; background: var(--green2, #dff1e8); color: var(--green, #176b50); display: grid; place-items: center; }
.nav-avatar-circle svg { width: 15px; height: 15px; }
.nav-user-avatar-btn { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; border-radius: 20px; border: 1px solid var(--line, #e2e8f0); background: var(--surface, #ffffff); font-size: 0.85rem; font-weight: 600; }
.nav-register-btn { border-radius: 20px !important; padding: 8px 18px !important; box-shadow: 0 4px 14px rgba(23, 107, 80, 0.25); }
.streak-badge { display: inline-flex; align-items: center; gap: 4px; background: rgba(245, 158, 11, 0.12); border: 1px solid rgba(245, 158, 11, 0.3); color: #d97706; font-weight: 700; font-size: 0.85rem; padding: 4px 11px; border-radius: 20px; }
.streak-flame { font-size: 0.95rem; }
.nav-logout-btn { border: 0; background: none; color: #dc2626; width: 100%; text-align: left; padding: 8px 12px; display: flex; align-items: center; gap: 8px; font-weight: 600; cursor: pointer; border-radius: 6px; }
.nav-logout-btn:hover { background: #fee2e2; }

/* Shadowing Mode & Controls */
.shadowing-mode { padding: 1.25rem; background: var(--bg-surface, #ffffff); border-radius: 12px; border: 1px solid var(--border-color, #e2e8f0); margin-top: 1rem; }
.shadowing-instruction { display: block; font-weight: 600; color: var(--text-heading, #1e293b); margin-bottom: 1rem; }
.shadowing-controls { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.record-button { background: #ef4444; color: #ffffff; border: none; border-radius: 8px; padding: 8px 16px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; transition: background 0.2s; }
.record-button:hover { background: #dc2626; }
.record-button.recording { background: #10b981; animation: pulse-rec 1.5s infinite; }
@keyframes pulse-rec { 0% { opacity: 1; } 50% { opacity: 0.7; } 100% { opacity: 1; } }
.record-timer { font-family: monospace; font-size: 1.1rem; font-weight: 700; color: #ef4444; }
.shadowing-comparison { display: grid; gap: 12px; padding: 12px; background: var(--bg-muted, #f8fafc); border-radius: 8px; }
.audio-track { display: flex; align-items: center; gap: 12px; font-weight: 600; font-size: 0.9rem; }
.speed.ab-loop.active { background: var(--accent-color, #176b50); color: #ffffff; }

/* 1-Click Popover */
.dict-popover { position: fixed; z-index: 1000; width: 260px; background: var(--surface, #fff); border: 1px solid var(--line, #e2e8f0); box-shadow: 0 10px 25px rgba(0,0,0,0.15); border-radius: 8px; padding: 12px; font-size: 0.85rem; }
.popover-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.popover-head strong { font-size: 1.1rem; color: var(--green, #176b50); }
.popover-head span { color: var(--muted, #64748b); font-family: monospace; }
.popover-audio-btn { background: none; border: none; cursor: pointer; color: var(--green, #176b50); padding: 2px; }
.popover-actions { display: flex; gap: 6px; margin-top: 10px; }

/* Accent Switcher & Survival HUD */
.accent-select { background: var(--surface, #fff); border: 1px solid var(--line, #e2e8f0); border-radius: 4px; padding: 4px; font-size: 0.8rem; cursor: pointer; }
.survival-hud { display: flex; justify-content: space-between; align-items: center; background: #fff7ed; border: 1px solid #ffedd5; padding: 8px 12px; border-radius: 6px; margin-bottom: 10px; font-weight: 700; color: #c2410c; }