/* lab-portal theme v2 — 클로드·노션 중간. 라이트 = 클로드 웜 오프화이트, 다크 = 클로드 기준. data-theme=light|dark 강제, 없으면 시스템. */
:root{
 --bg:#faf9f5;--bg2:#f4f2ec;--panel:#efece4;--hover:#e9e6dd;--ink:#29261f;--ink2:#4a463d;--muted:#7d786c;--line:#dedbd0;--line2:#ccc8ba;
 --brand:#d97757;--brandbg:#f6e4da;
 --a0:#c8322b;--a0bg:#fbe9e7;--a1:#2457c5;--a1bg:#e6edfb;--b0:#d97a12;--b0bg:#fdf0df;--b1:#2b8a4b;--b1bg:#e4f3e9;--acc:#7a3fb5;--accbg:#efe6f8;--grey:#8c8c8c;
 --font:'Inter','Noto Sans KR','Helvetica Neue',sans-serif;--serif:'Iowan Old Style','Palatino','Georgia','Noto Serif KR',serif;--mono:'JetBrains Mono','SF Mono','Menlo',monospace;
 --r:10px;--shadow:0 1px 2px rgba(0,0,0,.04),0 4px 14px rgba(0,0,0,.04);color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
 --bg:#262624;--bg2:#2b2b29;--panel:#30302e;--hover:#3a3a37;--ink:#ecebe4;--ink2:#cfcdc4;--muted:#9c9a91;--line:#3f3f3b;--line2:#55544e;
 --brand:#d97757;--brandbg:#3d2e27;
 --a0:#ff7a70;--a0bg:#3a1f1d;--a1:#7aa2ff;--a1bg:#1d2740;--b0:#ffb454;--b0bg:#3a2a12;--b1:#6fd08c;--b1bg:#173321;--acc:#c49aff;--accbg:#2d1f3d;
 --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.25);color-scheme:dark}}
:root[data-theme=dark]{
 --bg:#262624;--bg2:#2b2b29;--panel:#30302e;--hover:#3a3a37;--ink:#ecebe4;--ink2:#cfcdc4;--muted:#9c9a91;--line:#3f3f3b;--line2:#55544e;
 --brand:#d97757;--brandbg:#3d2e27;
 --a0:#ff7a70;--a0bg:#3a1f1d;--a1:#7aa2ff;--a1bg:#1d2740;--b0:#ffb454;--b0bg:#3a2a12;--b1:#6fd08c;--b1bg:#173321;--acc:#c49aff;--accbg:#2d1f3d;
 --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.25);color-scheme:dark}

*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.65 var(--font);-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-decoration:none}a:hover{color:var(--brand)}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:-.01em;line-height:1.25}h1{font-size:28px}h2{font-size:21px;margin:28px 0 8px}h3{font-size:17px;margin:20px 0 6px}
button,input,select,textarea{font:inherit;color:inherit}
button{background:var(--bg);border:1px solid var(--line2);border-radius:8px;padding:6px 12px;cursor:pointer;transition:background .12s,border-color .12s}button:hover{background:var(--hover)}
button.primary{background:var(--brand);color:#fff;border-color:var(--brand)}button.primary:hover{filter:brightness(.95)}button.danger{color:var(--a0);border-color:var(--a0)}
button.ghost{border-color:transparent;background:transparent}button.ghost:hover{background:var(--hover)}
input,select,textarea{background:var(--bg);border:1px solid var(--line2);border-radius:8px;padding:6px 10px}input:focus,textarea:focus{outline:2px solid var(--brandbg);border-color:var(--brand)}
.mono{font-family:var(--mono)}.muted{color:var(--muted)}.small{font-size:13px}.serif{font-family:var(--serif)}
::selection{background:var(--brandbg)}

/* ---- 레이아웃: 사이드바 264 / 본문 / (문서) 코멘트 레일 */
.app{display:grid;grid-template-columns:264px 1fr;min-height:100vh}
.side{background:var(--bg2);border-right:1px solid var(--line);display:flex;flex-direction:column;height:100vh;position:sticky;top:0}
.side-top{padding:14px 12px 8px}.side-scroll{flex:1;overflow:auto;padding:0 8px 12px}.side-bottom{border-top:1px solid var(--line);padding:8px}
.ws{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;font-weight:600;cursor:default}.ws .logo{width:22px;height:22px;border-radius:6px;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:12px;font-family:var(--serif)}
.search{display:flex;align-items:center;gap:8px;margin:8px 0 4px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--muted)}.search input{border:0;background:transparent;padding:0;flex:1;color:var(--ink)}.search input:focus{outline:none}
.nav a,.nav .item{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:7px;color:var(--ink2);font-size:14px}.nav a:hover,.nav .item:hover{background:var(--hover);color:var(--ink)}.nav a.active{background:var(--hover);color:var(--ink);font-weight:600}
.nav svg{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.sec{margin:14px 8px 4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;display:flex;justify-content:space-between;align-items:center}
/* 트리: 옵시디언 가이드라인 + 클로드 픽토그램 */
.tree ul{list-style:none;margin:0;padding:0}.tree ul ul{margin-left:14px;border-left:1px solid var(--line2);padding-left:6px}
.tree li>.row{display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:7px;color:var(--ink2);font-size:14px;cursor:pointer}.tree li>.row:hover{background:var(--hover);color:var(--ink)}.tree li>.row.active{background:var(--hover);color:var(--ink);font-weight:600}
.tree .row svg{width:15px;height:15px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.8}
.tree .dot{width:6px;height:6px;border-radius:50%;border:1.5px solid var(--muted);flex:none;margin:0 4px 0 5px}.tree .row.active .dot{background:var(--brand);border-color:var(--brand)}
.tree .caret{width:12px;text-align:center;color:var(--muted);font-size:10px;transition:transform .12s}.tree li.closed>.row .caret{transform:rotate(-90deg)}.tree li.closed>ul{display:none}
.tree .more{margin-left:0;opacity:.35;color:var(--muted);padding:0 4px;border-radius:5px;line-height:1}.tree .row:hover .more,.tree .sec-in:hover .more{opacity:1}.tree .more:hover,.tree .plus:hover{background:var(--line);color:var(--ink)}
.tree .plus{opacity:0;color:var(--muted);padding:0 4px;border-radius:5px;font-size:13px;line-height:1.3}.tree .row:hover .plus,.tree .sec-in:hover .plus{opacity:1}.tree .sec-in .plus{margin-left:auto}.tree .sec-in .more{margin-left:0}
.tree .row.drop-before{box-shadow:0 -2px 0 0 var(--brand)}.tree .row.drop-after{box-shadow:0 2px 0 0 var(--brand)}
.tree .tag{font-family:var(--mono);font-size:11px;color:var(--muted);margin-left:auto}.tree .row .tag{margin-left:0}
.tree .lbl{flex:1;min-width:0}.tree .pinico{width:11px;height:11px;flex:none;fill:var(--brand);stroke:none;opacity:1}
.tree .prow{font-weight:600;color:var(--ink)}.tree li.proj>ul{margin-left:8px;border-left:0;padding-left:0}.tree .secli>ul{margin-left:8px}
.tree .sec-in{margin:8px 6px 2px;padding:2px 4px;border-radius:6px;justify-content:flex-start;gap:5px}.tree .secico svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.8;opacity:.8}.tree .sec-in.dropover,.tree .row.dropover{outline:2px solid var(--brand);outline-offset:-2px;background:var(--brandbg)}
.tree .row.dragging{opacity:.4}.tree input.rename{flex:1;min-width:0;padding:1px 6px;font-size:14px;border-radius:6px}
/* 노션식 컨텍스트 메뉴 */
.cmenu{position:fixed;z-index:60;width:240px;background:var(--bg);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow),0 12px 32px rgba(0,0,0,.12);padding:6px;max-height:70vh;overflow:auto}
.cmenu .it{display:flex;width:100%;gap:10px;align-items:center;padding:7px 10px;border:0;border-radius:8px;background:transparent;color:var(--ink);font-size:14px;text-align:left;line-height:1.3}
.cmenu .it:hover{background:var(--hover)}.cmenu .it:disabled{opacity:.4;cursor:default}.cmenu .it.danger{color:var(--a0)}.cmenu .it .lbl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmenu .ico{width:16px;height:16px;flex:none;display:grid;place-items:center}.cmenu .ico svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.cmenu .k{font-size:12px;color:var(--muted);margin-left:auto}.cmenu hr{border:0;border-top:1px solid var(--line);margin:4px 0}.cmenu .foot{padding:6px 10px 2px;font-size:12px;color:var(--muted);border-top:1px solid var(--line);margin-top:4px}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:10px;font-size:13px;z-index:70;box-shadow:var(--shadow)}
.user{display:flex;align-items:center;gap:10px;padding:8px;border-radius:8px;cursor:pointer}.user:hover{background:var(--hover)}
.avatar{width:30px;height:30px;border-radius:8px;background:var(--brandbg);color:var(--brand);display:grid;place-items:center;font-weight:700;font-size:13px;flex:none}
.menu{position:absolute;bottom:56px;left:8px;width:248px;background:var(--bg);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;z-index:20}
.menu a,.menu button{display:flex;width:100%;text-align:left;gap:8px;align-items:center;padding:8px 10px;border-radius:8px;border:0;background:transparent;color:var(--ink);font-size:14px}.menu a:hover,.menu button:hover{background:var(--hover)}.menu hr{border:0;border-top:1px solid var(--line);margin:4px 0}

.main{padding:36px 48px 80px;max-width:1180px;width:100%}
.topbar{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:18px;flex-wrap:wrap}
.badge{display:inline-block;padding:1px 8px;border-radius:999px;font-size:11px;font-weight:600;border:1px solid var(--line2);background:var(--bg2);color:var(--ink2)}
.badge.shared{background:var(--b1bg);border-color:var(--b1);color:var(--b1)}.badge.private{background:var(--accbg);border-color:var(--acc);color:var(--acc)}
.badge.admin{background:var(--brandbg);border-color:var(--brand);color:var(--brand)}.badge.coauthor{background:var(--a1bg);border-color:var(--a1);color:var(--a1)}.badge.guest{}
.card{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:8px 0;transition:border-color .12s,box-shadow .12s}.card:hover{border-color:var(--line2)}
a.card:hover{box-shadow:var(--shadow);color:inherit}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
table.tbl{border-collapse:collapse;width:100%}.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:7px 10px;text-align:left;vertical-align:top}.tbl th{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.02em}.tbl tr:hover td{background:var(--bg2)}
/* 대시보드 */
.greet{font-family:var(--serif);font-size:34px;text-align:center;margin:24px 0 36px;font-weight:400}
.dash-sec{margin:26px 0 8px;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);font-weight:600}.dash-sec svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8}
.recent{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px}.recent a{flex:0 0 190px;border:1px solid var(--line);border-radius:12px;padding:0;background:var(--bg);overflow:hidden}.recent a:hover{box-shadow:var(--shadow)}
.recent .band{height:34px;background:var(--panel)}.recent .body{padding:10px 12px}.recent .t{font-weight:600;font-size:14px;line-height:1.35;height:38px;overflow:hidden}.recent .m{font-size:12px;color:var(--muted);margin-top:8px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:980px){.split{grid-template-columns:1fr}}
.list{border:1px solid var(--line);border-radius:12px;background:var(--bg)}.list .li{display:flex;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);font-size:14px}.list .li:last-child{border-bottom:0}.list .li .grow{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list .li .when{color:var(--muted);font-size:12px;font-family:var(--mono)}
.empty{padding:24px;color:var(--muted);text-align:center;font-size:14px}
/* 편집 표시 약속 */
.sug-ins{text-decoration:underline;text-decoration-color:var(--b1);text-decoration-thickness:2px;background:var(--b1bg)}
.sug-del{text-decoration:line-through;text-decoration-color:var(--a0);color:var(--a0);background:var(--a0bg)}
.cm-anchor{background:var(--accbg);border-bottom:2px solid var(--acc)}
.conflict{background:var(--b0bg);border-left:4px solid var(--b0);padding:8px 12px}
/* 문서 */
.doc-wrap{display:grid;grid-template-columns:minmax(0,760px) 300px;gap:28px}@media(max-width:1100px){.doc-wrap{grid-template-columns:1fr}}
.blk{position:relative;padding:3px 8px;border-radius:8px;margin:0 -8px}.blk:hover{background:var(--bg2)}.blk.sel{background:var(--panel)}
.blk-body[contenteditable]:focus{outline:2px solid var(--brandbg);background:var(--bg);border-radius:6px}
.blk-tools{position:absolute;right:-6px;top:2px;display:none;gap:4px}.blk:hover .blk-tools,.blk.sel .blk-tools{display:flex}
.blk-tools button{padding:2px 7px;font-size:12px;border-radius:6px;background:var(--bg)}
.rail .card{padding:10px 12px}.rail textarea{width:100%;resize:vertical}
blockquote{border-left:3px solid var(--brand);margin:0;padding:4px 14px;color:var(--ink2);background:var(--bg2);border-radius:0 8px 8px 0}
pre{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:10px 12px;overflow:auto}code{background:var(--bg2);border-radius:4px;padding:0 4px;font-family:var(--mono);font-size:.92em}
hr{border:0;border-top:1px solid var(--line);margin:22px 0}
figure{margin:12px 0;cursor:zoom-in}figcaption{font-size:12px;color:var(--muted);margin-top:4px}svg.fig{max-width:100%;height:auto;background:var(--bg);border-radius:8px}
.login{max-width:400px;margin:14vh auto;padding:36px;border:1px solid var(--line);border-radius:16px;background:var(--bg);box-shadow:var(--shadow)}.login h2{margin:0 0 20px;font-size:26px}.login input{width:100%;font-size:20px;letter-spacing:.1em;text-align:center;font-family:var(--mono);padding:10px}
.toast{position:fixed;bottom:20px;right:20px;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:8px}
