:root{--navy:#0b2447;--ink:#1c2f52;--muted:#5c6b86;--line:#e6eaf2;--bg:#fff;--soft:#f6f8fb;--accent:#0e7490;--accent-soft:#e0f2f7;
--ok:#15803d;--ok-bg:#e6f5ec;--warn:#9a5b00;--warn-bg:#fdf2dc;--bad:#b42318;--bad-bg:#fdeceb;--info:#1d4ed8;--info-bg:#e8efff;--na:#5b6577;--na-bg:#eef0f4;--late:#a15c07;--late-bg:#fff1dd;--r:14px}
*{box-sizing:border-box}html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--navy);font:14.5px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;color:var(--navy);line-height:1.25;font-weight:650}h1{font-size:26px}h2{font-size:19px}h3{font-size:15.5px}h4{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:650}
p{margin:0}a{color:var(--accent);text-decoration:none}button,select,input,textarea{font:inherit;color:inherit}
.muted{color:var(--muted)}.small{font-size:12.5px}.right{text-align:right}.nowrap{white-space:nowrap}.row{display:flex;align-items:center;gap:10px}.wrap{flex-wrap:wrap}.grow{flex:1}.gap16{gap:16px}.gap24{gap:24px}.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}.mt32{margin-top:32px}.col{display:flex;flex-direction:column}
.flag{border-radius:3px;box-shadow:0 0 0 1px rgba(11,36,71,.14);flex:none;vertical-align:middle}
.banner{background:#fff8e6;border-bottom:1px solid #f1e0aa;color:#6b4e00;text-align:center;font-size:12.5px;padding:6px 12px}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 16px;cursor:pointer;font-weight:600;font-size:13.5px;color:var(--navy);transition:background .12s,border-color .12s}
.btn:hover{background:var(--soft);border-color:#d3dae8}.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}.btn.primary:hover{background:#12336b}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}.btn.ok:hover{filter:brightness(1.08)}.btn.bad{background:#fff;border-color:#f0c4c0;color:var(--bad)}.btn.bad:hover{background:var(--bad-bg)}
.btn.sm{padding:6px 12px;font-size:12.5px;border-radius:8px}.btn.ghost{border-color:transparent;background:transparent}.btn:disabled{opacity:.45;cursor:not-allowed}
.badge{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.b-ok{background:var(--ok-bg);color:var(--ok)}.b-warn{background:var(--warn-bg);color:var(--warn)}.b-bad{background:var(--bad-bg);color:var(--bad)}.b-info{background:var(--info-bg);color:var(--info)}.b-na{background:var(--na-bg);color:var(--na)}.b-late{background:var(--late-bg);color:var(--late)}
.b-live{background:var(--accent-soft);color:var(--accent)}.b-sample{background:#f3ecff;color:#6b3fb4}.b-plan{background:var(--na-bg);color:var(--na)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:currentColor}
/* login */
.hero{min-height:100%;display:flex;flex-direction:column}.hero-in{max-width:1120px;width:100%;margin:0 auto;padding:56px 32px 40px}
.brand{display:flex;align-items:baseline;gap:12px;font-size:22px;font-weight:750;letter-spacing:-.01em}.brand small{font-size:13px;color:var(--muted);font-weight:500;letter-spacing:0}
.hero h1{font-size:40px;letter-spacing:-.02em;margin-top:40px;max-width:820px;line-height:1.12}.hero .sub{font-size:18px;color:var(--muted);margin-top:16px;max-width:720px}
.pers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
.pcard{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:#fff;cursor:pointer;text-align:left;transition:box-shadow .15s,border-color .15s;display:flex;flex-direction:column;gap:8px}
.pcard:hover{box-shadow:0 8px 26px rgba(11,36,71,.08);border-color:#cfd8ea}.pcard h3{font-size:16px}.pcard .who{display:flex;align-items:center;gap:10px;margin-top:6px;font-size:13px;color:var(--muted)}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex:none}
.foot{margin-top:auto;border-top:1px solid var(--line);padding:18px 32px;color:var(--muted);font-size:12.5px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
/* app shell */
.shell{display:grid;grid-template-columns:252px 1fr;min-height:100vh}
.side{border-right:1px solid var(--line);padding:22px 16px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:4px;background:#fff;overflow:auto}
.side .brand{padding:2px 10px 18px;font-size:20px}.nav{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;color:var(--ink);font-weight:550;cursor:pointer;border:0;background:none;width:100%;text-align:left;font-size:14px}
.nav:hover{background:var(--soft)}.nav.on{background:var(--accent-soft);color:var(--accent)}.nav svg{width:18px;height:18px;flex:none}.nav .cnt{margin-left:auto;background:var(--bad);color:#fff;border-radius:999px;font-size:11px;padding:1px 7px;font-weight:700}
.nav .cnt.soft{background:var(--na-bg);color:var(--na)}
.side .spacer{flex:1}.side .small{padding:0 10px}
.main{min-width:0;display:flex;flex-direction:column}
.top{display:flex;align-items:center;gap:18px;padding:14px 40px;border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}
.top .co{display:flex;align-items:center;gap:10px;font-weight:650}.top .co span.muted{font-weight:500}
.who-btn{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:6px 12px 6px 8px;background:#fff;cursor:pointer}.who-btn:hover{background:var(--soft)}
.menu{position:absolute;right:40px;top:62px;width:380px;max-height:70vh;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 50px rgba(11,36,71,.18);padding:8px;z-index:60}
.menu h4{padding:10px 10px 4px}.menu .mi{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer}.menu .mi:hover{background:var(--soft)}.menu .mi.on{background:var(--accent-soft)}
.page{padding:32px 40px 56px;max-width:1380px;width:100%}.ph{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px;flex-wrap:wrap}.ph p{color:var(--muted);margin-top:4px;max-width:760px}
.card{border:1px solid var(--line);border-radius:var(--r);padding:22px;background:#fff}.card h3{margin-bottom:4px}
.grid{display:grid;gap:20px}.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}.g21{grid-template-columns:2fr 1fr}
.kpi{padding:22px}.kpi .v{font-size:36px;font-weight:700;letter-spacing:-.02em;line-height:1.1;margin:8px 0 6px}.kpi .l{font-size:13px;color:var(--muted);font-weight:600}.kpi .n{font-size:12.5px;color:var(--muted)}
.bar{height:8px;background:var(--na-bg);border-radius:999px;overflow:hidden}.bar>i{display:block;height:100%;background:var(--ok);border-radius:999px}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:24px}
.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 14px;cursor:pointer;font-weight:550;font-size:13px}
.chip:hover{background:var(--soft)}.chip.on{background:var(--navy);color:#fff;border-color:var(--navy)}
select,input[type=text],input[type=date],input[type=number],textarea{border:1px solid var(--line);border-radius:10px;padding:9px 12px;background:#fff;width:100%}
select.sm{width:auto;padding:7px 10px;border-radius:999px}textarea{resize:vertical;min-height:84px}
select:focus,input:focus,textarea:focus{outline:2px solid #b6dde8;border-color:var(--accent)}
label.f{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--ink)}label.f .hint{font-weight:450;color:var(--muted);font-size:12px}
/* tables */
table{width:100%;border-collapse:collapse}th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);text-align:left;font-weight:650;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:14px 12px;border-bottom:1px solid #eef1f6;vertical-align:middle}tr.click{cursor:pointer}tr.click:hover td{background:var(--soft)}tbody tr:last-child td{border-bottom:0}
.tw{overflow:auto;border:1px solid var(--line);border-radius:var(--r)}.tw table td,.tw table th{padding-left:18px}
.ent{display:inline-flex;align-items:center;gap:8px;font-weight:550;white-space:nowrap}
/* heat */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px;margin-top:12px}
.tile{border:1px solid var(--line);border-radius:12px;padding:14px;cursor:pointer;background:#fff;display:flex;flex-direction:column;gap:6px;border-left:6px solid var(--ok);transition:box-shadow .12s}
.tile:hover{box-shadow:0 6px 18px rgba(11,36,71,.08)}.tile.warn{border-left-color:#e0a100}.tile.bad{border-left-color:var(--bad);background:#fffafa}.tile.soon{border-left-color:#3b82f6}.tile.none{border-left-color:#cbd2de;background:var(--soft)}.tile.on{outline:2px solid var(--accent)}
.tile b{font-size:14px}.tile .s{font-size:12.5px;color:var(--muted)}
.jhead{display:flex;align-items:center;gap:10px;margin-top:22px;font-weight:650}
.leg{display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin-top:12px}.leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.matrix{overflow:auto;border:1px solid var(--line);border-radius:12px}.matrix table td,.matrix table th{padding:5px 10px;text-align:center;font-size:12.5px}.matrix td:first-child,.matrix th:first-child{text-align:left;position:sticky;left:0;background:#fff}
.cell{display:inline-block;min-width:34px;padding:3px 8px;border-radius:8px;font-weight:650}.c0{background:var(--ok-bg);color:var(--ok)}.c1{background:var(--warn-bg);color:var(--warn)}.c2{background:var(--bad-bg);color:var(--bad)}.cn{color:#b4bccb}
/* reminders */
.rem{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid #eef1f6}.rem:last-child{border:0}.rem .ic{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:none;font-size:14px}
/* kanban */
.kan{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.kcol{background:var(--soft);border-radius:14px;padding:14px;min-height:240px}.kcol h4{margin:2px 4px 12px;display:flex;justify-content:space-between}
.kcard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:10px;cursor:pointer;display:flex;flex-direction:column;gap:8px}.kcard:hover{box-shadow:0 6px 18px rgba(11,36,71,.08)}
.kcard .t{font-weight:600;line-height:1.35}
/* calendar */
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--line);border-radius:14px;overflow:hidden}.cal .dh{background:var(--soft);padding:10px 12px;font-size:12px;font-weight:650;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--line)}
.cal .d{min-width:0;min-height:118px;padding:8px;border-right:1px solid #eef1f6;border-bottom:1px solid #eef1f6;display:flex;flex-direction:column;gap:4px;background:#fff}.cal .d:nth-child(7n){border-right:0}.cal .d.out{background:#fafbfd}.cal .d.today{background:#f1f9fc}
.cal .num{font-size:12px;font-weight:650;color:var(--muted)}.cal .d.today .num{color:var(--accent)}
.ce{display:flex;align-items:center;gap:6px;font-size:11.5px;padding:3px 6px;border-radius:6px;background:var(--soft);cursor:pointer;border-left:3px solid #9aa6bb;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ce:hover{background:#e9eef7}
.ce.s-bad{border-left-color:var(--bad)}.ce.s-ok{border-left-color:var(--ok)}.ce.s-warn{border-left-color:#e0a100}.ce.s-info{border-left-color:#3b82f6}.ce.s-late{border-left-color:#d98a1f}
/* drawer and modal */
.ov{position:fixed;inset:0;background:rgba(11,36,71,.32);z-index:80;display:flex;justify-content:flex-end;animation:fade .15s}
.drawer{width:min(760px,100%);background:#fff;height:100%;overflow:auto;box-shadow:-18px 0 50px rgba(11,36,71,.2);display:flex;flex-direction:column;animation:slide .18s}
.drawer .hd{padding:24px 28px 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}.drawer .bd{padding:24px 28px 40px;display:flex;flex-direction:column;gap:22px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-top:14px}.tab{padding:9px 14px;cursor:pointer;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;font-size:13.5px}.tab.on{color:var(--accent);border-color:var(--accent)}
.modal{margin:auto;background:#fff;border-radius:16px;width:min(620px,94vw);max-height:90vh;overflow:auto;box-shadow:0 24px 70px rgba(11,36,71,.3);padding:28px}.ov.center{justify-content:center;align-items:center}
.full{position:fixed;inset:0;background:#fff;z-index:90;display:flex;flex-direction:column;animation:fade .15s}
.full .fh{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 28px;border-bottom:1px solid var(--line)}.full .fb{flex:1;display:grid;grid-template-columns:minmax(380px,.8fr) 1.2fr;min-height:0}
.full .left{padding:24px 28px;overflow:auto;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:20px}.full .right{background:var(--soft);padding:20px;display:flex;flex-direction:column;gap:12px;min-height:0}
.full .ff{padding:14px 28px;border-top:1px solid var(--line);display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#fff}
.doc{flex:1;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:auto;min-height:320px}.doc iframe,.doc img{width:100%;height:100%;border:0;display:block;object-fit:contain}
.paper{padding:34px 40px;font-family:Georgia,serif;color:#222;position:relative}.paper h3{font-family:system-ui;margin-bottom:12px}.paper .wm{position:absolute;right:26px;top:20px;font:700 11px system-ui;color:#b00;border:1px solid #b00;padding:3px 8px;border-radius:4px;letter-spacing:.06em}
.paper table td,.paper table th{padding:7px 0;border-bottom:1px solid #e5e5e5;font-size:13px}.paper th{color:#666}
.drop{border:2px dashed #c9d3e6;border-radius:14px;padding:26px;text-align:center;color:var(--muted);cursor:pointer;background:#fbfcfe}.drop.on,.drop:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.file{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;padding:10px 14px}.file .fi{width:34px;height:34px;border-radius:8px;background:var(--bad-bg);color:var(--bad);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex:none}
.hash{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted)}
.kv{display:grid;grid-template-columns:150px 1fr;gap:8px 16px;font-size:13.5px}.kv dt{color:var(--muted)}.kv dd{margin:0}
.crumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:13px}.crumb b{color:var(--navy);font-weight:600}
.note{border-radius:12px;padding:12px 16px;font-size:13px;display:flex;gap:10px}.n-info{background:var(--info-bg);color:#17327a}.n-warn{background:var(--warn-bg);color:#6b4100}.n-bad{background:var(--bad-bg);color:#7d1b14}.n-ok{background:var(--ok-bg);color:#0f5a2c}.n-sample{background:#f3ecff;color:#4d2b86}
.tl{display:flex;flex-direction:column;gap:0;margin-left:6px}.tl .e{display:flex;gap:14px;padding-bottom:16px;position:relative}.tl .e:before{content:"";position:absolute;left:4px;top:12px;bottom:0;width:1px;background:var(--line)}.tl .e:last-child:before{display:none}.tl i{width:9px;height:9px;border-radius:50%;background:var(--accent);margin-top:6px;flex:none}
/* tree */
.tree{border:1px solid var(--line);border-radius:14px;padding:12px;overflow:auto;max-height:70vh}.tn{padding:7px 10px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:13.5px}.tn:hover{background:var(--soft)}.tn.on{background:var(--accent-soft);color:var(--accent);font-weight:600}.tl1{margin-left:16px;border-left:1px solid var(--line);padding-left:6px}
.caret{width:14px;color:var(--muted);flex:none;font-size:11px}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--navy);color:#fff;padding:12px 20px;border-radius:12px;z-index:200;box-shadow:0 12px 40px rgba(0,0,0,.25);font-weight:550}
.tg{display:flex;flex-wrap:wrap;gap:6px}
.big{font-size:44px;font-weight:700;letter-spacing:-.02em;line-height:1}
.empty{padding:40px;text-align:center;color:var(--muted)}
.org{margin-left:14px;border-left:1px solid var(--line);padding-left:10px}.orgrow{display:flex;align-items:center;gap:10px;padding:5px 6px;border-radius:8px}.orgrow:hover{background:var(--soft)}.orgrow .nm{font-weight:550}
@keyframes fade{from{opacity:0}to{opacity:1}}@keyframes slide{from{transform:translateX(24px);opacity:.6}to{transform:none;opacity:1}}
@media(max-width:1100px){.side .brand{font-size:0}.side .brand:first-letter{font-size:22px}.g4{grid-template-columns:repeat(2,1fr)}.g21,.g3,.pers{grid-template-columns:1fr}.shell{grid-template-columns:76px 1fr}.nav span.t,.side .brand small,.side .small{display:none}.full .fb{grid-template-columns:1fr}.kan{grid-template-columns:repeat(2,1fr)}}
@media print{.side,.top,.banner,.noprint,.btn{display:none!important}.shell{display:block}.page{padding:0;max-width:none}.card{break-inside:avoid;border-color:#ccc}body{font-size:12px}.g4{grid-template-columns:repeat(4,1fr)}}