:root{
  --bg:#0B0C0E; --side:#0B0C0E; --sunk:#16181B; --raise:#1A1C20; --line:#1F2125; --line2:#2A2D33; --ink:#E6E7EA; --muted:#8B8F98; --faint:#5C606A;
  --accent:#7AA7FF; --accent-ink:#0B0C0E; --accent-soft:#11151C; --accent-text:#9FB8EC;
  --pri:#FFFFFF; --pri-ink:#000000;
  --ok:#6FCF97; --ok-soft:#14261C; --warn:#F2B35A; --warn-soft:#2B2213; --bad:#F28B82; --bad-soft:#2E1A18;
  --ai:#7AA7FF; --ai-soft:#121A2A;
  --f:"Pretendard Variable",Pretendard,"Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  color-scheme:dark;
}
@media (prefers-color-scheme:light){:root{
  --bg:#FFFFFF; --side:#FAFAFA; --sunk:#F2F3F5; --raise:#ECEDF0; --line:#E7E8EB; --line2:#D9DBE0; --ink:#0E0F11; --muted:#666B75; --faint:#9A9EA7;
  --accent:#2F5FD0; --accent-ink:#FFFFFF; --accent-soft:#F1F5FE; --accent-text:#2B56BD;
  --pri:#0E0F11; --pri-ink:#FFFFFF;
  --ok:#1D7A46; --ok-soft:#E3F3E9; --warn:#9A5B00; --warn-soft:#FBEFD9; --bad:#B3261E; --bad-soft:#FBE3E1;
  --ai:#2F5FD0; --ai-soft:#EEF3FF; color-scheme:light}}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--f);font-size:15px;line-height:1.6}
button,input,textarea{font:inherit;color:inherit}
h1,h2,h3,p{margin:0}
h1{font-size:28px;font-weight:600;letter-spacing:-.01em;text-wrap:balance;line-height:1.3}
h2{font-size:19px;font-weight:600}
h3{font-size:15px;font-weight:600}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)} .small{font-size:13px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap} .between{justify-content:space-between}
.link{border:0;background:none;color:var(--accent);cursor:pointer;padding:0;font-weight:500}
.icon-btn{border:0;background:none;width:34px;height:34px;border-radius:8px;cursor:pointer;font-size:16px;color:var(--muted)}
.icon-btn:hover{background:var(--sunk)}
.btn{border:1px solid var(--line);background:var(--bg);padding:8px 15px;border-radius:9px;cursor:pointer;font-weight:500}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.tag{font-style:normal;display:inline-flex;align-items:center;font-size:12px;font-weight:500;padding:1px 8px;border-radius:999px;white-space:nowrap;background:var(--sunk);color:var(--muted)}
.tag.ai{background:var(--ai-soft);color:var(--ai)} .tag.me{background:var(--accent-soft);color:var(--accent)}
.tag.ok{background:var(--ok-soft);color:var(--ok)} .tag.warn{background:var(--warn-soft);color:var(--warn)} .tag.bad{background:var(--bad-soft);color:var(--bad)}
.only-mobile{display:none}

.app{display:grid;grid-template-columns:260px minmax(0,1fr) auto;grid-template-rows:100%;height:100%;overflow:hidden}
/* sidebar */
.side{background:var(--side);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:14px 12px;gap:6px;min-height:0}
.side-top{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 10px}
.logo{font-size:20px;font-weight:700;letter-spacing:-.02em;display:flex;align-items:baseline;gap:6px}
.logo span{font-size:11px;font-weight:500;color:var(--muted);font-family:var(--mono)}
.new{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:var(--bg);border-radius:10px;padding:10px 12px;cursor:pointer;font-weight:500;text-align:left}
.new .plus{width:22px;height:22px;border-radius:6px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-weight:700}
.side-sec{font-size:12px;color:var(--muted);padding:14px 8px 4px}
.hist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;overflow-y:auto;min-height:0}
.hist button{width:100%;border:0;background:none;text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;gap:1px}
.hist button:hover,.hist button[aria-current="true"]{background:var(--sunk)}
.hist .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}
.hist .s{font-size:12px;color:var(--muted)}
.side-bottom{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding:10px 6px 2px;border-top:1px solid var(--line)}
.consultant{display:flex;gap:10px;align-items:center}
.consultant b{display:block;font-size:14px} .consultant span{font-size:12px;color:var(--muted)}
.ava{width:34px;height:34px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-weight:600;flex:none}
.ticket{display:flex;justify-content:space-between;font-size:14px;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:8px 10px}
.reset{font-size:12px;color:var(--muted);text-align:left}

/* main */
.main{display:flex;flex-direction:column;min-width:0;min-height:0}
.bar{display:flex;align-items:center;gap:10px;padding:10px max(16px,env(safe-area-inset-right,0px)) 10px 16px;min-height:56px}
.bar-title{flex:1;min-width:0;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.seg{display:inline-flex;background:var(--sunk);border-radius:999px;padding:3px}
.seg button{border:0;background:none;padding:5px 13px;border-radius:999px;cursor:pointer;color:var(--muted);font-size:13px;font-weight:500}
.seg button[aria-pressed="true"]{background:var(--bg);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.1)}
.student{flex:1;display:flex;flex-direction:column;min-height:0}
.convo{flex:1;overflow-y:auto;padding:8px 16px 24px}
.col{max-width:740px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.dock{padding:0 16px max(16px,env(safe-area-inset-bottom,0px))}

/* home */
.home{min-height:100%;display:flex;flex-direction:column;justify-content:center;gap:22px;padding-block:24px}
.home .hello{display:flex;flex-direction:column;gap:8px;text-align:center;align-items:center}
.home .sub{color:var(--muted);max-width:46ch}
.modes{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.mode{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:7px 15px;cursor:pointer;font-size:14px;display:flex;gap:6px;align-items:center}
.mode[aria-pressed="true"]{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);font-weight:500}
.trust{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.trust span::before{content:"✓ ";color:var(--ok);font-weight:700}
.try{display:flex;justify-content:center}

/* composer */
.composer{width:100%;max-width:740px;margin:0 auto;border:1px solid var(--line);border-radius:16px;background:var(--bg);padding:10px 10px 8px 14px;display:flex;flex-direction:column;gap:6px;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.composer textarea{border:0;outline:0;resize:none;background:transparent;min-height:52px;max-height:180px;width:100%}
.composer .tools{display:flex;justify-content:space-between;align-items:center;gap:8px}
.attach{display:flex;gap:8px;align-items:center;min-width:0}
.file-chip{font-size:12px;background:var(--sunk);border-radius:6px;padding:2px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.send{width:36px;height:36px;border-radius:10px;border:0;background:var(--accent);color:var(--accent-ink);cursor:pointer;font-size:17px;flex:none}
.send:disabled{opacity:.35;cursor:not-allowed}
.chips{max-width:740px;margin:0 auto 8px;display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:var(--bg);border-radius:999px;padding:6px 12px;cursor:pointer;font-size:13px}
.chip:hover{border-color:var(--accent)}
.foot{max-width:740px;margin:6px auto 0;font-size:12px;color:var(--muted);text-align:center}

/* messages */
.msg{display:flex;flex-direction:column;gap:6px}
.msg.u{align-items:flex-end}
.msg.u .b{background:var(--sunk);padding:10px 14px;border-radius:14px;max-width:80%;white-space:pre-wrap}
.msg .who{display:flex;gap:8px;align-items:center;font-size:13px;font-weight:500}
.msg .who .ava{width:24px;height:24px;font-size:12px}
.msg .txt{max-width:100%}
.card{border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;background:var(--bg)}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;font-size:14px;margin:0}
.kv dt{color:var(--muted)} .kv dd{margin:0}
.topic{border:1px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;background:var(--bg);text-align:left;display:flex;flex-direction:column;gap:8px;width:100%;transition:border-color .15s,background .15s}
.topic:hover{border-color:var(--accent)}
.topic[aria-disabled="true"]{cursor:default}
.topic[aria-disabled="true"]:not([aria-pressed="true"]){opacity:.55}
.topic[aria-pressed="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--accent-soft)}
.tp-head{display:flex;align-items:flex-start;gap:10px}
.tp-no{flex:none;width:24px;height:24px;border-radius:50%;background:var(--sunk);color:var(--muted);display:grid;place-items:center;font-size:13px;font-weight:600;margin-top:1px}
.topic[aria-pressed="true"] .tp-no{background:var(--accent);color:var(--accent-ink)}
.tp-title{flex:1;min-width:0;font-size:16.5px;line-height:1.45;text-wrap:balance}
.tp-point{margin:0 0 0 34px;font-size:14.5px;font-weight:500;color:var(--ink);background:var(--accent-soft);border-left:3px solid var(--accent);border-radius:0 6px 6px 0;padding:6px 10px}
.topic[aria-pressed="true"] .tp-point{background:var(--bg)}
.tp-subj{margin:0 0 0 34px;font-size:13px;color:var(--muted)}
.tp-more{margin-left:34px;font-size:13px}
.tp-more summary{cursor:pointer;color:var(--accent);font-weight:500;width:max-content;list-style:none}
.tp-more summary::-webkit-details-marker{display:none}
.tp-more summary::after{content:" ▾"}
.tp-more[open] summary::after{content:" ▴"}
.tp-more .kv{margin-top:8px;line-height:1.6}
.lv{flex:none}
.lv-하{background:var(--ok-soft,var(--sunk));color:var(--ok,var(--muted))}
.lv-상{background:var(--warn-soft);color:var(--warn)}
.steps{display:flex;flex-direction:column;gap:8px;font-size:14px}
.steps div{display:flex;gap:10px;align-items:center}
.repcard{display:flex;flex-direction:row;align-items:center;gap:12px;cursor:pointer;text-align:left;width:100%}
.repcard .ic{width:40px;height:48px;border-radius:6px;border:1px solid var(--line);background:var(--sunk);display:grid;place-items:center;font-size:11px;font-family:var(--mono);color:var(--muted);flex:none}
.hint{font-size:13px;background:var(--warn-soft);color:var(--warn);border-radius:9px;padding:9px 12px}

/* report panel */
.panel{width:min(520px,46vw);border-left:1px solid var(--line);background:var(--bg);display:flex;flex-direction:column;min-height:0}
.panel-h{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.panel-h .t{flex:1;min-width:0;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc{flex:1;overflow-y:auto;padding:20px 22px 40px;display:flex;flex-direction:column;gap:18px}
.doc .sec{display:flex;flex-direction:column;gap:6px}
.doc .num{font-family:var(--mono);color:var(--muted);font-size:12px}
.doc ul{margin:0;padding-left:18px}
.why{border-left:3px solid var(--ai);background:var(--ai-soft);padding:8px 12px;font-size:14px}
.why b{color:var(--ai)}
.notice{font-size:13px;background:var(--sunk);border-radius:8px;padding:9px 12px;color:var(--muted)}
.refs{list-style:none;padding:0!important;display:flex;flex-direction:column;gap:6px;font-size:14px}
.refs li{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.flash{animation:fl 1.8s ease}
@keyframes fl{from{background:var(--ai-soft)}to{background:transparent}}
@media (prefers-reduced-motion:reduce){.flash{animation:none}}

/* admin */
.admin{flex:1;overflow-y:auto;padding:8px 16px 32px}
.admin .wrapA{max-width:1080px;margin:0 auto;display:flex;flex-direction:column;gap:16px}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.stat{border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.stat b{display:block;font-size:22px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto}
.tabs button{border:0;background:none;padding:9px 13px;cursor:pointer;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap;font-weight:500}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.adm{display:grid;grid-template-columns:280px minmax(0,1fr);gap:14px;align-items:start}
.queue{border:1px solid var(--line);border-radius:10px;padding:6px;display:flex;flex-direction:column}
.qi{border:0;background:none;text-align:left;padding:10px;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.qi[aria-current="true"]{background:var(--accent-soft)}
.detail{border:1px solid var(--line);border-radius:10px;padding:18px;display:flex;flex-direction:column;gap:14px;min-width:0}
.tw{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:12px;color:var(--muted);font-weight:500;white-space:nowrap}
.adoc{border:1px solid var(--line);border-radius:8px;padding:14px 16px;max-height:420px;overflow-y:auto;display:flex;flex-direction:column;gap:14px;font-size:14px}
.adoc .sec{display:flex;flex-direction:column;gap:4px}.adoc ul{margin:0;padding-left:18px}
.edgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.edf{display:flex;flex-direction:column;gap:4px;min-width:0}
.edf .ed{min-height:84px}
@media (max-width:1100px){.edgrid{grid-template-columns:minmax(0,1fr)}}
.aside{border:1px dashed var(--line);border-radius:10px;padding:10px 14px;font-size:14px}
.aside summary{cursor:pointer;font-weight:500}
.aside[open]{display:flex;flex-direction:column;gap:8px}
.ed{width:100%;min-height:110px;border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:10px;resize:vertical}

/* modal / toast */
.modal-back{position:fixed;inset:0;background:rgba(10,20,18,.45);display:grid;place-items:center;padding:16px;z-index:30}
.modal{background:var(--bg);border-radius:14px;padding:20px;max-width:440px;width:100%;display:flex;flex-direction:column;gap:12px}
.prices{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.price{border:1px solid var(--line);background:var(--bg);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:2px;cursor:pointer;text-align:left}
.price:hover{border-color:var(--accent)}
.price b{font-size:20px}
.note{font-size:13px;color:var(--muted);background:var(--sunk);border-radius:8px;padding:9px 12px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:9px;font-size:14px;z-index:40}

@media (max-width:900px){
  .app{grid-template-columns:minmax(0,1fr)}
  .side{position:fixed;inset:0 auto 0 0;width:280px;z-index:20;transform:translateX(-100%);transition:transform .2s}
  .side.open{transform:none;box-shadow:0 0 40px rgba(0,0,0,.2)}
  .only-mobile{display:inline-block}
  .panel{position:fixed;inset:0;width:100%;z-index:25}
  .adm{grid-template-columns:minmax(0,1fr)}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  h1{font-size:23px}
}

/* ---------- 실제 연결 (v20) ---------- */
.msg .txt{white-space:pre-wrap}
.banner{font-size:14px;background:var(--warn-soft);color:var(--warn);border-radius:10px;padding:10px 14px}
.chips .btn{padding:7px 14px;font-size:14px}
.chips{align-items:center}
.typing{display:flex;gap:4px;padding:6px 0}
.typing span{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:bl 1.2s infinite}
.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}
@keyframes bl{0%,80%,100%{opacity:.25}40%{opacity:1}}
.job{border-style:dashed}
.job.err{border-color:var(--bad);background:var(--bad-soft)}
.spin{width:16px;height:16px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--accent);animation:sp 0.9s linear infinite;flex:none}
@keyframes sp{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin,.typing span{animation:none}}
.mark{background:var(--warn-soft);color:var(--warn);border-radius:4px;padding:0 3px}
.md{display:flex;flex-direction:column;gap:6px;font-size:15px}
.md h1{font-size:21px;margin:4px 0 6px}
.md h2{font-size:17px;margin:18px 0 4px;padding-top:12px;border-top:1px solid var(--line)}
.md h3{font-size:15px;margin:12px 0 2px}
.md p,.md ul,.md ol{margin:4px 0}
.md ul,.md ol{padding-left:20px}
.md blockquote{margin:8px 0;border-left:3px solid var(--ai);background:var(--ai-soft);padding:8px 12px;font-size:14px}
.md blockquote p{margin:0}
.md table{display:block;overflow-x:auto;font-size:13px;width:auto}
.md td,.md th{border:1px solid var(--line);padding:4px 7px}
.md code{font-family:var(--mono);font-size:13px;background:var(--sunk);border-radius:4px;padding:0 4px}
.md hr{border:0;border-top:1px solid var(--line);margin:10px 0}
.msec.changed{background:var(--ai-soft);border-radius:8px;padding:2px 10px 8px;margin:0 -10px}
.msec.changed>.tag{margin-top:10px}
.form{display:flex;flex-direction:column;gap:12px}
.form label{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:500}
.form input:not([type=checkbox]),.form select{border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:9px 11px;font-weight:400}
.form .check{flex-direction:row;align-items:center;gap:8px;font-weight:400}
.form details p{margin-top:6px;line-height:1.6}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.modal{max-height:calc(100vh - 32px);overflow-y:auto}
.modal .tabs{margin-top:-4px}
.codebox{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid var(--accent);background:var(--accent-soft);border-radius:10px;padding:12px 14px}
.codebox b{font-size:22px;color:var(--accent);letter-spacing:.04em}
.price[aria-pressed="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.paystep{display:flex;flex-direction:column;gap:10px;background:var(--sunk);border-radius:10px;padding:12px 14px;font-size:14px}
.paystep ol{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.paystep a.btn{text-align:center;text-decoration:none}
.edcol{display:flex;flex-direction:column;gap:10px}
.tx{display:flex;flex-direction:column;gap:10px;max-height:420px;overflow-y:auto}
.tx p{margin:2px 0 0;white-space:pre-wrap}
.tx-u{background:var(--sunk);border-radius:8px;padding:8px 10px}
.tx-me b{color:var(--accent)}
.qi .small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.detail .tw td .btn{padding:4px 10px;font-size:13px}
/* 보고서 패널이 열리면 중간 폭 화면에서는 사이드바를 서랍으로 접는다 */
@media (min-width:901px) and (max-width:1279px){
  .app.with-panel{grid-template-columns:minmax(0,1fr) auto}
  .app.with-panel .side{position:fixed;inset:0 auto 0 0;width:280px;z-index:20;transform:translateX(-100%);transition:transform .2s}
  .app.with-panel .side.open{transform:none;box-shadow:0 0 40px rgba(0,0,0,.2)}
  .app.with-panel .only-mobile{display:inline-block}
}

/* ---------- C안 (v29): 모노톤 + 파란 포인트, 상자 줄이기 ---------- */
body{font-size:15px;letter-spacing:-.005em;-webkit-font-smoothing:antialiased}
h1{font-weight:600;letter-spacing:-.025em}
.btn{border-radius:999px;border-color:var(--line2);background:transparent;padding:8px 16px}
.btn:hover{border-color:var(--muted)}
.btn.pri{background:var(--pri);border-color:var(--pri);color:var(--pri-ink)}
.btn.pri:hover{opacity:.88}
.link{color:var(--accent)} .link.sub{color:var(--muted);font-weight:400}
.tag{border-radius:6px}

/* 로고 */
.glyph{width:18px;height:18px;border-radius:5px;background:var(--ink);position:relative;display:inline-block;flex:none}
.glyph::after{content:"";position:absolute;left:5px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 2px var(--accent)}
.glyph.big{width:36px;height:36px;border-radius:10px}
.glyph.big::after{left:10px;top:10px;width:16px;height:16px;box-shadow:inset 0 0 0 4px var(--accent)}
.logo{font-size:17px;font-weight:600;letter-spacing:-.02em;align-items:center;gap:8px}
.logo .beta{font-size:10px;font-weight:500;color:var(--faint);font-family:var(--mono);letter-spacing:.04em}

/* 사이드: 얇게 */
.app{grid-template-columns:232px minmax(0,1fr) auto}
.side{background:var(--side);border-right-color:var(--line);padding:16px 12px;gap:4px}
.new{border-radius:999px;border-color:var(--line2);background:transparent;padding:7px 14px;font-size:14px;gap:8px;width:max-content}
.new:hover{border-color:var(--muted)}
.new .plus{width:auto;height:auto;background:none;color:var(--ink);font-weight:500}
.side-sec{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--faint);padding:18px 10px 6px;text-transform:uppercase}
.hist button{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:8px;padding:7px 10px}
.hist .dot{width:6px;height:6px;border-radius:50%;background:var(--line2)}
.hist [aria-current="true"] .dot{background:var(--accent)}
.hist .dot.ok{background:var(--ok)} .hist .dot.wait{background:var(--warn)}
.hist .t{font-size:13.5px;color:var(--muted)}
.hist [aria-current="true"] .t{color:var(--ink)}
.hist .s{grid-column:2;font-size:11px;color:var(--faint)}
.hist button:hover,.hist button[aria-current="true"]{background:var(--sunk)}
.side-bottom{border-top:0;gap:6px;padding:10px}
.side-bottom .lab{font-family:var(--mono);font-size:11px;color:var(--faint);letter-spacing:.02em}
.side-bottom .lab b{color:var(--ink);font-weight:500}

/* 상단 진행 표시 */
.bar{border-bottom:1px solid var(--line);min-height:52px}
.rail{list-style:none;margin:0;padding:0;display:flex;gap:6px;max-width:740px;margin-inline:auto;width:100%}
.rail li{flex:1;border-top:2px solid var(--line2);padding-top:6px;font-size:12px;color:var(--faint);white-space:nowrap}
.rail li .mono{font-size:10.5px;margin-right:2px}
.rail li.d{border-color:var(--ink);color:var(--muted)}
.rail li.c{border-color:var(--accent);color:var(--accent);font-weight:500}
.seg{background:var(--sunk)}
.seg button[aria-pressed="true"]{background:var(--raise);box-shadow:none}

/* 대화 */
.col{gap:22px}
.convo{padding-top:20px}
.msg .who{font-size:12px;font-weight:500;color:var(--muted)}
.msg .who .me{color:var(--accent);font-weight:400}
.msg .txt{line-height:1.7}
.msg.u .b{background:var(--raise);border-radius:18px;padding:9px 15px}
.card{border-color:var(--line);background:var(--sunk);border-radius:14px}
.repcard .ic{background:var(--raise);border-color:var(--line2)}

/* 주제 목록: 상자 대신 번호 줄 */
.tlist{display:flex;flex-direction:column;margin-top:4px}
.topic{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;border:0;border-top:1px solid var(--line);border-radius:0;padding:14px 10px;background:transparent;transition:background .15s}
.topic:first-child{border-top-color:transparent}
.topic:hover{background:var(--sunk);border-color:var(--line)}
.topic[aria-pressed="true"]{background:var(--accent-soft);border-radius:10px;border-top-color:transparent;box-shadow:inset 2px 0 0 var(--accent)}
.topic[aria-pressed="true"] + .topic{border-top-color:transparent}
.topic[aria-disabled="true"]:not([aria-pressed="true"]){opacity:.45}
.tp-no{font-size:12px;color:var(--faint);padding-top:3px;width:auto;height:auto;background:none;display:block;margin:0;border-radius:0}
.topic[aria-pressed="true"] .tp-no{background:none;color:var(--accent)}
.tp-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.tp-title{font-size:16px;font-weight:600;line-height:1.45;color:var(--ink)}
.tp-point{margin:0;font-size:14px;font-weight:400;color:var(--accent-text);background:none;border:0;padding:0}
.topic[aria-pressed="true"] .tp-point{background:none}
.tp-lv{font-size:11px;color:var(--muted);padding-top:4px}
.tp-more{margin:2px 0 0;font-size:12.5px}
.tp-more summary{color:var(--faint);font-weight:400;width:auto}
.tp-more summary:hover{color:var(--muted)}
.tp-more .kv{color:var(--muted);font-size:13px}
.tp-more .kv dt{color:var(--faint)}
.tp-go{padding:14px 10px 0}

/* 입력창: 알약 */
.dock{padding-top:6px}
.composer{flex-direction:row;align-items:flex-end;gap:8px;border-color:var(--line2);background:var(--sunk);border-radius:26px;padding:7px 7px 7px 18px;box-shadow:none}
.composer:focus-within{border-color:var(--muted)}
.composer textarea{min-height:24px;padding:6px 0;line-height:1.5}
.composer textarea::placeholder{color:var(--faint)}
.composer.big{border-radius:22px;padding:12px 10px 10px 20px}
.composer.big textarea{min-height:72px}
.send{width:34px;height:34px;border-radius:50%;background:var(--pri);color:var(--pri-ink);font-size:16px}
.chips{margin-bottom:10px}
.foot{font-size:11.5px;color:var(--faint)}

/* 첫 화면 */
.home{gap:26px}
.home .hello{gap:12px}
.trust{font-size:12.5px;color:var(--faint)}
.trust span::before{color:var(--accent);font-weight:500}

/* 보고서 패널·관리자는 토큰만 따라감 */
.panel{border-left-color:var(--line)}
.notice,.note,.paystep{background:var(--sunk)}
.modal-back{background:rgba(0,0,0,.6)}
.modal{background:var(--bg);border:1px solid var(--line2);border-radius:18px}
.form input:not([type=checkbox]),.form select,.ed{background:var(--sunk);border-color:var(--line2)}
.codebox{border-color:var(--accent);background:var(--accent-soft)}
.codebox b{color:var(--accent);font-family:var(--mono)}
@media (max-width:900px){.rail li{font-size:11px}.rail li .mono{display:none}}
.composer:not(.big) textarea::placeholder{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 주제 카드 가독성 (v30): 글씨 키우고 밝게, 줄 길이 제한, 라벨은 위로 */
.tp-body{max-width:58ch}
.tp-title{font-size:16.5px;line-height:1.5}
.tp-point{font-size:15px;line-height:1.6}
.tp-subj{margin:2px 0 0;font-size:13px;color:var(--muted)}
.tp-more{font-size:14px;margin-top:4px}
.tp-more summary{color:var(--accent);font-weight:500}
.tp-why{margin:10px 0 2px;display:flex;flex-direction:column}
.tp-why dt:not(:first-child){margin-top:12px}
.tp-why dt{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em}
.tp-why dd{margin:1px 0 0;font-size:15px;line-height:1.65;color:var(--ink)}
.tp-more summary::after{font-size:10px;vertical-align:1px}
/* 보고서 창 너비 조절 손잡이 (v31) */
.panel{position:relative;max-width:calc(100vw - 380px)}
.panel-resize{position:absolute;left:-5px;top:0;bottom:0;width:10px;cursor:col-resize;z-index:6;touch-action:none}
.panel-resize::after{content:"";position:absolute;left:4px;top:0;bottom:0;width:2px;background:transparent;transition:background .15s}
.panel-resize:hover::after,.panel-resize:focus-visible::after,.resizing .panel-resize::after{background:var(--accent)}
.panel-resize:focus-visible{outline:0}
body.resizing{cursor:col-resize;user-select:none}
body.resizing iframe{pointer-events:none}
@media (max-width:900px){.panel-resize{display:none}.panel{max-width:none;width:100%!important}}
/* 난이도 표시 (v32): 쉬움/보통/도전 */
.tp-lv{font-size:12px;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--raise);color:var(--muted);align-self:start;white-space:nowrap;margin-top:1px}
.tp-lv.lv-하{background:var(--ok-soft);color:var(--ok)}
.tp-lv.lv-상{background:var(--warn-soft);color:var(--warn)}
/* ---------- 메디컬 / 이공계 화면 (v33) ---------- */
:root[data-track="med"]{--accent:#5FD4B0;--accent-ink:#04201A;--accent-soft:#0E1A16;--accent-text:#8FE0C6;--ai:#5FD4B0;--ai-soft:#0F201B}
@media (prefers-color-scheme:light){:root[data-track="med"]{--accent:#0E8A6A;--accent-ink:#FFFFFF;--accent-soft:#EDF8F3;--accent-text:#0C7A5E;--ai:#0E8A6A;--ai-soft:#E8F6F0}}
:root{--grid:color-mix(in srgb,var(--ink) 5%,transparent)}
.main{position:relative}
.main::before{content:"";position:absolute;inset:0 0 auto 0;height:440px;pointer-events:none;z-index:0;
  background:radial-gradient(900px 320px at 50% -60px,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%);
  -webkit-mask-image:linear-gradient(#000 40%,transparent);mask-image:linear-gradient(#000 40%,transparent);transition:background .3s}
:root[data-track="stem"] .main::before{background:
  radial-gradient(900px 320px at 50% -60px,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%),
  linear-gradient(var(--grid) 1px,transparent 1px) 0 0/28px 28px,
  linear-gradient(90deg,var(--grid) 1px,transparent 1px) 0 0/28px 28px}
:root[data-track="med"] .main::before{background:
  radial-gradient(900px 320px at 50% -60px,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%),
  radial-gradient(circle,var(--grid) 1.2px,transparent 1.6px) 0 0/22px 22px}
.bar,.student,.admin{position:relative;z-index:1}
.seg.track button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.bar .seg + .seg{margin-left:6px}
.hero-art{width:min(420px,90%);height:56px;color:var(--accent)}
.hero-art svg{width:100%;height:100%;overflow:visible}
.hero-art polyline,.hero-art path{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.hero-art .dash{stroke-dasharray:4 6;stroke-width:1.2;opacity:.5}
.eyebrow{font-size:11.5px;letter-spacing:.08em;color:var(--accent);text-wrap:balance}
.home h1{font-size:30px;line-height:1.32}
.ttags{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.ttags span{font-size:12.5px;padding:3px 10px;border-radius:999px;border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);color:var(--accent-text);background:color-mix(in srgb,var(--accent) 7%,transparent)}
.exs{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:-8px}
.exs .chip{background:var(--sunk);border-color:var(--line2);color:var(--muted)}
.exs .chip:hover{border-color:var(--accent);color:var(--ink)}
@media (max-width:900px){.home h1{font-size:23px}.bar .seg.track button{padding:5px 10px}}
.hero-art svg{animation:art-in .9s ease-out both}
@keyframes art-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.hero-art svg{animation:none}}
/* 첫 화면 강조 (v37): 세 가지 약속 + 컨설턴트 약력 */
.values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.val{border:1px solid var(--line2);border-radius:14px;padding:14px 16px;background:color-mix(in srgb,var(--sunk) 70%,transparent);display:flex;flex-direction:column;gap:4px}
.val .mono{font-size:11px;color:var(--accent)}
.val b{font-size:15.5px;color:var(--ink)}
.val p{font-size:13.5px;line-height:1.6;color:var(--muted)}
.val:first-child{border-color:color-mix(in srgb,var(--accent) 55%,transparent);background:var(--accent-soft)}
.cons{border:1px solid var(--line2);border-radius:14px;padding:10px 14px;align-self:center;min-width:min(100%,340px)}
.cons summary{display:flex;gap:10px;align-items:center;cursor:pointer;list-style:none}
.cons summary::-webkit-details-marker{display:none}
.cons summary>span:last-child{display:flex;flex-direction:column}
.cons summary b{font-size:14px}
.cons .cava{width:32px;height:32px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-weight:700;font-size:14px;flex:none}
.cons ul{margin:10px 0 2px;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-size:14px}
.cons[open]{background:var(--sunk)}
.trust{justify-content:center;margin-top:-8px}
@media (max-width:760px){.values{grid-template-columns:minmax(0,1fr)}}
.hello .cons{text-align:left;margin-top:4px;background:color-mix(in srgb,var(--sunk) 70%,transparent)}
/* v39: 한글 줄바꿈은 단어 단위, '직접 검수' 강조, 강조 카드 대비 높이기 */
body{word-break:keep-all;overflow-wrap:anywhere}
.home .sub{max-width:52ch;text-wrap:pretty;line-height:1.75}
.hl{display:inline-block;margin-top:8px;background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--ink);font-weight:600;padding:3px 10px;border-radius:8px;box-shadow:inset 0 -2px 0 var(--accent)}
.cons .badge{display:inline-block;margin-left:6px;font-size:11px;font-weight:700;padding:1px 8px;border-radius:999px;background:var(--accent);color:var(--accent-ink);vertical-align:1px}
.hello .cons{border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
.values{gap:12px}
.val{border-color:var(--line2);background:var(--sunk);padding:18px 18px 16px;gap:6px;position:relative;overflow:hidden}
.val::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--accent);opacity:.55}
.val .mono{font-size:12px;font-weight:500}
.val b{font-size:17.5px;letter-spacing:-.02em}
.val p{font-size:14.5px;line-height:1.65;color:color-mix(in srgb,var(--ink) 78%,var(--bg));text-wrap:pretty}
.val:first-child{border-color:var(--accent);background:var(--accent-soft)}
.val:first-child::before{opacity:1}
/* v40: 강조 문장은 앞 문장에 이어지는 형광펜 */
.hl{display:inline;margin:0;padding:1px 2px;border-radius:3px;box-shadow:none;font-weight:600;color:var(--ink);background:linear-gradient(transparent 55%,color-mix(in srgb,var(--accent) 38%,transparent) 55%);-webkit-box-decoration-break:clone;box-decoration-break:clone}
.home .sub{max-width:60ch} @media (max-width:760px){br.wide{display:none}}
/* v43: 첫 화면 그림 (메디컬 생명체 / 이공계 회로·전류) */
.hero-art{width:min(520px,94%);height:auto;aspect-ratio:520/110;max-width:100%}
.hero-art svg{width:100%;height:100%}
.hero-art svg *{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:none}
.hero-art .thin{stroke-width:1.4;opacity:.75}
.hero-art .faint path{opacity:.35;stroke-width:1.6}
.hero-art .fill{fill:currentColor;fill-opacity:.35}
.hero-art .dot{fill:currentColor;stroke:none}
.hero-art .nodes circle{fill:var(--bg)}
.hero-art .flow{stroke-width:3.2;stroke-dasharray:2 26;animation:flow 1.4s linear infinite}
@keyframes flow{to{stroke-dashoffset:-28}}
.hero-art .beat{transform-box:fill-box;transform-origin:center;animation:beat 1.6s ease-in-out infinite}
@keyframes beat{0%,40%,100%{transform:scale(1)}12%{transform:scale(1.07)}24%{transform:scale(.99)}}
.hero-art .glow{animation:blink 1.4s ease-in-out infinite}
@keyframes blink{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.hero-art .flow,.hero-art .beat,.hero-art .glow{animation:none}}
.seg button,.btn,.chip,.new{white-space:nowrap}
/* C안에서 넣은 3칸 그리드가 좁은 화면의 1칸 규칙을 덮어써서 다시 1칸으로 */
@media (max-width:900px){.app{grid-template-columns:minmax(0,1fr)}}
/* v47: 고지 (AI 표시, 이용 안내 링크) */
.aitag{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.04em;padding:0 5px;border-radius:4px;border:1px solid var(--line2);color:var(--faint);vertical-align:1px}
.foot a,.policy-links a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.policy-links{text-align:center;font-size:12px;color:var(--faint);margin-top:-6px}
.form .link{font-size:inherit}
/* v48: 보고서 난이도 선택, 로고 링크 */
.depth{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:16px 10px 0}
.depth .seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.depth > .small:last-child{flex-basis:100%}
a.logo{color:inherit;text-decoration:none}
/* v50: 사진 첨부 */
.composer .attach{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line2);background:transparent;color:var(--muted);font-size:20px;line-height:1;cursor:pointer}
.composer .attach:hover{border-color:var(--muted);color:var(--ink)}
.composer .attach:disabled{opacity:.35;cursor:not-allowed}
.composer.big .attach{align-self:flex-end}
.attach-row{width:100%;max-width:740px;margin:0 auto 8px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.thumb{position:relative;width:64px;height:64px;border-radius:10px;overflow:hidden;border:1px solid var(--line2);flex:none}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb button{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;border:0;background:rgba(0,0,0,.65);color:#fff;font-size:11px;cursor:pointer}
.msg.u .pics{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:80%}
.msg.u .pics img{width:120px;height:120px;object-fit:cover;border-radius:12px;border:1px solid var(--line2);background:var(--sunk)}
.txpic{width:96px;height:96px;object-fit:cover;border-radius:8px;margin:4px 4px 0 0;border:1px solid var(--line)}
/* v54: 계좌이체 안내 */
.acct{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1px solid var(--line2);border-radius:10px;background:var(--bg)}
.acct b{font-size:18px;letter-spacing:.02em}
.acct .link{align-self:flex-start;margin-top:2px}

/* v55: 접수 창 + 밴드형 진행 보드 */
.intake-cta{display:flex;flex-direction:column;align-items:center;gap:8px}
.intake-cta .btn{padding:13px 30px;font-size:16px}
.modal .rail{max-width:none;margin:2px 0 4px}
.intake .fld{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:500}
.intake em{font-style:normal;font-weight:400;color:var(--muted);font-size:12.5px;margin-left:4px}
.intake .chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.intake textarea{border:1px solid var(--line2);background:var(--sunk);border-radius:8px;padding:9px 11px;font-weight:400;resize:vertical;line-height:1.5}
.intake .check{display:flex;flex-direction:row;align-items:center;gap:6px;font-weight:400;color:var(--muted);margin-top:2px}
.intake input[type=date]{color-scheme:inherit}
.modal:has(.intake){max-width:560px}
.board{gap:0}
.bhead{position:sticky;top:-20px;z-index:3;background:var(--bg);border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);border-radius:14px;padding:14px 16px;margin-bottom:6px;display:flex;flex-direction:column;gap:10px;box-shadow:0 6px 16px -8px rgba(0,0,0,.5)}
.bhead .bt{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.bhead .bt b{font-size:15.5px}
.dtag{font-size:12px;font-weight:500;padding:2px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent)}
.bhead .rail{max-width:none;margin:0}
.bhead .next{margin:0;font-size:13.5px;color:var(--muted)}
.bhead .next b{color:var(--ink);font-weight:600}
.cmt{display:flex;gap:12px;padding:16px 0;border-top:1px solid var(--line)}
.cmt:nth-child(2){border-top:0}
.cav{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:12.5px;font-weight:600}
.cav.n{background:var(--accent);color:var(--accent-ink)}
.cav.u{background:var(--raise);color:var(--ink);border:1px solid var(--line2)}
.cbody{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.cname{font-size:13px;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.ctime{font-size:11.5px;font-weight:400;color:var(--faint);margin-left:6px}
.cmt .txt{margin:0;white-space:pre-wrap;line-height:1.7}
.cmt.mine .txt{color:color-mix(in srgb,var(--ink) 88%,var(--bg))}
.cmt .pics{display:flex;gap:6px;flex-wrap:wrap}
.cmt .pics img{width:120px;height:120px;object-fit:cover;border-radius:12px;border:1px solid var(--line2);background:var(--sunk)}
.board > .card{margin:8px 0}
.waiting{margin:10px 0;font-size:12.5px;color:var(--warn);background:var(--warn-soft);border-radius:10px;padding:8px 12px}
/* v61: 강조 카드는 제목 + 한 줄 + 꼬리표로 짧게 */
.val{gap:8px}
.val b{font-size:18px}
.val p{font-size:15px;color:var(--ink);line-height:1.5}
.vlines{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-direction:column;gap:3px}
.vlines li{font-size:14.5px;line-height:1.55;color:color-mix(in srgb,var(--ink) 80%,var(--bg))}
.vlines li:last-child{color:var(--muted);font-size:13.5px;margin-top:2px}
.vlines em{font-style:normal;font-weight:600;color:var(--accent-text)}
.vtags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.vtags span{font-size:12.5px;font-weight:500;padding:3px 10px;border-radius:999px;white-space:nowrap;border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);color:var(--accent-text);background:color-mix(in srgb,var(--accent) 8%,transparent)}
/* v64: 강조 카드는 한 줄이 끝까지 한 줄로 보이게 넓힌다. 자리가 모자라면 카드가 아래로 내려간다(2+1, 1열). */
.col.home{max-width:1140px}
.home .values{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));width:100%}
.vlines li{white-space:nowrap}
@media (max-width:480px){.vlines li{white-space:normal}}

/* v65 그래프 · 이전 탐구 연결 */
.md figure.chart{margin:14px 0;padding:12px 12px 8px;border:1px solid var(--line);border-radius:10px;background:var(--sunk)}
.md figure.chart figcaption{font-size:12.5px;color:var(--muted);margin-top:6px;line-height:1.5}
.md figure.chart figcaption b{color:var(--ink)}
.clegend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--muted);margin-top:4px}
.clegend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.cdata{margin-top:6px;font-size:12.5px}.cdata summary{cursor:pointer;color:var(--muted)}
.cdata table{margin-top:6px;font-size:12.5px}
.msec.link{border-left:3px solid var(--accent);background:var(--accent-soft);padding:2px 14px 6px;border-radius:0 10px 10px 0;margin:10px 0}
.tp-link{font-size:13px;color:var(--accent-text);margin:4px 0 0}

/* v66 탐구 흐름 */
.flowbtn{display:flex;align-items:center;gap:8px;margin:6px 12px 0;padding:8px 12px;border:1px solid var(--line2);border-radius:10px;background:transparent;color:var(--ink);font:inherit;font-size:13.5px;cursor:pointer;text-align:left}
.flowbtn:hover,.flowbtn[aria-current="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text)}
.col.flow{max-width:none;width:100%}
.fhead h2{margin:0 0 4px}.fhead p{margin:0 0 16px;font-size:14px}
.fcols{display:flex;align-items:stretch;gap:10px;overflow-x:auto;padding-bottom:12px}
.fcol{flex:0 0 300px;display:flex;flex-direction:column;gap:10px;padding:14px;border:1px solid var(--line2);border-radius:12px;background:var(--raise);min-width:0}
.fcol.now{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.fcol header{display:flex;align-items:center;gap:8px}.fcol header .tag{margin-left:auto}
.fno{font-size:13px;color:var(--accent-text);font-weight:600}
.ftitle{font-size:15px;line-height:1.4}
.flab{display:block;font-size:11.5px;font-weight:600;letter-spacing:.02em;color:var(--accent-text);margin-bottom:3px}
.fget,.fnext{font-size:13px;line-height:1.5;color:var(--muted);padding:8px 10px;border-radius:8px;background:var(--sunk)}
.fchat{flex:1;max-height:340px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;padding:2px 2px 2px 0}
.fchat p{margin:0;font-size:12.5px;line-height:1.5;padding:6px 9px;border-radius:8px;background:var(--sunk);color:var(--ink)}
.fchat p.u{background:var(--accent-soft)}
.fchat p b{font-size:11.5px;margin-right:6px;color:var(--muted);font-weight:600}
.farrow{align-self:center;color:var(--faint);font-size:20px;flex:0 0 auto}
.fadd{align-items:center;justify-content:center;text-align:center;border-style:dashed;background:transparent;color:var(--muted);font:inherit;font-size:14px;cursor:pointer;flex-basis:200px}
.fadd:hover{color:var(--accent-text);border-color:var(--accent)}
.fadd .plus{font-size:24px;line-height:1}
@media (max-width:900px){.fcols{flex-direction:column;overflow:visible}.fcol{flex-basis:auto}.farrow{transform:rotate(90deg)}.fadd{padding:22px}}
.fget.on{background:var(--accent-soft);color:var(--ink);border-left:3px solid var(--accent)}

/* v68 흐름 여러 개 */
.ftabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.ftabs button{font:inherit;font-size:13.5px;padding:6px 12px;border-radius:999px;border:1px solid var(--line2);background:transparent;color:var(--muted);cursor:pointer}
.ftabs button[aria-selected="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.ftabs .fnew{border-style:dashed}
.fbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-bottom:14px}
.fbar input{font:inherit;font-size:13.5px;margin-left:6px;padding:5px 9px;border-radius:8px;border:1px solid var(--line2);background:var(--sunk);color:var(--ink);width:160px}
.ftools{display:flex;gap:6px;align-items:center}
.ftools select{flex:1;min-width:0;font:inherit;font-size:13px;padding:6px 8px;border-radius:8px;border:1px solid var(--line2);background:var(--sunk);color:var(--ink)}
.ftools .icon-btn:disabled{opacity:.3}
.fout{margin-top:22px;padding-top:16px;border-top:1px solid var(--line)}
.fout h3{font-size:15px;margin:0 0 8px}
.fout ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.fout li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--raise)}
.fout li b{font-size:14px;font-weight:500;min-width:0}

/* v69 끌어서 옮기기 · 불러오기 */
.fcol[draggable="true"]{cursor:grab}
.fcol.dragging{opacity:.4}
.fcol.drop-before{box-shadow:-6px 0 0 -2px var(--accent)}
.fadd.drop-end,.ftabs button.drop-on,.fout.drop-on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text)}
.fout{border-radius:12px;transition:background .15s}
.fout li[draggable="true"]{cursor:grab}
.fpick{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow-y:auto}
.fpick li label{display:flex;gap:10px;align-items:flex-start;padding:9px 12px;border:1px solid var(--line2);border-radius:10px;cursor:pointer}
.fpick li label>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.fpick b{font-weight:500;font-size:14px}

/* v70 챗 위 흐름 한 줄 */
.fstrip{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:0 0 8px;margin-bottom:8px;border-bottom:1px solid var(--line);min-width:0}
.fstrip>b{color:var(--accent-text);font-weight:600;white-space:nowrap}
.fs-sep,.fs-arr{color:var(--faint);flex:0 0 auto}
.fs-items{display:flex;align-items:center;gap:6px;overflow-x:auto;min-width:0;flex:1;white-space:nowrap;scrollbar-width:none}
.fs-item{font:inherit;font-size:12.5px;background:none;border:0;padding:2px 4px;border-radius:6px;color:var(--muted);cursor:pointer;white-space:nowrap}
.fs-item:hover{color:var(--ink);background:var(--sunk)}
.fs-now{color:var(--ink);font-weight:600;padding:2px 8px;border-radius:6px;background:var(--accent-soft);white-space:nowrap}
.fstrip .mono{color:var(--faint);font-size:11.5px}
.fstrip [data-fedit]{white-space:nowrap;flex:0 0 auto}

/* v71 흐름 줄 크게 */
.fstrip{display:block;margin:-2px 0 12px;padding:12px 14px;border:1px solid var(--accent);border-radius:12px;background:var(--accent-soft);border-bottom:1px solid var(--accent)}
.fs-top{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-bottom:10px;font-size:14px}
.fs-lab{font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--accent-ink);background:var(--accent);padding:2px 8px;border-radius:6px}
.fs-top b{font-size:15px;color:var(--ink)}
.fs-edit{margin-left:auto;font:inherit;font-size:13px;padding:5px 12px;border-radius:999px;border:1px solid var(--accent);background:transparent;color:var(--accent-text);cursor:pointer;white-space:nowrap}
.fs-edit:hover{background:var(--accent);color:var(--accent-ink)}
.fs-items{display:flex;align-items:center;gap:8px;overflow-x:auto;white-space:nowrap;scrollbar-width:thin;padding-bottom:2px}
.fs-chip{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:14px;padding:7px 12px;border-radius:10px;border:1px solid var(--line2);background:var(--bg);color:var(--ink);cursor:pointer;white-space:nowrap;flex:0 0 auto}
.fs-chip:hover{border-color:var(--accent)}
.fs-chip .no{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:var(--accent-text);font-weight:600}
.fs-chip.now{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600;cursor:default}
.fs-chip.now .no{color:var(--accent-ink)}
.fs-arr{color:var(--accent-text);font-size:16px;flex:0 0 auto}
.fs-items{scrollbar-width:none}.fs-items::-webkit-scrollbar{display:none}

/* v73 위 고정 칸 접기 */
.bhead{position:sticky}
.fold-btn{font:inherit;font-size:12.5px;padding:3px 10px;border-radius:999px;border:1px solid var(--line2);background:var(--bg);color:var(--muted);cursor:pointer;white-space:nowrap}
.fold-btn:hover{color:var(--ink);border-color:var(--accent)}
.fold-btn.top{position:absolute;top:-11px;right:16px;z-index:1}
.bhead.fold{padding:8px 12px}
.bmini{display:flex;align-items:center;gap:10px;min-width:0}
.bmini b{font-size:14.5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bmini .small{white-space:nowrap}
.bmini .fold-btn{margin-left:auto}
.bhead .bt .fold-btn{margin-left:8px}
.bhead .bt{justify-content:flex-start}.bhead .bt>b{margin-right:auto}

/* v76 글꼴 SUIT + Claude 느낌 덜기: 밑줄 탭, 사각 네온 버튼, 터미널형 입력창 (구성은 그대로) */
:root{--f:"SUIT Variable","SUIT","Pretendard Variable",Pretendard,"Apple SD Gothic Neo",sans-serif}
body{letter-spacing:-.01em}
h1,h2,.home h1,.bt b,.val b,.tp-title{letter-spacing:-.025em}

/* 상단 토글: 알약 → 밑줄 탭 (네온) */
.seg{background:transparent!important;border-radius:0;padding:0;gap:4px;border-bottom:1px solid var(--line2)}
.seg button{border-radius:0!important;padding:8px 12px 9px!important;font-size:14px;color:var(--muted);background:transparent!important;box-shadow:none!important;position:relative}
.seg button[aria-pressed="true"]{color:var(--accent-text)!important}
.seg button[aria-pressed="true"]::after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:2px;background:var(--accent);box-shadow:0 0 10px var(--accent)}
.seg button:hover{color:var(--ink)}

/* 사이드바 */
.new{width:100%!important;border-radius:8px!important;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent)!important;background:color-mix(in srgb,var(--accent) 8%,transparent)!important;color:var(--accent-text);padding:10px 12px!important;font-weight:600;justify-content:flex-start}
.new:hover{box-shadow:0 0 0 1px var(--accent),0 0 18px color-mix(in srgb,var(--accent) 30%,transparent)}
.new .plus{color:var(--accent)!important;font-size:18px;line-height:1}
.hist button{border-radius:6px!important;border-left:2px solid transparent}
.hist button[aria-current="true"]{background:color-mix(in srgb,var(--accent) 7%,transparent)!important;border-left-color:var(--accent)}
.hist .dot{display:none}
.hist button{grid-template-columns:minmax(0,1fr)!important}
.hist .s{grid-column:1!important;font-size:12px}

/* 버튼: 알약 → 각진 둥근 사각 */
.btn,.fold-btn,.fs-edit,.fs-chip,.flowbtn,.price,.chip{border-radius:8px!important}
.btn.pri{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--accent-ink)!important;font-weight:700;box-shadow:0 0 0 1px var(--accent),0 0 16px color-mix(in srgb,var(--accent) 35%,transparent)}
.btn.pri:hover{opacity:1;filter:brightness(1.08)}

/* 입력창: 둥근 알약 → 터미널형 박스 + 네온 포커스 */
.composer{border-radius:12px!important;background:var(--sunk)!important}
.composer:focus-within{border-color:var(--accent)!important;box-shadow:0 0 0 1px var(--accent),0 0 20px color-mix(in srgb,var(--accent) 25%,transparent)}
.send{border-radius:8px!important;background:var(--accent)!important;color:var(--accent-ink)!important}

/* 대화: 둥근 아바타 → 각진 배지 */
.cav{border-radius:8px!important}
.cav.n{box-shadow:0 0 12px color-mix(in srgb,var(--accent) 45%,transparent)}
.cons .cava{border-radius:8px}

/* 카드 모서리 조금 각지게 */
.val,.bhead,.fstrip,.topic,.modal,.panel .doc,.repcard{border-radius:10px!important}
.panel-h .btn,.panel-h .tag{white-space:nowrap;flex:none}

/* v78 접수창 '참고할 스토리' 한 줄 */
.inflow{border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);background:var(--accent-soft);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.inflow .if-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px}
.inflow .if-lab{font-size:12px;font-weight:700;color:var(--accent-ink);background:var(--accent);padding:2px 8px;border-radius:6px}
.inflow .if-row .link{margin-left:auto}
.inflow p{margin:0}

/* v79 접수 첫 화면: 처음 쓰기 / 이어서 쓰기 */
.startpick{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.startpick .sp{display:flex;flex-direction:column;gap:8px;text-align:left;padding:18px;border-radius:12px;border:1px solid var(--line2);background:var(--sunk);color:var(--ink);font:inherit;cursor:pointer;min-height:140px}
.startpick .sp b{font-size:17px}
.startpick .sp span{font-size:14px;line-height:1.6;color:var(--muted)}
.startpick .sp:hover,.startpick .sp:focus-visible{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 0 18px color-mix(in srgb,var(--accent) 25%,transparent);outline:none}
@media (max-width:560px){.startpick{grid-template-columns:1fr}}
/* v80 첫 화면 카드: 짧게, 단어 단위 줄바꿈 */
.startpick .sp{min-height:0;padding:20px;gap:6px}
.startpick .sp b,.startpick .sp span{word-break:keep-all;text-wrap:balance}
.startpick .sp span{font-size:14.5px}
.modal:has(.startpick){max-width:600px;width:100%}
/* v82 주제 2개 더 받기 */
.tp-more-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:4px}

/* 문자 인증 */
.otp-row{flex-wrap:nowrap} .otp-row input{flex:1;min-width:0}
/* 검수 예시: 빨간 줄 = 지운 곳, 초록 = 고친 곳, 오른쪽 = 컨설턴트 메모 */
.rv-teaser{border:1px solid var(--line);border-radius:12px;padding:12px;display:grid;gap:10px;margin:10px 0}
.rv-list{display:grid;gap:12px;margin:12px 0}
.rv-item{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:10px}
.rv-doc{background:var(--raise);border:1px solid var(--line);border-radius:10px;padding:12px 14px;min-width:0}
.rv-doc p{margin:6px 0 0;line-height:1.7}
.rv-sec{font-size:12px;font-weight:700;color:var(--muted)}
.rv-doc del,.rv-list+p del,p.small del{color:var(--bad);text-decoration-thickness:2px;background:var(--bad-soft)}
.rv-doc ins,p.small ins{color:var(--ok);text-decoration:none;background:var(--ok-soft);font-weight:600}
.rv-note{border-left:3px solid var(--bad);padding:6px 4px 6px 12px;min-width:0;position:relative}
.rv-note b{display:block;font-size:13px;margin-bottom:2px}
.rv-note p{margin:0;font-size:13px;line-height:1.6;color:var(--muted)}
.rv-num{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--bad);color:#fff;font-size:12px;font-weight:700;float:left;margin-right:6px}
.rv-checks{border-top:1px solid var(--line);padding-top:10px} .rv-checks ol{margin:6px 0 0;padding-left:20px;line-height:1.8}
@media (max-width:640px){.rv-item{grid-template-columns:1fr} .rv-note{border-left:0;border-top:2px solid var(--bad);padding:8px 2px 0}}

/* 첫 화면 강조 문장에서 검수 예시 열기 */
.hl-link{cursor:pointer} .hl-link:hover{background:linear-gradient(transparent 40%,color-mix(in srgb,var(--accent) 55%,transparent) 40%)}
.sample-chip{margin-left:6px;white-space:nowrap}
/* 검수 예시 창: 넓게 펴서 고친 곳 4개를 2×2로 한 화면에 */
.modal.modal-wide{max-width:min(1120px,96vw);padding:22px 24px}
.rv-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.rv-grid .rv-item{grid-template-columns:1fr;gap:8px;border:1px solid var(--line);border-radius:12px;padding:10px;align-content:start}
.rv-grid .rv-doc{border:0;padding:4px 6px;background:transparent}
.rv-grid .rv-doc p{font-size:14px;line-height:1.6}
.rv-grid .rv-note{border-left:0;border-top:2px solid var(--bad);padding:8px 6px 2px}
.nw{white-space:nowrap}
@media (max-width:760px){.rv-grid{grid-template-columns:1fr}}

/* 맥 테스트 서버 표시 */
.test-bar{position:fixed;top:8px;left:50%;transform:translateX(-50%);z-index:999;background:#E8590C;color:#fff;font-size:12.5px;font-weight:700;padding:5px 14px;border-radius:999px;pointer-events:none;box-shadow:0 2px 8px rgba(0,0,0,.18);white-space:nowrap}

/* 가입 직후 무료 이용권 안내 */
.gift{display:flex;flex-direction:column;gap:4px;border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--bg));border-radius:12px;padding:12px 14px}
.gift b{font-size:16px;color:var(--ink)} .gift span{font-size:13.5px;color:var(--muted);line-height:1.5}
.free-tk{color:var(--accent-text,var(--accent));font-weight:700}
/* 검수 예시 카드 v2: 번호·제목 → AI 초안(회색 취소선) → 컨설턴트 수정(진한 글씨, 초록 띠) → 이유 */
.rv-grid .rv-item{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border:1px solid var(--line2);border-radius:14px;background:var(--raise)}
.rv-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .rv-head b{font-size:15.5px;color:var(--ink)}
.rv-head .rv-num{float:none;margin:0}
.rv-head .rv-sec{margin-left:auto;font-size:12px;color:var(--faint);font-weight:600}
.rv-lab{display:block;font-size:11.5px;font-weight:700;letter-spacing:.02em;color:var(--faint);margin-bottom:3px}
.rv-before p,.rv-after p{margin:0;line-height:1.65;font-size:14.5px}
.rv-before del{color:var(--faint);text-decoration-color:var(--bad);text-decoration-thickness:1.5px;background:none}
.rv-after{border-left:4px solid var(--ok);background:var(--ok-soft);border-radius:0 10px 10px 0;padding:8px 12px}
.rv-after .rv-lab{color:var(--ok)} .rv-after p{color:var(--ink);font-weight:600}
.rv-why{margin:0;font-size:13.5px;line-height:1.6;color:var(--muted)}

/* 로고: 펼친 책 + AI 반짝이 */
.logo-mark{width:24px;height:24px;flex:none;display:block}

/* 검수 예시 v3: 보고서 본문에서 고친 곳이 하나씩 바뀐다 */
.rv3-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.rv3-seg{display:inline-flex;border:1px solid var(--line2);border-radius:10px;padding:3px;gap:3px}
.rv3-seg button{border:0;background:none;padding:7px 14px;border-radius:8px;font-weight:700;font-size:14px;color:var(--muted);cursor:pointer}
.rv3-seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink,#fff)}
.rv3{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:16px;align-items:start}
.rv3-doc{background:#fff;border:1px solid var(--line2);border-radius:12px;padding:20px 24px;max-height:min(62vh,560px);overflow-y:auto;color:#111}
.rv3-doc h3{margin:0 0 6px;font-size:18px} .rv3-doc h4{margin:16px 0 4px;font-size:14px;color:#444}
.rv3-doc p{margin:0;font-size:15px;line-height:1.85}
.rvc-new{display:none;background:linear-gradient(transparent 55%,#C8F2D4 55%);font-weight:600;color:#0B5A2B}
.rvc-old{transition:background .3s,color .3s}
.rvc.s1 .rvc-old{background:#FFF0A6}
.rvc.s2 .rvc-old{text-decoration:line-through;text-decoration-color:#E5484D;text-decoration-thickness:2.5px;color:#888;background:#FFF0A6}
.rvc.s3 .rvc-old{background:none}
.rvc.s3 .rvc-new{display:inline;animation:rvIn .5s ease}
.rvc-tag{display:none;margin-left:4px;font-size:11.5px;font-weight:800;color:#E5484D;border:1.5px solid #E5484D;border-radius:999px;padding:0 7px;vertical-align:super;white-space:nowrap;background:#fff}
.rvc.s3 .rvc-tag{display:inline-block;animation:rvIn .4s ease}
.rvc.focus{outline:2px solid #E5484D;outline-offset:3px;border-radius:4px}
@keyframes rvIn{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
.rv3-notes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.rv3-notes li{display:flex;gap:10px;border:1px solid var(--line2);border-radius:12px;padding:12px 14px;background:var(--raise);transition:opacity .3s,border-color .3s,box-shadow .3s}
.rv3-notes li.dim{opacity:.35} .rv3-notes li.flash{border-color:#E5484D;box-shadow:0 0 0 3px rgba(229,72,77,.15)}
.rv3-notes li .rv-num{flex:none;float:none;margin:2px 0 0}
.rv3-notes b{font-size:15px;color:var(--ink)} .rv3-notes .rv-sec{display:block;font-size:12px;color:var(--faint);margin:1px 0 4px}
.rv3-notes p{margin:0;font-size:13.5px;line-height:1.6;color:var(--muted)}
@media (max-width:820px){.rv3{grid-template-columns:1fr} .rv3-doc{max-height:none}}

/* 관리자: 새로 불러오기 버튼 (누르면 한 바퀴 이상 돈다) */
.spin-btn{font-size:18px;line-height:1;width:34px;height:34px;display:inline-grid;place-items:center;border:1px solid var(--line2);border-radius:10px;background:var(--raise);cursor:pointer}
.spin-btn.spinning{animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}