/* Layout: app shell — sticky header, one content column (max 1180px); bottom tab bar on phones, top tabs on wide screens; detail opens in a sheet.
   Calendar colours encode the STAGE (same hues the team already reads in TimeTree); the person is a small initial on each line. */
:root{
  --bg:#eef2f3; --surface:#ffffff; --surface-2:#f5f8f9; --ink:#14212b; --muted:#5b6a76; --line:#d8e0e5;
  --accent:#0a6c86; --accent-ink:#ffffff; --accent-soft:#d9ecf1;
  --late:#c3342a; --late-soft:#fbe4e1; --stuck:#a95c0a; --stuck-soft:#fbecd8; --ok:#2c7d50; --ok-soft:#dcf0e3;
  --c-home:#1f67b1; --c-home-soft:#dde9f7; --c-tool:#9a6108; --c-tool-soft:#f6e9d0; --c-other:#6c5ca3; --c-other-soft:#e8e4f5;
  --k-up:#c4306f; --k-final:#1b8656; --k-cut:#2f6cc9; --k-acopy:#c0650f; --k-shoot:#56636d; --k-script:#7b4cc4; --k-revise:#8a6400; --k-leave:#c3342a; --k-misc:#7d8a94; --k-ink:#ffffff;
  --p-tang:#d9681a; --p-xuan:#138a5b; --p-de:#7b4cc4; --p-an:#2563c9;
  --shadow:0 1px 2px rgba(20,33,43,.06),0 6px 20px rgba(20,33,43,.07);
  --scrim:rgba(12,20,26,.42);
  --f-body:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0f1519; --surface:#172027; --surface-2:#1d2830; --ink:#e4ebef; --muted:#94a4af; --line:#2b3943;
  --accent:#43b3d1; --accent-ink:#04212a; --accent-soft:#143944;
  --late:#ff7d71; --late-soft:#3d1e1c; --stuck:#f0a54e; --stuck-soft:#3a2a15; --ok:#62d08f; --ok-soft:#163323;
  --c-home:#78adec; --c-home-soft:#182d44; --c-tool:#e3a748; --c-tool-soft:#362a14; --c-other:#ab9de2; --c-other-soft:#2a2541;
  --k-up:#b8336c; --k-final:#1d7a51; --k-cut:#2f63b5; --k-acopy:#b05c10; --k-shoot:#4b5761; --k-script:#6d45ad; --k-revise:#7a5a00; --k-leave:#b8352c; --k-misc:#5f6b74;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 20px rgba(0,0,0,.3); --scrim:rgba(0,0,0,.6); color-scheme:dark }}
:root[data-theme="dark"]{
  --bg:#0f1519; --surface:#172027; --surface-2:#1d2830; --ink:#e4ebef; --muted:#94a4af; --line:#2b3943;
  --accent:#43b3d1; --accent-ink:#04212a; --accent-soft:#143944;
  --late:#ff7d71; --late-soft:#3d1e1c; --stuck:#f0a54e; --stuck-soft:#3a2a15; --ok:#62d08f; --ok-soft:#163323;
  --c-home:#78adec; --c-home-soft:#182d44; --c-tool:#e3a748; --c-tool-soft:#362a14; --c-other:#ab9de2; --c-other-soft:#2a2541;
  --k-up:#b8336c; --k-final:#1d7a51; --k-cut:#2f63b5; --k-acopy:#b05c10; --k-shoot:#4b5761; --k-script:#6d45ad; --k-revise:#7a5a00; --k-leave:#b8352c; --k-misc:#5f6b74;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 20px rgba(0,0,0,.3); --scrim:rgba(0,0,0,.6); color-scheme:dark }

*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.55;margin:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
h1,h2,h3{text-wrap:balance;margin:0}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--surface);border-bottom:1px solid var(--line)}
.top-in{max-width:1180px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.brand{display:flex;flex-direction:column;line-height:1.2;margin-right:auto}
.brand b{font-weight:900;font-size:17px;letter-spacing:.02em}
.brand span{font-size:12px;color:var(--muted)}
.sync{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.sync i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-soft)}
.sync.pulse i{animation:pulse 1s ease 2}
@keyframes pulse{50%{box-shadow:0 0 0 7px var(--ok-soft)}}
.who{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.who select{border:1px solid var(--line);background:var(--surface-2);border-radius:8px;padding:5px 8px;color:var(--ink)}
.ghost{border:1px solid var(--line);background:transparent;border-radius:8px;padding:5px 10px;font-size:13px}
.ghost:hover{background:var(--surface-2)}
.tabs{display:flex;gap:4px;max-width:1180px;margin:0 auto;padding:0 16px}
.tab{position:relative;border:0;background:none;padding:10px 14px;font-weight:500;color:var(--muted);border-bottom:2px solid transparent}
.tab[aria-current="page"]{color:var(--ink);border-bottom-color:var(--accent)}
.tab .n{display:inline-block;min-width:18px;margin-left:6px;padding:0 5px;border-radius:9px;background:var(--late);color:#fff;font-size:11px;line-height:18px;text-align:center}
.banner{max-width:1180px;margin:12px auto 0;padding:0 16px}
.banner p{margin:0;font-size:12.5px;color:var(--muted);background:var(--surface-2);border:1px dashed var(--line);border-radius:10px;padding:8px 12px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}

main{max-width:1180px;margin:0 auto;padding:16px 16px 40px;display:flex;flex-direction:column;gap:22px}
.sec{display:flex;flex-direction:column;gap:10px;min-width:0}
.sec-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.sec-h h2{font-size:17px;font-weight:700}
.sec-h .sub{font-size:13px;color:var(--muted)}
.sec-h .right{margin-left:auto}
.hello{display:flex;flex-direction:column;gap:2px}
.hello h1{font-size:22px;font-weight:900}
.hello p{margin:0;color:var(--muted)}

.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:2px;text-align:left}
.stat b{font-size:28px;font-weight:900;line-height:1.1;font-variant-numeric:tabular-nums}
.stat span{font-size:13px;color:var(--muted)}
.stat.late b{color:var(--late)} .stat.stuck b{color:var(--stuck)} .stat.soon b{color:var(--accent)}
.stat small{font-size:12px;color:var(--muted)}
button.stat:hover{border-color:var(--accent)}

.chase{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px}
.person{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.person-h{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--surface-2)}
.av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;background:var(--accent-soft);color:var(--accent);flex:none}
.av.none{background:var(--late-soft);color:var(--late)}
.person-h b{font-size:15px}
.person-h span{font-size:12px;color:var(--muted)}
.issue{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-top:1px solid var(--line)}
.issue:first-of-type{border-top:0}
.issue .body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.issue .name{font-weight:500;background:none;border:0;padding:0;text-align:left;cursor:pointer}
.issue .name:hover{color:var(--accent);text-decoration:underline}
.issue .acts{display:flex;gap:6px;flex:none}

.pill{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:500;padding:1px 8px;border-radius:999px;white-space:nowrap}
.pill.late,.pill.noowner{background:var(--late-soft);color:var(--late)}
.pill.stuck{background:var(--stuck-soft);color:var(--stuck)}
.pill.risk{background:transparent;color:var(--late);border:1px dashed var(--late)}
.pill.warn{background:transparent;color:var(--stuck);border:1px dashed var(--stuck)}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.plain{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
.stage{font-family:var(--f-mono);font-size:11.5px;font-weight:700;letter-spacing:.02em;padding:1px 7px;border-radius:5px;background:var(--accent-soft);color:var(--accent);white-space:nowrap}
.nat{font-size:11.5px;font-weight:700;padding:1px 7px;border-radius:5px;white-space:nowrap}
.nat.home{background:var(--c-home-soft);color:var(--c-home)}
.nat.tool{background:var(--c-tool-soft);color:var(--c-tool)}
.nat.other{background:var(--c-other-soft);color:var(--c-other)}
.meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12.5px;color:var(--muted)}

.btn{border:1px solid var(--line);background:var(--surface);border-radius:9px;padding:6px 12px;font-size:13.5px;font-weight:500}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{filter:brightness(1.08);color:var(--accent-ink)}
.btn.big{padding:12px 16px;font-size:16px;font-weight:700;border-radius:12px;width:100%}
.btn.sm{padding:4px 10px;font-size:12.5px}
.btn:disabled{opacity:.5;cursor:not-allowed}

.pipe-wrap{overflow-x:auto;padding-bottom:6px}
.pipe{display:grid;grid-template-columns:repeat(8,minmax(150px,1fr));gap:8px;min-width:1000px}
.col{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:6px;min-width:0}
.col-h{display:flex;justify-content:space-between;align-items:center;padding:2px 2px 4px}
.col-h .c{font-size:12px;color:var(--muted)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:8px 9px;text-align:left;display:flex;flex-direction:column;gap:5px;cursor:pointer;min-width:0}
.card:hover{border-color:var(--accent)}
.card.is-late{border-color:var(--late)} .card.is-stuck{border-color:var(--stuck)}
.card .t{font-size:13px;font-weight:500;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .meta{font-size:11.5px}
.empty-col{font-size:12px;color:var(--muted);text-align:center;padding:10px 0}

.load{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:12px}
.lrow{display:grid;grid-template-columns:78px minmax(0,1fr) 150px;gap:10px;align-items:center}
.lrow .nm{font-weight:500}
.bar{height:14px;border-radius:7px;background:var(--surface-2);border:1px solid var(--line);display:flex;overflow:hidden}
.bar i{display:block;height:100%}
.bar i.l{background:var(--accent)} .bar i.s{background:color-mix(in srgb,var(--accent) 45%,var(--surface))}
.bar.thin{height:8px}
.lrow .v{font-size:12.5px;color:var(--muted)}
.lrow .v b{color:var(--ink);font-size:15px}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);align-items:center}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}

.feed{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px 14px}
.fi{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px}
.fi:first-child{border-top:0}
.fi time{color:var(--muted);font-size:12px;flex:none;width:44px;padding-top:1px}
.fi.new{animation:flash 1.6s ease}
@keyframes flash{0%{background:var(--accent-soft)}100%{background:transparent}}
.feed-empty{color:var(--muted);font-size:13px;padding:10px 0}

.remind{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:4px 14px}
.rm{display:flex;gap:10px;align-items:center;padding:9px 0;border-top:1px solid var(--line);font-size:14px;flex-wrap:wrap}
.rm:first-child{border-top:0}
.rm .when{font-weight:700;min-width:64px}
.rm .when.today{color:var(--late)}
.rm .grow{flex:1;min-width:180px}

.mine{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.task{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow)}
.task.is-late{border-color:var(--late)}
.task-top{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.task h3{font-size:16px;font-weight:700;line-height:1.4}
.task .now{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.task .now .big{font-family:var(--f-mono);font-weight:700;font-size:22px;color:var(--accent)}
.task .prev{font-size:12.5px;color:var(--muted)}
.row2{display:flex;gap:8px;flex-wrap:wrap}
.row2 .btn{flex:1}
.queue{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:4px 14px}
.qi{display:flex;gap:10px;align-items:center;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px;flex-wrap:wrap}
.qi:first-child{border-top:0}
.qi .grow{flex:1;min-width:160px}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:14px;padding:22px;text-align:center;color:var(--muted)}

.seg{display:flex;gap:2px}
.seg i{flex:1;height:6px;border-radius:2px;background:var(--line)}
.seg i.d{background:var(--accent)}
.seg i.c{background:var(--accent);opacity:.35}
.seg i.c.late{background:var(--late);opacity:1}
.seg i.c.stuck{background:var(--stuck);opacity:1}

/* ---- schedule ---- */
.cal-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cal-head h2{font-size:18px;font-weight:900;min-width:120px}
.seg-toggle{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.seg-toggle button{border:0;background:var(--surface);padding:5px 14px;font-size:13.5px}
.seg-toggle button[aria-pressed="true"]{background:var(--ink);color:var(--bg);font-weight:700}
.sums{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:10px}
.sum{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;text-align:left;min-width:0}
.sum.primary{border-color:var(--accent);box-shadow:var(--shadow)}
button.sum:hover{border-color:var(--accent)}
.sum-top{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.sum-top .lbl{font-size:13px;color:var(--muted);margin-right:auto}
.sum-top b{font-size:30px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
.sum-top b.bad{color:var(--late)}
.state{font-size:12.5px;font-weight:700;padding:1px 9px;border-radius:999px;align-self:center}
.state.bad{background:var(--late-soft);color:var(--late)}
.state.ok{background:var(--ok-soft);color:var(--ok)}
details.lvl>summary,details.hint>summary,details.dd>summary{cursor:pointer;list-style:none;font-size:13px;color:var(--accent);font-weight:500;display:inline-flex;align-items:center;gap:4px}
details.lvl>summary::-webkit-details-marker,details.hint>summary::-webkit-details-marker,details.dd>summary::-webkit-details-marker{display:none}
details.lvl>summary::after,details.dd>summary::after{content:"▾";font-size:11px;transition:transform .15s}
details[open].lvl>summary::after,details[open].dd>summary::after{transform:rotate(180deg)}
.lvl-body{display:flex;flex-direction:column;gap:8px;padding-top:8px}
.lvl-body details.lvl{padding-top:2px}
details.hint>summary{color:var(--stuck);border:1px dashed var(--stuck);border-radius:999px;padding:1px 10px;font-size:12.5px}
details.hint>summary::before{content:"!";font-weight:900}
.hint-p{margin:6px 0 0;font-size:13px;color:var(--stuck);background:var(--stuck-soft);border-radius:8px;padding:8px 10px}
details.dd{position:relative}
details.dd>summary{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:5px 12px}
.dd-body{display:flex;gap:6px;flex-wrap:wrap;padding-top:8px}
.seg-toggle.sm{align-items:center}
.seg-toggle .seg-lbl{font-size:12.5px;color:var(--muted);padding:0 8px 0 10px}
.seg-toggle.sm button{padding:4px 12px;font-size:13px}
.sum-top span.of{font-size:14px;color:var(--muted)}
.types{display:flex;gap:10px;flex-wrap:wrap;font-size:13px}
.types span b{font-variant-numeric:tabular-nums}
.types .miss{color:var(--late)}
.gaps{display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:13px}
.gap{border:1px dashed var(--late);color:var(--late);background:transparent;border-radius:8px;padding:3px 9px;font-size:12.5px}
.gap:hover{background:var(--late-soft)}
.gap.past{border-style:solid;background:var(--late-soft)}
.gap.ok{border-color:var(--ok);color:var(--ok)}
.weeks{display:flex;gap:6px;flex-wrap:wrap}
.wk{border:1px solid var(--line);background:var(--surface-2);border-radius:8px;padding:3px 9px;font-size:12.5px}
.wk.bad{border-color:var(--late);color:var(--late)}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:5px 12px;font-size:13px;display:inline-flex;gap:6px;align-items:center}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.chip .av-s{width:20px;height:20px;font-size:11px}

/* event lines — same look in week and month views */
.ev{display:flex;align-items:center;gap:6px;width:100%;min-width:0;border:0;border-radius:6px;padding:3px 7px 3px 3px;font-size:12.5px;line-height:1.4;text-align:left;color:var(--k-ink);background:var(--k-misc);font-style:normal}
.ev .evt{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ev .nm{font-weight:700;letter-spacing:.01em}
.ev .tm{font-weight:700;margin-right:4px}
.ev .sub{opacity:.9}
.ev .tag{display:inline-block;font-size:10.5px;font-weight:700;line-height:1.5;background:rgba(255,255,255,.24);border-radius:4px;padding:0 4px;margin-right:5px;vertical-align:1px}
.ev .bell{flex:none;font-size:11px;opacity:.9}
.av-s{width:18px;height:18px;border-radius:50%;color:#fff;display:grid;place-items:center;font-size:10.5px;font-weight:900;font-style:normal;flex:none;box-shadow:0 0 0 2px rgba(255,255,255,.95)}
.ev.c-up{background:var(--k-up)} .ev.c-final{background:var(--k-final)} .ev.c-cut{background:var(--k-cut)} .ev.c-acopy{background:var(--k-acopy)}
.ev.c-shoot{background:var(--k-shoot)} .ev.c-script{background:var(--k-script)} .ev.c-revise{background:var(--k-revise)} .ev.c-leave{background:var(--k-leave)} .ev.c-misc{background:var(--k-misc)}
.ev.done{opacity:.5}
.ev.done .evt::before{content:"✓ "}
.ev.slot-empty{background:transparent;border:1px dashed var(--muted);color:var(--muted);padding-left:6px}
.ev.slot-empty.past{border:1px solid var(--late);color:var(--late);background:var(--late-soft)}
.ev.offday{box-shadow:inset 0 0 0 2px var(--stuck)}
.ev.warn{box-shadow:inset 0 0 0 2px var(--late)}
.ev.demo .evt::after{content:"・示意";opacity:.8}
.hol-line{font-size:11px;font-weight:700;color:#fff;background:var(--late);border-radius:5px;padding:1px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.wday{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:4px;min-width:0;min-height:180px}
.wday.today{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.wday.off{background:var(--surface-2)}
.wday-h{display:flex;align-items:baseline;gap:6px;padding-bottom:4px;border-bottom:1px solid var(--line);margin-bottom:2px}
.wday-h b{font-family:var(--f-mono);font-size:16px}
.wday-h span{font-size:12px;color:var(--muted)}
.wday-h .add{margin-left:auto;border:0;background:none;color:var(--muted);font-size:16px;line-height:1;padding:0 2px}
.wday-h .add:hover{color:var(--accent)}
.week .ev{align-items:flex-start;font-size:13px;padding:5px 7px 5px 4px}
.week .ev .evt{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.week .ev .av-s{margin-top:1px}
.wlbl{font-size:10.5px;color:var(--muted);letter-spacing:.06em;margin-top:4px}

.cal-wrap{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.dow{font-size:12px;color:var(--muted);text-align:center;padding:6px 0;background:var(--surface-2);border-bottom:1px solid var(--line)}
.day{min-height:112px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:4px;display:flex;flex-direction:column;gap:2px;text-align:left;background:var(--surface);min-width:0;cursor:pointer}
.day:nth-child(7n){border-right:0}
.day.blank{background:var(--surface-2);cursor:default}
.day.sel{box-shadow:inset 0 0 0 2px var(--accent)}
.day .num{font-size:12px;font-weight:700;font-family:var(--f-mono)}
.day.today .num{color:var(--accent-ink);background:var(--accent);border-radius:5px;padding:0 5px;align-self:flex-start}
.day.off{background:var(--surface-2)}
.day .ev{font-size:11.5px;padding:2px 5px 2px 3px;gap:4px}
.day .ev .tag{font-size:9.5px;padding:0 3px;margin-right:3px}
.day .ev .av-s{width:15px;height:15px;font-size:9px;box-shadow:0 0 0 1.5px rgba(255,255,255,.95)}
.more{font-size:11px;color:var(--muted);padding-left:4px}
.dots{display:none;gap:3px;flex-wrap:wrap}
.dots i{width:7px;height:7px;border-radius:50%}
.agenda{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.agenda h3{font-size:16px}
.agenda .ev{font-size:14px;padding:6px 9px 6px 5px}
.agenda .ev .av-s{width:22px;height:22px;font-size:12px}

/* projects */
.search{flex:1;min-width:200px;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:9px 12px}
.plist{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.prow{display:grid;grid-template-columns:minmax(0,1fr) 170px 110px;gap:14px;align-items:center;padding:12px 14px;border-top:1px solid var(--line);cursor:pointer;background:none;border-left:0;border-right:0;border-bottom:0;width:100%;text-align:left}
.prow:first-child{border-top:0}
.prow:hover{background:var(--surface-2)}
.prow .t{font-weight:500}
.prow .due{text-align:right;font-size:13px}
.prow .due.late{color:var(--late);font-weight:700}

/* sheet */
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:50;display:flex;align-items:flex-end;justify-content:center}
.sheet{background:var(--surface);width:100%;max-width:580px;max-height:88vh;overflow:auto;border-radius:18px 18px 0 0;padding:18px 18px calc(18px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}
@media (min-width:760px){.scrim{align-items:center}.sheet{border-radius:18px}}
.sheet-h{display:flex;gap:10px;align-items:flex-start}
.sheet-h h2{font-size:18px;flex:1;line-height:1.4}
.x{border:0;background:var(--surface-2);border-radius:50%;width:32px;height:32px;font-size:18px;line-height:1;flex:none}
.say{background:var(--surface-2);border-radius:10px;padding:10px 12px;font-size:14px}
.say.late{background:var(--late-soft);color:var(--late)}
.say.stuck{background:var(--stuck-soft);color:var(--stuck)}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:start;padding:7px 0;position:relative}
.step::before{content:"";position:absolute;left:10px;top:24px;bottom:-8px;width:2px;background:var(--line)}
.step:last-child::before{display:none}
.step .dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);background:var(--surface);display:grid;place-items:center;font-size:12px;position:relative;z-index:1}
.step.d .dot{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.step.c .dot{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.step.c.stuck .dot{border-color:var(--stuck);box-shadow:0 0 0 4px var(--stuck-soft)}
.step.c.late .dot{border-color:var(--late);box-shadow:0 0 0 4px var(--late-soft)}
.step .sn{font-weight:500}
.step.f .sn{color:var(--muted)}
.step .sw{font-size:12.5px;color:var(--muted)}
.step .sd{font-size:12.5px;color:var(--muted);text-align:right}
.field{display:flex;flex-direction:column;gap:5px;min-width:0}
.field label{font-size:13px;font-weight:500}
.field input,.field select,.field textarea{border:1px solid var(--line);background:var(--surface-2);border-radius:10px;padding:10px 12px;width:100%;min-width:0}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.handoff{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:10px;background:var(--accent-soft);color:var(--ink);font-size:14px}
.reasons{display:flex;flex-wrap:wrap;gap:6px}
.form{display:flex;flex-direction:column;gap:12px;font-size:14px}
.notes{font-size:14px;display:flex;flex-direction:column;gap:12px}
.notes h3{font-size:15px}
.notes ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.notes p{margin:0}
.hidden-dl{background:var(--surface-2);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:6px;font-size:13px}
.hidden-dl .row{display:flex;gap:8px;flex-wrap:wrap}
.check{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;cursor:pointer}
.check input{margin-top:3px;accent-color:var(--accent)}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:60;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:12px;font-size:14px;max-width:calc(100% - 32px);box-shadow:var(--shadow)}

.bnav{display:none}
@media (max-width:900px){ .week{grid-template-columns:1fr} .wday{min-height:0} .sums{grid-template-columns:1fr} }
@media (max-width:760px){
  .tabs{display:none}
  .bnav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
  .bnav button{border:0;background:none;padding:9px 0 8px;font-size:12px;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:2px;position:relative}
  .bnav button[aria-current="page"]{color:var(--accent);font-weight:700}
  .bnav svg{width:22px;height:22px}
  .bnav .n{position:absolute;top:4px;left:calc(50% + 6px);min-width:17px;padding:0 4px;border-radius:9px;background:var(--late);color:#fff;font-size:10.5px;line-height:17px}
  main{padding-bottom:96px}
  .toast{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .day{min-height:54px;padding:4px}
  .day .ev,.day .hol-line,.day .more{display:none}
  .dots{display:flex}
  .prow{grid-template-columns:minmax(0,1fr) 80px}
  .prow .who-col{display:none}
  .lrow{grid-template-columns:62px minmax(0,1fr)}
  .lrow .v{grid-column:2}
  .who label{display:none}
  .chase{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* version footer */
.ver{max-width:1180px;margin:0 auto;padding:0 16px 24px;display:flex;justify-content:flex-end}
.ver-btn{border:0;background:none;color:var(--muted);font-size:12px;font-family:var(--f-mono);text-decoration:underline;text-underline-offset:3px}
.ver-btn:hover{color:var(--accent)}
@media (max-width:760px){.ver{padding-bottom:84px}}

/* login / empty state */
.login{max-width:420px;margin:40px auto;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}
.login h1{font-size:22px;font-weight:900}
.login p{margin:0;color:var(--muted)}
.login img{border-radius:14px}
#lg-c{font-family:var(--f-mono);font-size:22px;letter-spacing:.3em;text-align:center}

/* overload — 最優先的提醒：放最上面、紅框，第一眼只看一行，點開才看建議 */
.overload{border:2px solid var(--late);background:var(--late-soft);border-radius:14px;padding:10px 14px;display:flex;flex-direction:column;gap:6px}
.ol-title{font-weight:900;color:var(--late);font-size:15px}
details.ol>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink);padding:4px 0}
details.ol>summary::-webkit-details-marker{display:none}
details.ol>summary::after{content:"▾";color:var(--late);font-size:11px;margin-left:auto;transition:transform .15s}
details[open].ol>summary::after{transform:rotate(180deg)}
.ol-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ol-head b{color:var(--late)}
.ol-head b:first-of-type{color:var(--ink)}
.ol-body{display:flex;flex-direction:column;gap:4px;padding:4px 0 8px 24px}
.ol-lbl{font-size:12px;font-weight:700;color:var(--muted);margin-top:4px}
.wday.over{border-color:var(--late);box-shadow:inset 0 0 0 1px var(--late)}
.ol-badge{font-size:11px;font-weight:700;color:#fff;background:var(--late);border-radius:999px;padding:0 7px;margin-left:2px}

/* 待主管同意：排在超載紅框下面 */
.approve{border:2px solid var(--stuck);background:var(--stuck-soft);border-radius:14px;padding:10px 14px;display:flex;flex-direction:column;gap:6px}
.ap-title{font-weight:900;color:var(--stuck);font-size:15px}
.approve details.ol>summary::after{color:var(--stuck)}
.ev.pending{background:transparent!important;border:1.5px dashed var(--stuck);color:var(--stuck)}
.ev.pending .tag{background:var(--stuck-soft);color:var(--stuck)}
.ev.pending .av-s{box-shadow:none}
/* 鈴鐺 */
.bell-btn{position:relative;border:1px solid var(--line);background:transparent;border-radius:8px;padding:4px 8px;color:var(--ink);display:inline-flex;align-items:center}
.bell-btn:hover{background:var(--surface-2)}
.bell-btn .n{position:absolute;top:-6px;right:-6px;min-width:18px;padding:0 5px;border-radius:9px;background:var(--late);color:#fff;font-size:11px;line-height:18px;text-align:center}
.rm.unread{background:var(--accent-soft);border-radius:8px;padding-left:8px;padding-right:8px}

/* header logo（恆準工程） */
.brand-logo{width:36px;height:36px;border-radius:9px;flex:none;display:block}