/* === Базовая тема (1-в-1 с tg-notebooklm) === */
:root{
  --bg:#09090b;
  --surface:#111113;
  --surface-2:#17171a;
  --surface-3:#1f1f23;
  --border:#242428;
  --border-2:#2e2e33;
  --text:#f4f4f5;
  --text-2:#a1a1aa;
  --muted:#71717a;
  --accent:#b5ff3d;
  --accent-dim:#8fcc2f;
  --accent-glow:rgba(181,255,61,.35);
  --danger:#ff5d5d;
  --danger-dim:#c43e3e;
}
*{box-sizing:border-box}
html,body{
  margin:0;padding:0;background:var(--bg);color:var(--text);
  font-family:"Inter",-apple-system,system-ui,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;letter-spacing:-.005em;
}
body{
  background-image:
    radial-gradient(ellipse 80% 60% at 15% -10%, rgba(181,255,61,.07), transparent 60%),
    radial-gradient(ellipse 60% 50% at 95% 0%, rgba(99,102,241,.06), transparent 60%);
  background-attachment:fixed;
  min-height:100vh;
}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}
.serif{font-family:"Lora",Georgia,serif;font-style:italic;letter-spacing:-.01em;font-weight:500}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:#000}
.hide{display:none !important}

/* === Shell === */
.shell{min-height:100vh;display:flex;flex-direction:column}
.topbar{
  display:flex;align-items:center;gap:.75rem;
  padding:.85rem 1.4rem;
  border-bottom:1px solid var(--border);
  background:rgba(9,9,11,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  position:sticky;top:0;z-index:20;
}
.logo{display:flex;align-items:center;gap:.6rem;font-size:.92rem;font-weight:500;letter-spacing:-.01em;color:inherit;transition:opacity .15s}
.logo:hover{opacity:.85}
.logo-mark{
  width:24px;height:24px;border-radius:7px;
  background:linear-gradient(135deg,var(--accent),var(--accent-dim));
  box-shadow:0 0 20px var(--accent-glow),inset 0 1px 0 rgba(255,255,255,.4);
  display:flex;align-items:center;justify-content:center;
  color:#0a0a0b;font-weight:700;font-size:.78rem;
}
.logo .dim{color:var(--muted);font-weight:400}
.topbar .spacer{flex:1}
.chip{
  font-family:"JetBrains Mono",monospace;font-size:.72rem;color:var(--text-2);
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.35rem .65rem;background:var(--surface);
  border:1px solid var(--border);border-radius:7px;
}
.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent-glow)}
.tb-btn{
  font-size:.8rem;color:var(--text-2);padding:.45rem .8rem;
  border:1px solid var(--border);border-radius:7px;background:transparent;
  transition:border-color .15s,color .15s,background .15s;
}
.tb-btn:hover{color:var(--text);border-color:var(--border-2);background:var(--surface)}
.tb-btn.accent{color:var(--accent);border-color:rgba(181,255,61,.3)}
.tb-btn.accent:hover{background:rgba(181,255,61,.06);border-color:var(--accent)}
form.inline{display:inline}

/* === Auth (login & admin-login) === */
.auth-wrap{max-width:460px;margin:5.5rem auto 0;padding:0 1.5rem}
.kicker{
  font-family:"JetBrains Mono",monospace;font-size:.7rem;color:var(--accent);
  margin-bottom:1.1rem;display:inline-flex;align-items:center;gap:.5rem;
  padding:.35rem .75rem;border:1px solid rgba(181,255,61,.22);
  background:rgba(181,255,61,.05);border-radius:999px;text-transform:lowercase;
}
.kicker::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent-glow)}
.auth-wrap h2{font-size:2.5rem;font-weight:500;margin:0 0 .6rem;line-height:1.02;letter-spacing:-.04em}
.auth-wrap h2 .serif{color:var(--accent)}
.auth-wrap .lede{color:var(--text-2);font-size:.95rem;margin:0 0 2rem;max-width:34ch;line-height:1.5}
.field{margin-bottom:1rem}
.field label{display:block;font-size:.74rem;color:var(--muted);margin-bottom:.45rem;font-weight:500}
input[type=text],input[type=password],input[type=tel],input[type=email],input[type=number],input:not([type]),textarea,select{
  width:100%;background:var(--surface);border:1px solid var(--border);
  color:var(--text);font:inherit;font-size:.95rem;
  padding:.72rem .9rem;border-radius:9px;outline:none;
  transition:border-color .15s,background .15s,box-shadow .15s;
}
textarea{font-family:"JetBrains Mono",monospace;font-size:.86rem;min-height:140px;resize:vertical;line-height:1.5}
input::placeholder,textarea::placeholder{color:var(--muted)}
input:focus,textarea:focus,select:focus{border-color:var(--accent);background:var(--surface-2);box-shadow:0 0 0 3px rgba(181,255,61,.13)}
.primary{
  display:inline-flex;align-items:center;gap:.55rem;justify-content:center;
  background:var(--accent);color:#0a0a0b;
  padding:.78rem 1.25rem;
  font-size:.88rem;font-weight:600;letter-spacing:-.005em;
  border-radius:9px;cursor:pointer;border:0;
  transition:transform .08s,box-shadow .2s;
  box-shadow:0 0 0 1px rgba(0,0,0,.2),0 10px 30px -10px var(--accent-glow),inset 0 1px 0 rgba(255,255,255,.5);
}
.primary:hover{box-shadow:0 0 0 1px rgba(0,0,0,.2),0 14px 40px -8px var(--accent-glow),inset 0 1px 0 rgba(255,255,255,.5)}
.primary:active{transform:translateY(1px)}
.primary.danger{background:var(--danger);box-shadow:0 0 0 1px rgba(0,0,0,.2),0 10px 30px -10px rgba(255,93,93,.35)}
.error{
  color:var(--danger);background:rgba(255,93,93,.06);border:1px solid rgba(255,93,93,.25);
  padding:.7rem .9rem;border-radius:8px;margin-bottom:1rem;font-size:.85rem;
}

/* === App layout (sidebar + main) === */
.app{display:grid;grid-template-columns:340px 1fr;flex:1;min-height:0;transition:grid-template-columns .2s ease}
.app.collapsed{grid-template-columns:0 1fr}
.app.collapsed .sidebar{opacity:0;pointer-events:none;overflow:hidden}
@media(max-width:900px){
  .app{grid-template-columns:1fr}
  .app.has-selection .sidebar{display:none}
  .app:not(.has-selection) .main{display:none}
}
.sidebar{
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;min-height:0;
  background:rgba(17,17,19,.4);
  max-height:calc(100vh - 58px);
  position:sticky;top:58px;
}
.side-head{
  padding:1rem 1.1rem .85rem;
  border-bottom:1px solid var(--border);
}
.side-head .label{
  font-family:"JetBrains Mono",monospace;font-size:.66rem;color:var(--muted);
  text-transform:lowercase;letter-spacing:.04em;
}
.side-head .progress{margin-top:.55rem;display:flex;align-items:center;gap:.6rem}
.side-head .progress-bar{
  flex:1;height:5px;background:var(--surface-3);border-radius:99px;overflow:hidden;
}
.side-head .progress-bar > span{
  display:block;height:100%;background:linear-gradient(90deg,var(--accent-dim),var(--accent));
  box-shadow:0 0 10px var(--accent-glow);
}
.side-head .progress-num{font-family:"JetBrains Mono",monospace;font-size:.7rem;color:var(--text-2)}
.tree{overflow-y:auto;flex:1;padding:.6rem .55rem 1rem}
.tree::-webkit-scrollbar{width:10px}
.tree::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:10px;border:3px solid transparent;background-clip:padding-box}

.module-block{margin-bottom:.4rem}
.module-title{
  display:flex;align-items:center;gap:.5rem;
  padding:.55rem .65rem;
  font-family:"JetBrains Mono",monospace;font-size:.7rem;color:var(--text-2);
  text-transform:lowercase;letter-spacing:.02em;
}
.module-title .idx{
  width:18px;height:18px;border-radius:5px;
  background:var(--surface-2);border:1px solid var(--border);
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.62rem;color:var(--muted);
}
.module-title .name{flex:1;color:var(--text);font-weight:500;font-family:"Inter",sans-serif;font-size:.86rem;text-transform:none;letter-spacing:-.01em}
.lesson-item{
  display:grid;grid-template-columns:auto 1fr auto;gap:.55rem;align-items:center;
  padding:.6rem .65rem .6rem .85rem;margin:.12rem 0;
  border-radius:8px;cursor:pointer;
  border:1px solid transparent;
  position:relative;
  transition:background .12s,border-color .12s,color .12s,padding-left .12s;
  color:var(--text-2);
}
.lesson-item::before{
  content:"";position:absolute;left:.25rem;top:.55rem;bottom:.55rem;width:2px;border-radius:2px;
  background:transparent;transition:background .15s;
}
.lesson-item:hover{background:var(--surface);color:var(--text)}
.lesson-item:hover::before{background:var(--border-2)}
.lesson-item.active{background:var(--surface-2);border-color:var(--border-2);color:var(--text)}
.lesson-item.active::before{background:var(--accent);box-shadow:0 0 10px var(--accent-glow)}
.lesson-item .check{
  width:18px;height:18px;border-radius:5px;
  border:1px solid var(--border-2);
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.68rem;color:var(--muted);background:var(--surface);
}
.lesson-item.done .check{
  background:var(--accent);color:#0a0a0b;border-color:var(--accent);
  box-shadow:0 0 12px var(--accent-glow);
}
.lesson-item .ttl{font-size:.87rem;line-height:1.25;font-weight:500;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lesson-item .dur{font-family:"JetBrains Mono",monospace;font-size:.64rem;color:var(--muted)}

/* === Main pane === */
.main{min-width:0;display:flex;flex-direction:column;min-height:0;overflow-y:auto}
.main::-webkit-scrollbar{width:10px}
.main::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:10px;border:3px solid transparent;background-clip:padding-box}

/* Welcome (course landing) */
.welcome{
  flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  padding:4rem 3rem;max-width:760px;
}
.welcome .big{font-size:3.4rem;font-weight:500;letter-spacing:-.04em;line-height:1.04;margin-bottom:1rem;color:var(--text)}
.welcome .big .serif{color:var(--accent);font-size:3.6rem}
.welcome .hint{font-size:1.05rem;color:var(--text-2);max-width:54ch;line-height:1.6}
.welcome .meta{margin-top:1.6rem;display:flex;gap:.7rem;flex-wrap:wrap}
.welcome .meta .chip{padding:.45rem .75rem}

/* Lesson page */
.lesson-wrap{padding:1.5rem 2.2rem 4rem;max-width:980px;width:100%}
.crumbs{font-family:"JetBrains Mono",monospace;font-size:.7rem;color:var(--muted);margin-bottom:.85rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.crumbs .tag{padding:.2rem .55rem;background:var(--surface-2);border:1px solid var(--border);border-radius:5px;color:var(--text-2)}
.lesson-wrap h1{margin:.2rem 0 1.4rem;font-size:2.2rem;font-weight:500;letter-spacing:-.035em;line-height:1.08}
.lesson-wrap h1 .serif{color:var(--accent)}

.player{
  position:relative;width:100%;aspect-ratio:16/9;background:#000;
  border-radius:14px;overflow:hidden;border:1px solid var(--border);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.7);
}
.player video{width:100%;height:100%;display:block;background:#000}
.player .ph{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;color:var(--text-2);gap:.6rem;
  text-align:center;padding:1.5rem;
  background:
    radial-gradient(circle at 50% 40%, rgba(181,255,61,.05), transparent 50%),
    linear-gradient(180deg, var(--surface-2), var(--surface));
}
.player.empty{background:linear-gradient(180deg, var(--surface-2), var(--surface))}
.player .ph .ph-icon{font-size:2.4rem;color:var(--border-2);margin-bottom:.4rem}
.player .ph .ph-title{font-size:1rem;font-weight:500;color:var(--text);letter-spacing:-.01em}
.player .ph .ph-text{font-family:"JetBrains Mono",monospace;font-size:.74rem;color:var(--muted)}
.watermark{
  position:absolute;inset:0;pointer-events:none;z-index:5;
  overflow:hidden;
}
.watermark > span{
  position:absolute;top:0;left:0;
  font-family:"JetBrains Mono",monospace;font-size:.78rem;
  color:rgba(255,255,255,.18);
  text-shadow:0 1px 2px rgba(0,0,0,.6);
  padding:.35rem .65rem;border-radius:5px;
  background:rgba(0,0,0,.18);backdrop-filter:blur(3px);
  white-space:nowrap;
  animation:wm-drift 38s linear infinite;
  will-change:transform;
}
@keyframes wm-drift{
  0%   { transform: translate(10%, 8%); }
  25%  { transform: translate(70%, 12%); }
  50%  { transform: translate(65%, 78%); }
  75%  { transform: translate(8%, 75%); }
  100% { transform: translate(10%, 8%); }
}
.player.fullscreen-active .watermark > span{font-size:1rem;color:rgba(255,255,255,.22)}

.player .ph .play-circle{
  width:56px;height:56px;border-radius:50%;
  background:rgba(181,255,61,.1);border:1px solid rgba(181,255,61,.35);
  display:flex;align-items:center;justify-content:center;
  color:var(--accent);font-size:1.3rem;padding-left:.2rem;
  box-shadow:0 0 30px var(--accent-glow);
  animation:pulse 1.6s ease-in-out infinite;
}
@keyframes pulse{
  0%,100%{box-shadow:0 0 18px rgba(181,255,61,.25)}
  50%{box-shadow:0 0 32px rgba(181,255,61,.5)}
}

.lesson-actions{
  margin-top:1.2rem;display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;
}
.lesson-actions .nav-btn{
  padding:.6rem 1rem;border:1px solid var(--border);border-radius:8px;
  background:var(--surface);color:var(--text-2);font-size:.85rem;
  transition:all .15s;
}
.lesson-actions .nav-btn:hover{color:var(--text);border-color:var(--border-2);background:var(--surface-2)}
.lesson-actions .spacer{flex:1}
.toggle-complete{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.65rem 1.05rem;border-radius:9px;font-size:.86rem;font-weight:600;
  background:var(--accent);color:#0a0a0b;border:0;cursor:pointer;
  box-shadow:0 0 0 1px rgba(0,0,0,.2),0 10px 30px -10px var(--accent-glow),inset 0 1px 0 rgba(255,255,255,.5);
  transition:transform .08s,box-shadow .2s;
}
.toggle-complete.done{
  background:var(--surface);color:var(--accent);
  border:1px solid rgba(181,255,61,.4);
  box-shadow:none;
}
.toggle-complete:hover{box-shadow:0 0 0 1px rgba(0,0,0,.2),0 14px 40px -8px var(--accent-glow),inset 0 1px 0 rgba(255,255,255,.5)}
.toggle-complete.done:hover{background:rgba(181,255,61,.05);border-color:var(--accent)}

.section-title{
  font-family:"JetBrains Mono",monospace;font-size:.72rem;color:var(--muted);
  text-transform:lowercase;letter-spacing:.04em;
  margin:2rem 0 .8rem;
  display:flex;align-items:center;gap:.55rem;
}
.section-title::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent-glow)}

.description{
  background:var(--surface);border:1px solid var(--border);border-radius:10px;
  padding:1.3rem 1.5rem;color:var(--text);font-size:.96rem;line-height:1.65;
}
.description p{margin:0 0 .9rem}
.description p:last-child{margin-bottom:0}
.description h1,.description h2,.description h3{margin:1.4rem 0 .7rem;font-weight:500;letter-spacing:-.02em}
.description h1{font-size:1.4rem}
.description h2{font-size:1.2rem}
.description h3{font-size:1.05rem;color:var(--text-2)}
.description a{color:var(--accent);border-bottom:1px solid rgba(181,255,61,.25)}
.description a:hover{border-bottom-color:var(--accent)}
.description ul,.description ol{padding-left:1.4rem;margin:0 0 .9rem}
.description li{margin-bottom:.3rem}
.description code{font-family:"JetBrains Mono",monospace;font-size:.86em;background:var(--surface-3);padding:.1rem .35rem;border-radius:4px;border:1px solid var(--border)}
.description pre{background:var(--surface-3);border:1px solid var(--border);border-radius:8px;padding:.85rem 1rem;overflow-x:auto;font-size:.85rem;line-height:1.5}
.description pre code{background:none;border:0;padding:0}
.description blockquote{margin:0 0 .9rem;padding:.6rem 1rem;border-left:2px solid var(--accent);background:var(--surface-2);color:var(--text-2);border-radius:0 6px 6px 0}
.description hr{border:0;border-top:1px solid var(--border);margin:1.4rem 0}
.description table{border-collapse:collapse;margin:0 0 .9rem;font-size:.88rem}
.description th,.description td{border:1px solid var(--border);padding:.45rem .7rem;text-align:left}
.description th{background:var(--surface-2);color:var(--text-2);font-weight:500}

.notes textarea{
  width:100%;min-height:160px;
  background:var(--surface);border:1px solid var(--border);
  color:var(--text);font:inherit;font-size:.92rem;line-height:1.55;
  padding:.85rem 1rem;border-radius:10px;outline:none;resize:vertical;
  transition:border-color .15s,background .15s,box-shadow .15s;
}
.notes textarea:focus{border-color:var(--accent);background:var(--surface-2);box-shadow:0 0 0 3px rgba(181,255,61,.13)}
.note-status{
  margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:.66rem;color:var(--muted);
  opacity:0;transition:opacity .2s;
}
.note-status.visible{opacity:1}
.note-status.saved{color:var(--accent)}

.chapters-meta{margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:.66rem;color:var(--muted)}
.chapters{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:.25rem;
}
.chapter-row{
  display:grid;grid-template-columns:auto 1fr;gap:.85rem;align-items:center;
  padding:.65rem .85rem;border-radius:9px;cursor:pointer;
  border:1px solid var(--border);background:var(--surface);
  transition:border-color .12s,background .12s,color .12s;
  position:relative;
}
.chapter-row:hover{border-color:var(--border-2);background:var(--surface-2)}
.chapter-row.active{
  border-color:rgba(181,255,61,.45);background:rgba(181,255,61,.05);
  box-shadow:0 0 24px rgba(181,255,61,.08);
}
.chapter-row.active::before{
  content:"";position:absolute;left:-1px;top:.65rem;bottom:.65rem;width:2px;border-radius:2px;
  background:var(--accent);box-shadow:0 0 10px var(--accent-glow);
}
.chapter-row.passed{opacity:.65}
.chapter-row .ts{
  font-family:"JetBrains Mono",monospace;font-size:.72rem;color:var(--muted);
  min-width:3.2rem;
}
.chapter-row.active .ts{color:var(--accent)}
.chapter-row .ttl{font-size:.92rem;font-weight:500;color:var(--text);line-height:1.3}

.transcript-block{margin-top:1.4rem}
.transcript-block summary{cursor:pointer;list-style:none}
.transcript-block summary::-webkit-details-marker{display:none}
.transcript-summary::after{content:"↓ развернуть";margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:.66rem;color:var(--muted)}
.transcript-block[open] .transcript-summary::after{content:"↑ свернуть"}
.transcript-list{
  margin-top:.8rem;padding:1rem 1.2rem;
  background:var(--surface);border:1px solid var(--border);border-radius:10px;
  max-height:24rem;overflow-y:auto;
}
.transcript-list::-webkit-scrollbar{width:8px}
.transcript-list::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:8px}
.transcript-seg{
  display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:baseline;
  padding:.3rem .25rem;border-radius:6px;cursor:pointer;
  transition:background .12s;
}
.transcript-seg:hover{background:var(--surface-2)}
.transcript-seg .ts{
  font-family:"JetBrains Mono",monospace;font-size:.7rem;color:var(--muted);min-width:2.8rem;
}
.transcript-seg .txt{font-size:.88rem;color:var(--text-2);line-height:1.55}
.transcript-seg.active{background:rgba(181,255,61,.06)}
.transcript-seg.active .txt{color:var(--text)}
.transcript-seg.active .ts{color:var(--accent)}

.files{display:flex;flex-direction:column;gap:.45rem}
.file-row{
  display:flex;align-items:center;gap:.7rem;padding:.7rem .9rem;
  background:var(--surface);border:1px solid var(--border);border-radius:9px;
  transition:all .15s;color:var(--text);font-size:.9rem;
}
.file-row:hover{border-color:var(--border-2);background:var(--surface-2)}
.file-row .ic{font-family:"JetBrains Mono",monospace}
.file-row .label{flex:1;font-weight:500}
.file-action{
  font-size:.85rem;color:var(--text-2);
  padding:.3rem .55rem;border-radius:6px;
  background:transparent;border:1px solid var(--border);cursor:pointer;
  transition:all .15s;
}
.file-action:hover{border-color:var(--accent);color:var(--accent);background:rgba(181,255,61,.05)}
.file-action.preview{font-size:.95rem}

/* PDF modal */
.modal{
  position:fixed;inset:0;z-index:200;
  display:flex;align-items:center;justify-content:center;
}
.modal.hide{display:none}
.modal-backdrop{
  position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);
}
.modal-panel{
  position:relative;width:min(1000px, 92vw);height:min(85vh, 1100px);
  background:var(--surface);border:1px solid var(--border);border-radius:14px;
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 50px 120px -20px rgba(0,0,0,.85);
}
.modal-head{
  display:flex;align-items:center;gap:.5rem;
  padding:.7rem 1rem;border-bottom:1px solid var(--border);
  background:var(--surface-2);
}
.modal-title{
  flex:1;font-size:.95rem;font-weight:500;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.modal-btn{
  font-size:.8rem;color:var(--text-2);
  padding:.4rem .75rem;border-radius:7px;
  border:1px solid var(--border);background:var(--surface);cursor:pointer;
  transition:all .15s;text-decoration:none;
  display:inline-flex;align-items:center;gap:.4rem;
}
.modal-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(181,255,61,.05)}
.modal-body{flex:1;background:#1a1a1d}
.modal-body iframe{width:100%;height:100%;border:0;display:block;background:#1a1a1d}

/* === Admin === */
.admin-wrap{width:100%;max-width:1100px;margin:1.8rem auto 4rem;padding:0 1.6rem;box-sizing:border-box}
.admin-header{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  margin-bottom:1.6rem;flex-wrap:wrap;
}
.admin-header h1{margin:0;font-size:1.6rem;font-weight:500;letter-spacing:-.02em}
.admin-tabs{display:flex;gap:.4rem}
.admin-tabs a{
  font-family:"JetBrains Mono",monospace;font-size:.78rem;color:var(--text-2);
  padding:.5rem .85rem;border:1px solid var(--border);border-radius:7px;
  transition:all .15s;
}
.admin-tabs a.active{color:var(--accent);border-color:rgba(181,255,61,.35);background:rgba(181,255,61,.05)}
.admin-tabs a:hover{color:var(--text);border-color:var(--border-2)}

.card{
  background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:1.4rem 1.5rem;margin-bottom:1.2rem;
}
.card h2{margin:0 0 1rem;font-size:1.1rem;font-weight:500;letter-spacing:-.01em}
.card h2 .dim{color:var(--muted);font-family:"JetBrains Mono",monospace;font-size:.72rem;margin-left:.6rem}

.row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.row.between{justify-content:space-between}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
@media(max-width:700px){.grid-2{grid-template-columns:1fr}}

.btn{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.78rem;font-weight:500;color:var(--text);
  padding:.45rem .75rem;border-radius:7px;
  background:var(--surface);border:1px solid var(--border);
  transition:all .15s;cursor:pointer;
}
.btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(181,255,61,.06)}
.btn.danger:hover{border-color:var(--danger);color:var(--danger);background:rgba(255,93,93,.05)}
.btn.ghost{background:transparent}

.lesson-row-admin{
  display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:.6rem;
  padding:.55rem .7rem;border-radius:8px;border:1px solid var(--border);
  background:var(--surface-2);margin-bottom:.4rem;
}
.drag-handle{
  font-family:"JetBrains Mono",monospace;font-size:1.1rem;
  color:var(--muted);cursor:grab;user-select:none;
  padding:0 .35rem;line-height:1;
  transition:color .12s;
}
.drag-handle:hover{color:var(--accent)}
.drag-handle:active{cursor:grabbing}
.module-num{
  display:inline-flex;width:1.6rem;height:1.6rem;align-items:center;justify-content:center;
  background:var(--surface-3);border:1px solid var(--border);border-radius:6px;
  font-family:"JetBrains Mono",monospace;font-size:.78rem;color:var(--text-2);
  margin-right:.45rem;
}
.sortable-ghost{
  opacity:.35;border-style:dashed;background:rgba(181,255,61,.05)!important;
}
.sortable-chosen{cursor:grabbing}
.sortable-drag{
  box-shadow:0 20px 60px -10px rgba(0,0,0,.8),0 0 30px var(--accent-glow);
  border-color:var(--accent)!important;
}
.lesson-row-admin .ttl{font-size:.9rem;font-weight:500}
.lesson-row-admin .ttl .meta{color:var(--muted);font-family:"JetBrains Mono",monospace;font-size:.66rem;margin-left:.5rem}

table.students{
  width:100%;border-collapse:collapse;font-size:.86rem;
}
table.students th{
  text-align:left;padding:.6rem .7rem;
  font-family:"JetBrains Mono",monospace;font-size:.66rem;color:var(--muted);
  text-transform:lowercase;border-bottom:1px solid var(--border);
}
table.students td{padding:.7rem .7rem;border-bottom:1px solid var(--border);vertical-align:middle}
table.students tr.disabled td{opacity:.45}
.key-cell{display:flex;align-items:center;gap:.4rem;font-family:"JetBrains Mono",monospace;font-size:.72rem;color:var(--text-2)}
.copy-btn{
  font-size:.78rem;color:var(--text);
  padding:.42rem .7rem;border:1px solid var(--border);border-radius:7px;
  background:var(--surface);display:inline-flex;align-items:center;gap:.4rem;cursor:pointer;
  transition:all .15s;
}
.copy-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(181,255,61,.06)}
.copy-btn.copied{border-color:var(--accent);color:var(--accent);background:rgba(181,255,61,.1)}
.copy-btn .ic{font-size:.85rem}
.key-hint{font-family:"JetBrains Mono",monospace;font-size:.66rem;color:var(--muted);margin-left:.55rem}
.badge{display:inline-block;font-family:"JetBrains Mono",monospace;font-size:.66rem;padding:.2rem .5rem;border-radius:5px;border:1px solid var(--border);background:var(--surface)}
.badge.on{color:var(--accent);border-color:rgba(181,255,61,.35);background:rgba(181,255,61,.06)}
.badge.off{color:var(--danger);border-color:rgba(255,93,93,.3);background:rgba(255,93,93,.05)}

.access-cell{display:flex;flex-direction:column;gap:.15rem;font-size:.84rem}
.access-cell .date{color:var(--text);font-family:"JetBrains Mono",monospace;font-size:.78rem}
.access-cell .left{color:var(--muted);font-family:"JetBrains Mono",monospace;font-size:.66rem}
.access-cell.soon .left{color:#f5c542}
.access-cell.expired .date{color:var(--danger)}
.access-cell.expired .left{color:var(--danger)}

.access-edit{margin-top:.3rem}
.access-edit summary{font-family:"JetBrains Mono",monospace;font-size:.66rem;color:var(--muted);cursor:pointer;list-style:none;padding:.15rem 0}
.access-edit summary::-webkit-details-marker{display:none}
.access-edit summary:hover{color:var(--accent)}
.access-edit summary::before{content:"+ ";opacity:.6}
.access-edit[open] summary::before{content:"− "}
.access-form{display:flex;gap:.35rem;margin-top:.35rem}
.access-form input[type=date]{padding:.32rem .5rem;font-size:.78rem;border-radius:6px}
.access-quick{display:flex;gap:.3rem;margin-top:.35rem;flex-wrap:wrap}
.access-quick .btn{font-size:.7rem;padding:.32rem .55rem}

.help{
  font-family:"JetBrains Mono",monospace;font-size:.72rem;color:var(--muted);
  margin-top:.3rem;line-height:1.5;
  overflow-wrap:anywhere;word-break:break-word;
}
.card{min-width:0}
.card .help, .card textarea, .card input{max-width:100%}
.settings-pane{min-width:0}

.md-editor{
  border:1px solid var(--border);border-radius:10px;overflow:hidden;
  background:var(--surface);
}
.md-toolbar{
  display:flex;align-items:center;gap:.15rem;
  padding:.4rem .55rem;
  background:var(--surface-2);border-bottom:1px solid var(--border);
}
.md-toolbar .md-btn{
  font-family:"Inter",sans-serif;font-size:.85rem;color:var(--text-2);
  padding:.32rem .55rem;border-radius:5px;
  background:transparent;border:1px solid transparent;cursor:pointer;
  min-width:1.9rem;text-align:center;
  transition:all .12s;
}
.md-toolbar .md-btn:hover{color:var(--text);background:var(--surface-3);border-color:var(--border)}
.md-toolbar .md-btn:active{transform:translateY(1px)}
.md-toolbar .md-sep{width:1px;height:18px;background:var(--border);margin:0 .25rem}
.md-toolbar .md-toggle-preview{margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:.72rem}
.md-toolbar .md-toggle-preview.active{color:var(--accent);border-color:rgba(181,255,61,.3);background:rgba(181,255,61,.05)}

.md-body{display:grid;grid-template-columns:1fr;min-height:300px}
.md-editor.preview .md-body{grid-template-columns:1fr 1fr}
.md-body textarea{
  border:0!important;border-radius:0!important;
  background:transparent!important;
  padding:.95rem 1.1rem!important;
  font-family:"JetBrains Mono",monospace!important;font-size:.88rem!important;line-height:1.6!important;
  min-height:300px!important;resize:vertical;
}
.md-body textarea:focus{box-shadow:none!important;background:transparent!important}
.md-preview{
  display:none;
  padding:.95rem 1.4rem;
  border-left:1px solid var(--border);
  background:rgba(17,17,19,.4);
  overflow-y:auto;max-height:600px;
  font-size:.95rem;line-height:1.65;
}
.md-editor.preview .md-preview{display:block}
.md-preview p{margin:0 0 .8rem}
.md-preview h1,.md-preview h2,.md-preview h3{margin:1.2rem 0 .6rem;font-weight:500;letter-spacing:-.02em}
.md-preview h2{font-size:1.2rem}
.md-preview h3{font-size:1.05rem;color:var(--text-2)}
.md-preview ul,.md-preview ol{padding-left:1.4rem;margin:0 0 .8rem}
.md-preview a{color:var(--accent);border-bottom:1px solid rgba(181,255,61,.25)}
.md-preview code{font-family:"JetBrains Mono",monospace;font-size:.86em;background:var(--surface-3);padding:.1rem .35rem;border-radius:4px}
.md-preview pre{background:var(--surface-3);border:1px solid var(--border);border-radius:8px;padding:.7rem .9rem;overflow-x:auto;font-size:.85rem}
.md-preview pre code{background:none;padding:0}
.md-preview blockquote{margin:0 0 .8rem;padding:.4rem .9rem;border-left:2px solid var(--accent);background:var(--surface-2);color:var(--text-2);border-radius:0 6px 6px 0}
.md-preview table{border-collapse:collapse;margin:0 0 .8rem;font-size:.88rem}
.md-preview th,.md-preview td{border:1px solid var(--border);padding:.4rem .7rem}
.md-preview th{background:var(--surface-2);color:var(--text-2);font-weight:500}
.md-preview-empty{color:var(--muted);font-family:"JetBrains Mono",monospace;font-size:.75rem;text-align:center;padding:2rem 0}

@media(max-width:780px){
  .md-editor.preview .md-body{grid-template-columns:1fr}
  .md-editor.preview .md-preview{border-left:0;border-top:1px solid var(--border)}
}

.chapters-progress{
  display:flex;flex-direction:column;gap:.35rem;margin-top:1rem;
  padding:.9rem 1rem;background:var(--surface-2);border:1px solid var(--border);border-radius:9px;
}
.chapters-progress .step{
  font-family:"JetBrains Mono",monospace;font-size:.78rem;color:var(--muted);
  display:flex;align-items:center;gap:.55rem;
}
.chapters-progress .step::before{
  content:"○";color:var(--border-2);font-size:.9rem;width:14px;display:inline-block;
}
.chapters-progress .step.active{color:var(--accent)}
.chapters-progress .step.active::before{content:"●";color:var(--accent);animation:pulse 1.4s ease-in-out infinite}
.chapters-progress .step.done{color:var(--text-2)}
.chapters-progress .step.done::before{content:"✓";color:var(--accent)}
.chapters-progress .step .detail{margin-left:auto;font-size:.7rem;color:var(--muted)}

.dropzone{
  position:relative;
  border:1.5px dashed var(--border-2);border-radius:11px;
  background:var(--surface);padding:1.6rem 1.2rem;
  text-align:center;cursor:pointer;
  transition:all .15s;
}
.dropzone:hover{border-color:var(--accent);background:rgba(181,255,61,.04)}
.dropzone.dragover{
  border-color:var(--accent);background:rgba(181,255,61,.08);
  box-shadow:0 0 30px var(--accent-glow);
}
.dropzone.uploading{cursor:default}
.dropzone .dz-content{display:flex;flex-direction:column;gap:.45rem;align-items:center}
.dropzone .dz-icon{font-size:2rem;color:var(--text-2);line-height:1}
.dropzone:hover .dz-icon,.dropzone.dragover .dz-icon{color:var(--accent)}
.dropzone .dz-title{font-size:1rem;font-weight:500;color:var(--text);letter-spacing:-.01em}
.dropzone .dz-hint{font-family:"JetBrains Mono",monospace;font-size:.74rem;color:var(--muted)}
.dropzone .dz-link{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.dropzone.uploading .dz-content{display:none}
.dropzone.uploading .dz-progress{display:flex;flex-direction:column;gap:.5rem}
.dz-progress{display:none}
.dz-progress-info{
  display:flex;align-items:center;justify-content:space-between;
  font-family:"JetBrains Mono",monospace;font-size:.78rem;color:var(--text-2);
}
.dz-progress-label{flex:1;text-align:left}
.dz-cancel{
  font-family:"JetBrains Mono",monospace;font-size:.7rem;color:var(--muted);
  padding:.25rem .55rem;border-radius:5px;border:1px solid var(--border);
  background:transparent;cursor:pointer;
}
.dz-cancel:hover{color:var(--danger);border-color:var(--danger)}
.dz-progress-bar{
  height:6px;background:var(--surface-3);border-radius:99px;overflow:hidden;
}
.dz-progress-fill{
  height:100%;width:0;
  background:linear-gradient(90deg,var(--accent-dim),var(--accent));
  box-shadow:0 0 10px var(--accent-glow);
  transition:width .15s;
}

.upload-field{
  display:flex;gap:.4rem;align-items:stretch;
}
.upload-field > input[type=text]{flex:1}
.upload-btn{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.8rem;font-weight:500;color:var(--text);
  padding:0 .9rem;border-radius:9px;
  background:var(--surface);border:1px solid var(--border);
  cursor:pointer;transition:all .15s;white-space:nowrap;
}
.upload-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(181,255,61,.06)}
.upload-btn input[type=file]{display:none}
.upload-progress{
  margin-top:.45rem;display:flex;align-items:center;gap:.55rem;
  font-family:"JetBrains Mono",monospace;font-size:.7rem;color:var(--text-2);
}
.upload-progress .bar{
  flex:1;height:5px;background:var(--surface-3);border-radius:99px;overflow:hidden;
}
.upload-progress .bar::after{
  content:"";display:block;height:100%;width:var(--progress, 0%);
  background:linear-gradient(90deg,var(--accent-dim),var(--accent));
  box-shadow:0 0 10px var(--accent-glow);transition:width .15s;
}
.upload-progress .lbl{min-width:7rem;text-align:right;color:var(--muted)}
.upload-progress.success .lbl{color:var(--accent)}
.upload-progress.error .lbl{color:var(--danger)}

.sticky-save{
  position:sticky;bottom:0;
  margin:1.2rem -1.5rem -1.4rem;padding:.9rem 1.5rem;
  background:linear-gradient(180deg, rgba(17,17,19,.4), rgba(17,17,19,.95) 40%, rgba(17,17,19,.98));
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-top:1px solid var(--border);
  border-radius:0 0 12px 12px;
  display:flex;justify-content:flex-end;gap:.6rem;
}
.help code{background:var(--surface-3);padding:.1rem .35rem;border-radius:4px;border:1px solid var(--border)}

/* === Settings tabs === */
.settings-tabs{
  display:flex;gap:.3rem;
  margin:0 0 1.2rem;padding:.4rem;
  background:var(--surface-2);border:1px solid var(--border);border-radius:12px;
}
.settings-tab{
  flex:1 1 0;min-width:0;
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-size:.86rem;font-weight:500;color:var(--text-2);
  padding:.6rem .8rem;border-radius:9px;
  background:transparent;border:1px solid transparent;
  cursor:pointer;transition:all .15s;text-decoration:none;
  letter-spacing:-.005em;white-space:nowrap;
}
@media(max-width:680px){
  .settings-tabs{flex-wrap:wrap}
  .settings-tab{flex:1 1 calc(50% - .15rem)}
}
.settings-tab:hover{color:var(--text);background:var(--surface)}
.settings-tab.active{
  color:var(--accent);background:rgba(181,255,61,.06);
  border-color:rgba(181,255,61,.3);
  box-shadow:0 0 16px rgba(181,255,61,.1);
}
.settings-tab .ic{
  font-size:1rem;width:1.4rem;text-align:center;
  font-family:"JetBrains Mono",monospace;
}
.settings-tab.active .ic{filter:drop-shadow(0 0 6px var(--accent-glow))}
.settings-tab .dot{
  width:6px;height:6px;border-radius:50%;
  margin-left:.2rem;
}
.settings-tab .dot.ok{background:var(--accent);box-shadow:0 0 8px var(--accent-glow)}
.settings-tab .dot.off{background:var(--border-2)}

.settings-pane{display:none}
.settings-pane.active{display:block;animation:fade-in .2s ease-out}
@keyframes fade-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

.group-ic{
  display:inline-block;width:1.6rem;text-align:center;
  color:var(--accent);font-family:"JetBrains Mono",monospace;
  filter:drop-shadow(0 0 8px var(--accent-glow));
  margin-right:.2rem;
}

.secret-field{
  position:relative;display:flex;gap:.4rem;align-items:stretch;
}
.secret-field input{flex:1}
.secret-toggle, .secret-clear{
  font-size:.78rem;color:var(--text-2);
  padding:0 .85rem;border-radius:8px;
  background:var(--surface-2);border:1px solid var(--border);cursor:pointer;
  transition:all .15s;white-space:nowrap;
}
.secret-toggle{font-size:1rem}
.secret-toggle:hover, .secret-clear:hover{
  color:var(--accent);border-color:var(--accent);background:rgba(181,255,61,.06);
}
.secret-clear:hover{color:var(--danger);border-color:var(--danger);background:rgba(255,93,93,.05)}

.checkbox-row{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.5rem .75rem;border:1px solid var(--border);border-radius:8px;
  background:var(--surface-2);font-size:.85rem;color:var(--text);cursor:pointer;
  transition:all .15s;user-select:none;
}
.checkbox-row:hover{border-color:var(--border-2)}
.checkbox-row input[type=checkbox]{
  width:18px;height:18px;accent-color:var(--accent);margin:0;cursor:pointer;
}
.checkbox-row input:disabled + span{color:var(--muted)}
.checkbox-row input:disabled{cursor:not-allowed}

.flash{
  background:rgba(181,255,61,.06);border:1px solid rgba(181,255,61,.25);
  color:var(--accent);padding:.7rem 1rem;border-radius:8px;margin-bottom:1rem;font-size:.85rem;
  font-family:"JetBrains Mono",monospace;
}

/* Toast */
#toast{
  position:fixed;left:50%;bottom:1.5rem;transform:translateX(-50%) translateY(20px);
  background:var(--surface-2);border:1px solid rgba(181,255,61,.35);
  color:var(--accent);padding:.7rem 1.1rem;border-radius:9px;
  font-family:"JetBrains Mono",monospace;font-size:.82rem;
  box-shadow:0 14px 40px -10px rgba(0,0,0,.6),0 0 24px var(--accent-glow);
  opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:1000;
  display:flex;align-items:center;gap:.55rem;
}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#toast.error{border-color:rgba(255,93,93,.4);color:var(--danger);box-shadow:0 14px 40px -10px rgba(0,0,0,.6),0 0 24px rgba(255,93,93,.25)}
