﻿:root{
  --bg0:#0d0f14;--bg1:#13161e;--bg2:#1a1e28;--bg3:#222736;--bg4:#2c3245;
  --border:rgba(255,255,255,.07);--border2:rgba(255,255,255,.12);
  --text1:#eef0f6;--text2:#9ba3bc;--text3:#5d6580;
  --blue:#4f8ef7;--blue2:#3a7af5;--blue-dim:rgba(79,142,247,.12);--blue-glow:rgba(79,142,247,.25);
  --green:#34d399;--green-dim:rgba(52,211,153,.1);
  --amber:#fbbf24;--amber-dim:rgba(251,191,36,.1);
  --red:#f87171;--red-dim:rgba(248,113,113,.1);
  --purple:#a78bfa;
  --r:12px;--rsm:8px;--sbw:260px;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden;background:var(--bg0)}
body{color:var(--text1);display:flex;flex-direction:column}
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bg4);border-radius:4px}

.app{display:flex;flex:1;overflow:hidden}

/* SIDEBAR */
.lsb{width:var(--sbw);flex-shrink:0;background:var(--bg1);border-right:1px solid var(--border);display:flex;flex-direction:column;transition:width .3s cubic-bezier(.4,0,.2,1);overflow:hidden}
.lsb.collapsed{width:0}
.lsb-logo{padding:22px 16px 18px;display:flex;align-items:center;gap:12px;cursor:pointer;border-bottom:1px solid var(--border);transition:background .2s,box-shadow .25s;flex-shrink:0;position:relative;overflow:hidden}
.lsb-logo::before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,rgba(79,142,247,.08),transparent 56%,rgba(167,139,250,.06));opacity:0;transition:opacity .25s}
.lsb-logo:hover{background:var(--bg2);box-shadow:inset 0 0 0 1px rgba(79,142,247,.18)}
.lsb-logo:hover::before{opacity:1}
.logo-icon{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 8px 22px var(--blue-glow);animation:logoFloat 3s ease-in-out infinite;object-fit:contain;background:transparent}
.logo-label{font-size:17px;font-weight:700;letter-spacing:.01em;white-space:nowrap;background:linear-gradient(135deg,#ecf2ff,#b8cdfc 55%,#9fe8dd);-webkit-background-clip:text;background-clip:text;color:transparent}
.logo-sub{font-size:10.5px;color:var(--text3);letter-spacing:.09em;text-transform:uppercase;margin-top:2px;white-space:nowrap}
.lsb-section{padding:14px 12px 6px;flex-shrink:0}
.lsb-sh{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);padding:0 6px;display:flex;align-items:center;justify-content:space-between}
.lsb-sh-btn{background:transparent;border:none;cursor:pointer;color:var(--text3);font-size:18px;padding:0 2px;line-height:1;transition:color .15s}
.lsb-sh-btn:hover{color:var(--blue)}
.chat-list{overflow-y:auto;flex:1;padding:6px 8px 10px}
.chat-item{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:10px;cursor:pointer;transition:background .18s,transform .2s,box-shadow .2s,border-color .18s,filter .2s;position:relative;margin-bottom:4px;border:1px solid transparent;animation:chatItemIn .24s ease both}
.chat-item:hover{background:var(--bg3);transform:translateY(-1px) scale(1.012);border-color:rgba(79,142,247,.24);box-shadow:0 8px 16px rgba(0,0,0,.18)}
.chat-item.active{background:var(--blue-dim);border:1px solid rgba(79,142,247,.32);box-shadow:0 10px 18px rgba(79,142,247,.14);animation:activePulse 2.8s ease-in-out infinite}
.chat-item.active .ci-name{color:var(--blue)}
.chat-item.pinned{border-color:rgba(245,158,11,.35);box-shadow:0 8px 18px rgba(245,158,11,.12)}
.chat-item.drag-over{outline:1px dashed rgba(79,142,247,.55);outline-offset:1px}
.chat-item.dragging{opacity:.45;filter:saturate(.7)}
.ci-icon{width:30px;height:30px;border-radius:9px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--text2);background:var(--bg3);font-family:'JetBrains Mono',monospace;letter-spacing:.01em;border:1px solid transparent;transition:transform .18s ease}
.chat-item:hover .ci-icon{transform:scale(1.08) rotate(-3deg)}
.ci-icon.general{background:linear-gradient(135deg,rgba(79,142,247,.25),rgba(59,130,246,.12));color:#bfdbfe;border-color:rgba(79,142,247,.3)}
.ci-icon.subject{background:linear-gradient(135deg,rgba(52,211,153,.18),rgba(20,184,166,.12));color:#99f6e4;border-color:rgba(45,212,191,.25)}
.ci-icon.subject.tone-math{background:linear-gradient(135deg,rgba(59,130,246,.3),rgba(99,102,241,.14));color:#bfdbfe;border-color:rgba(96,165,250,.35)}
.ci-icon.subject.tone-language{background:linear-gradient(135deg,rgba(16,185,129,.28),rgba(45,212,191,.14));color:#a7f3d0;border-color:rgba(52,211,153,.35)}
.ci-icon.subject.tone-humanities{background:linear-gradient(135deg,rgba(245,158,11,.27),rgba(249,115,22,.14));color:#fde68a;border-color:rgba(251,191,36,.35)}
.ci-icon.subject.tone-science{background:linear-gradient(135deg,rgba(139,92,246,.3),rgba(79,70,229,.16));color:#ddd6fe;border-color:rgba(167,139,250,.35)}
.ci-icon.subject.tone-tech{background:linear-gradient(135deg,rgba(34,197,94,.24),rgba(6,182,212,.16));color:#bbf7d0;border-color:rgba(45,212,191,.35)}
.ci-icon.subject.tone-economy{background:linear-gradient(135deg,rgba(234,88,12,.28),rgba(239,68,68,.16));color:#fed7aa;border-color:rgba(251,146,60,.35)}
.ci-icon.subject.tone-creative{background:linear-gradient(135deg,rgba(236,72,153,.26),rgba(168,85,247,.16));color:#fbcfe8;border-color:rgba(244,114,182,.35)}
.ci-icon.subject.tone-custom{background:linear-gradient(135deg,rgba(148,163,184,.28),rgba(100,116,139,.14));color:#cbd5e1;border-color:rgba(148,163,184,.35)}
.ci-icon svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ci-info{flex:1;min-width:0}
.ci-name{font-size:12.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text1)}
.ci-prev{font-size:10.5px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.ci-pin,.ci-del{opacity:0;background:transparent;border:none;cursor:pointer;color:var(--text3);padding:3px;border-radius:5px;transition:all .15s;position:absolute;font-size:13px}
.ci-pin{right:28px}
.ci-del{right:7px}
.ci-pin svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ci-pin.on{opacity:1;color:#fbbf24;background:rgba(245,158,11,.14)}
.chat-item:hover .ci-pin,.chat-item:hover .ci-del{opacity:1}
.ci-pin:hover{color:#fbbf24;background:rgba(245,158,11,.14)}
.ci-del:hover{color:var(--red);background:var(--red-dim)}
.lsb-profile{padding:10px;border-top:1px solid var(--border);flex-shrink:0}
.lsb-pcard{display:flex;align-items:center;gap:9px;padding:9px;background:var(--bg2);border-radius:var(--rsm);cursor:pointer;transition:background .15s;border:1px solid var(--border)}
.lsb-pcard:hover{background:var(--bg3);border-color:var(--border2)}
.av{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--purple));display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0}
.pcard-name{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcard-class{font-size:10.5px;color:var(--text3);margin-top:1px}

.toggle-sb{position:fixed;left:var(--sbw);top:50%;transform:translateY(-50%);width:16px;height:40px;background:var(--bg2);border:1px solid var(--border2);border-left:none;border-radius:0 7px 7px 0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text3);font-size:10px;z-index:200;transition:left .3s cubic-bezier(.4,0,.2,1),background .2s}
.toggle-sb:hover{background:var(--bg3);color:var(--text1)}
.toggle-sb.sb-hidden{left:0;border-left:1px solid var(--border2);border-radius:0 7px 7px 0}

/* MAIN */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--bg0)}
.main{padding-bottom:92px}
.topbar{display:flex;align-items:center;gap:16px;padding:16px 24px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,var(--bg1),rgba(19,22,30,.92));flex-shrink:0}
.topbar-title{font-size:19px;font-weight:700;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.01em}
.topbar-sub{font-size:12px;color:var(--text3);margin-top:2px}
.icon-btn{width:36px;height:36px;border-radius:10px;border:1px solid var(--border2);background:var(--bg2);color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:all .2s}
.icon-btn:hover{color:var(--text1);border-color:rgba(79,142,247,.45);background:var(--blue-dim)}
.tab-pills{display:flex;gap:6px;background:linear-gradient(135deg,var(--bg2),var(--bg3));padding:6px;border-radius:14px;border:1px solid var(--border2);box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 8px 20px rgba(0,0,0,.2)}
.tab-pill{position:relative;padding:9px 16px;border-radius:10px;font-size:13.5px;font-weight:600;cursor:pointer;border:none;background:transparent;color:var(--text2);transition:all .22s;font-family:'Outfit',sans-serif;overflow:hidden}
.tab-pill::after{content:'';position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:999px;background:var(--blue);transform:scaleX(0);transform-origin:center;transition:transform .22s ease}
.tab-pill:hover{color:var(--text1);background:rgba(255,255,255,.03);transform:translateY(-1px)}
.tab-pill.active{background:linear-gradient(135deg,rgba(79,142,247,.25),rgba(20,184,166,.18));color:#eaf2ff;box-shadow:0 10px 24px rgba(79,142,247,.24), inset 0 0 0 1px rgba(79,142,247,.38);animation:tabGlow 2.4s ease-in-out infinite}
.tab-pill.active::after{transform:scaleX(1)}
.tab-pill.locked{opacity:.45;cursor:not-allowed;pointer-events:none;filter:saturate(.6)}
.top-tabs{display:none}
.bottom-dock{
  position:fixed;
  left:50%;
  transform:translateX(-50%);
  bottom:10px;
  z-index:240;
  pointer-events:none;
}
.bottom-dock-track{
  pointer-events:auto;
  display:flex;
  align-items:flex-end;
  gap:7px;
  padding:8px 10px;
  border-radius:14px;
  border:1px solid var(--border2);
  background:linear-gradient(180deg,rgba(19,22,30,.92),rgba(15,18,26,.95));
  box-shadow:0 16px 34px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.03);
  overflow-x:auto;
  max-width:min(1120px,calc(100vw - 28px));
}
.dock-pill{
  white-space:nowrap;
  transform-origin:center bottom;
  transition:transform .26s ease, background .24s ease, box-shadow .24s ease;
  min-width:max-content;
}
.dock-pill:hover{transform:scale(1.045)}
.dock-pill:hover::after{transform:scaleX(1)}
.dock-pill.active{
  box-shadow:0 10px 24px rgba(79,142,247,.24), inset 0 0 0 1px rgba(79,142,247,.38);
}
.dock-pill.active:hover{transform:scale(1.05)}

#panel-chat .chat-input-area{margin-bottom:0;padding-bottom:8px}
.api-health{padding:6px 10px;border-radius:999px;border:1px solid var(--border2);font-size:11px;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.api-health.ok{color:var(--green);background:var(--green-dim);border-color:rgba(52,211,153,.35)}
.api-health.err{color:var(--red);background:var(--red-dim);border-color:rgba(248,113,113,.35)}
.api-health.checking{color:var(--amber);background:var(--amber-dim);border-color:rgba(251,191,36,.35)}
@keyframes tabGlow{0%,100%{box-shadow:0 6px 16px rgba(79,142,247,.16), inset 0 0 0 1px rgba(79,142,247,.32)}50%{box-shadow:0 8px 20px rgba(79,142,247,.3), inset 0 0 0 1px rgba(79,142,247,.45)}}
.panel{display:none;flex:1;overflow:hidden;flex-direction:column}
.panel.active{display:flex}
#panel-chat,#panel-chat #chatView{min-height:0}

/* CHAT */
.chat-body{flex:1;overflow-y:auto;padding:20px 18px 280px 18px;display:flex;flex-direction:column;gap:14px;background:radial-gradient(circle at 10% 10%,rgba(79,142,247,.07),transparent 42%),radial-gradient(circle at 85% 90%,rgba(167,139,250,.08),transparent 38%)}
.msg{display:flex;flex-direction:column;gap:4px;animation:su .28s cubic-bezier(.17,.67,.37,1)}
@keyframes su{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
.msg.user{align-items:flex-end}
.msg.ai{align-items:flex-start}
.msg-meta{font-size:10px;font-weight:500;letter-spacing:.05em;color:var(--text3);font-family:'JetBrains Mono',monospace;text-transform:uppercase;padding:0 4px}
.bubble{max-width:74%;padding:11px 15px;font-size:14px;line-height:1.72;border-radius:14px;transition:transform .2s ease,box-shadow .2s ease}
.msg.user .bubble{background:linear-gradient(135deg,var(--blue2),var(--blue));color:#fff;border-radius:14px 14px 3px 14px}
.msg.ai .bubble{background:var(--bg2);border:1px solid var(--border2);color:var(--text1);border-radius:14px 14px 14px 3px;white-space:pre-wrap}
.msg .bubble:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(0,0,0,.22)}
.msg.ai .bubble strong{color:var(--blue)}
.msg.ai .bubble .msatz{display:block;margin:10px 0 4px;padding:9px 12px;background:var(--amber-dim);border-left:3px solid var(--amber);border-radius:0 7px 7px 0;color:var(--amber);font-size:13px}
.pdf-pill{display:flex;align-items:center;gap:6px;padding:6px 12px;background:var(--red-dim);border:1px solid rgba(248,113,113,.2);border-radius:18px;font-size:12px;color:var(--red);margin-bottom:3px;align-self:flex-end}
.typing{display:flex;gap:5px;align-items:center;padding:12px 16px;background:var(--bg2);border:1px solid var(--border2);border-radius:14px 14px 14px 3px;width:fit-content}
.td{width:6px;height:6px;background:var(--text3);border-radius:50%;animation:bob 1.3s ease-in-out infinite}
.td:nth-child(2){animation-delay:.18s}.td:nth-child(3){animation-delay:.36s}
@keyframes bob{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}
.chat-input-area{position:fixed;bottom:0;left:var(--sbw);right:0;padding:12px 16px;border-top:1px solid var(--border);background:var(--bg1);flex-shrink:0;z-index:300;box-sizing:border-box}
.pdf-attach-bar{display:flex;align-items:center;gap:7px;padding:6px 11px;background:var(--red-dim);border:1px solid rgba(248,113,113,.2);border-radius:7px;font-size:12px;color:var(--red);margin-bottom:8px}
.pdf-attach-bar button{margin-left:auto;background:transparent;border:none;cursor:pointer;color:var(--red);font-size:14px;padding:0 2px;line-height:1}
.input-row{display:flex;gap:7px;align-items:flex-end}
.chat-tf{flex:1;background:var(--bg2);border:1.5px solid var(--border2);border-radius:11px;padding:10px 14px;font-family:'Outfit',sans-serif;font-size:13.5px;color:var(--text1);outline:none;resize:none;min-height:44px;max-height:110px;line-height:1.5;transition:border-color .2s}
.chat-tf:focus{border-color:var(--blue)}
.chat-tf::placeholder{color:var(--text3)}
.btn-attach{width:44px;height:44px;background:var(--bg3);border:1.5px solid var(--border2);border-radius:11px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text2);transition:all .18s;flex-shrink:0}
.btn-attach:hover{background:var(--bg4);border-color:var(--blue);color:var(--blue)}
#pdfInput{display:none}
.btn-send{width:44px;height:44px;background:linear-gradient(135deg,var(--blue2),var(--blue));border:none;border-radius:11px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;transition:all .18s;flex-shrink:0;box-shadow:0 4px 12px var(--blue-glow)}
.btn-send:hover{transform:scale(1.05)}
.btn-send:disabled{background:var(--bg3);box-shadow:none;transform:none;cursor:not-allowed}
.quick-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:9px}
.qchip{padding:5px 11px;background:var(--bg2);border:1px solid var(--border2);border-radius:18px;font-size:11.5px;color:var(--text2);cursor:pointer;transition:all .15s;font-weight:500;font-family:'Outfit',sans-serif}
.qchip:hover{background:var(--blue-dim);border-color:rgba(79,142,247,.4);color:var(--blue)}

/* WELCOME */
.welcome{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;padding:40px}
.welcome-icon{width:120px;height:120px;border-radius:18px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px var(--blue-glow);animation:logoFloat 3s ease-in-out infinite;object-fit:contain;background:transparent}
.welcome h1{font-size:30px;font-weight:700;letter-spacing:-0.02em;text-align:center;background:linear-gradient(135deg,#f0f4ff,#aac6fc 56%,#9be1d8);-webkit-background-clip:text;background-clip:text;color:transparent}
.welcome p{font-size:14px;color:var(--text2);text-align:center;max-width:400px;line-height:1.6}
.welcome-btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.wb{padding:9px 20px;border-radius:9px;font-family:'Outfit',sans-serif;font-size:13.5px;font-weight:600;cursor:pointer;transition:all .18s;border:none}
.wb.primary{background:linear-gradient(135deg,var(--blue2),var(--blue));color:#fff;box-shadow:0 4px 12px var(--blue-glow)}
.wb.secondary{background:var(--bg3);border:1px solid var(--border2);color:var(--text1)}
.wb:hover{transform:translateY(-1px)}

/* LERNFORTSCHRITT WIDGET */
.welcome-progress{display:none;width:100%;max-width:760px;margin:16px auto 28px;gap:14px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.progress-card{background:var(--bg1);border:1px solid var(--border);border-radius:16px;padding:20px;text-align:center;box-shadow:0 8px 24px rgba(0,0,0,.15);transition:transform .2s ease, box-shadow .2s ease;position:relative;overflow:hidden;}
.progress-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--blue2),var(--purple));opacity:0.7;}
.progress-card:hover{transform:translateY(-3px);border-color:rgba(79,142,247,.4);box-shadow:0 14px 32px rgba(0,0,0,.25);}
.progress-card h4{font-size:12px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;font-family:'JetBrains Mono',monospace;}
.progress-value{font-size:32px;font-weight:700;color:var(--text1);letter-spacing:-0.02em;}
.progress-sub{font-size:12.5px;color:var(--text2);margin-top:6px;}
.progress-bar-bg{background:var(--bg3);height:10px;border-radius:5px;overflow:hidden;box-shadow:inset 0 1px 3px rgba(0,0,0,.2);}
.progress-bar-fill{background:linear-gradient(90deg,var(--blue),var(--purple));height:100%;border-radius:5px;transition:width 1s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px rgba(167,139,250,.4);}

.empty-chat{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;color:var(--text3);margin-top:auto;padding-bottom:92px}
.empty-chat h3{font-size:15px;font-weight:600;color:var(--text2)}
.empty-chat p{font-size:12.5px;text-align:center;max-width:280px}

/* LERNPLAN */
.lp-body{flex:1;overflow-y:auto;padding:16px;max-width:1020px;width:100%;margin:0 auto}
.lp-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.lp-main{min-width:0}
.lp-side{position:sticky;top:14px;display:flex;flex-direction:column;gap:10px}
.lp-side-card{background:var(--bg1);border:1px solid var(--border);border-radius:var(--r);padding:10px}
.lp-side-card + .lp-side-card{border-color:rgba(79,142,247,.24);background:linear-gradient(180deg,rgba(79,142,247,.06),rgba(19,22,30,.98))}
.lp-side-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.lp-side-top h3{font-size:12.5px;font-weight:700;white-space:nowrap}
.lp-side-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.side-action-btn{padding:5px 9px;font-size:11px;line-height:1.2;border-radius:7px;font-weight:600}
.lp-side-actions .plan-btn:hover{transform:none}
.lp-side-card > h3{font-size:14px;font-weight:700;line-height:1.2;margin-bottom:7px}
.lp-side-card .doc-meta{font-size:12px;line-height:1.45}
.doc-list{display:flex;flex-direction:column;gap:8px;max-height:72vh;overflow:auto}
#docHistoryList{max-height:none;overflow:visible}
.doc-item{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:10px}
.doc-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.doc-title{font-size:12.5px;font-weight:600;line-height:1.4}
.doc-meta{font-size:10.5px;color:var(--text3);margin-top:4px}
.doc-status{font-size:10px;padding:2px 7px;border-radius:999px;border:1px solid var(--border2);white-space:nowrap}
.doc-status.ok{color:var(--green);border-color:rgba(52,211,153,.35);background:var(--green-dim)}
.doc-status.no{color:var(--red);border-color:rgba(248,113,113,.35);background:var(--red-dim)}
.doc-actions{display:flex;gap:6px;margin-top:8px}
.doc-btn{padding:5px 10px;border-radius:7px;border:1px solid var(--border2);background:var(--bg3);color:var(--text1);font-size:11.5px;cursor:pointer}
.doc-btn:hover{border-color:var(--blue);color:var(--blue)}
.doc-btn.danger{border-color:rgba(248,113,113,.35);color:#fecaca}
.doc-btn.danger:hover{border-color:rgba(248,113,113,.55);color:#fca5a5;background:rgba(248,113,113,.08)}
.doc-actions .doc-btn{font-family:'Outfit',sans-serif;font-size:12.5px;font-weight:600;padding:8px 12px;border-radius:9px}
.lp-hero{background:linear-gradient(135deg,rgba(16,185,129,.12),rgba(52,211,153,.08));border:1px solid rgba(16,185,129,.35);border-radius:var(--r);padding:14px 16px;margin-bottom:12px;text-align:center;display:flex;flex-direction:column;align-items:center}
.lp-hero h2{font-size:20px;font-weight:700;letter-spacing:-0.02em;margin-bottom:3px}
.lp-hero p{font-size:12px;color:var(--text2);line-height:1.5;max-width:700px;margin:0 auto}
.lp-preset-row{display:flex;gap:6px;flex-wrap:wrap;margin:-8px 0 14px}
.lp-mode-toggle{display:flex;gap:8px;margin-bottom:12px}
.lp-mode-btn{flex:1;padding:9px 10px;border-radius:var(--rsm);border:1.5px solid var(--border2);background:var(--bg2);cursor:pointer;text-align:left;transition:all .2s}
.lp-mode-btn.active{border-color:var(--blue);background:var(--blue-dim)}
.lp-mode-btn h4{font-size:13px;font-weight:600;margin-bottom:1px;color:var(--text1);font-family:'Outfit',sans-serif}
.lp-mode-btn p{font-size:11px;color:var(--text3);font-family:'Outfit',sans-serif}
.lp-mode-btn.active h4{color:var(--blue)}
.lp-section{display:none}
.lp-section.show{display:block}
.lp-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:12px}
.lp-card{background:var(--bg1);border:1px solid var(--border);border-radius:var(--r);padding:13px}
.lp-card{box-shadow:0 8px 18px rgba(0,0,0,.14)}
.lp-card.full{grid-column:1/-1}
.lp-label{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text3);margin-bottom:6px;font-family:'JetBrains Mono',monospace;display:block}
.lp-input,.lp-select,.lp-textarea{width:100%;background:var(--bg2);border:1.5px solid var(--border2);border-radius:var(--rsm);padding:9px 13px;font-family:'Outfit',sans-serif;font-size:13.5px;color:var(--text1);outline:none;transition:border-color .2s}
.lp-input:focus,.lp-select:focus,.lp-textarea:focus{border-color:var(--blue)}
.lp-input::placeholder,.lp-textarea::placeholder{color:var(--text3)}
.lp-select option{background:var(--bg2);color:var(--text1)}
.lp-textarea{resize:none;line-height:1.5}
.lp-exam-add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:10px;margin-bottom:6px}
.abi-exam-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:10px}
.abi-exam-row{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:8px}
.abi-exam-row .doc-meta{display:block;margin-bottom:6px;margin-top:0}
.lp-topic-picker{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px;max-height:130px;overflow:auto;padding-right:2px}
.lp-topic-chip{padding:6px 11px;border:1px solid var(--border2);border-radius:999px;background:var(--bg2);color:var(--text2);font-size:12px;cursor:pointer;transition:all .15s;font-family:'Outfit',sans-serif}
.lp-topic-chip:hover{border-color:rgba(79,142,247,.45);color:var(--blue);background:var(--blue-dim)}
.lp-topic-chip.picked{border-color:rgba(79,142,247,.55);background:var(--blue-dim);color:var(--blue)}
.lang-pick-row{display:flex;flex-wrap:wrap;gap:8px}
.lang-pill{padding:7px 12px;border:1px solid var(--border2);border-radius:999px;background:var(--bg2);color:var(--text2);font-size:12px;cursor:pointer;transition:all .18s;font-family:'Outfit',sans-serif}
.lang-pill:hover{border-color:rgba(79,142,247,.45);color:var(--blue);background:var(--blue-dim);transform:translateY(-1px)}
.lang-pill.active{border-color:rgba(79,142,247,.55);background:var(--blue-dim);color:var(--blue);box-shadow:0 0 0 2px rgba(79,142,247,.12) inset}
.hide-file-input{display:none !important}
.emoji-upload-btn{display:inline-flex;align-items:center;gap:10px;width:fit-content;padding:10px 14px;border-radius:999px;background:var(--bg2);border:1.5px solid var(--border2);cursor:pointer;color:var(--text1);transition:all .2s}
.emoji-upload-btn:hover{border-color:var(--blue);background:var(--blue-dim);color:var(--blue);transform:translateY(-1px)}
.emoji-upload-icon{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--blue2),var(--blue));color:#fff;font-size:16px;box-shadow:0 6px 16px var(--blue-glow);animation:emojiPulse 1.8s ease-in-out infinite}
@keyframes emojiPulse{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}
.time-row{display:flex;gap:8px}
.time-num{flex:1;background:var(--bg2);border:1.5px solid var(--border2);border-radius:var(--rsm);padding:9px 13px;font-family:'Outfit',sans-serif;font-size:13.5px;color:var(--text1);outline:none;transition:border-color .2s}
.time-num:focus{border-color:var(--blue)}
.time-unit{background:var(--bg2);border:1.5px solid var(--border2);border-radius:var(--rsm);padding:9px 12px;font-family:'Outfit',sans-serif;font-size:13.5px;color:var(--text1);outline:none;transition:border-color .2s}

/* Moderner Slider (Schieberegler) */
.lp-slider {
  -webkit-appearance: none;
  width: 100%;
  height: 6px;
  background: var(--bg3);
  border-radius: 3px;
  outline: none;
  margin: 12px 0 8px 0;
}
.lp-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--blue);
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  transition: transform 0.1s;
}
.lp-slider::-webkit-slider-thumb:hover {
  transform: scale(1.15);
}
.lp-slider::-moz-range-thumb {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--blue);
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  transition: transform 0.1s;
}
.lp-slider::-moz-range-thumb:hover {
  transform: scale(1.15);
}

.upload-zone{border:2px dashed var(--border2);border-radius:var(--r);padding:24px;text-align:center;cursor:pointer;transition:all .2s;background:var(--bg2)}
.upload-zone:hover,.upload-zone.dragover{border-color:var(--blue);background:var(--blue-dim)}
.upload-zone p{font-size:12.5px;color:var(--text2);margin-top:6px}
.uz-attached{display:flex;align-items:center;gap:9px;padding:10px 14px;background:var(--green-dim);border:1px solid rgba(52,211,153,.2);border-radius:var(--rsm)}
.uz-attached span{flex:1;font-size:13px;color:var(--green)}
.uz-attached button{background:transparent;border:none;cursor:pointer;color:var(--text3);transition:color .15s;font-size:15px}
.uz-attached button:hover{color:var(--red)}
.lp-actions-row{display:flex;justify-content:center;gap:10px}
.lp-actions-row .btn-gen{width:min(420px,100%)}
.btn-gen{width:100%;padding:13px;background:linear-gradient(135deg,#22c55e,#14b8a6 45%,#3b82f6);border:none;border-radius:var(--rsm);font-family:'Outfit',sans-serif;font-size:14.5px;font-weight:600;color:#fff;cursor:pointer;transition:all .2s;box-shadow:0 10px 24px rgba(34,197,94,.18),0 10px 24px rgba(59,130,246,.18);letter-spacing:.01em}
.btn-gen.secondary{background:linear-gradient(135deg,#0f766e,#14b8a6);box-shadow:0 4px 14px rgba(20,184,166,.3)}
.btn-gen:hover{transform:translateY(-1px) scale(1.005);box-shadow:0 14px 30px rgba(34,197,94,.22),0 14px 30px rgba(59,130,246,.2)}
.btn-gen.secondary:hover{box-shadow:0 6px 20px rgba(20,184,166,.4)}

/* PLAN OUTPUT */
.lp-result{margin-top:20px}
.plan-actions{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.plan-btn{padding:8px 18px;border-radius:var(--rsm);font-family:'Outfit',sans-serif;font-size:13px;font-weight:600;cursor:pointer;border:none;transition:all .18s}
.plan-btn.pdf{background:linear-gradient(135deg,var(--red),#e55);color:#fff;box-shadow:0 3px 10px rgba(248,113,113,.3)}
.plan-btn.edit{background:var(--bg3);border:1px solid var(--border2);color:var(--text1)}
.plan-btn:hover{transform:translateY(-1px)}
.week-card{background:var(--bg1);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin-bottom:12px}
.week-hd{background:var(--bg2);padding:11px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}
.week-hd h3{font-size:13.5px;font-weight:600}
.week-hd span{font-size:10.5px;color:var(--text3);font-family:'JetBrains Mono',monospace}
.day-row{display:flex;align-items:flex-start;gap:12px;padding:10px 16px;border-bottom:1px solid var(--border);transition:background .15s}
.day-row:last-child{border-bottom:none}
.day-row:hover{background:var(--bg2)}
.day-label{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:600;color:var(--blue);min-width:26px;padding-top:2px;letter-spacing:.05em}
.day-content{font-size:13px;color:var(--text1);line-height:1.6;flex:1}
.day-edit-btn{background:transparent;border:none;cursor:pointer;color:var(--text3);font-size:13px;padding:2px 5px;border-radius:5px;transition:all .15s;opacity:0;flex-shrink:0}
.day-row:hover .day-edit-btn{opacity:1}
.day-edit-btn:hover{color:var(--blue);background:var(--blue-dim)}
.day-edit-input{flex:1;background:var(--bg3);border:1.5px solid var(--blue);border-radius:6px;padding:6px 10px;font-family:'Outfit',sans-serif;font-size:13px;color:var(--text1);outline:none;width:100%}
.tips-card{background:var(--amber-dim);border:1px solid rgba(251,191,36,.2);border-radius:var(--r);padding:18px;margin-top:12px}
.tips-card h3{font-size:13.5px;font-weight:600;color:var(--amber);margin-bottom:10px}
.tip-row{display:flex;gap:9px;padding:5px 0;font-size:13px;color:var(--text1)}
.tip-row::before{content:'Tipp:';color:var(--amber);flex-shrink:0;font-weight:700;font-size:11px;padding-top:2px}
.notes-card{background:var(--bg1);border:1px solid var(--border);border-radius:var(--r);padding:16px}
.notes-card h3{font-size:14px;margin-bottom:10px}
.notes-card pre{white-space:pre-wrap;font-family:'Outfit',sans-serif;font-size:13px;line-height:1.65;color:var(--text1)}
.loading-state{text-align:center;padding:44px 24px;display:none}
.loading-state.show{display:block}
.loader{width:36px;height:36px;border:3px solid var(--bg3);border-top-color:var(--blue);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 14px}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-state p{color:var(--text2);font-size:13.5px}

/* TOOLS */
.tools-body{flex:1;overflow-y:auto;padding:22px;max-width:1100px;width:100%;margin:0 auto}
.tools-hero{background:linear-gradient(135deg,rgba(16,185,129,.12),rgba(52,211,153,.08));border:1px solid rgba(16,185,129,.35);border-radius:var(--r);padding:20px;margin-bottom:16px;text-align:center;display:flex;flex-direction:column;align-items:center}
.tools-hero h2{font-size:24px;font-weight:700;letter-spacing:-0.02em;margin-bottom:4px}
.tools-hero p{font-size:13px;color:var(--text2);max-width:760px;margin:0 auto}
.tools-hero h2,.tools-hero p{transition:transform .25s ease,opacity .25s ease}
.tools-hero:hover h2{transform:translateY(-1px)}
.grammar-hero{background:linear-gradient(135deg,rgba(20,184,166,.1),rgba(79,142,247,.08));border-color:rgba(20,184,166,.3)}
.tools-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tools-card{background:var(--bg1);border:1px solid var(--border);border-radius:var(--r);padding:14px}
.tools-card.full{grid-column:1/-1}
.tools-card h3{font-size:14px;margin-bottom:10px}
.grammar-card{box-shadow:0 10px 24px rgba(0,0,0,.18)}
.tools-form{display:flex;flex-direction:column;gap:8px}
.tools-bottom{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;margin-top:14px}
.tools-output{min-height:120px}
.tools-side{display:flex;flex-direction:column;gap:10px}
.tools-side-card{background:var(--bg1);border:1px solid var(--border);border-radius:var(--r);padding:12px}
.tools-side-card h3{font-size:13px;margin-bottom:8px}
.tools-stats{display:flex;flex-direction:column;gap:6px}
.stat-row{display:flex;justify-content:space-between;font-size:12px;padding:6px 8px;background:var(--bg2);border-radius:8px;border:1px solid var(--border)}
.quality-box{margin-top:10px;padding:10px;border-radius:10px;background:var(--amber-dim);border:1px solid rgba(251,191,36,.25)}
.quality-box h4{font-size:12px;color:var(--amber);margin-bottom:6px}
.quality-line{font-size:12px;color:var(--text1);padding:2px 0}
.ai-pie-wrap{display:flex;align-items:center;gap:12px;margin-top:10px}
.ai-pie{width:90px;height:90px;border-radius:50%;position:relative;flex-shrink:0;border:1px solid var(--border2)}
.ai-pie::after{content:'';position:absolute;inset:13px;background:var(--bg1);border-radius:50%}
.ai-pie-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;z-index:2}
.formula-item{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:10px}
.formula-name{font-weight:700;font-size:13px}
.formula-fx{font-family:'JetBrains Mono',monospace;color:var(--blue);font-size:12px;margin-top:4px}
.formula-math{font-family:'Outfit',sans-serif;font-size:14px;color:var(--blue)}
.formula-desc{font-size:12px;color:var(--text2);margin-top:4px;line-height:1.45}
#formulaList{max-height:none;overflow:visible}
.vq-word{font-size:24px;font-weight:700;letter-spacing:.04em;color:var(--blue);margin-bottom:8px}
.vq-meta{font-size:12px;color:var(--text3);margin-bottom:10px}
.vq-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.vq-input{flex:1;min-width:180px}
.vq-score{font-size:12px;color:var(--text2);margin-top:10px}
.vocab-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vocab-btn{padding:10px 12px;font-size:12.5px;font-weight:600;border-radius:9px}
.vocab-btn.danger{border-color:rgba(248,113,113,.35);color:#fecaca}
.vocab-btn.danger:hover{border-color:rgba(248,113,113,.55);color:#fca5a5;background:rgba(248,113,113,.08)}
.vocab-mode-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:11px;background:var(--bg2);border:1px solid var(--border)}
.vocab-mode-title{font-size:12.5px;font-weight:700;color:var(--text1)}
.vocab-mode-sub{font-size:11.5px;color:var(--text2);margin-top:2px;line-height:1.4}
.vocab-mode-toggle{position:relative;display:inline-flex;align-items:center;cursor:pointer}
.vocab-mode-toggle input{position:absolute;opacity:0;pointer-events:none}
.vocab-switch{position:relative;width:48px;height:28px;border-radius:999px;background:var(--bg1);border:1px solid var(--border2);transition:all .2s ease}
.vocab-switch::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#cbd5e1;transition:all .2s ease}
.vocab-mode-toggle input:checked + .vocab-switch{background:rgba(16,185,129,.22);border-color:rgba(16,185,129,.55)}
.vocab-mode-toggle input:checked + .vocab-switch::after{left:23px;background:#34d399}
.heat-table{width:100%;border-collapse:collapse;font-size:12px}
.heat-table th,.heat-table td{padding:6px 8px;border-bottom:1px solid var(--border);text-align:left}
.heat-lv{display:inline-block;min-width:74px;padding:2px 8px;border-radius:999px;border:1px solid var(--border2);font-size:10px}
.heat-low{background:var(--green-dim);color:var(--green);border-color:rgba(52,211,153,.35)}
.heat-mid{background:var(--amber-dim);color:var(--amber);border-color:rgba(251,191,36,.35)}
.heat-high{background:var(--red-dim);color:var(--red);border-color:rgba(248,113,113,.35)}

.ai-studio-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.ai-studio-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.ai-studio-head h4{font-size:15px}
.ai-studio-sub{font-size:12px;color:var(--text2)}
.unified-hero{
  position:relative;
  overflow:hidden;
  padding:26px 20px 22px;
  background:
    radial-gradient(120% 130% at 0% 0%,rgba(20,184,166,.2),transparent 55%),
    radial-gradient(100% 120% at 100% 100%,rgba(79,142,247,.18),transparent 55%),
    linear-gradient(135deg,rgba(16,185,129,.08),rgba(79,142,247,.08));
  border-color:rgba(52,211,153,.42);
}
.panel-kicker{
  font-family:'JetBrains Mono',monospace;
  font-size:10.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#a7f3d0;
  border:1px solid rgba(52,211,153,.4);
  border-radius:999px;
  padding:5px 11px;
  margin-bottom:10px;
  background:rgba(6,78,59,.28);
}
.unified-card{
  padding:16px;
  background:linear-gradient(180deg,rgba(17,24,39,.96),rgba(15,23,35,.98));
  border:1px solid rgba(79,142,247,.2);
  box-shadow:0 14px 30px rgba(0,0,0,.22);
}
.ai-studio-body{max-width:1160px}
.ai-studio-grid{grid-template-columns:1fr}
.ai-studio-hero{
  position:relative;
  overflow:hidden;
  padding:26px 20px 22px;
  background:
    radial-gradient(120% 130% at 0% 0%,rgba(20,184,166,.2),transparent 55%),
    radial-gradient(100% 120% at 100% 100%,rgba(79,142,247,.18),transparent 55%),
    linear-gradient(135deg,rgba(16,185,129,.08),rgba(79,142,247,.08));
  border-color:rgba(52,211,153,.42);
}
.ai-hero-badge{
  font-family:'JetBrains Mono',monospace;
  font-size:10.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#a7f3d0;
  border:1px solid rgba(52,211,153,.4);
  border-radius:999px;
  padding:5px 11px;
  margin-bottom:10px;
  background:rgba(6,78,59,.28);
}
.ai-studio-builder{
  padding:16px;
  background:linear-gradient(180deg,rgba(17,24,39,.96),rgba(15,23,35,.98));
  border:1px solid rgba(79,142,247,.2);
  box-shadow:0 14px 30px rgba(0,0,0,.22);
}
.ai-builder-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.ai-builder-head h3{
  font-size:18px;
  font-weight:700;
  margin:0;
}
.ai-studio-form{gap:12px}
.ai-field{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:12px}
.ai-field.full{padding:0;background:transparent;border:none}
.ai-main-prompt{
  min-height:122px;
  border-color:rgba(79,142,247,.35);
  background:linear-gradient(180deg,rgba(30,41,59,.62),rgba(17,24,39,.92));
}
.ai-form-row{display:grid;grid-template-columns:1.2fr .8fr;gap:12px}
.ai-side-fields{display:grid;gap:12px}
.ai-build-btn{
  height:52px;
  border-radius:12px;
  font-size:15px;
  font-weight:700;
  background:linear-gradient(135deg,#22c55e,#14b8a6 45%,#3b82f6);
  box-shadow:0 10px 24px rgba(34,197,94,.18),0 10px 24px rgba(59,130,246,.18);
}
.ai-build-btn:hover{
  transform:translateY(-1px) scale(1.005);
  box-shadow:0 14px 30px rgba(34,197,94,.22),0 14px 30px rgba(59,130,246,.2);
}
.ai-studio-result{margin-top:14px}
.ai-slide-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ai-slide-card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:12px;animation:fadeSlideIn .26s ease both}
.ai-slide-card h5{font-size:13.5px;margin-bottom:7px}
.ai-slide-card ul{padding-left:16px}
.ai-slide-card li{font-size:12.5px;line-height:1.55;color:var(--text1);margin-bottom:3px}
.ai-slide-notes{margin-top:7px;padding:8px;border-radius:9px;background:var(--bg1);border:1px solid var(--border);font-size:12px;color:var(--text2);line-height:1.5}
.ai-img-wrap{margin-top:9px;border:1px dashed var(--border2);border-radius:10px;overflow:hidden;background:var(--bg1);min-height:150px;display:flex;align-items:center;justify-content:center}
.ai-img-wrap img{width:100%;height:auto;display:block}
.ai-img-ph{font-size:11.5px;color:var(--text3);padding:12px;text-align:center}
.ai-slide-tools{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.ai-codebox{background:var(--bg1);border:1px solid var(--border);border-radius:10px;padding:10px;white-space:pre-wrap;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--text2)}

/* EDIT MODAL for plan */
.edit-modal-body textarea{width:100%;background:var(--bg3);border:1.5px solid var(--border2);border-radius:var(--rsm);padding:12px;font-family:'Outfit',sans-serif;font-size:13.5px;color:var(--text1);outline:none;resize:vertical;min-height:200px;line-height:1.6;transition:border-color .2s}
.edit-modal-body textarea:focus{border-color:var(--blue)}
.settings-modal{width:680px;max-width:calc(100vw - 24px)}
.settings-modal{background:linear-gradient(180deg,var(--bg1),rgba(17,21,30,.98));position:relative;overflow:hidden}
.settings-modal::before{content:'';position:absolute;inset:-120px -80px auto auto;width:260px;height:260px;background:radial-gradient(circle,rgba(79,142,247,.26),transparent 70%);pointer-events:none;filter:blur(2px)}
.settings-layout{display:grid;grid-template-columns:170px minmax(0,1fr);gap:12px;position:relative;z-index:1}
.settings-sidebar{background:linear-gradient(180deg,var(--bg2),rgba(24,30,42,.95));border:1px solid var(--border);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.settings-nav{padding:10px 12px;border-radius:10px;border:1px solid transparent;background:transparent;color:var(--text2);font-size:12.5px;font-weight:600;text-align:left;cursor:pointer;transition:all .24s;font-family:'Outfit',sans-serif}
.settings-nav:hover{border-color:rgba(79,142,247,.35);background:rgba(79,142,247,.08);color:var(--text1)}
.settings-nav.active{border-color:rgba(79,142,247,.52);background:linear-gradient(135deg,rgba(79,142,247,.22),rgba(20,184,166,.12));color:#e6efff;box-shadow:0 8px 18px rgba(79,142,247,.18)}
.settings-main{min-width:0}
.settings-grid{display:grid;gap:10px}
.settings-card{background:linear-gradient(180deg,var(--bg2),rgba(28,34,48,.95));border:1px solid var(--border);border-radius:10px;padding:10px}
.settings-label{font-size:11px;color:var(--text3);margin-bottom:6px;letter-spacing:.06em;text-transform:uppercase}
.settings-switch{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;background:linear-gradient(180deg,var(--bg2),rgba(28,34,48,.95));border:1px solid var(--border);border-radius:10px;color:var(--text1);font-size:13px;cursor:pointer}
.settings-switch-text{font-weight:500}
.settings-toggle{position:relative;display:inline-flex;align-items:center}
.settings-toggle input{position:absolute;opacity:0;width:0;height:0}
.settings-slider{width:44px;height:24px;border-radius:999px;background:var(--bg4);border:1px solid var(--border2);position:relative;transition:all .2s}
.settings-slider::before{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.25);transition:all .2s}
.settings-toggle input:checked + .settings-slider{background:linear-gradient(135deg,var(--blue2),var(--blue));border-color:rgba(79,142,247,.55)}
.settings-toggle input:checked + .settings-slider::before{left:22px}
.settings-toggle input:focus-visible + .settings-slider{outline:2px solid rgba(79,142,247,.45);outline-offset:2px}
.settings-item{opacity:0;transform:translateY(6px);transition:opacity .25s ease,transform .25s ease}
.settings-item.in{opacity:1;transform:translateY(0)}
.settings-item.hidden{display:none}
.settings-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}

/* MODAL */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:500;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.overlay.open{display:flex}
.modal{background:var(--bg1);border:1px solid var(--border2);border-radius:16px;width:700px;max-width:96vw;max-height:92vh;overflow-y:auto;box-shadow:0 24px 80px rgba(0,0,0,.5);animation:mIn .24s cubic-bezier(.4,0,.2,1)}
@keyframes mIn{from{opacity:0;transform:scale(.95) translateY(-10px)}to{opacity:1;transform:none}}
.modal-top{padding:18px 22px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--bg1);z-index:10;border-radius:16px 16px 0 0}
.modal-top h2{font-size:17px;font-weight:700}
.modal-x{background:var(--bg3);border:none;width:28px;height:28px;border-radius:7px;cursor:pointer;color:var(--text2);font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .15s}
.modal-x:hover{background:var(--red-dim);color:var(--red)}
.modal-body{padding:22px}

/* Custom Confirm Modal */
.custom-confirm-overlay{opacity:0;transition:opacity .25s ease}
.custom-confirm-overlay.open{opacity:1}
.confirm-modal{transform:scale(.9) translateY(15px);opacity:0;transition:all .3s cubic-bezier(.34,1.56,.64,1)}
.custom-confirm-overlay.open .confirm-modal{transform:scale(1) translateY(0);opacity:1}

/* PROFILE MODAL */
.prof-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:10px;margin-bottom:18px}
.prof-card{background:var(--bg2);border:1.5px solid var(--border);border-radius:var(--r);padding:16px 14px;cursor:pointer;transition:all .2s;position:relative}
.prof-card:hover{border-color:var(--border2);background:var(--bg3)}
.prof-card.sel{border-color:var(--blue);background:var(--blue-dim)}
.prof-av{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--blue),var(--purple));display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;margin-bottom:9px}
.prof-name{font-size:13.5px;font-weight:700}
.prof-meta{font-size:11px;color:var(--text3);margin-top:2px}
.prof-del{position:absolute;top:9px;right:9px;background:transparent;border:none;cursor:pointer;color:var(--text3);transition:color .15s;font-size:13px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:5px}
.prof-del:hover{color:var(--red);background:var(--red-dim)}
.prof-edit{margin-top:9px;width:100%;padding:5px;background:transparent;border:1px solid var(--border2);border-radius:6px;font-size:11.5px;cursor:pointer;color:var(--text2);font-family:'Outfit',sans-serif;transition:all .15s}
.prof-edit:hover{border-color:var(--blue);color:var(--blue)}
.btn-add-prof{width:100%;padding:13px;background:var(--bg2);border:2px dashed var(--border2);border-radius:var(--r);font-family:'Outfit',sans-serif;font-size:13.5px;cursor:pointer;color:var(--text2);display:flex;align-items:center;justify-content:center;gap:7px;transition:all .2s;margin-bottom:18px}
.btn-add-prof:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-dim)}

/* PROFILE FORM */
.pf-form{background:var(--bg2);border:1px solid var(--border2);border-radius:var(--r);padding:20px;display:none;margin-bottom:18px}
.pf-form.open{display:block}
.pf-form h3{font-size:15px;font-weight:700;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.pf-fg{display:flex;flex-direction:column;gap:5px}
.pf-fg.full{grid-column:1/-1}
.pf-label{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--text3);font-family:'JetBrains Mono',monospace}
.pf-input,.pf-select{background:var(--bg3);border:1.5px solid var(--border2);border-radius:var(--rsm);padding:9px 12px;font-family:'Outfit',sans-serif;font-size:13.5px;color:var(--text1);outline:none;transition:border-color .2s;width:100%}
.pf-input:focus,.pf-select:focus{border-color:var(--blue)}
.pf-input::placeholder{color:var(--text3)}
.pf-select option{background:var(--bg3);color:var(--text1)}
.kl-notice{padding:9px 13px;background:var(--amber-dim);border:1px solid rgba(251,191,36,.2);border-radius:var(--rsm);font-size:12px;color:var(--amber);margin-bottom:12px;display:none;line-height:1.5}
.kl-notice.show{display:block}

/* FAECHER */
.fach-section{margin-top:14px}
.fach-cats{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}
.fcat-btn{padding:4px 11px;background:var(--bg3);border:1px solid var(--border2);border-radius:18px;font-size:12px;color:var(--text2);cursor:pointer;transition:all .15s;font-weight:500;font-family:'Outfit',sans-serif}
.fcat-btn.act{background:var(--blue-dim);border-color:rgba(79,142,247,.4);color:var(--blue)}
.preset-grid{display:flex;flex-wrap:wrap;gap:5px;padding:12px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--rsm);margin-bottom:8px;max-height:190px;overflow-y:auto}
.preset-btn{padding:4px 11px;background:var(--bg4);border:1px solid var(--border2);border-radius:18px;font-size:12px;color:var(--text2);cursor:pointer;transition:all .15s;font-family:'Outfit',sans-serif}
.preset-btn:hover{border-color:var(--blue);color:var(--blue)}
.preset-btn.picked{background:var(--blue-dim);border-color:rgba(79,142,247,.5);color:var(--blue);font-weight:600}
.subject-menu{display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:8px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--rsm);margin-bottom:8px;max-height:170px;overflow-y:auto}
.sub-item{display:flex;align-items:center;justify-content:flex-start;gap:9px;width:100%;min-height:40px;padding:8px 10px;border-radius:9px;border:1px solid var(--border2);background:var(--bg2);cursor:pointer;transition:all .16s;color:var(--text2);font-size:12.5px}
.sub-item:hover{border-color:rgba(79,142,247,.45);color:var(--text1);transform:translateY(-1px)}
.sub-item.active{border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.08);color:#dffaf2}
.sub-check{width:18px;height:18px;border-radius:50%;border:1px solid var(--border2);display:inline-flex;align-items:center;justify-content:center;font-size:11px;color:transparent;transition:all .16s;flex-shrink:0}
.sub-item.active .sub-check{background:linear-gradient(135deg,#10b981,#34d399);border-color:rgba(52,211,153,.65);color:#fff}
.sub-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sub-badge{font-size:10px;padding:2px 7px;border-radius:999px;border:1px solid var(--border2);color:var(--text3)}
.sub-item{font-family:'Outfit',sans-serif}
.lp-topic-menu{background:linear-gradient(180deg,rgba(16,185,129,.06),rgba(79,142,247,.04));border-color:rgba(79,142,247,.25)}
.lp-topic-menu .sub-item{padding:10px 12px}
.lp-topic-menu .sub-item.active{border-color:rgba(79,142,247,.58);background:rgba(79,142,247,.16);color:#e5f0ff}
.lp-topic-menu .sub-item.active .sub-check{background:linear-gradient(135deg,var(--blue2),var(--blue));border-color:rgba(79,142,247,.65)}
.lp-topic-menu .sub-badge{color:#cfe1ff;border-color:rgba(79,142,247,.38);background:rgba(79,142,247,.14)}

.lernzettel-card{background:linear-gradient(180deg,rgba(19,22,30,.98),rgba(15,18,26,.98));border:1px solid rgba(16,185,129,.25);box-shadow:0 10px 28px rgba(0,0,0,.2)}
.lernzettel-card h3{font-size:20px;margin-bottom:14px;background:linear-gradient(135deg,#e9fdf6,#a6f4d6 55%,#7ed9ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.lz-block{margin-bottom:12px;padding:11px;border:1px solid var(--border);border-radius:10px;background:var(--bg2)}
.lz-block h4{font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:#86efac;margin-bottom:8px;font-family:'JetBrains Mono',monospace}
.lz-block ul{margin:0;padding-left:18px}
.lz-block li{margin:5px 0;color:var(--text1);line-height:1.55;font-size:13px}
.sel-label{font-size:10.5px;color:var(--text3);margin-bottom:6px;font-family:'JetBrains Mono',monospace;letter-spacing:.06em;text-transform:uppercase}
.sel-chips{display:flex;flex-wrap:wrap;gap:5px;min-height:34px;padding:7px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--rsm);margin-bottom:8px}
.sch{display:flex;align-items:center;gap:4px;padding:3px 9px;background:var(--bg4);border:1px solid var(--border2);border-radius:18px;font-size:12px;color:var(--text1)}
.sch.lk{background:var(--red-dim);border-color:rgba(248,113,113,.3);color:var(--red)}
.sch.p{background:var(--blue-dim);border-color:rgba(79,142,247,.3);color:var(--blue)}
.sch-type-sel{background:transparent;border:none;font-size:9.5px;color:inherit;cursor:pointer;padding:0;font-family:'JetBrains Mono',monospace;opacity:.7}
.sch button{background:transparent;border:none;cursor:pointer;color:var(--text3);font-size:12px;padding:0;line-height:1;transition:color .15s}
.sch button:hover{color:var(--red)}
.custom-fach-row{display:flex;gap:7px}
.cf-input{flex:1;background:var(--bg3);border:1.5px solid var(--border2);border-radius:var(--rsm);padding:8px 11px;font-family:'Outfit',sans-serif;font-size:13px;color:var(--text1);outline:none;transition:border-color .2s}
.cf-input:focus{border-color:var(--blue)}
.cf-input::placeholder{color:var(--text3)}
.cf-type{background:var(--bg3);border:1.5px solid var(--border2);border-radius:var(--rsm);padding:8px 9px;font-family:'Outfit',sans-serif;font-size:13px;color:var(--text1);outline:none}
.btn-cf{background:var(--blue-dim);border:1px solid rgba(79,142,247,.3);border-radius:var(--rsm);padding:8px 13px;font-size:13px;color:var(--blue);cursor:pointer;font-family:'Outfit',sans-serif;font-weight:600;transition:all .15s;white-space:nowrap}
.btn-cf:hover{background:var(--blue);color:#fff}

/* ABITUR LERNEN */
.abi-learn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.abi-card{display:flex;flex-direction:column;gap:10px}
.abi-card-result{margin-top:10px}
.abi-inline-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:8px}
.abi-question-box{background:var(--bg2);border:1px solid var(--border2);border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.55;min-height:70px;white-space:pre-wrap}
.abi-exam-session{display:flex;flex-direction:column;gap:8px;margin-top:6px;max-height:360px;overflow:auto}
.abi-exam-answer{margin-top:8px}

/* ABITUR LERNEN MENÜ */
.abi-menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:20px}
.abi-menu-card{background:var(--bg1);border:1px solid var(--border);border-radius:16px;padding:28px 20px;text-align:center;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 24px rgba(0,0,0,.12);display:flex;flex-direction:column;align-items:center}
.abi-menu-card:hover{transform:translateY(-4px);border-color:rgba(79,142,247,.5);box-shadow:0 16px 32px rgba(79,142,247,.15);background:linear-gradient(180deg,var(--bg2),var(--bg1))}
.abi-menu-icon{font-size:38px;margin-bottom:18px;background:var(--bg3);width:76px;height:76px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--border2);transition:transform .3s ease;box-shadow:0 8px 16px rgba(0,0,0,.1)}
.abi-menu-card:hover .abi-menu-icon{transform:scale(1.1) rotate(4deg);border-color:rgba(79,142,247,.4);background:var(--blue-dim)}
.abi-menu-card h3{font-size:18px;margin-bottom:10px;color:var(--text1)}
.abi-menu-card p{font-size:13.5px;color:var(--text2);line-height:1.55;margin-bottom:24px;flex:1}
.abi-menu-card .doc-btn{width:100%;padding:12px;font-size:14px;font-weight:600;background:var(--bg3);transition:all .2s;border-radius:10px}
.abi-menu-card:hover .doc-btn{background:linear-gradient(135deg,var(--blue2),var(--blue));color:#fff;border-color:var(--blue);box-shadow:0 4px 12px var(--blue-glow)}

/* STUNDENPLAN */
.sp-table{border:1px solid var(--border);border-radius:var(--rsm);overflow:hidden;margin-top:7px}
.sp-hrow{display:grid;grid-template-columns:62px 1fr}
.sp-head{background:var(--bg3);padding:7px 11px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text3);font-family:'JetBrains Mono',monospace}
.sp-drow{display:grid;grid-template-columns:62px 1fr}
.sp-day{background:var(--bg3);padding:8px 11px;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--text2);display:flex;align-items:center;border-bottom:1px solid var(--border);letter-spacing:.05em}
.sp-inp{background:var(--bg2);border:none;border-bottom:1px solid var(--border);border-left:1px solid var(--border);padding:8px 11px;font-family:'Outfit',sans-serif;font-size:13px;color:var(--text1);outline:none;width:100%}
.sp-inp:focus{background:var(--bg3)}
.sp-inp::placeholder{color:var(--text3)}
.sp-drow:last-child .sp-day,.sp-drow:last-child .sp-inp{border-bottom:none}

.pf-btns{display:flex;gap:9px;margin-top:18px;justify-content:flex-end}
.btn-cancel{background:var(--bg3);border:1px solid var(--border2);color:var(--text2);padding:8px 18px;border-radius:var(--rsm);font-family:'Outfit',sans-serif;font-size:13px;cursor:pointer;transition:all .15s}
.btn-cancel:hover{border-color:var(--text2);color:var(--text1)}
.btn-save{background:linear-gradient(135deg,var(--blue2),var(--blue));border:none;color:#fff;padding:8px 22px;border-radius:var(--rsm);font-family:'Outfit',sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .18s}
.btn-save:hover{transform:translateY(-1px);box-shadow:0 4px 12px var(--blue-glow)}

.toast{position:fixed;bottom:22px;right:22px;padding:11px 16px;background:var(--bg2);border:1px solid var(--green);border-radius:9px;font-size:13px;color:var(--green);z-index:9999;animation:tIn .22s ease;box-shadow:0 8px 24px rgba(0,0,0,.3)}
.toast.err{border-color:var(--red);color:var(--red)}
@keyframes tIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:18px;font-size:9.5px;font-weight:600;font-family:'JetBrains Mono',monospace;letter-spacing:.04em}
/* Einheitliche Schrift */
*, *::before, *::after, html, body, input, button, textarea, select { font-family: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important; }
.blk{background:var(--red-dim);color:var(--red);border:1px solid rgba(248,113,113,.2)}
.bgk{background:var(--bg4);color:var(--text3);border:1px solid var(--border)}
.bpx{background:var(--blue-dim);color:var(--blue);border:1px solid rgba(79,142,247,.2)}

.panel.active .tools-hero,.panel.active .tools-card,.panel.active .lp-card,.panel.active .lp-hero{animation:fadeSlideIn .34s ease both}
@keyframes fadeSlideIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes logoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes activePulse{0%,100%{box-shadow:0 10px 18px rgba(79,142,247,.12)}50%{box-shadow:0 14px 24px rgba(79,142,247,.24)}}
@keyframes chatItemIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* THEMES */
body.theme-light{
  --bg0:#f3f6fb;--bg1:#ffffff;--bg2:#eef2f8;--bg3:#e7ecf4;--bg4:#d9e0eb;
  --border:rgba(24,36,58,.12);--border2:rgba(24,36,58,.2);
  --text1:#162238;--text2:#4b5a75;--text3:#6d7a92;
  --blue-dim:rgba(79,142,247,.18);
  --green-dim:rgba(16,185,129,.12);
  --amber-dim:rgba(251,191,36,.16);
  --red-dim:rgba(248,113,113,.14);
}
body.theme-light .main{background:var(--bg0)}
body.theme-light .lsb{background:#f8fbff;border-right-color:rgba(24,36,58,.14)}
body.theme-light .lsb-logo{border-bottom-color:rgba(24,36,58,.12)}
body.theme-light .logo-label{background:none;color:#284062}
body.theme-light .logo-sub{color:#5f7391}
body.theme-light .chat-item{border-color:transparent}
body.theme-light .chat-item:hover{background:#edf3fb;border-color:rgba(79,142,247,.34);box-shadow:0 8px 18px rgba(27,55,97,.10)}
body.theme-light .chat-item.active{background:rgba(79,142,247,.20);border-color:rgba(79,142,247,.48);box-shadow:0 10px 20px rgba(79,142,247,.18)}
body.theme-light .ci-name{color:#1d2f4b}
body.theme-light .ci-prev{color:#647896}

body.theme-light .topbar{
  background:#ffffff;
  border-bottom-color:rgba(24,36,58,.14);
  box-shadow:0 2px 10px rgba(22,34,56,.06);
}
body.theme-light .topbar-title{color:#12243f}
body.theme-light .topbar-sub{color:#5f7391}
body.theme-light .tab-pills{background:#f2f6fc;border-color:rgba(24,36,58,.16);box-shadow:none}
body.theme-light .tab-pill{color:#425777}
body.theme-light .tab-pill:hover{color:#1b3355;background:rgba(79,142,247,.10)}
body.theme-light .tab-pill.active{color:#14325a;background:rgba(79,142,247,.20);box-shadow:inset 0 0 0 1px rgba(79,142,247,.45)}
body.theme-light .icon-btn{background:#f2f6fc;color:#3f5474;border-color:rgba(24,36,58,.18)}
body.theme-light .icon-btn:hover{color:#18345d;background:rgba(79,142,247,.14);border-color:rgba(79,142,247,.45)}

body.theme-light .api-health{font-weight:700}
body.theme-light .api-health.ok{color:#0b8a68;background:rgba(16,185,129,.18)}
body.theme-light .api-health.err{color:#bf3e3e;background:rgba(248,113,113,.18)}
body.theme-light .api-health.checking{color:#a06a10;background:rgba(251,191,36,.2)}

body.theme-light .chat-body{
  background:#f6f9fe;
}
body.theme-light .msg-meta{color:#5d7392}
body.theme-light .msg.ai .bubble{
  background:#ffffff;
  border-color:rgba(24,36,58,.18);
  color:#1c2f4a;
}
body.theme-light .msg.user .bubble{
  background:linear-gradient(135deg,#3f80f4,#356fe0);
}
body.theme-light .chat-input-area{
  background:#f8fbff;
  border-top-color:rgba(24,36,58,.14);
}
body.theme-light .chat-tf{
  background:#ffffff;
  border-color:rgba(24,36,58,.22);
  color:#1a2d49;
}
body.theme-light .chat-tf::placeholder{color:#7086a6}
body.theme-light .btn-attach{
  background:#ffffff;
  border-color:rgba(24,36,58,.2);
  color:#4f6485;
}
body.theme-light .qchip{
  background:#ffffff;
  border-color:rgba(24,36,58,.2);
  color:#38506f;
  font-weight:600;
}
body.theme-light .qchip:hover{background:rgba(79,142,247,.14);border-color:rgba(79,142,247,.45);color:#1e3a63}
body.theme-light .empty-chat h3{color:#203450}
body.theme-light .empty-chat p{color:#5f7391}

body.theme-light .lp-card,
body.theme-light .tools-card,
body.theme-light .lp-side-card{
  background:#ffffff;
  border-color:rgba(24,36,58,.16);
  box-shadow:0 8px 20px rgba(22,34,56,.06);
}
body.theme-light .lp-side-card + .lp-side-card{
  background:#f8fbff;
  border-color:rgba(79,142,247,.25);
}
body.theme-light .lp-input,
body.theme-light .lp-select,
body.theme-light .lp-textarea{
  background:#ffffff;
  border-color:rgba(24,36,58,.22);
  color:#1a2d49;
}
body.theme-light .lp-input::placeholder,
body.theme-light .lp-textarea::placeholder{color:#7086a6}

body.theme-light .bottom-dock-track{
  background:#ffffff;
  border-color:rgba(24,36,58,.18);
  box-shadow:0 14px 28px rgba(22,34,56,.12);
}
body.theme-light .dock-pill{color:#3f5474}
body.theme-light .dock-pill.active{color:#17365f;background:rgba(79,142,247,.18)}
body.reduce-motion *{animation:none !important;transition:none !important}
body.ui-large{font-size:17px}
body.ui-large .topbar-title{font-size:21px}
body.ui-large .tab-pill{font-size:14px}
body.ui-large .chat-tf,body.ui-large .lp-input,body.ui-large .lp-select,body.ui-large .lp-textarea{font-size:15px}
body.compact-ui .topbar{padding:12px 18px}
body.compact-ui .chat-body{padding:12px}
body.compact-ui .chat-input-area{padding:8px 12px}
body.compact-ui .tools-body,body.compact-ui .lp-body{padding:12px}
body.compact-ui .tools-card,body.compact-ui .lp-card{padding:10px}
body.compact-ui .welcome{padding:24px;gap:12px}
body.compact-ui .welcome h1{font-size:26px}
body.dock-hidden .bottom-dock{display:none}
body.dock-hidden .main{padding-bottom:16px}
body.quickchips-hidden .quick-chips{display:none}
body.quickchips-hidden .chat-input-area{padding-top:8px}

/* TABLET / IPAD VIEW (bis 1024px) */
@media(max-width:1024px){
  .lp-layout{grid-template-columns:1fr;gap:16px}
  .lp-side{position:static;display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .tools-grid{grid-template-columns:1fr}
  .abi-learn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .settings-modal{width:90vw}
  .ai-studio-grid{grid-template-columns:1fr}
}

/* HANDY / MOBILE VIEW (bis 768px) */
@media(max-width:768px){
  :root{--sbw:0px}
  .topbar{padding:12px 14px}
  .topbar-title{font-size:17px}
  .api-health{display:none}
  .tab-pills{padding:4px;gap:4px}
  .tab-pill{padding:7px 11px;font-size:12px}
  
  /* Sidebar Overlay */
  .lsb{position:fixed;top:0;left:0;height:100%;z-index:300;transition:transform .3s cubic-bezier(.4,0,.2,1);width:260px;transform:translateX(-100%)}
  .lsb:not(.collapsed){transform:translateX(0);box-shadow:0 0 40px rgba(0,0,0,.5)}
  .toggle-sb{left:0;border-left:1px solid var(--border2);z-index:301;transition:transform .3s cubic-bezier(.4,0,.2,1),background .2s}
  .lsb:not(.collapsed) ~ .toggle-sb{transform:translateX(260px)}
  
  .pf-grid,.lp-grid{grid-template-columns:1fr}
  .abi-exam-grid{grid-template-columns:1fr}
  .lp-actions-row{display:flex}
  .lp-side{grid-template-columns:1fr}
  .abi-learn-grid{grid-template-columns:1fr}
  .ai-form-row{grid-template-columns:1fr}
  .vocab-actions{grid-template-columns:1fr}
  .vocab-mode-card{flex-direction:column;align-items:flex-start}
  .ai-slide-grid{grid-template-columns:1fr}
  .tools-bottom{grid-template-columns:1fr}
  .main{padding-bottom:92px}
  .bottom-dock{left:50%;right:auto;bottom:8px;transform:translateX(-50%);width:calc(100% - 16px);max-width:400px}
  .bottom-dock-track{padding:7px 8px;gap:6px;width:100%;justify-content:space-between}
  .dock-pill{font-size:12px;padding:8px 10px;flex:1;text-align:center}
  #panel-chat .chat-input-area{margin-bottom:0;padding-bottom:max(env(safe-area-inset-bottom), 12px)}
  .settings-modal{width:calc(100vw - 18px)}
  .settings-layout{grid-template-columns:1fr}
  .settings-sidebar{flex-direction:row;overflow-x:auto;padding-bottom:4px}
  .settings-nav{white-space:nowrap}
  .modal{max-width:calc(100vw - 20px);max-height:calc(100vh - 20px)}
  #modal-auth .modal{width:92%;padding:24px 16px}
  .welcome h1{font-size:24px}
  .welcome p{font-size:13px}
  .chat-body{padding:12px 12px 280px 12px}
  .bubble{max-width:88%}
  
  /* Dim Background for Mobile Sidebar */
  body::after {
    content: ''; position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 290;
    opacity: 0; pointer-events: none; transition: opacity 0.3s ease; backdrop-filter: blur(2px);
  }
  body.sb-mobile-open::after { opacity: 1; pointer-events: auto; }
}
