[hidden]:not([hidden=until-found i]){display:none!important}

/* KoPubWorld 돋움체: 보는 사람 컴퓨터에 설치된 폰트를 사용 (Light / Medium / Bold). 없으면 Noto Sans KR로 대체 */
@font-face{font-family:"KoPub Dotum WBS";font-weight:100 399;font-display:swap;
  src:local("KoPubWorld Dotum Light"),local("KoPubWorldDotum Light"),local("KoPubWorldDotumLight"),local("KoPubWorld돋움체 Light"),local("KoPubWorld Dotum Pro Light"),local("KoPubWorldDotumPro-Light"),local("KoPubWorld돋움체_Pro Light")}
@font-face{font-family:"KoPub Dotum WBS";font-weight:400 599;font-display:swap;
  src:local("KoPubWorld Dotum Medium"),local("KoPubWorldDotum Medium"),local("KoPubWorldDotumMedium"),local("KoPubWorld돋움체 Medium"),local("KoPubWorld Dotum Pro Medium"),local("KoPubWorldDotumPro-Medium"),local("KoPubWorld돋움체_Pro Medium")}
@font-face{font-family:"KoPub Dotum WBS";font-weight:600 900;font-display:swap;
  src:local("KoPubWorld Dotum Bold"),local("KoPubWorldDotum Bold"),local("KoPubWorldDotumBold"),local("KoPubWorld돋움체 Bold"),local("KoPubWorld Dotum Pro Bold"),local("KoPubWorldDotumPro-Bold"),local("KoPubWorld돋움체_Pro Bold")}
/* Layout: 프로젝트 전환 띠 → 선택 범위 개요(전체 또는 단일 사업) → 요약 지표 → 탭(WBS 일정표 | 업무분장). 전체 보기에서는 프로젝트별 머리행 아래 WBS가 한 간트 축을 공유. */
:root{
  --bg:#F3F5F8; --surface:#FFFFFF; --sunk:#EDF0F5; --grp:#E9EDF5; --grp2:#F4F6FA;
  --ink:#161B26; --muted:#586174; --faint:#8C94A6; --line:#DCE1EA; --line-strong:#C3CAD7;
  --accent:#2747B0; --accent-soft:#E1E7F8; --accent-ink:#FFFFFF;
  --today:#C9711A;
  --ok:#22815A; --ok-soft:#DCF0E5; --late:#C23B31; --late-soft:#F8E0DC;
  --hold:#7B8295; --hold-soft:#E7E9EF; --run:#2747B0; --run-soft:#E1E7F8; --wait:#8C94A6; --wait-soft:#EEF0F4;
  --p1:#3355C4; --p2:#C0562F; --p3:#23887A; --p4:#8A4CB5; --p5:#A9831A; --p6:#55702F;
  --f-kopub:"KoPub Dotum WBS","KoPubWorld돋움체","KoPubWorld Dotum","KoPubWorldDotum","KoPubWorld돋움체_Pro","KoPubWorld Dotum Pro","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --f-display:var(--f-kopub);
  --f-body:var(--f-kopub);
  --f-mono:var(--f-kopub);
  --shadow:0 6px 24px rgba(22,27,38,.12),0 1px 3px rgba(22,27,38,.08);
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#11141B; --surface:#191D27; --sunk:#151922; --grp:#222838; --grp2:#1D2230;
  --ink:#E6E9F0; --muted:#A0A8B9; --faint:#7A8294; --line:#2B3140; --line-strong:#3A4255;
  --accent:#8AA2F2; --accent-soft:#25304E; --accent-ink:#10131A;
  --today:#E6A14F;
  --ok:#5DC08C; --ok-soft:#1D3A2D; --late:#F07468; --late-soft:#43231F;
  --hold:#8F96A8; --hold-soft:#2A2F3B; --run:#8AA2F2; --run-soft:#25304E; --wait:#7A8294; --wait-soft:#242935;
  --p1:#8AA2F2; --p2:#EE8E66; --p3:#5CC3AF; --p4:#C28EE8; --p5:#DDBB56; --p6:#9EBE70;
  --shadow:0 8px 28px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.4);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#11141B; --surface:#191D27; --sunk:#151922; --grp:#222838; --grp2:#1D2230;
  --ink:#E6E9F0; --muted:#A0A8B9; --faint:#7A8294; --line:#2B3140; --line-strong:#3A4255;
  --accent:#8AA2F2; --accent-soft:#25304E; --accent-ink:#10131A;
  --today:#E6A14F;
  --ok:#5DC08C; --ok-soft:#1D3A2D; --late:#F07468; --late-soft:#43231F;
  --hold:#8F96A8; --hold-soft:#2A2F3B; --run:#8AA2F2; --run-soft:#25304E; --wait:#7A8294; --wait-soft:#242935;
  --p1:#8AA2F2; --p2:#EE8E66; --p3:#5CC3AF; --p4:#C28EE8; --p5:#DDBB56; --p6:#9EBE70;
  --shadow:0 8px 28px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.4);
  color-scheme:dark}

*{box-sizing:border-box}

button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.pc1{--pc:var(--p1)}.pc2{--pc:var(--p2)}.pc3{--pc:var(--p3)}.pc4{--pc:var(--p4)}.pc5{--pc:var(--p5)}.pc6{--pc:var(--p6)}
.sw{width:10px;height:10px;border-radius:3px;background:var(--pc,var(--faint));flex:none;display:inline-block}

/* Project switcher */
.projbar{display:flex;gap:6px;align-items:center;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}
.pbtn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:5px 12px;cursor:pointer;white-space:nowrap;font-size:13px;font-weight:500;color:var(--muted);max-width:280px}
.pbtn span.nm{overflow:hidden;text-overflow:ellipsis}
.pbtn:hover{border-color:var(--line-strong);color:var(--ink)}
.pbtn[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.pbtn .n{font-family:var(--f-mono);font-size:11px;opacity:.75}
.pbtn .ld{width:6px;height:6px;border-radius:50%;background:var(--late)}
.pbtn.add{border-style:dashed;color:var(--accent);font-weight:600}
.brand{font-size:12px;letter-spacing:.08em;color:var(--muted);font-weight:700;margin-right:6px;white-space:nowrap}

/* Header */
.head{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:flex-end;justify-content:space-between}
.head-main{min-width:0;flex:1 1 420px;display:flex;flex-direction:column;gap:6px}
.eyebrow{font-size:12px;letter-spacing:.06em;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:6px}
.namerow{display:flex;align-items:center;gap:4px;min-width:0}
.pname{font-family:var(--f-display);font-weight:700;font-size:clamp(22px,3vw,30px);line-height:1.25;border:1px solid transparent;border-radius:6px;background:transparent;padding:2px 6px;margin-left:-7px;width:100%;min-width:0}
.pname:hover:not(:disabled){border-color:var(--line)}
.pname:focus{border-color:var(--accent);background:var(--surface);outline:none}
h1.pname{margin:0 0 0 -7px;border:0}
.meta{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.meta label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.meta input{border:1px solid var(--line);background:var(--surface);border-radius:6px;padding:4px 8px;min-width:0}
.meta input[type=text]{width:9.5em}
.meta input[type=date]{font-family:var(--f-mono);font-size:13px}
.tilde{color:var(--faint)}
.hint{font-size:12px;color:var(--faint)}

/* Portfolio */
.pfbox{display:flex;flex-direction:column;gap:8px}
.pfbox:empty{display:none}
.pfhd{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 12px}
.pfhd h2{margin:0;font-size:15px;font-weight:700}
.pfhd .hint b{font-family:var(--f-mono);font-weight:500;color:var(--ink)}
.pfwrap{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow-x:auto}
table.pf{border-collapse:separate;border-spacing:0;table-layout:fixed;width:100%;min-width:1180px;font-size:13px}
.pf th{background:var(--sunk);font-size:12px;font-weight:600;color:var(--muted);text-align:left;padding:0 8px;height:36px;border-bottom:1px solid var(--line-strong);white-space:nowrap}
.pf th.num{text-align:right}
.pf td{border-bottom:1px solid var(--line);padding:0 2px;vertical-align:middle;height:42px;background:var(--surface)}
.pf tbody td:first-child{box-shadow:inset 3px 0 0 var(--pc)}
.pf tbody tr:hover td{background:color-mix(in srgb,var(--accent-soft) 40%,var(--surface))}
.pf .in{height:32px}
.pf .in.amt{text-align:right;font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.pf .namecell{display:flex;align-items:center;gap:6px;padding-left:8px;min-width:0}
.pf .namecell .in{font-weight:600}
.pf .cnt{font-size:12px;color:var(--muted);padding:0 8px;white-space:nowrap}
.pf .cnt b{font-family:var(--f-mono);font-weight:500;color:var(--ink)}
.pf .cnt b.late{color:var(--late)}
.pf tfoot td{background:var(--sunk);border-bottom:0;font-weight:600;height:40px}
.pf tfoot .tot{font-family:var(--f-mono);font-variant-numeric:tabular-nums;text-align:right;padding:0 10px;white-space:nowrap}
.pf tfoot .lbl{padding:0 12px;white-space:nowrap}
.pf tfoot .kr{padding:0 8px;font-weight:500;color:var(--muted);white-space:nowrap}

/* Banner */
.banner{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 25%,transparent);border-radius:8px;padding:8px 12px;font-size:13px}
.banner.warn{background:var(--hold-soft);border-color:var(--line-strong)}
.banner .grow{flex:1 1 240px;min-width:0}
#banners{display:flex;flex-direction:column;gap:8px}
#banners:empty{display:none}

/* Summary */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.stats:empty{display:none}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.stat .lbl{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.02em}
.stat .num{font-family:var(--f-mono);font-size:26px;font-weight:500;line-height:1.1;font-variant-numeric:tabular-nums}
.stat .num small{font-size:14px;color:var(--muted);margin-left:2px}
.stat .sub{font-size:12px;color:var(--muted)}
.stat.alert .num{color:var(--late)}
.dual{display:flex;flex-direction:column;gap:4px}
.dual .row{display:grid;grid-template-columns:30px 1fr 38px;gap:6px;align-items:center;font-size:11px;color:var(--muted)}
.track{height:6px;border-radius:3px;background:var(--sunk);overflow:hidden}
.track i{display:block;height:100%;background:var(--accent);border-radius:3px}
.track.plan i{background:var(--faint)}
.seg{display:flex;height:8px;border-radius:4px;overflow:hidden;background:var(--sunk)}
.seg i{display:block;height:100%}
.legend{display:flex;flex-wrap:wrap;gap:2px 10px;font-size:11px;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:4px}
.legend b{width:8px;height:8px;border-radius:2px;display:inline-block}
.plist{display:flex;flex-direction:column;gap:3px;font-size:12px}
.plist div{display:grid;grid-template-columns:10px 1fr auto;gap:6px;align-items:center;min-width:0}
.plist span.t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.plist b{font-family:var(--f-mono);font-weight:500}

/* Tabs + toolbar */
.bar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between}
.tabs{display:inline-flex;background:var(--sunk);border:1px solid var(--line);border-radius:8px;padding:3px;gap:2px}
.tabs button{border:0;background:transparent;padding:6px 14px;border-radius:6px;cursor:pointer;font-weight:600;color:var(--muted)}
.tabs button[aria-selected=true]{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tools select,.tools input{border:1px solid var(--line);background:var(--surface);border-radius:6px;padding:6px 8px;min-width:0}
.tools input[type=search]{width:12em}
.btn{border:1px solid var(--line-strong);background:var(--surface);border-radius:6px;padding:6px 12px;cursor:pointer;font-weight:500;white-space:nowrap}
.btn:hover{background:var(--sunk)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{filter:brightness(1.07)}
.btn.danger{color:var(--late)}
.btn.danger.armed{background:var(--late);border-color:var(--late);color:#fff}
.btn.sm{padding:3px 9px;font-size:12px}
.sep{width:1px;height:22px;background:var(--line)}

/* Table */
.tablewrap{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:auto;max-height:78vh;position:relative}
table.wbs{border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:13px}
.wbs th,.wbs td{border-bottom:1px solid var(--line);padding:0;vertical-align:middle;background:var(--surface)}
.wbs th{position:sticky;top:0;z-index:3;background:var(--sunk);font-size:12px;font-weight:600;color:var(--muted);text-align:left;padding:0 8px;height:46px;border-bottom:1px solid var(--line-strong);white-space:nowrap}
.wbs th.sticky{z-index:5}
.wbs td.sticky{position:sticky;z-index:2}
.s0{left:0}.s1{left:34px}.s2{left:100px;border-right:1px solid var(--line-strong)}
.wbs th.c-gantt{padding:0}
.wbs td>.in{height:38px}
.in{width:100%;border:1px solid transparent;background:transparent;padding:0 8px;border-radius:4px;min-width:0;height:30px}
.in:hover:not(:disabled){border-color:var(--line)}
.in:focus{border-color:var(--accent);background:var(--surface);outline:none}
.in:disabled{cursor:default}
.in::placeholder{color:var(--faint)}
input[type=date].in{font-family:var(--f-mono);font-size:12px;padding:0 4px}
input[type=number].in{font-family:var(--f-mono);text-align:right;padding-right:4px;width:52px}
select.in{padding:0 4px;cursor:pointer}
.cellbox{display:flex;align-items:center;gap:4px;padding:0 4px;min-width:0;height:38px}
.ro{padding:0 8px;font-family:var(--f-mono);font-size:12px;color:var(--muted);white-space:nowrap}
.dd{font-family:var(--f-mono);font-size:11px;color:var(--faint);white-space:nowrap;padding:0 8px 0 0}
.dd.late{color:var(--late);font-weight:500}
.dd.soon{color:var(--today);font-weight:500}
.txt{padding:0 8px;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}

tr.lv1 td{background:var(--grp)}
tr.lv1 .title{font-weight:700}
tr.grp:not(.lv1) td{background:var(--grp2)}
tr.grp:not(.lv1) .title{font-weight:600}
tr.is-late td.s0{box-shadow:inset 3px 0 0 var(--late)}
tbody tr:not(.proj):hover td{background:color-mix(in srgb,var(--accent-soft) 45%,var(--surface))}
tbody tr.lv1:hover td{background:color-mix(in srgb,var(--accent-soft) 45%,var(--grp))}
tr.proj td{background:color-mix(in srgb,var(--pc) 13%,var(--surface));border-top:2px solid var(--pc);border-bottom-color:color-mix(in srgb,var(--pc) 35%,var(--line))}
tbody tr.proj:first-child td{border-top-width:0}
tbody tr.proj:first-child td{box-shadow:inset 0 2px 0 var(--pc)}
.plink{border:0;background:transparent;padding:0 8px;font-weight:700;font-size:14px;cursor:pointer;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;height:38px}
.plink:hover{text-decoration:underline;text-underline-offset:3px}
.pmeta{display:flex;gap:10px;padding:0 8px;font-size:12px;color:var(--muted);white-space:nowrap}
.pmeta b{font-family:var(--f-mono);font-weight:500;color:var(--ink)}
.pmeta b.late{color:var(--late)}

.code{font-family:var(--f-mono);font-size:12px;color:var(--muted);white-space:nowrap}
.codebox{display:flex;align-items:center;gap:3px;padding:0 4px 0 2px;height:38px}
.tg{width:18px;height:18px;border:0;background:transparent;border-radius:4px;cursor:pointer;display:grid;place-items:center;color:var(--muted);padding:0;flex:none}
.tg:hover{background:var(--line)}
.tg svg{transition:transform .15s}
.tg[aria-expanded=false] svg{transform:rotate(-90deg)}
.tgph{width:18px;flex:none}
.titlebox{display:flex;align-items:center;height:38px;min-width:0}
.kebab{width:26px;height:26px;margin:0 4px;border:0;background:transparent;border-radius:5px;cursor:pointer;display:grid;place-items:center;color:var(--faint);flex:none}
.kebab:hover{background:var(--line);color:var(--ink)}

.chip{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;white-space:nowrap;line-height:1.5}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.st-wait{color:var(--wait);background:var(--wait-soft)}
.st-run{color:var(--run);background:var(--run-soft)}
.st-ok{color:var(--ok);background:var(--ok-soft)}
.st-hold{color:var(--hold);background:var(--hold-soft)}
.st-late{color:var(--late);background:var(--late-soft)}

.prog{display:flex;align-items:center;gap:4px;padding:0 6px 0 2px;width:100%}
.prog .track{flex:1;min-width:24px}
.prog .pct{font-family:var(--f-mono);font-size:12px;color:var(--muted);width:36px;text-align:right}
.track.ok i{background:var(--ok)}
.track.late i{background:var(--late)}
.track.hold i{background:var(--hold)}
.track.pj i{background:var(--pc)}

/* Gantt */
.ghead{position:relative;height:46px}
.ghead .mo{position:absolute;top:5px;font-size:11px;font-weight:700;color:var(--ink);padding-left:5px;border-left:1px solid var(--line-strong);height:14px;line-height:14px;white-space:nowrap}
.ghead .wk{position:absolute;bottom:5px;font-family:var(--f-mono);font-size:10px;color:var(--faint);padding-left:4px;white-space:nowrap}
.ghead .tdl{position:absolute;top:0;bottom:0;width:2px;background:var(--today)}
.ghead .tdl span{position:absolute;top:2px;left:4px;font-size:10px;font-weight:700;color:var(--today);white-space:nowrap;background:var(--sunk);padding:0 3px}
.gcell{position:relative;height:38px;background-image:repeating-linear-gradient(to right,transparent 0,transparent calc(var(--wk) - 1px),var(--line) calc(var(--wk) - 1px),var(--line) var(--wk))}
.gcell .tdl{position:absolute;top:0;bottom:0;width:2px;background:var(--today);opacity:.55}
.gbar{position:absolute;top:11px;height:16px;border-radius:4px;overflow:hidden}
.gbar i{display:block;height:100%}
.gbar.b-wait{background:var(--wait-soft);box-shadow:inset 0 0 0 1px var(--line-strong)}
.gbar.b-run{background:var(--run-soft)}.gbar.b-run i{background:var(--run)}
.gbar.b-ok{background:var(--ok)}.gbar.b-ok i{background:var(--ok)}
.gbar.b-hold{background:var(--hold-soft)}.gbar.b-hold i{background:var(--hold)}
.gbar.b-late{background:var(--late-soft);box-shadow:inset 0 0 0 1px var(--late)}.gbar.b-late i{background:var(--late)}
.gbar.grp{top:15px;height:8px;border-radius:0;background:var(--ink);overflow:visible;opacity:.8}
.gbar.grp::before,.gbar.grp::after{content:"";position:absolute;width:0;height:0;border-top:7px solid var(--ink);top:8px}
.gbar.grp::before{left:0;border-right:6px solid transparent}
.gbar.grp::after{right:0;border-left:6px solid transparent}
.gbar.grp i{display:none}
.gbar.pj{top:9px;height:20px;border-radius:5px;background:color-mix(in srgb,var(--pc) 22%,transparent);box-shadow:inset 0 0 0 1px var(--pc)}
.gbar.pj i{background:var(--pc);opacity:.85}

.empty{padding:40px 20px;text-align:center;display:flex;flex-direction:column;gap:12px;align-items:center;color:var(--muted)}
.empty h3{margin:0;font-family:var(--f-display);font-size:19px;color:var(--ink)}
.empty p{margin:0;max-width:44ch}
.empty .acts{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.addrow{display:flex;flex-wrap:wrap;gap:8px 12px;padding:10px 0;align-items:center}

/* Roles */
.roles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:12px;align-items:start}
.pcard{background:var(--surface);border:1px solid var(--line);border-radius:10px;display:flex;flex-direction:column;min-width:0}
.pcard header{padding:12px 14px;display:flex;flex-direction:column;gap:8px;border-bottom:1px solid var(--line)}
.pcard .who{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.pcard .who h3{margin:0;font-size:16px;font-weight:700}
.pcard .who span{font-size:12px;color:var(--muted)}
.pcard .kv{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--muted)}
.pcard .kv b{font-family:var(--f-mono);font-weight:500;color:var(--ink)}
.pcard .kv b.late{color:var(--late)}
.pmix{display:flex;height:6px;border-radius:3px;overflow:hidden;background:var(--sunk)}
.pmix i{display:block;height:100%;background:var(--pc)}
.pcard ul{list-style:none;margin:0;padding:6px 0}
.pcard li{display:grid;grid-template-columns:44px 1fr auto;gap:2px 8px;padding:6px 14px;align-items:center}
.pcard li .c{font-family:var(--f-mono);font-size:11px;color:var(--faint)}
.pcard li .t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard li .d{grid-column:2/3;font-size:11px;color:var(--muted);display:flex;gap:6px;align-items:center;min-width:0}
.pcard li .d .mono{white-space:nowrap}
.pcard li .d .pj{display:inline-flex;align-items:center;gap:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.pcard li .chip{grid-row:1/3;grid-column:3}
.pcard .subhd{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--faint);padding:8px 14px 0;border-top:1px dashed var(--line)}
.pcard.none{border-style:dashed}

/* Menu */
.menu{position:fixed;z-index:50;background:var(--surface);border:1px solid var(--line-strong);border-radius:8px;box-shadow:var(--shadow);padding:4px;display:flex;flex-direction:column;min-width:210px}
.menu button{border:0;background:transparent;text-align:left;padding:7px 10px;border-radius:5px;cursor:pointer;font-size:13px}
.menu button:hover,.menu button:focus-visible{background:var(--sunk)}
.menu button:disabled{color:var(--faint);cursor:default;background:transparent}
.menu .danger{color:var(--late)}
.menu .danger.armed{background:var(--late);color:#fff}
.menu hr{border:0;border-top:1px solid var(--line);margin:4px 2px}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:8px;font-size:13px;z-index:60;box-shadow:var(--shadow);max-width:calc(100% - 32px)}
.loading{padding:48px;text-align:center;color:var(--muted)}

@media (max-width:720px){
  .s2{position:static!important;border-right:0}
  .tools input[type=search]{width:100%}
  .tools{width:100%}
  .stat .num{font-size:22px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}


/* =====================================================================
   그룹웨어형 화면 (상단 바 · 왼쪽 아이콘 레일 · 보조 사이드바 · 본문)
   ===================================================================== */
:root{
  --bg:#FFFFFF; --surface:#FFFFFF; --sunk:#F5F6F8; --grp:#EEF1F4; --grp2:#F7F8FA;
  --ink:#1F2329; --muted:#646B76; --faint:#9AA0A9; --line:#E7E9ED; --line-strong:#D3D7DE;
  --accent:#0FA39A; --accent-2:#0B8C84; --accent-soft:#E3F4F2; --accent-ink:#FFFFFF;
  --run:#0FA39A; --run-soft:#E3F4F2; --ok:#2A9D5C; --ok-soft:#E1F3E8; --late:#E5484D; --late-soft:#FDE8E8;
  --today:#F08C00; --hold:#8A919C; --hold-soft:#EEF0F3; --wait:#9AA0A9; --wait-soft:#F1F2F4;
  --p1:#0FA39A; --p2:#3B6FE0; --p3:#E07B39; --p4:#8A5CD6; --p5:#C79A12; --p6:#D9488A;
  --rail:76px; --side:248px; --head:60px;
  --shadow:0 12px 32px rgba(17,24,39,.14),0 2px 6px rgba(17,24,39,.06);
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#15181D; --surface:#1B1F25; --sunk:#20252C; --grp:#252B33; --grp2:#1F242B;
  --ink:#E7EAEE; --muted:#A3AAB5; --faint:#7C8490; --line:#2C323B; --line-strong:#3A414C;
  --accent:#3CC8BC; --accent-2:#5AD6CB; --accent-soft:#183A38; --accent-ink:#0E1513;
  --run:#3CC8BC; --run-soft:#183A38; --ok:#53C07F; --ok-soft:#173528; --late:#FF6B6F; --late-soft:#3D1F21;
  --today:#FFA94D; --hold:#949BA6; --hold-soft:#2A2F37; --wait:#7C8490; --wait-soft:#252A31;
  --p1:#3CC8BC; --p2:#7EA2F5; --p3:#F2A06A; --p4:#B794F0; --p5:#E2BF4C; --p6:#F07BB0;
  --shadow:0 12px 32px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.35);
}}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:14px;line-height:1.5;letter-spacing:-.01em}
a{color:var(--accent-2);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
svg{flex:none}

/* ---- 상단 바 ---- */
.gh{position:sticky;top:0;z-index:40;height:var(--head);background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:0 18px 0 12px}
.gh .ib{width:40px;height:40px;border-radius:10px;border:0;background:transparent;display:grid;place-items:center;color:var(--muted);cursor:pointer;position:relative;flex:none}
.gh .ib:hover{background:var(--sunk);color:var(--ink);text-decoration:none}
.gh .ib.on{background:var(--accent-soft);color:var(--accent-2)}
.gh .ib b{position:absolute;top:4px;right:3px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--late);color:#fff;font-size:10px;line-height:17px;text-align:center;font-family:var(--f-mono);font-weight:700}
.brand2{display:flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:var(--ink);white-space:nowrap;margin-right:auto}
.brand2:hover{text-decoration:none}
.brand2 i{width:28px;height:28px;border-radius:8px;background:var(--accent);color:#fff;display:grid;place-items:center;font-style:normal;font-size:13px;font-weight:800}
.gsearch{display:flex;align-items:center;width:min(420px,38vw);height:40px;border:1px solid var(--line-strong);border-radius:999px;background:var(--surface);padding:0 6px 0 4px}
.gsearch select{border:0;background:transparent;font:inherit;font-size:13px;color:var(--ink);padding:0 6px 0 10px;cursor:pointer;border-right:1px solid var(--line);height:22px}
.gsearch svg{color:var(--faint);margin-left:10px}
.gsearch input{flex:1;min-width:0;border:0;background:transparent;font:inherit;color:inherit;padding:0 8px;height:38px}
.gsearch input:focus{outline:none}
.gsearch:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.gtools{display:flex;align-items:center;gap:4px}
.me{display:flex;align-items:center;gap:8px;border:0;background:transparent;padding:4px 6px 4px 4px;border-radius:999px;cursor:pointer;color:var(--ink);font:inherit}
.me:hover{background:var(--sunk)}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--accent-soft);color:var(--accent-2);display:grid;place-items:center;font-weight:700;font-size:13px;flex:none}
.me .nm{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2;font-size:13px;font-weight:600}
.me .nm small{font-size:11px;color:var(--muted);font-weight:400}

/* ---- 몸통: 레일 + 보조 사이드바 + 본문 ---- */
.shell{display:grid;grid-template-columns:var(--rail) var(--side) minmax(0,1fr);min-height:calc(100vh - var(--head))}
.shell.noside{grid-template-columns:var(--rail) minmax(0,1fr)}
.rail{position:sticky;top:var(--head);height:calc(100vh - var(--head));overflow-y:auto;scrollbar-width:none;border-right:1px solid var(--line);background:var(--surface);display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 0 20px}
.rail a,.rail button{width:64px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;border-radius:10px;color:var(--muted);font-size:12px;border:0;background:transparent;cursor:pointer;font-family:inherit;position:relative}
.rail a:hover,.rail button:hover{text-decoration:none;color:var(--ink)}
.rail a .ri,.rail button .ri{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;transition:background .15s}
.rail a:hover .ri,.rail button:hover .ri{background:var(--sunk)}
.rail a.on{color:var(--accent-2);font-weight:700}
.rail a.on .ri{background:var(--accent);color:#fff;box-shadow:0 4px 10px color-mix(in srgb,var(--accent) 35%,transparent)}
.rail .rdot{position:absolute;top:6px;right:12px;width:8px;height:8px;border-radius:50%;background:var(--late);border:2px solid var(--surface)}
.rail hr{width:36px;border:0;border-top:1px solid var(--line);margin:6px 0}
.side{position:sticky;top:var(--head);height:calc(100vh - var(--head));overflow-y:auto;border-right:1px solid var(--line);background:var(--surface);padding:22px 18px 28px;display:flex;flex-direction:column;gap:16px}
.side h2{margin:0;font-size:20px;font-weight:700;display:flex;justify-content:space-between;align-items:center}
.side .act{display:flex;align-items:center;justify-content:center;gap:6px;height:46px;border:1.5px solid var(--ink);border-radius:10px;background:var(--surface);color:var(--ink);font-weight:600;font-size:15px;cursor:pointer;font-family:inherit;width:100%}
.side .act:hover{background:var(--sunk);text-decoration:none}
.side nav{display:flex;flex-direction:column;gap:2px}
.side nav .lbl{font-size:12px;font-weight:700;color:var(--faint);padding:10px 10px 4px;letter-spacing:.02em}
.side nav a{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;color:var(--ink);font-size:14px;min-width:0}
.side nav a span.t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side nav a:hover{background:var(--sunk);text-decoration:none}
.side nav a.on{background:var(--accent-soft);color:var(--accent-2);font-weight:700}
.side nav a em{font-style:normal;font-size:11px;font-family:var(--f-mono);color:var(--muted);background:var(--sunk);border-radius:999px;padding:1px 7px}
.side nav a em.hot{background:var(--late);color:#fff}
.side nav a .sw{width:8px;height:8px;border-radius:50%}
.sidebox{background:var(--sunk);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px}
.clock{font-size:13px;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:6px}
.clock .mono{font-weight:600}
.pill{display:inline-flex;align-items:center;font-size:11px;font-weight:700;padding:1px 8px;border-radius:999px;border:1.5px solid var(--accent);color:var(--accent-2);background:var(--surface);white-space:nowrap}
.sidebox .big{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;text-align:center;background:var(--surface);border-radius:10px;padding:12px 6px}
.sidebox .big small{display:block;font-size:11px;color:var(--muted)}
.sidebox .big b{font-family:var(--f-mono);font-size:22px;font-weight:600}
.sidebox .big b.late{color:var(--late)}
.sidebox .big i{color:var(--faint);font-style:normal}
.main{min-width:0;padding:26px 36px 60px;display:flex;flex-direction:column;gap:18px}
.main.narrow>*{max-width:1080px}
.sidechips{display:none}

/* ---- 공통 요소 ---- */
.ph{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 20px}
.ph h1{margin:0;font-size:22px;line-height:1.3;font-weight:700}
.ph .sub{color:var(--muted);font-size:13px;margin-top:4px}
.ph .acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;min-width:0}
.card>h2,.card .chd{margin:0;padding:14px 18px;font-size:15px;font-weight:700;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}
.card .chd h2{margin:0;font-size:15px}
.card .cbd{padding:16px 18px}
.card .cbd.flush{padding:0}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:18px;align-items:start}
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:16px;align-items:start}
.col{display:flex;flex-direction:column;gap:18px;min-width:0}
.muted{color:var(--muted)} .faint{color:var(--faint)} .late{color:var(--late)} .small{font-size:12px} .right{text-align:right}
.flash{padding:11px 16px;border-radius:10px;background:var(--ok-soft);color:var(--ok);font-weight:600;border:1px solid color-mix(in srgb,var(--ok) 25%,transparent)}
.flash.err{background:var(--late-soft);color:var(--late);border-color:color-mix(in srgb,var(--late) 25%,transparent)}
.btn{border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:7px 13px;cursor:pointer;font-weight:500;white-space:nowrap;font-family:inherit;font-size:13px;color:var(--ink)}
.btn:hover{background:var(--sunk);text-decoration:none}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{background:var(--accent-2);border-color:var(--accent-2)}
.btn.sm{padding:4px 10px;font-size:12px;border-radius:7px}
a.btn{display:inline-flex;align-items:center;gap:6px;color:var(--ink);text-decoration:none}
a.btn.primary{color:#fff}
.stat{border-radius:14px;padding:16px 18px;gap:8px}
.stat .lbl{font-size:13px;font-weight:600;color:var(--muted)}
.stat .num{font-size:28px;font-weight:600}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.track{height:7px;border-radius:4px}
.track i{background:var(--accent)}
.chip{font-size:11px;padding:2px 9px}
.tabs{border-radius:10px}
.tabs button,.tabs a{border-radius:8px}

/* 목록 표 */
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{background:var(--grp2);text-align:left;font-size:12px;color:var(--muted);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl .num{text-align:right;font-family:var(--f-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl tfoot td{background:var(--grp2);font-weight:700;border-top:1px solid var(--line)}
.scrollx{overflow-x:auto}
.cellprog{display:flex;align-items:center;gap:8px;min-width:120px}
.cellprog .track{flex:1}
.cellprog span{font-family:var(--f-mono);font-size:12px;color:var(--muted);width:34px;text-align:right}

/* 폼 */
.form{display:grid;gap:12px}
.form .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px}
.fld{display:flex;flex-direction:column;gap:5px;min-width:0}
.fld>span{font-size:12px;font-weight:600;color:var(--muted)}
.fld input,.fld select,.fld textarea,.ctl{border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:8px 11px;min-width:0;width:100%;font:inherit;color:inherit}
.fld textarea{min-height:76px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus,.ctl:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
select.ctl,input.ctl{width:auto}
.inline{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
details.box{background:var(--surface);border:1px solid var(--line);border-radius:14px}
details.box>summary{padding:14px 18px;cursor:pointer;font-weight:700;list-style:none;display:flex;align-items:center;gap:8px}
details.box>summary::-webkit-details-marker{display:none}
details.box>summary::before{content:"+";width:20px;height:20px;border-radius:6px;background:var(--accent-soft);color:var(--accent-2);display:grid;place-items:center;font-weight:700}
details.box[open]>summary::before{content:"−"}
details.box>.cbd{padding:0 18px 18px}

/* 메인: 날짜 띠 · 업무 목록 */
.agenda{display:flex;gap:6px;overflow-x:auto;padding:2px 0 4px;scrollbar-width:thin}
.aday{flex:0 0 62px;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:8px 4px;text-align:center;display:flex;flex-direction:column;gap:2px;color:var(--ink)}
.aday:hover{text-decoration:none;border-color:var(--line-strong)}
.aday .w{font-size:11px;color:var(--muted)}
.aday .d{font-family:var(--f-mono);font-size:17px;font-weight:600}
.aday .c{font-size:11px;color:var(--faint);min-height:16px;display:flex;justify-content:center;gap:3px}
.aday .c b{color:var(--accent-2);font-weight:700}
.aday .c b.due{color:var(--today)}
.aday .c b.td{color:var(--p4)}
.aday.today .w{color:#fff;background:var(--ink);border-radius:999px;width:22px;height:22px;line-height:22px;margin:0 auto;font-weight:700}
.aday.sun .w{color:var(--late)}
.aday.on{background:var(--accent-soft);border-color:var(--accent)}
.tlist{list-style:none;margin:0;padding:0}
.tlist li{display:grid;grid-template-columns:4px 1fr auto;gap:4px 12px;padding:11px 18px;border-bottom:1px solid var(--line);align-items:center}
.tlist li:last-child{border-bottom:0}
.tlist .pc{grid-row:1/3;align-self:stretch;border-radius:2px;background:var(--pc,var(--line-strong))}
.tlist .tt{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tlist .tt small{font-weight:500;color:var(--muted);margin-left:6px}
.tlist .meta2{grid-column:2/3;font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;align-items:center;min-width:0}
.tlist .tside{grid-row:1/3;grid-column:3;display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.tlist .qp{display:flex;gap:4px;align-items:center}
.tlist .qp input{width:56px;border:1px solid var(--line-strong);border-radius:6px;padding:3px 6px;font-family:var(--f-mono);text-align:right;background:var(--surface)}
.role{font-size:10px;font-weight:700;padding:1px 6px;border-radius:4px;background:var(--sunk);color:var(--muted)}
.role.main{background:var(--accent-soft);color:var(--accent-2)}
.role.todo{background:color-mix(in srgb,var(--p4) 14%,transparent);color:var(--p4)}
.sec-h{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--muted);padding:10px 18px 7px;background:var(--grp2);border-bottom:1px solid var(--line);display:flex;justify-content:space-between}
.sec-h.late{color:var(--late)}
.emptyline{padding:20px 18px;color:var(--faint);font-size:13px}

/* 프로젝트 카드 */
.pjcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:10px;border-top:4px solid var(--pc,var(--accent));min-width:0}
.pjcard h3{margin:0;font-size:15px;line-height:1.35}
.pjcard h3 a{color:var(--ink)}
.pjcard .row1{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.pjcard .kv{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--muted)}
.pjcard .kv b{color:var(--ink);font-weight:600;font-family:var(--f-mono)}
.pjcard .kv b.late{color:var(--late)}
.people{display:flex;flex-wrap:wrap;gap:4px}
.ptag{font-size:11px;padding:2px 8px;border-radius:999px;background:var(--sunk);color:var(--muted);white-space:nowrap}
.ptag.pm{background:var(--accent);color:#fff;font-weight:700}
.ptag.pl{background:var(--accent-soft);color:var(--accent-2);font-weight:700}
.pbar2{display:grid;grid-template-columns:34px 1fr 38px;gap:6px;align-items:center;font-size:11px;color:var(--muted)}
.pbar2 span:last-child{font-family:var(--f-mono);text-align:right}

/* 파일 */
.fcat{font-size:11px;padding:2px 8px;border-radius:6px;background:var(--sunk);color:var(--muted);white-space:nowrap;font-weight:600}
.fresh{font-size:11px;font-weight:700;color:var(--ok)}
.stale{font-size:11px;color:var(--faint)}
.ver{font-family:var(--f-mono);font-size:11px;padding:1px 6px;border-radius:5px;border:1px solid var(--line-strong);color:var(--muted)}
.months{display:flex;gap:4px;flex-wrap:wrap}
.months a{min-width:48px;text-align:center;padding:6px 8px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:13px}
.months a small{display:block;font-size:10px;color:var(--faint);font-family:var(--f-mono)}
.months a.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.months a.on small{color:var(--bg);opacity:.7}
.months a.none{color:var(--faint)}
.score{font-family:var(--f-mono);font-size:11px;color:var(--accent-2);font-weight:700}
.drop{border:2px dashed var(--line-strong);border-radius:12px;padding:20px;text-align:center;color:var(--muted);background:var(--grp2)}
.drop.over{border-color:var(--accent);background:var(--accent-soft)}

/* 알림 (전체 목록 화면용) */
.nlist{list-style:none;margin:0;padding:0}
.nlist li{display:flex;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line);align-items:flex-start}
.nlist li.unread{background:color-mix(in srgb,var(--accent-soft) 55%,var(--surface))}
.nlist li .dot{width:8px;height:8px;border-radius:50%;background:var(--accent);margin-top:7px;flex:none}
.nlist li.read .dot{background:transparent}
.nlist .nt{font-weight:600}
.nlist .nb{font-size:13px;color:var(--muted)}
.nlist .nd{font-size:11px;color:var(--faint);margin-left:auto;white-space:nowrap}

/* ---- 알림 팝업 ---- */
.npop{position:fixed;z-index:65;top:calc(var(--head) - 4px);right:16px;width:400px;max-width:calc(100vw - 24px);max-height:min(640px,calc(100vh - var(--head) - 16px));background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden}
.npop header{display:flex;align-items:center;gap:8px;padding:14px 16px 10px;border-bottom:1px solid var(--line)}
.npop header h3{margin:0;font-size:16px;flex:1}
.npop .ntabs{display:flex;gap:4px;padding:8px 12px;border-bottom:1px solid var(--line)}
.npop .ntabs button{border:0;background:transparent;padding:5px 10px;border-radius:999px;cursor:pointer;font:inherit;font-size:13px;color:var(--muted)}
.npop .ntabs button.on{background:var(--ink);color:var(--bg);font-weight:600}
.npop .nbody{overflow-y:auto;flex:1}
.npop .ni{display:grid;grid-template-columns:36px 1fr;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);cursor:pointer;text-align:left;width:100%;border-left:0;border-right:0;border-top:0;background:var(--surface);font:inherit;color:inherit}
.npop .ni:hover{background:var(--sunk)}
.npop .ni.unread{background:color-mix(in srgb,var(--accent-soft) 60%,var(--surface))}
.npop .ni .nic{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--sunk);color:var(--muted)}
.npop .ni .nic.assign,.npop .ni .nic.team{background:var(--accent-soft);color:var(--accent-2)}
.npop .ni .nic.task{background:color-mix(in srgb,var(--p2) 14%,transparent);color:var(--p2)}
.npop .ni .nic.done{background:var(--ok-soft);color:var(--ok)}
.npop .ni .nic.doc{background:color-mix(in srgb,var(--p3) 16%,transparent);color:var(--p3)}
.npop .ni .nic.digest{background:color-mix(in srgb,var(--today) 16%,transparent);color:var(--today)}
.npop .ni .nic.budget{background:var(--late-soft);color:var(--late)}
.npop .ni .nt{font-weight:600;font-size:13px;display:flex;gap:6px;align-items:baseline}
.npop .ni .nt span{flex:1;min-width:0}
.npop .ni .nt time{font-size:11px;color:var(--faint);font-weight:400;white-space:nowrap}
.npop .ni .nb{font-size:12px;color:var(--muted);margin-top:2px;word-break:break-word}
.npop .ni.unread .nt span::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--late);margin-right:6px;vertical-align:2px}
.npop footer{border-top:1px solid var(--line);padding:8px;display:flex;justify-content:center}
.npop .nempty{padding:40px 16px;text-align:center;color:var(--faint)}

/* ---- 드롭다운 (내 정보) ---- */
.medd{position:fixed;z-index:65;top:calc(var(--head) - 4px);right:16px;min-width:220px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px}
.medd .who2{padding:10px 12px 12px;border-bottom:1px solid var(--line);margin-bottom:4px}
.medd .who2 b{display:block}
.medd .who2 span{font-size:12px;color:var(--muted)}
.medd a{display:block;padding:9px 12px;border-radius:8px;color:var(--ink)}
.medd a:hover{background:var(--sunk);text-decoration:none}

/* ---- 전체 메뉴 ---- */
.allmenu{position:fixed;inset:0;z-index:70;background:var(--surface);display:flex;flex-direction:column;overflow:auto}
.allmenu header{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--surface)}
.allmenu header h2{margin:0;font-size:18px;flex:1}
.allmenu header input{width:min(260px,40vw);border:1px solid var(--line-strong);border-radius:8px;padding:8px 12px;font:inherit;background:var(--surface);color:inherit}
.allmenu .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:0;padding:8px 0}
.allmenu section{padding:16px 22px;border-right:1px solid var(--line)}
.allmenu section:last-child{border-right:0}
.allmenu h3{margin:0 0 12px;font-size:15px}
.allmenu .apps{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.allmenu .apps a{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;color:var(--ink);font-size:14px}
.allmenu .apps a:hover{background:var(--sunk);text-decoration:none}
.allmenu .apps a .ai{width:34px;height:34px;border-radius:9px;background:var(--accent-soft);color:var(--accent-2);display:grid;place-items:center}
.allmenu .apps a.on .ai{background:var(--accent);color:#fff}

/* 체크리스트 */
.chk td{padding:4px 4px}
.chk .in{height:34px}
.chk input[type=checkbox]{width:20px;height:20px;accent-color:var(--ok);cursor:pointer}
.chk tr.done td{background:color-mix(in srgb,var(--ok-soft) 60%,var(--surface))}
.chk tr.done .in.nm{text-decoration:line-through;color:var(--muted)}
.printhead{display:none}

/* 인증 화면 */
.auth{min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:linear-gradient(160deg,var(--accent-soft),var(--bg) 55%)}
.authbox{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:30px 26px;display:flex;flex-direction:column;gap:16px;box-shadow:var(--shadow)}
.authbox h1{margin:0;font-size:22px}
.authbox .btn{padding:11px 14px;font-size:15px}
.logo{display:flex;align-items:center;gap:8px;font-weight:700}
.logo i{width:28px;height:28px;border-radius:8px;background:var(--accent);color:#fff;display:grid;place-items:center;font-style:normal;font-size:13px;font-weight:800}

/* 날짜 이동 · 구분 버튼 */
.datebar{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.datebar b{font-size:18px;font-weight:600;margin:0 4px}
.seg2{display:inline-flex;border:1px solid var(--line-strong);border-radius:8px;overflow:hidden;margin-left:auto}
.seg2 a{padding:6px 14px;font-size:13px;color:var(--muted)}
.seg2 a+a{border-left:1px solid var(--line-strong)}
.seg2 a.on{background:var(--ink);color:var(--bg);font-weight:600}
.seg2 a:hover{text-decoration:none}

/* ---- 모바일 하단 탭 ---- */
.btmbar{display:none}
@media (max-width:1180px){
  .shell{grid-template-columns:var(--rail) minmax(0,1fr)}
  .side{display:none}
  .sidechips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:-8px 0 -4px;padding-bottom:2px}
  .sidechips a,.sidechips button{flex:none;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:13px;white-space:nowrap;font-family:inherit;cursor:pointer}
  .sidechips a.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-2);font-weight:700}
  .sidechips .actc{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
  .sidechips a:hover{text-decoration:none}
  .gsearch{width:min(320px,30vw)}
}
@media (max-width:860px){
  :root{--head:56px}
  .shell,.shell.noside{display:block}
  .rail{display:none}
  .gsearch,.me .nm,.hide-m{display:none!important}
  .gh{padding:0 8px;gap:4px}
  .main{padding:16px 14px calc(88px + env(safe-area-inset-bottom,0px));gap:14px}
  .ph h1{font-size:20px}
  .btmbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
  .btmbar a,.btmbar button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 0 7px;font-size:11px;color:var(--muted);border:0;background:transparent;cursor:pointer;position:relative;font-family:inherit}
  .btmbar a.on{color:var(--accent-2);font-weight:700}
  .btmbar a:hover{text-decoration:none}
  .btmbar b{position:absolute;top:3px;left:calc(50% + 6px);min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--late);color:#fff;font-size:10px;line-height:16px;font-family:var(--f-mono)}
  .npop,.medd{top:var(--head);right:0;left:0;width:auto;max-width:none;border-radius:0 0 14px 14px;max-height:calc(100vh - var(--head) - 64px)}
  .tlist li{padding:10px 12px}
  .card .cbd{padding:12px}
  .card>h2,.card .chd{padding:12px 14px}
  .allmenu .apps{grid-template-columns:1fr 1fr}
  .allmenu section{border-right:0;border-bottom:1px solid var(--line)}
}
@media (min-width:861px){.only-m{display:none!important}}

/* 인쇄 */
@media print{
  .gh,.rail,.side,.sidechips,.btmbar,.noprint,.btn,.tools{display:none!important}
  .shell{display:block}
  body{background:#fff;color:#000}
  .main{padding:0}
  .card{border:0}
  .printhead{display:block}
  .chk .in{border:0!important}
  .chk td,.chk th{border:1px solid #888!important;background:#fff!important}
}

.memberpick{display:flex;flex-wrap:wrap;gap:6px;max-height:180px;overflow:auto;padding:8px;border:1px solid var(--line-strong);border-radius:7px;background:var(--surface)}
.memberpick label{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;background:var(--sunk);font-size:13px;cursor:pointer}
.memberpick label:has(input:checked){background:var(--accent-soft);color:var(--accent);font-weight:600}
.memberpick small{color:var(--faint)}
.tabs a{padding:6px 14px;border-radius:6px;font-weight:600;color:var(--muted);white-space:nowrap}
.tabs a:hover{text-decoration:none;color:var(--ink)}
.tabs a.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}

/* 미리보기 창 */
.pvov{position:fixed;inset:0;z-index:70;background:rgba(10,14,22,.55);display:flex;align-items:center;justify-content:center;padding:24px}
.pvov iframe{width:min(1200px,100%);height:100%;border:0;border-radius:12px;background:var(--sunk);box-shadow:var(--shadow)}
@media (max-width:860px){.pvov{padding:0}.pvov iframe{border-radius:0}}
.ext{display:inline-grid;place-items:center;min-width:34px;height:20px;padding:0 4px;border-radius:4px;font-size:10px;font-weight:700;letter-spacing:.02em;color:#fff;background:var(--faint);font-family:var(--f-mono);vertical-align:1px}
.ext.pdf{background:#C23B31}.ext.hwp,.ext.hwpx{background:#2B7BC0}.ext.doc,.ext.docx{background:#2747B0}.ext.xls,.ext.xlsx,.ext.csv{background:#22815A}
.ext.ppt,.ext.pptx{background:#C0562F}.ext.img{background:#8A4CB5}.ext.vid{background:#55702F}.ext.zip{background:#7B8295}
.pvframe{width:100%;height:min(78vh,900px);border:0;display:block;background:var(--sunk);border-radius:0 0 10px 10px}
button.linkish{border:0;background:none;padding:0;color:var(--accent);cursor:pointer;font:inherit;text-align:left}
button.linkish:hover{text-decoration:underline;text-underline-offset:3px}
.note{font-size:12px;color:var(--muted);background:var(--hold-soft);border-radius:8px;padding:8px 12px}
.upprog{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--accent);border-radius:8px;background:var(--accent-soft)}
.upprog .track{height:8px;background:var(--surface)}

/* 개인 할 일 */
.todolist{list-style:none;margin:0;padding:0}
.todo{display:grid;grid-template-columns:auto 1fr auto;gap:2px 12px;align-items:start;padding:10px 16px;border-bottom:1px solid var(--line)}
.todo:last-child{border-bottom:0}
.tchk{padding-top:1px;cursor:pointer}
.tchk input{width:22px;height:22px;accent-color:var(--ok);cursor:pointer;margin:0}
.tchk input:disabled{cursor:default}
.tbody{display:flex;flex-direction:column;gap:2px;min-width:0}
.todo .tt{font-weight:600;word-break:break-word}
.todo .meta2{font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tmemo{font-size:12px;color:var(--muted);white-space:normal}
.todo.done .tt{text-decoration:line-through;color:var(--faint);font-weight:500}
.todo.done{background:color-mix(in srgb,var(--ok-soft) 35%,var(--surface))}
.donemark{color:var(--ok);font-weight:600}
.tedit{grid-column:1/-1;margin-top:8px;padding:10px;border:1px solid var(--line-strong);border-radius:8px;background:var(--sunk)}
.todoadd{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--sunk)}
.todoadd input[name=title]{flex:1 1 260px;width:auto}
.todoadd .ctl{width:auto}
@media (max-width:860px){.todo{padding:10px 12px}.todoadd{padding:10px 12px}.todoadd input[name=title]{flex-basis:100%}}
.rate{display:flex;align-items:center;gap:8px;min-width:120px}
.rate .track{flex:1}
.rate span{font-family:var(--f-mono);font-size:12px;width:38px;text-align:right}
.projbar .brand{display:none}