/* Eğitmen paneli — laptop ekranı için. Mobil hedeflenmiyor. */
:root{
  /* Status paleti (dataviz referansı, sabit; ikon+etiket ile birlikte kullanılır) */
  --st-good:#0ca30c; --st-warn:#fab219; --st-serious:#ec835a; --st-critical:#d03b3b;
  --meter-accent:#2a78d6;
  --meter-track:#e1e0d9;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){ --meter-accent:#3987e5; --meter-track:#2c2c2a; }
}
body{overflow-y:auto}
.shell{max-width:1680px;margin:0 auto;padding:0 20px 40px}

/* Üst bar */
.top{position:sticky;top:0;z-index:20;background:var(--bg);
     border-bottom:1px solid var(--line);padding:12px 0;margin-bottom:18px}
.top .inner{max-width:1680px;margin:0 auto;padding:0 20px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.logo{font-weight:800;letter-spacing:.18em;font-size:.72rem;color:var(--ink-faint)}
.top h1{font-size:1.05rem}
.grow{flex:1}
.codebox{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.5rem;font-weight:700;
         letter-spacing:.2em;padding:4px 12px;background:var(--panel-2);border:1px solid var(--line);border-radius:10px}
.linkrow{display:flex;gap:8px;align-items:center;width:100%;margin-top:4px}
.linkrow{max-width:560px}
.linkrow input{font-family:ui-monospace,monospace;font-size:.82rem;padding:8px 10px}
.linkrow button{padding:8px 14px;font-size:.85rem}
.banner{background:color-mix(in srgb,var(--st-warn) 20%,transparent);border:1px solid var(--st-warn);
        border-radius:8px;padding:6px 12px;font-size:.8rem;font-weight:650}

/* Kart ızgarası — 5 görüşme aynı ekranda */
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
@media (min-width:1500px){ .grid{grid-template-columns:repeat(5,1fr)} }
@media (max-width:1100px){ .grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))} }

.conv{display:flex;flex-direction:column;gap:10px;padding:14px;cursor:pointer;
      border-left:3px solid var(--line);transition:border-color .12s,box-shadow .12s}
.conv:hover{border-color:var(--accent)}
.conv:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.conv.empty{opacity:.55;cursor:default;border-left-color:var(--line)}
.conv[data-risk="critical"]{border-left-color:var(--st-critical)}
.conv[data-risk="high"]{border-left-color:var(--st-serious)}
.conv[data-risk="worsening"]{border-left-color:var(--st-warn)}
.conv[data-risk="normal"]{border-left-color:var(--meter-accent)}
.conv[data-risk="done"]{border-left-color:var(--st-good)}

.chead{display:flex;align-items:flex-start;gap:8px}
.chead .who{flex:1;min-width:0}
.chead .who b{display:block;font-size:.95rem;font-weight:670;line-height:1.25}
.chead .who span{display:block;font-size:.78rem;color:var(--ink-dim);
                 overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.badge{display:inline-flex;align-items:center;gap:5px;font-size:.7rem;font-weight:700;
       padding:3px 8px;border-radius:999px;white-space:nowrap;border:1px solid transparent}
.badge .ic{font-size:.85em;line-height:1}
.badge.critical{background:color-mix(in srgb,var(--st-critical) 16%,transparent);border-color:var(--st-critical)}
.badge.high{background:color-mix(in srgb,var(--st-serious) 18%,transparent);border-color:var(--st-serious)}
.badge.worsening{background:color-mix(in srgb,var(--st-warn) 20%,transparent);border-color:var(--st-warn)}
.badge.normal{background:color-mix(in srgb,var(--meter-accent) 14%,transparent);border-color:var(--meter-accent)}
.badge.done{background:color-mix(in srgb,var(--st-good) 16%,transparent);border-color:var(--st-good)}
.badge.neutral{background:var(--panel-2);border-color:var(--line);color:var(--ink-dim)}

.meta{display:flex;gap:6px;flex-wrap:wrap;font-size:.72rem;color:var(--ink-dim)}
.meta .k{padding:2px 7px;background:var(--panel-2);border:1px solid var(--line);border-radius:6px}

/* Duygu ölçerleri: dolgu şiddeti taşır, etiket + değer her zaman görünür */
.meters{display:grid;gap:6px}
.meter{display:grid;grid-template-columns:78px 1fr 30px;gap:8px;align-items:center;font-size:.72rem}
.meter .lab{color:var(--ink-dim);font-weight:600}
.meter .val{text-align:right;font-variant-numeric:tabular-nums;font-weight:650;color:var(--ink)}
.track{display:block;height:8px;border-radius:999px;background:var(--meter-track);overflow:hidden}
.fill{display:block;height:100%;border-radius:0 4px 4px 0;background:var(--meter-accent);
      box-shadow:inset 0 0 0 1px rgba(0,0,0,.14);transition:width .2s linear}
.fill[data-sev="warn"]{background:var(--st-warn)}
.fill[data-sev="serious"]{background:var(--st-serious)}
.fill[data-sev="critical"]{background:var(--st-critical)}
@media (prefers-reduced-motion:reduce){ .fill{transition:none} }

.quote{font-size:.78rem;line-height:1.4;border-left:2px solid var(--line);padding-left:9px;
       display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.quote b{display:block;font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;
         color:var(--ink-faint);margin-bottom:2px;font-weight:700}
.riskwhy{font-size:.72rem;color:var(--ink-dim)}
.conv button.open{width:100%;padding:9px;font-size:.84rem;background:var(--panel-2);
                  color:var(--ink);border:1px solid var(--line)}
.conv button.open:hover{border-color:var(--accent)}

/* Detay çekmecesi */
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:40}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(760px,94vw);z-index:41;
        background:var(--bg);border-left:1px solid var(--line);
        display:flex;flex-direction:column;box-shadow:-8px 0 32px rgba(0,0,0,.28)}
.drawer header{flex:0 0 auto;padding:14px 20px;border-bottom:1px solid var(--line);
               display:flex;gap:12px;align-items:center;background:var(--panel)}
.drawer header h2{flex:1;margin:0;font-size:1.02rem}
.drawer .body{flex:1 1 auto;overflow-y:auto;padding:18px 20px 28px;display:grid;gap:18px}
.sec{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px}
.sec > h3{margin:0 0 10px;font-size:.76rem;text-transform:uppercase;letter-spacing:.07em;
          color:var(--ink-faint);font-weight:750}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:820px){ .two{grid-template-columns:1fr} }

.colorchip{display:inline-flex;align-items:center;gap:8px;font-weight:650;font-size:.95rem}
.colorchip .sw{width:14px;height:14px;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}

.list{display:grid;gap:7px}
.item{display:flex;gap:9px;align-items:flex-start;font-size:.83rem;line-height:1.4}
.item .tag{flex:0 0 auto;font-size:.66rem;font-weight:700;padding:2px 7px;border-radius:5px;
           border:1px solid var(--line);background:var(--panel-2);color:var(--ink-dim);white-space:nowrap}
.item .tag.on{border-color:var(--st-good);background:color-mix(in srgb,var(--st-good) 15%,transparent);color:var(--ink)}
.item .tag.warn{border-color:var(--st-warn);background:color-mix(in srgb,var(--st-warn) 18%,transparent);color:var(--ink)}
.item .tag.bad{border-color:var(--st-critical);background:color-mix(in srgb,var(--st-critical) 15%,transparent);color:var(--ink)}
.item .txt{flex:1;min-width:0}
.item.dim .txt{color:var(--ink-faint)}

/* Duygu geçmişi: küçük çoklu satırlar, grafik kütüphanesi YOK */
.hist{display:grid;gap:9px}
.histrow{display:grid;grid-template-columns:78px 1fr 40px;gap:8px;align-items:center;font-size:.72rem}
/* Tur başına bir çubuk. flex:1 verilirse az turda çubuklar sayfayı kaplayıp
   tek bir blok gibi okunuyordu; sabit genişlik tur ayrımını geri getiriyor. */
.spark{display:flex;gap:3px;align-items:flex-end;height:32px;
       border-bottom:1px solid var(--line);padding-bottom:1px}
.spark i{display:block;flex:0 0 auto;width:14px;background:var(--meter-accent);
         border-radius:3px 3px 0 0;opacity:.9}
.spark i[data-sev="warn"]{background:var(--st-warn)}
.spark i[data-sev="serious"]{background:var(--st-serious)}
.spark i[data-sev="critical"]{background:var(--st-critical)}

.flow{display:flex;flex-direction:column;gap:9px;max-height:380px;overflow-y:auto;padding-right:4px}
.msg{max-width:88%;padding:9px 12px;border-radius:12px;font-size:.85rem;white-space:pre-wrap}
.msg b{display:block;font-size:.64rem;text-transform:uppercase;letter-spacing:.06em;
       color:var(--ink-faint);margin-bottom:3px;font-weight:750}
.msg.persona{align-self:flex-start;background:var(--panel-2);border:1px solid var(--line)}
.msg.participant{align-self:flex-end;background:color-mix(in srgb,var(--meter-accent) 16%,transparent);
                 border:1px solid color-mix(in srgb,var(--meter-accent) 40%,transparent)}
.notebox{display:flex;gap:8px;margin-top:10px}
.notebox input{flex:1}
.notebox button{flex:0 0 auto}
.note{background:color-mix(in srgb,var(--st-warn) 13%,transparent);border:1px solid var(--st-warn);
      border-radius:9px;padding:8px 11px;font-size:.82rem}
.empty-note{font-size:.82rem;color:var(--ink-faint)}

/* ── Lobi ──────────────────────────────────────────────────────────────── */
.lobby{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:start;
       background:var(--panel);border:1px solid var(--line);border-radius:16px;
       padding:24px;box-shadow:var(--shadow);margin-bottom:18px}
@media (max-width:860px){ .lobby{grid-template-columns:1fr} }
.qrbox{text-align:center}
.qrbox svg{display:block;border-radius:10px;border:1px solid var(--line)}
.qrhint{margin:10px 0 0;font-size:.82rem;color:var(--ink-dim)}
.roster h2{font-size:1.15rem;margin:0 0 2px}
.roster > p.muted{margin:0 0 14px;font-size:.88rem}
.rrow{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:.9rem}
.rrow + .rrow{border-top:1px solid var(--line)}
.rrow .nm{flex:1;min-width:0}
.rrow .nm b{display:block;font-weight:650}
.rrow .nm span{display:block;font-size:.78rem;color:var(--ink-dim)}
.roster .faint{margin:14px 0 0}

/* ── Oturum raporu ─────────────────────────────────────────────────────── */
#report{background:var(--panel);border:1px solid var(--line);border-radius:16px;
        padding:22px;box-shadow:var(--shadow);margin-bottom:18px}
#report h2{margin:0 0 16px;font-size:1.15rem}
.sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:20px}
.sumtile{background:var(--panel-2);border:1px solid var(--line);border-radius:11px;padding:13px}
.sumtile .k{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;
            color:var(--ink-faint);font-weight:750;margin-bottom:3px}
.sumtile .v{display:block;font-size:1.7rem;font-weight:700;line-height:1.1}
.sumtile .n{display:block;font-size:.74rem;color:var(--ink-dim);margin-top:2px}
table.rep{width:100%;border-collapse:collapse;font-size:.86rem}
table.rep th{text-align:left;font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;
             color:var(--ink-faint);font-weight:750;padding:8px 10px;border-bottom:1px solid var(--line)}
table.rep td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle}
table.rep tr:last-child td{border-bottom:0}
table.rep td.num{text-align:right;font-variant-numeric:tabular-nums;font-weight:650}
.cdot{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.cdot i{width:11px;height:11px;border-radius:3px;display:block;box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}
