/* ---- Tokens: Graphite / Teal ---- */
:root{
  --ink:#FBFBFA; --surface:#FFFFFF; --surface-2:#F3F4F2;
  --line:#ECEDEA; --line-2:#DDDFDB;
  --text:#14171A; --muted:#6A6F73;
  --accent:#0E9E8E; --accent-ink:#0B7D71;
  --dissent:#D0584A; --support:#2E9E6B; --oppose:#D0584A; --cond:#C68A2E;
  --on-accent:#FFFFFF;
  --radius:16px; --maxw:680px;
  /* ÜÇ yazı boyutu — başka boyut kullanılmaz */
  --fs-h1:30px; --fs-h2:20px; --fs-body:15px;
}
:root[data-theme="dark"]{
  --ink:#0A1110; --surface:#121A19; --surface-2:#18221F;
  --line:#25302D; --line-2:#32403B;
  --text:#E6EAE8; --muted:#899590;
  --accent:#2DD4BF; --accent-ink:#2DD4BF;
  --dissent:#F87171; --support:#34D399; --oppose:#F87171; --cond:#FBBF24;
  --on-accent:#06100E;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--ink);color:var(--text);
  font-family:'Sora',system-ui,-apple-system,sans-serif;
  font-size:var(--fs-body);line-height:1.5;
  -webkit-font-smoothing:antialiased;
  padding-bottom:env(safe-area-inset-bottom);
  transition:background .25s,color .25s;
}

/* ---- Yalnızca başlık boyutları ---- */
.hero-title{font-size:var(--fs-h1);line-height:1.18;font-weight:600;margin:0}
.brand-text,.console-title,.v-title,.seat-detail h3{font-size:var(--fs-h2);line-height:1.25;font-weight:600}

/* ---- Topbar ---- */
.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;
  padding:calc(env(safe-area-inset-top) + 14px) 20px 14px;
  background:color-mix(in srgb, var(--ink) 88%, transparent);
  backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--line)}
.tb-left{display:flex;align-items:center;gap:8px}
.icon-btn{background:none;border:none;color:var(--text);cursor:pointer;width:34px;height:34px;border-radius:8px;display:grid;place-items:center;line-height:1}
.icon-btn:hover{background:var(--surface-2)}
.brand{display:flex;align-items:center;gap:10px}
.brand-mark{width:32px;height:auto;color:var(--text);display:block}
.brand-text{letter-spacing:1.5px}
.theme-toggle{background:none;border:1px solid var(--line);color:var(--text);width:34px;height:34px;border-radius:50%;cursor:pointer;margin-left:4px;display:grid;place-items:center;line-height:1}
.theme-toggle .ic-moon{display:none}
:root[data-theme="dark"] .theme-toggle .ic-sun{display:none}
:root[data-theme="dark"] .theme-toggle .ic-moon{display:block}

/* ---- Layout / sidebar / drawer ---- */
.content{flex:1;min-width:0;padding:30px 20px 70px}
.content-inner{max-width:680px;margin:0 auto}
.layout{display:flex;align-items:flex-start}
.sidebar{width:264px;flex-shrink:0;background:var(--surface-2);border-right:1px solid var(--line);
  padding:14px 10px;transition:margin-left .25s ease;
  position:sticky;top:calc(env(safe-area-inset-top) + 62px);
  height:calc(100vh - env(safe-area-inset-top) - 62px);overflow-y:auto}
.layout:not(.is-open) .sidebar{margin-left:-264px}
.overlay{display:none}
.new-btn{display:flex;align-items:center;gap:8px;width:100%;background:var(--accent);color:var(--on-accent);border:none;border-radius:999px;padding:11px 16px;font-family:inherit;font-weight:500;cursor:pointer}
.new-btn:active{transform:scale(.99)}
.h-grp{letter-spacing:.5px;text-transform:uppercase;color:var(--muted);padding:16px 10px 5px;font-weight:500}
.h-row{display:flex;align-items:flex-start;gap:9px;padding:9px 10px;border-radius:8px;cursor:pointer}
.h-row:hover{background:var(--surface)}
.h-dot{width:9px;height:9px;border-radius:50%;margin-top:6px;flex-shrink:0;background:var(--muted)}
.h-dot.yes{background:var(--support)}.h-dot.no{background:var(--oppose)}.h-dot.cond{background:var(--cond)}.h-dot.split{background:var(--muted)}
.h-body{min-width:0;display:flex;flex-direction:column}
.h-idea{color:var(--text);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h-sub{color:var(--muted)}
.hist-empty{color:var(--muted);padding:18px 10px;text-align:center}

@media (max-width:860px){
  .sidebar{position:fixed;top:0;left:0;height:100vh;width:284px;z-index:50;margin-left:0;
    transform:translateX(-100%);transition:transform .25s ease;
    padding-top:calc(env(safe-area-inset-top) + 16px);box-shadow:6px 0 26px rgba(0,0,0,.25)}
  .layout.is-open .sidebar{transform:none}
  .layout:not(.is-open) .sidebar{margin-left:0}
  .overlay{position:fixed;inset:0;background:rgba(0,0,0,.42);z-index:45}
  .layout.is-open .overlay{display:block}
  .content{width:100%}
}

.view{display:none;animation:fade .35s ease}
.view.is-active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---- Hero ---- */
.hero{text-align:center;max-width:560px;margin:0 auto 26px}
.hero-title em{font-style:normal;color:var(--accent-ink)}
.hero-sub{color:var(--muted);line-height:1.55;margin:14px auto 0;max-width:520px}

/* ---- Console ---- */
.console{max-width:460px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:24px}
.console-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.console-eyebrow{letter-spacing:1px;color:var(--accent-ink);text-transform:uppercase;font-weight:500}
.mode-badge{font-weight:500;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--cond) 18%,transparent);color:var(--cond);white-space:nowrap}
.console-title{margin:6px 0 16px}

.field{background:var(--ink);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:border-color .15s}
.field:focus-within{border-color:var(--accent-ink)}
.field textarea{width:100%;background:none;border:none;color:var(--text);padding:14px;font-family:inherit;font-size:var(--fs-body);resize:vertical;min-height:74px;display:block}
.field textarea:focus{outline:none}
.field textarea::placeholder{color:var(--muted)}
.field-bar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid var(--line)}
.suggest-btn{background:none;border:1px solid var(--line);color:var(--muted);font-family:inherit;padding:5px 12px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.suggest-btn:hover{border-color:var(--line-2);color:var(--text)}
.suggest-btn .sg-ic{color:var(--accent-ink)}
.suggest-btn.open{border-color:var(--accent-ink);color:var(--accent-ink)}
.counter{color:var(--muted);white-space:nowrap}
.suggest-panel{margin-top:10px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--ink)}
.suggest-panel .sg-item{padding:11px 13px;color:var(--text);cursor:pointer;border-top:1px solid var(--line);line-height:1.35}
.suggest-panel .sg-item:first-child{border-top:none}
.suggest-panel .sg-item:hover{background:var(--surface-2)}

.segmented{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.seg{border:1px solid var(--line);border-radius:999px;padding:8px 14px;color:var(--muted);cursor:pointer;white-space:nowrap;font-weight:500}
.seg.is-sel{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}

.preview{margin-top:18px}
.preview-label{color:var(--muted);margin-bottom:12px}
.preview-row{display:flex;flex-wrap:wrap;gap:9px}
.pv{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:4px 14px 4px 4px}
.pv .av{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:var(--surface-2);color:var(--muted);display:grid;place-items:center;font-family:inherit;flex-shrink:0}
.pv .pn{color:var(--muted);white-space:nowrap}
.pv.tenth{border-color:color-mix(in srgb,var(--dissent) 40%,var(--line))}
.pv.tenth .av{border-color:var(--dissent);color:var(--dissent)}
.pv.tenth .pn{color:var(--dissent)}

.btn-primary{width:100%;margin-top:22px;background:var(--accent);color:var(--on-accent);border:none;border-radius:12px;padding:15px;font-family:inherit;font-weight:600;cursor:pointer;font-size:var(--fs-body)}
.btn-primary:active{transform:scale(.99)}
.btn-primary:disabled{opacity:.5}
.btn-ghost{background:none;border:1px solid var(--line);color:var(--muted);padding:11px 20px;border-radius:999px;font-family:inherit;cursor:pointer;font-size:var(--fs-body)}

/* ---- Questions ---- */
.q-intro{color:var(--muted);margin:6px 0 16px;line-height:1.5}
.q-list{display:flex;flex-direction:column;gap:18px}
.q-q{font-weight:600;margin-bottom:9px}
.q-input{width:100%;background:var(--ink);border:1px solid var(--line);border-radius:10px;padding:11px 12px;color:var(--text);font-family:inherit;font-size:var(--fs-body)}
.q-input:focus{outline:none;border-color:var(--accent-ink)}
.q-opts{display:flex;flex-wrap:wrap;gap:8px}
.q-opt{border:1px solid var(--line);border-radius:999px;padding:8px 14px;cursor:pointer;color:var(--muted)}
.q-opt.sel{border-color:var(--accent-ink);color:var(--accent-ink);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.q-actions{display:flex;gap:14px;align-items:center;margin-top:22px}
.q-actions .btn-primary{margin-top:0;flex:1}
.q-skip{background:none;border:none;color:var(--muted);cursor:pointer;text-decoration:underline;font-family:inherit;font-size:var(--fs-body);white-space:nowrap}

/* ---- Why ---- */
.why{max-width:560px;margin:38px auto 0}
.why-eyebrow{text-align:center;letter-spacing:1px;color:var(--accent-ink);text-transform:uppercase;font-weight:500;margin-bottom:16px}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.why-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px}
.why-card.tenth{border-color:color-mix(in srgb,var(--dissent) 45%,var(--line))}
.why-h{font-weight:600;margin-bottom:7px}
.why-card.tenth .why-h{color:var(--dissent)}
.why-card p{color:var(--muted);line-height:1.5;margin:0}
.why-card b{color:var(--text);font-weight:600}
@media (max-width:560px){.why-grid{grid-template-columns:1fr}}

/* ---- Round table ---- */
.idea-recall{color:var(--muted);background:var(--surface);border:1px solid var(--line);border-left:2px solid var(--accent-ink);border-radius:10px;padding:10px 12px;margin-bottom:18px}
.table-wrap{position:relative;width:100%;aspect-ratio:1/1;max-width:360px;margin:56px auto 30px}
.round-table{position:absolute;inset:0}
.table-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:42%;height:42%;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;text-align:center;box-shadow:inset 0 2px 16px color-mix(in srgb,var(--text) 8%,transparent)}
.center-label{color:var(--muted);letter-spacing:.5px;position:relative;z-index:2}
.pulse{position:absolute;width:60%;height:60%;border-radius:50%;background:var(--accent);opacity:.12;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(.8);opacity:.08}50%{transform:scale(1.15);opacity:.22}}
.table-center.done .pulse{display:none}
.seat{position:absolute;width:80px;transform:translate(-50%,-50%);text-align:center;opacity:.35;transition:opacity .4s}
.seat.active{opacity:1}
.seat.thinking .avatar{animation:think 1.1s ease-in-out infinite}
@keyframes think{0%,100%{box-shadow:0 0 0 0 rgba(45,212,191,0)}50%{box-shadow:0 0 0 6px rgba(45,212,191,.22)}}
.avatar{width:42px;height:42px;margin:0 auto 6px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);border:1.5px solid var(--line);color:var(--muted);font-family:inherit}
.seat.tenth .avatar{border-color:var(--dissent);color:var(--dissent)}
.seat .name{color:var(--muted);line-height:1.2;font-weight:500}
.seat .chip{display:inline-block;margin-top:5px;font-weight:600;padding:2px 9px;border-radius:999px}
.chip.destekliyor{background:color-mix(in srgb,var(--support) 18%,transparent);color:var(--support)}
.chip.karsi{background:color-mix(in srgb,var(--oppose) 18%,transparent);color:var(--oppose)}
.chip.sartli{background:color-mix(in srgb,var(--cond) 20%,transparent);color:var(--cond)}

.seat-detail{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--surface);border-top:1px solid var(--line);border-radius:18px 18px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));transform:translateY(110%);transition:transform .3s ease;max-width:var(--maxw);margin:0 auto}
.seat-detail.open{transform:none}
.seat-detail h3{margin:0 0 2px}
.seat-detail .crit{color:var(--muted);margin-bottom:12px}
.seat-detail p{margin:8px 0}
.seat-detail .kp{border-left:2px solid var(--accent-ink);padding-left:10px;color:var(--text)}
.sd-close{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--muted);cursor:pointer;line-height:1}

/* ---- Verdict ---- */
.verdict{margin-top:26px;animation:fade .4s ease}
.verdict .seal{text-align:center;padding:22px 16px;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface)}
.verdict .v-label{letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.verdict .v-title{margin:6px 0 4px}
.verdict.yes .v-title{color:var(--support)}
.verdict.no .v-title{color:var(--oppose)}
.verdict.cond .v-title{color:var(--cond)}
.verdict.split .v-title{color:var(--text)}
.verdict .v-summary{color:var(--text);margin:10px 4px 0;line-height:1.5}
.verdict .frame{color:var(--muted);margin-top:8px}
.verdict .frame b{color:var(--accent-ink)}
.block{margin-top:16px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px}
.block h4{margin:0 0 8px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);font-weight:500}
.block ul{margin:0;padding-left:18px}
.block li{margin:5px 0;line-height:1.45}
.block.tenth{border-color:color-mix(in srgb,var(--dissent) 45%,var(--line))}
.block.tenth h4{color:var(--dissent)}
.table-actions{display:flex;justify-content:center;margin-top:22px}

/* ---- Debate transcript ---- */
.debate{margin-top:16px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px}
.debate h4{margin:0 0 6px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);font-weight:500}
.d-msg{display:flex;gap:10px;margin-top:12px}
.d-av{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:var(--surface-2);color:var(--muted);display:grid;place-items:center;flex-shrink:0;font-family:inherit}
.d-msg.tenth .d-av{border-color:var(--dissent);color:var(--dissent)}
.d-body{min-width:0}
.d-name{font-weight:600;margin-bottom:3px}
.d-msg.tenth .d-name{color:var(--dissent)}
.d-bubble{background:var(--surface-2);border:1px solid var(--line);border-radius:4px 12px 12px 12px;padding:9px 12px;line-height:1.45}
.d-msg.tenth .d-bubble{border-color:color-mix(in srgb,var(--dissent) 35%,var(--line))}

.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--dissent);color:#fff;padding:11px 18px;border-radius:999px;z-index:70;max-width:90%}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}