/* legalAI Web-Test-Interface — Kanzlei/Editorial.
   Einspaltig, System-Serifen (offline), warmes Papier + Burgund-Akzent. */

:root{
  --paper:#faf8f3; --surface:#fff; --ink:#2b2b2b; --head:#1a1a2e;
  --burg:#7a2e2e; --burg-d:#5e2323; --navy:#2a3f6b;
  --line:#d8cfba; --line-soft:#ece5d6; --muted:#6b6149;
  --sage-bg:#eef2e8; --sage:#3f5a2e; --ox-bg:#f3e7e5; --brass:#b89a5e;
  --serif:'Charter','Iowan Old Style','Palatino Linotype','Palatino',Georgia,'Times New Roman',serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
     font:16px/1.7 var(--serif);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.lbl{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted)}

/* ---- Header ---- */
header{position:sticky;top:0;z-index:5;padding:16px 24px 13px;background:var(--paper);
       border-bottom:1px solid var(--line)}
header .wm{display:flex;align-items:baseline;gap:11px;max-width:760px;margin:0 auto;flex-wrap:wrap}
header h1{margin:0;font-size:23px;font-weight:600;color:var(--head);letter-spacing:.2px}
header h1 b{color:var(--burg);font-weight:600}
header .sub{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted)}
header .rule{max-width:760px;margin:9px auto 0;height:2px;width:34px;background:var(--burg)}
header .wm a{margin-left:auto;font-size:12px;color:var(--navy);text-decoration:none;border-bottom:1px solid #c7cfe0}
header .wm a:hover{border-bottom-color:var(--navy)}

/* ---- Chat ---- */
main#chat{max-width:760px;margin:0 auto;padding:26px 24px 110px}
.msg{margin:0}
.msg.user{text-align:right;font-style:italic;color:#6a6a6a;font-size:15px;margin:26px 0 12px}
.msg.user::before{content:'— ';color:var(--line)}
.msg.assistant{margin:0 0 34px}

/* ---- Antwort ---- */
.answer{background:var(--surface);border:1px solid var(--line-soft);border-left:3px solid var(--burg);
        border-radius:4px;padding:16px 19px;box-shadow:0 1px 0 #efe9da;white-space:pre-wrap}
.answer.typing::after{content:'▍';color:var(--burg);animation:blink 1s steps(2) infinite;margin-left:1px}
@keyframes blink{50%{opacity:0}}
.answer.refusal{background:var(--ox-bg);border-left-color:var(--burg);border-color:#e9d6d2}
.answer p{margin:0 0 10px}.answer p:last-child{margin:0}
.answer .grund{font-size:13px;color:var(--muted);font-style:italic}
.cite{color:var(--burg);border-bottom:1px solid #d6b9b3;white-space:nowrap}
.unbelegt{margin-top:10px;font-size:13px;color:var(--burg);font-style:italic}

/* ---- Quellen ---- */
.src-h{margin:18px 0 6px}
.sources{display:flex;flex-direction:column}
details.src{border-bottom:1px solid var(--line-soft);padding:8px 2px}
details.src summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:baseline}
details.src summary::-webkit-details-marker{display:none}
.src .num{color:var(--burg);font-size:13px;min-width:22px}
.src .sp{font-weight:600;color:var(--head)} .src .sg{color:var(--head)}
.src .head-line{flex:1}
.src a{color:var(--navy);text-decoration:none;border-bottom:1px solid #c7cfe0}
.src a:hover{border-bottom-color:var(--navy)}
.src .st{color:#6a6a6a;font-style:italic}
.src.uncited{opacity:.5}.src.uncited:hover{opacity:.85}
.src .zit{font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:var(--burg);font-weight:600;white-space:nowrap}
.src .chev{color:var(--muted);transition:transform .15s;font-size:11px}
details.src[open] .chev{transform:rotate(90deg)}
.src .body{margin:8px 0 2px 30px;padding-left:12px;border-left:1px solid var(--line-soft);
           font-size:14px;color:#4a4a4a;white-space:pre-wrap}
.pill{font-size:10px;letter-spacing:.6px;text-transform:uppercase;padding:1px 7px;border-radius:9px;
      background:var(--sage-bg);color:var(--sage);white-space:nowrap}
.pill.bad{background:var(--ox-bg);color:var(--burg)}

/* ---- Auswertung ---- */
.ev{margin:16px 0 0;border-top:1px solid var(--line);padding-top:11px}
.ev .top{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ev .tot{font-size:14px;color:var(--head)} .ev .tot b{color:var(--burg)}
.ev .tot.run{color:var(--muted)}
.stages{display:flex;flex-direction:column;gap:5px;margin-top:10px}
.stg{display:grid;grid-template-columns:78px 1fr 70px;align-items:center;gap:9px;font-size:12.5px;color:#555}
.stg .nm{color:var(--head)}
.stg .track{height:4px;background:var(--line-soft);border-radius:2px;overflow:hidden}
.stg .track i{display:block;height:100%;width:0;background:var(--burg);border-radius:2px;transition:width .25s}
.stg .ms{text-align:right;font-variant-numeric:tabular-nums;color:#555}
.stg.run .nm::after{content:' ⏳'}
.stg.run .track i{background:var(--navy);width:60%;animation:pulse 1.1s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.45}50%{opacity:1}}
.stg.done .nm::after{content:' ✓';color:var(--sage)}
.stg.wait{opacity:.45}.stg.wait .ms{color:var(--muted)}

details.more{margin-top:10px}
details.more summary{cursor:pointer;list-style:none;font-size:12px;color:var(--navy)}
details.more summary::-webkit-details-marker{display:none}
details.more summary::before{content:'▸ ';color:var(--muted)}
details.more[open] summary::before{content:'▾ '}
table.full{width:100%;border-collapse:collapse;font-size:12px;margin-top:8px}
table.full th,table.full td{border-bottom:1px solid var(--line-soft);padding:3px 6px;
     text-align:right;font-variant-numeric:tabular-nums}
table.full th:first-child,table.full td:first-child{text-align:left}
table.full th{color:var(--muted);font-weight:600;font-size:10px;letter-spacing:.8px;text-transform:uppercase}

/* ---- Präzisieren (Phase 2) ---- */
details.refine{margin:10px 0 0;border-top:1px solid var(--line-soft);padding-top:8px}
details.refine>summary{cursor:pointer;list-style:none;font-size:13px;color:var(--navy)}
details.refine>summary::-webkit-details-marker{display:none}
details.refine>summary::before{content:'▸ ';color:var(--muted)}
details.refine[open]>summary::before{content:'▾ '}
.refine-body{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.reform{display:grid;grid-template-columns:auto auto 1fr;align-items:start;gap:8px;
        background:var(--surface);border:1px solid var(--line-soft);border-radius:6px;padding:8px 10px}
.reform .tag{font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:var(--burg);
             font-weight:600;padding-top:3px}
.reform textarea{grid-column:3;font:14px/1.5 var(--serif);border:1px solid var(--line);
                 border-radius:5px;padding:6px 8px;background:var(--paper);color:var(--ink);resize:vertical}
.reform .meta{grid-column:3;font-size:11px;color:var(--muted)}
.refine-go{align-self:flex-end;font:600 13px/1 var(--serif);padding:8px 16px;border:0;
           border-radius:6px;background:var(--burg);color:#fff;cursor:pointer}
.refine-go:hover{background:var(--burg-d)}
.verfeinert{font-size:11px;letter-spacing:.6px;text-transform:uppercase;color:var(--burg);
            font-weight:600;margin-bottom:6px}

/* ---- Eingabe ---- */
form{position:sticky;bottom:0;z-index:5;padding:14px 24px 22px;
     background:linear-gradient(transparent,var(--paper) 24%)}
form .row{max-width:760px;margin:0 auto;display:flex;gap:10px;align-items:flex-end}
textarea{flex:1;font:15px/1.6 var(--serif);padding:11px 13px;border:1px solid var(--line);
         border-radius:6px;background:var(--surface);color:var(--ink);resize:vertical}
textarea:focus{outline:none;border-color:var(--burg);box-shadow:0 0 0 3px rgba(122,46,46,.08)}
button{font:600 14px/1 var(--serif);padding:0 22px;height:42px;border:0;border-radius:6px;
       background:var(--burg);color:#fff;cursor:pointer;letter-spacing:.3px}
button:hover{background:var(--burg-d)}
button:disabled{opacity:.5;cursor:default}

/* ---- Demo-Banner + Block-Notice ---- */
.demo-banner{background:#3a2f28;color:#f0e6da;font-size:.8rem;text-align:center;padding:.4rem .8rem;letter-spacing:.02em}
.notice{background:#f6efe6;border:1px solid #d8c9b4;color:#3a2f28;padding:.7rem 1rem;border-radius:6px;margin:.6rem 0}

/* ---- Editorial Hero (Empty-State) ---- */
.hero{max-width:760px;margin:14px auto 0;padding:6px 2px 4px}
.hero-claim{margin:0;font-size:27px;font-weight:600;color:var(--head);letter-spacing:.2px;line-height:1.25}
.hero-rule{height:2px;width:34px;background:var(--burg);margin:11px 0 18px}
.hero-lbl{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.hero-ex{display:block;width:100%;text-align:left;font:15px/1.5 var(--serif);color:var(--ink);
  background:var(--surface);border:1px solid var(--line-soft);border-radius:7px;padding:11px 14px;
  margin-bottom:9px;cursor:pointer;transition:border-color .12s,background .12s}
.hero-ex:hover{border-color:var(--brass);background:#fffdf8}
.hero-ex .ex-ic{color:var(--burg);font-weight:600;margin-right:4px}
.hero-trust{font-size:12px;color:var(--muted);margin-top:14px;line-height:1.5}

/* ---- Public: Verifikations-Strip + Siegel ---- */
.vstrip{display:flex;align-items:center;gap:10px;margin-top:2px}
.vsteps{display:flex;flex-wrap:wrap;gap:6px}
.vstep{font-size:11px;color:#6a6a6a;background:var(--surface);border:1px solid var(--line-soft);
  border-radius:20px;padding:2px 10px}
.vstep.ok{border-color:#cfe0c2;color:var(--sage)}
.vtime{margin-left:auto;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.vseal{margin-top:11px;font-size:12.5px;color:var(--sage);font-style:italic}

/* ---- Zeichen-Zähler ---- */
.cbar{max-width:760px;margin:5px auto 0;text-align:right;font-size:11px;color:var(--muted);letter-spacing:.2px}
.cbar.over{color:var(--burg);font-weight:600}

/* ---- A11y: sichtbarer Tastatur-Fokus ---- */
a:focus-visible,button:focus-visible,summary:focus-visible,.hero-ex:focus-visible,
details>summary:focus-visible,textarea:focus-visible{
  outline:2px solid var(--burg);outline-offset:2px;border-radius:3px}
@media (prefers-reduced-motion: reduce){
  .answer.typing::after{animation:none}
  .stg.run .track i{animation:none;width:60%}
}

/* ---- Mobile ---- */
@media (max-width:640px){
  body{font-size:15px}
  header{padding:13px 16px 11px}
  header h1{font-size:20px}
  main#chat{padding:20px 16px 96px}
  .hero-claim{font-size:22px}
  form{padding:11px 16px 18px}
  .stg{grid-template-columns:64px 1fr 50px}
  .reform{grid-template-columns:auto 1fr}
  .reform .tag{grid-column:1}
  table.full{font-size:11px}
}

/* ---- Frage-Optimierung (Public-Einzelfeld) ---- */
.refine-ta{width:100%;font:14px/1.5 var(--serif);border:1px solid var(--line);border-radius:5px;
  padding:7px 9px;background:var(--paper);color:var(--ink);resize:vertical}

/* ---- Korpus-Übersicht (Hero, #16) ---- */
details.corpus{margin:16px 0 0;border-top:1px solid var(--line-soft);padding-top:10px}
details.corpus>summary{cursor:pointer;list-style:none;font-size:12px;letter-spacing:.4px;color:var(--navy)}
details.corpus>summary::-webkit-details-marker{display:none}
details.corpus>summary::before{content:'▸ ';color:var(--muted)}
details.corpus[open]>summary::before{content:'▾ '}
.corpus-body{margin-top:10px}
details.corpus-cat{border-bottom:1px solid var(--line-soft);padding:5px 0}
details.corpus-cat>summary{cursor:pointer;list-style:none;font-size:12px;color:var(--head);font-weight:600}
details.corpus-cat>summary::-webkit-details-marker{display:none}
details.corpus-cat>summary::before{content:'▸ ';color:var(--muted)}
details.corpus-cat[open]>summary::before{content:'▾ '}
.corpus-law{font-size:12.5px;color:#555;padding:3px 0 3px 18px}
.corpus-law a{color:var(--burg);text-decoration:none;border-bottom:1px solid #d6b9b3;font-weight:600}
.corpus-law a:hover{border-bottom-color:var(--burg)}

/* ---- Modus-Umschalter + OGH-Rechtssatz-Suche (#17) ---- */
.modes{max-width:760px;margin:0 auto 8px;display:flex}
.mode{font:600 12px/1 var(--serif);padding:8px 14px;border:1px solid var(--line);background:var(--surface);
  color:var(--muted);cursor:pointer;letter-spacing:.2px}
.mode:first-child{border-radius:6px 0 0 6px;border-right:0}
.mode:last-child{border-radius:0 6px 6px 0}
.mode.on{background:var(--burg);color:#fff;border-color:var(--burg)}
.courts{max-width:760px;margin:-2px auto 8px;display:flex;justify-content:center}
.court{font:600 11px/1 var(--serif);padding:6px 16px;border:1px solid var(--line);background:var(--surface);
  color:var(--muted);cursor:pointer;letter-spacing:.2px}
.court:first-child{border-radius:6px 0 0 6px;border-right:0}
.court:last-child{border-radius:0 6px 6px 0}
.court.on{background:var(--burg);color:#fff;border-color:var(--burg)}
.rs-intro{max-width:760px;margin:0 auto;font-size:13px;color:var(--muted);font-style:italic;padding:6px 0 8px}
.rs-status,.rs-empty{max-width:760px;margin:0 auto;color:var(--muted);font-style:italic;padding:6px 0}
.rs-count{max-width:760px;margin:0 auto;font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);padding:4px 0}
.rs-card{max-width:760px;margin:0 auto 12px;background:var(--surface);border:1px solid var(--line-soft);
  border-left:3px solid var(--navy);border-radius:4px;padding:11px 14px;box-shadow:0 1px 0 #efe9da}
.rs-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.rs-gz{font-weight:600;color:var(--head)}
.rs-date{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.rs-ris{margin-left:auto;font-size:12px;color:var(--navy);text-decoration:none;border-bottom:1px solid #c7cfe0}
.rs-ris:hover{border-bottom-color:var(--navy)}
.rs-norms{font-size:12px;color:var(--burg);margin:5px 0 2px}
.rs-fund{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;margin:2px 0}
.rs-text{font-size:14px;color:#3a3a3a;margin-top:4px;white-space:pre-wrap}

/* ---- Feedback-Strip (#24) ---- */
.fb{margin-top:12px;border-top:1px solid var(--line-soft);padding-top:9px;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.fb-q{font-size:12.5px;color:var(--muted);font-style:italic}
.fb-btn{font:15px/1 var(--serif);height:30px;padding:0 11px;border:1px solid var(--line);
  border-radius:20px;background:var(--surface);color:var(--ink);cursor:pointer}
.fb-btn:hover:not(:disabled){border-color:var(--brass);background:#fffdf8}
.fb-btn.chosen{border-color:var(--burg);background:var(--ox-bg)}
.fb-btn:disabled:not(.chosen){opacity:.45}
.fb-detail{flex-basis:100%;display:flex;gap:8px;align-items:flex-end;margin-top:4px}
.fb-ta{flex:1;font:14px/1.5 var(--serif);border:1px solid var(--line);border-radius:5px;
  padding:7px 9px;background:var(--paper);color:var(--ink);resize:vertical}
.fb-send{font:600 12px/1 var(--serif);height:34px;padding:0 14px;border:0;border-radius:6px;
  background:var(--burg);color:#fff;cursor:pointer}
.fb-send:hover:not(:disabled){background:var(--burg-d)}
.fb-danke{font-size:12.5px;color:var(--sage);font-style:italic}

/* ---- Subsumtions-Assistent (#20) ---- */
.subsume { margin-top: .75rem; border: 1px solid var(--line, #ddd); border-radius: 8px; padding: .25rem .6rem; }
.subsume-q { font-weight: 600; margin: .5rem 0 .25rem; }
.subsume-opt { padding: .4rem .85rem; height: auto; font: 600 13px/1.35 var(--serif); letter-spacing: 0; border: 1px solid #bbb; border-radius: 999px; background: #fff; color: #1a1a1a; cursor: pointer; text-align: left; }
.subsume-opt:hover:not(:disabled) { border-color: #333; background: #f7f4ef; }
.subsume-opt.chosen { background: #1a1a1a; color: #fff; border-color: #1a1a1a; }
.subsume-opt:disabled:not(.chosen) { opacity: .45; }
.subsume-orient { margin: .6rem 0 .3rem; }
.subsume-belege { font-size: .85em; color: #555; }
.subsume-warn { font-size: .85em; color: #9a3412; background: #fff7ed; border-left: 3px solid #fb923c; padding: .5rem .6rem; border-radius: 4px; }
.subsume-vorlaeufig { margin: .5rem 0 0; font-size: .9em; color: #9a3412; background: #fff7ed;
  border-left: 3px solid #fb923c; padding: .5rem .6rem; border-radius: 4px; cursor: pointer; }
.subsume-vorlaeufig:hover { background: #ffedd5; text-decoration: underline; }
.subsume-vorlaeufig:focus-visible { outline: 2px solid #fb923c; outline-offset: 2px; }
.subsume-lead { font-weight: 600; margin: .25rem 0 .5rem; }
.subsume-cta { margin-top: .5rem; }
.subsume-head { font-size: .85em; color: #666; margin: .25rem 0 0; }
.subsume-cond { margin: .55rem 0; padding-bottom: .55rem; border-bottom: 1px solid #eee; }
.subsume-cond-t { margin: 0 0 .35rem; font: 400 14px/1.4 var(--serif); }
.subsume-tri { display: flex; flex-wrap: wrap; gap: .4rem; }
.subsume-drill { margin: .5rem 0 0 1rem; padding: .4rem .6rem; border-left: 2px solid #ddd;
  background: #faf8f4; border-radius: 4px; }
.subsume-drill-q { margin: 0 0 .35rem; font-size: .92em; }