/* EXPACK 5 — 紙トーン・丸み（EXPACK 2/3 の「デスク」系）。ビルド不要 */
:root{
  --bg:#f6f1e7; --card:#fffdf8; --surface:#efe9dc; --text:#2b2a27; --muted:#7a7466; --line:rgba(43,42,39,.13); --line-soft:rgba(43,42,39,.07);
  --accent:#3d9bd9; --accent-100:#eef5fb; --accent-700:#2a6f9f;
  --red:#c9452f; --amber:#c9851c; --green:#2f9e6b; --green-bg:#e4f5ec; --purple:#7a5cc2;
  --k-pickup:#7a5cc2; --k-arrive:#3d9bd9; --k-pack:#2f9e6b; --k-docs:#8b857a; --k-customs:#a46a21; --k-vanning:#d9583f; --k-shipout:#d8901f; --k-cut:#c9452f; --k-etd:#2a6f9f; --k-other:#a39c8f;
  --hd:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Yu Gothic UI",sans-serif;
  --body:"Hiragino Sans","Yu Gothic UI","Noto Sans JP",system-ui,sans-serif;
  --r:12px; --sh:0 1px 2px rgba(60,50,30,.06),0 8px 24px rgba(60,50,30,.07);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:15px;line-height:1.5}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer;border:1px solid var(--line);background:var(--card);border-radius:8px;padding:6px 12px}
button:hover{background:var(--surface)}
button.pri{background:var(--accent);border-color:var(--accent);color:#fff}
button.pri:hover{background:var(--accent-700)}
button.danger{color:var(--red);border-color:rgba(201,69,47,.4)}
button.ghost{border-color:transparent;background:transparent}
button.sm{padding:2px 8px;font-size:13px;border-radius:6px}
a.btn{display:inline-block;border:1px solid var(--line);background:var(--card);border-radius:8px;padding:6px 12px;text-decoration:none;color:inherit}
input,select,textarea{border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:#fff;width:100%}
textarea{min-height:70px;resize:vertical}
.muted{color:var(--muted)} .small{font-size:13px} .tiny{font-size:12px} .grow{flex:1} .row{display:flex;gap:8px;align-items:center;flex-wrap:wrap} .row.end{justify-content:flex-end;margin-top:14px}
.err{color:var(--red)} [hidden]{display:none !important}
.hd{font-family:var(--hd);font-weight:700}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh)}

/* header */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;white-space:nowrap;padding:8px 16px;background:rgba(246,241,231,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:baseline;gap:8px;font-family:var(--hd);flex-shrink:0} .brand b{font-size:19px}
.brand .tag{background:#ff7537;color:#54240e;font-size:12px;padding:1px 8px;border-radius:999px;font-weight:700}
.tabs{display:flex;gap:2px;background:var(--surface);border-radius:999px;padding:3px}
.tabs button{border:0;background:transparent;border-radius:999px;padding:5px 12px;font-family:var(--hd);font-weight:700;color:var(--muted);white-space:nowrap}
.tabs button.on{background:var(--card);color:var(--text);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.tabs .cnt{font-size:12px;color:var(--accent-700)}
.actions{margin-left:auto;display:flex;gap:6px;flex-shrink:0} .actions button{white-space:nowrap}
.bar{padding:6px 16px;font-size:13px;background:var(--accent-100);border-bottom:1px solid rgba(61,155,217,.3)}
.bar.err{background:#f7e9e9;color:var(--red)} .bar.ok{background:var(--green-bg);color:var(--green)}
main{padding:16px;max-width:1500px;margin:0 auto}

/* today */
.grid2{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}
@media (max-width:1000px){.grid2{grid-template-columns:1fr} .brand .small{display:none}}
.sec{padding:12px 14px;margin-bottom:14px}
.sec h2{font-family:var(--hd);font-size:16px;margin:0 0 8px;display:flex;align-items:center;gap:8px}
.sec h2 .n{font-size:12px;color:var(--muted);font-weight:500}
.dayblk{margin-bottom:10px}
.dayblk .dh{font-family:var(--hd);font-weight:700;font-size:14px;color:var(--accent-700);border-bottom:1px dashed var(--line);padding-bottom:2px;margin-bottom:4px}
.dayblk .dh.today{color:var(--red)}
.evline{display:flex;gap:8px;align-items:flex-start;padding:4px 2px;border-radius:6px;cursor:pointer}
.evline:hover{background:var(--surface)}
.evline .who{color:var(--muted);font-size:13px;white-space:nowrap}
.kchip{display:inline-block;font-family:var(--hd);font-weight:700;font-size:11px;color:#fff;border-radius:6px;padding:1px 6px;white-space:nowrap;min-width:36px;text-align:center}
.kchip.tent{opacity:.55;outline:1px dashed #fff;outline-offset:-2px}
.k-pickup{background:var(--k-pickup)} .k-arrive{background:var(--k-arrive)} .k-pack{background:var(--k-pack)} .k-docs{background:var(--k-docs)} .k-customs{background:var(--k-customs)}
.k-vanning{background:var(--k-vanning)} .k-shipout{background:var(--k-shipout)} .k-cut{background:var(--k-cut)} .k-etd{background:var(--k-etd)} .k-other{background:var(--k-other)}
.task{display:flex;gap:8px;align-items:flex-start;padding:5px 2px;border-bottom:1px solid var(--line-soft)}
.task input[type=checkbox]{width:auto;margin-top:4px}
.task .t{flex:1} .task .t small{display:block;color:var(--muted)}
.task.over .due{color:var(--red);font-weight:700} .task.soon .due{color:var(--amber);font-weight:700}
.task .case{font-size:12px;color:var(--accent-700);cursor:pointer}
.alert{background:#fff4e5;border:1px solid rgba(201,133,28,.4);border-radius:8px;padding:8px 10px;margin-bottom:8px;font-size:13px}
.alert b{color:var(--amber)}

/* cases table */
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.toolbar input[type=search]{max-width:260px}
.toolbar select{width:auto}
.tbl{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;font-size:13.5px}
.tbl th{font-family:var(--hd);font-weight:700;text-align:left;padding:8px 8px;background:var(--surface);border-bottom:1px solid var(--line);white-space:nowrap;font-size:12.5px;color:var(--muted)}
.tbl td{padding:7px 8px;border-bottom:1px solid var(--line-soft);vertical-align:top}
.tbl tr:hover td{background:#faf6ee;cursor:pointer}
.tbl .title{font-weight:700} .tbl .sub{color:var(--muted);font-size:12px}
.tbl .d{display:block;max-width:230px} .tbl .d .dt{white-space:nowrap} .tbl .d.past{color:var(--muted)} .tbl .d.today{color:var(--red);font-weight:700} .tbl .d.soon{color:var(--amber);font-weight:700}
.tbl .d .tent{color:var(--muted);font-weight:400}
.jobs{display:flex;flex-wrap:wrap;gap:3px}
.job{font-size:11px;border:1px solid var(--line);border-radius:999px;padding:0 7px;background:#fff;white-space:nowrap}
.stage{font-family:var(--hd);font-weight:700;font-size:12px;border-radius:6px;padding:1px 6px;white-space:nowrap;background:var(--surface)}
.stage.s-作業完了,.stage.s-搬出待ち{background:var(--green-bg);color:var(--green)} .stage.s-作業中,.stage.s-入庫済{background:var(--accent-100);color:var(--accent-700)}
.stage.s-見積中{background:#f3ead9;color:var(--amber)} .stage.s-搬出済{background:#eee;color:var(--muted)}
.badge{display:inline-block;font-size:11px;border-radius:999px;padding:0 7px;margin-left:4px}
.badge.off{background:#f7e9e9;color:var(--red)} .badge.stale{background:#f3ead9;color:var(--amber)}
.wrap{max-width:260px;white-space:normal}
.tblwrap{overflow-x:auto}

/* drawer */
.drawer{position:fixed;inset:0;z-index:30}
.drawer-bg{position:absolute;inset:0;background:rgba(43,42,39,.35)}
.drawer-body{position:absolute;top:0;right:0;bottom:0;width:min(860px,100%);background:var(--bg);overflow-y:auto;box-shadow:-10px 0 40px rgba(0,0,0,.2);padding:16px 18px 40px}
.dhead{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.dhead h2{font-family:var(--hd);font-size:20px;margin:0;line-height:1.3}
.dhead .no{font-size:12px;color:var(--muted)}
.dbtns{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px 14px;font-size:14px}
.fields .f{padding:4px 0;border-bottom:1px solid var(--line-soft)}
.fields .f label{display:block;font-size:11px;color:var(--muted);font-family:var(--hd)}
.fields .f .v{white-space:pre-wrap;min-height:20px} .fields .f .v:empty::before{content:"—";color:#c4bba8}
.fields .f.wide{grid-column:1/-1}
.fields .f.human label::after{content:" ✎ 手入力";color:var(--accent-700)}
.editgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px 14px}
.editgrid label{display:block;font-size:11px;color:var(--muted);font-family:var(--hd)}
.editgrid .wide{grid-column:1/-1}
.chk{display:inline-flex;align-items:center;gap:4px;margin:2px 8px 2px 0;font-size:13px} .chk input{width:auto}
.sub-h{font-family:var(--hd);font-weight:700;font-size:15px;margin:14px 0 6px;display:flex;align-items:center;gap:8px}
.evrow{display:flex;gap:8px;align-items:center;padding:4px 0;border-bottom:1px solid var(--line-soft);font-size:14px}
.evrow .dt{font-family:var(--hd);font-weight:700;min-width:120px} .evrow .src{font-size:11px;color:var(--muted)}
.mail{border:1px solid var(--line);border-radius:8px;margin-bottom:6px;background:var(--card)}
.mail summary{padding:6px 10px;cursor:pointer;font-size:13px;display:flex;gap:8px;align-items:center}
.mail summary .fr{font-weight:700} .mail summary .fr.us{color:var(--accent-700)}
.mail summary .subj{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.mail pre{margin:0;padding:8px 12px 12px;white-space:pre-wrap;font-family:inherit;font-size:13px;border-top:1px solid var(--line-soft);background:#fff}
.mail .att{font-size:12px;color:var(--muted);padding:0 12px 8px}
.cautions{background:#fff4e5;border-radius:8px;padding:8px 12px;margin:8px 0;font-size:13.5px}
.cautions li{margin:2px 0}
.summary{background:var(--accent-100);border-radius:8px;padding:8px 12px;font-size:13.5px;margin:8px 0;white-space:pre-wrap}
.next{font-size:14px;margin:6px 0}
.next b{color:var(--red)}
.loglist{font-size:12px;color:var(--muted)} .loglist div{padding:2px 0}
.inline-form{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:6px}
.inline-form input,.inline-form select{width:auto}
.inline-form input.wide{flex:1;min-width:200px}

/* misc */
dialog{border:1px solid var(--line);border-radius:14px;padding:18px 22px;width:min(640px,94vw);background:var(--bg)}
dialog::backdrop{background:rgba(43,42,39,.35)}
dialog h2{font-family:var(--hd);margin:0 0 10px} dialog h3{font-family:var(--hd);font-size:14px;margin:12px 0 4px}
dialog section{border-top:1px solid var(--line);padding:6px 0}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--text);color:#fff;padding:8px 16px;border-radius:999px;font-size:13px;opacity:0;pointer-events:none;transition:.2s;z-index:50}
.toast.on{opacity:1}
body.login{display:grid;place-items:center;height:100vh}
.loginbox{width:320px;padding:22px} .loginbox h1{font-family:var(--hd);margin:0} .loginbox label{display:block;margin:10px 0 4px;font-size:13px}
.loginbox button{width:100%;margin-top:12px}
.empty{color:var(--muted);padding:20px;text-align:center}
@media (max-width:700px){.top{flex-wrap:wrap;gap:8px} .actions{margin-left:0} main{padding:10px} .fields{grid-template-columns:1fr 1fr}}

/* ── 2026-10-01: お客様の色・ガント・スマホ ── */
.client{display:inline-block;font-family:var(--hd);font-weight:700;font-size:12px;border-radius:999px;padding:1px 9px;white-space:nowrap;line-height:1.5;vertical-align:middle;max-width:170px;overflow:hidden;text-overflow:ellipsis}
.chips{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.client.fb{border:2px solid transparent;cursor:pointer;opacity:.75} .client.fb.on,.client.fb:hover{opacity:1;border-color:var(--text)}
.tbl tr[data-open] td:first-child,.ccard,.g-row .g-lbl,.evline,.ag-item{border-left:4px solid var(--cc,transparent)}
.tbl .cc{white-space:nowrap} .tbl .sub.mono{font-family:ui-monospace,Consolas,monospace;font-size:11px}
.tbl .d .sub{display:block} .tbl .d .tent{font-size:11px;color:var(--amber);margin-left:3px;font-weight:700}
.evline{border-radius:0 6px 6px 0;padding-left:8px} .evline .t{flex:1}
.dayblk .dh.sat{color:var(--accent-700)} .dayblk .dh.sun{color:var(--red)}
.legend{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin-left:auto}
.task .case .client{font-size:11px;padding:0 7px}

/* ガント（PC） */
.gantt{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:var(--r);--lbl:230px;--dw:46px}
.g-head,.g-row{display:grid;grid-template-columns:var(--lbl) repeat(var(--n),minmax(var(--dw),1fr));min-width:calc(var(--lbl) + var(--n) * var(--dw))}
.g-head{position:sticky;top:0;z-index:4;background:var(--surface);border-bottom:1px solid var(--line)}
.g-corner{position:sticky;left:0;z-index:5;background:var(--surface);padding:6px 10px;font-family:var(--hd);font-weight:700;font-size:12px;color:var(--muted)}
.g-day{text-align:center;font-family:var(--hd);font-weight:700;font-size:11.5px;line-height:1.25;padding:4px 0;border-left:1px solid var(--line-soft);color:var(--muted)}
.g-day.sat{color:var(--accent-700);background:#e6f0f8} .g-day.sun{color:var(--red);background:#f8e6e2} .g-day.today{background:#ffe9a8;color:var(--text)}
.g-row{border-bottom:1px solid var(--line-soft)} .g-row:hover{background:#faf6ee;cursor:pointer}
.g-lbl{position:sticky;left:0;z-index:3;background:var(--card);padding:5px 8px;display:flex;flex-direction:column;gap:2px;align-items:flex-start;font-size:12.5px;line-height:1.3;border-right:1px solid var(--line)}
.g-lbl b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.g-row:hover .g-lbl{background:#faf6ee}
.g-lane{grid-column:2/-1;display:grid;grid-template-columns:repeat(var(--n),minmax(var(--dw),1fr));grid-auto-rows:minmax(22px,auto);gap:2px 0;padding:3px 0;position:relative}
.g-bg{display:block;border-left:1px solid var(--line-soft);pointer-events:none} .g-bg.sat{background:#f4f8fc} .g-bg.sun{background:#fcf1ee} .g-bg.today{background:#fff6d6}
.g-ev{align-self:center;justify-self:stretch;margin:0 2px;font-family:var(--hd);font-weight:700;font-size:11px;color:#fff;border-radius:6px;padding:1px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.55;z-index:1;text-align:center}
.g-ev.bar{text-align:left;border-radius:999px;padding-left:9px}
.g-ev.pt{justify-self:center;min-width:34px}
.g-ev.big{font-size:12px;padding:2px 7px;box-shadow:0 1px 2px rgba(0,0,0,.25);outline:2px solid #fff}
.g-ev.tent{opacity:.5;outline:1px dashed rgba(0,0,0,.35);outline-offset:-2px}
.g-ev small{display:block;font-weight:500;font-size:10px;line-height:1.2;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* スマホの案件カード・日ごとの予定 */
.cards{display:flex;flex-direction:column;gap:8px}
.ccard{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 10px 8px 12px;box-shadow:var(--sh)}
.ccard .r1{display:flex;gap:6px;align-items:center;flex-wrap:wrap} .ccard .title{font-weight:700;margin:4px 0 2px;line-height:1.35} .ccard .r2{font-size:13px;margin-bottom:4px} .ccard .r2 b.today{color:var(--red)} .ccard .r2 b.soon{color:var(--amber)}
.agenda{display:flex;flex-direction:column;gap:10px}
.ag-day{background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.ag-hd{display:flex;align-items:baseline;gap:6px;padding:6px 12px;background:var(--surface);font-family:var(--hd);border-bottom:1px solid var(--line)}
.ag-hd b{font-size:17px} .ag-hd span{color:var(--muted);font-size:13px} .ag-hd em{font-style:normal;background:var(--red);color:#fff;font-size:11px;padding:0 8px;border-radius:999px;margin-left:auto}
.ag-day.today .ag-hd{background:#fff0c2} .ag-day.sat .ag-hd b{color:var(--accent-700)} .ag-day.sun .ag-hd b{color:var(--red)}
.ag-items{padding:4px 8px}
.ag-item{display:flex;gap:8px;align-items:flex-start;padding:6px 6px 6px 8px;border-bottom:1px solid var(--line-soft);border-radius:0 6px 6px 0;margin:2px 0}
.ag-item:last-child{border-bottom:0} .ag-item .t{flex:1;font-size:14px;line-height:1.4} .ag-item .kchip{min-width:64px;padding:3px 6px;font-size:12px;margin-top:1px}
.ag-item.big .kchip{font-size:13px;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.logs summary{cursor:pointer;list-style:none} .logs summary::-webkit-details-marker{display:none}
@media (max-width:760px){
  .top{padding:6px 10px} .brand .tag,.brand .small{display:none} .tabs button{padding:5px 10px;font-size:14px}
  .toolbar{gap:6px} .toolbar input[type=search]{max-width:none;flex:1 1 100%}
  .drawer-body{padding:12px 12px 40px} .dhead h2{font-size:17px} .fields{grid-template-columns:1fr} .editgrid{grid-template-columns:1fr}
  .evrow{flex-wrap:wrap} .evrow .dt{min-width:0} .inline-form input.wide{min-width:0;flex:1 1 100%}
  .kchip{font-size:11px}
}

/* ── v0.3: お知らせ（新着メールで分かったこと）・稼働中タスク ── */
.bell{font-size:14px} .bell.on{background:#fff0c2;border-color:var(--amber);font-weight:700}
.notices{border-color:rgba(201,133,28,.5);background:#fffaf0}
.notice{display:flex;gap:10px;align-items:flex-start;padding:7px 8px 7px 10px;border-left:4px solid var(--cc,var(--amber));border-bottom:1px solid var(--line-soft);border-radius:0 6px 6px 0}
.notice .t{flex:1;font-size:14px;line-height:1.4} .notice .t [data-open]{cursor:pointer} .notice small{display:block}
.ub{display:inline-block;font-family:var(--hd);font-weight:700;font-size:11px;border-radius:6px;padding:0 6px;white-space:nowrap;margin-left:4px;vertical-align:middle;background:var(--surface);color:var(--muted)}
.ub-new_todo{background:var(--red);color:#fff} .ub-date_changed{background:var(--amber);color:#fff} .ub-content_changed{background:#d8901f;color:#fff}
.ub-task_done{background:var(--green-bg);color:var(--green)} .ub-info{background:var(--accent-100);color:var(--accent-700)}
.notice .ub{margin:2px 0 0;min-width:64px;text-align:center;padding:3px 6px;font-size:12px}
.memo{display:inline-block;font-family:var(--hd);font-weight:700;font-size:10.5px;border:1px solid var(--purple);color:var(--purple);border-radius:4px;padding:0 4px;margin-left:4px;vertical-align:middle;line-height:1.5}
.memo-row{display:flex;gap:8px;align-items:flex-start;padding:6px 6px 6px 10px;border-left:4px solid var(--cc,transparent);border-bottom:1px solid var(--line-soft);cursor:pointer;border-radius:0 6px 6px 0}
.memo-row:hover{background:var(--surface)} .memo-row .t{flex:1;font-size:14px;line-height:1.4}
.toolbar .seg button{padding:4px 12px}
.notice.t-new_todo{background:#fdf0ee} .notice.t-date_changed{background:#fdf5e6} .notice.t-content_changed{background:#fdf5e6} .notice.t-task_done{background:#f1faf5} .notice.t-info{background:#f3f8fc}
.notice .t b{color:var(--text)}

/* ── v0.4: 済・進み具合・表の幅 ── */
.tbl .d.done .dt{color:var(--green)} .tbl .d .tent.ok{color:var(--green)}
.tbl .d .sub{white-space:normal}
.tblwrap{overflow-x:auto;max-width:100%} .tbl{table-layout:auto}
.tbl th:nth-child(2){min-width:220px}
.kchip.done{background:var(--green) !important;opacity:.9}
.evline.done .t,.ag-item.done .t{color:var(--muted)}
.g-ev.done{opacity:.6;outline:none}
.evrow.done .dt{color:var(--green)} .evrow .chk{margin:0}
.steps{display:flex;flex-wrap:wrap;align-items:center;gap:2px 0;margin:6px 0 4px;font-family:var(--hd)}
.step{display:inline-flex;align-items:center;gap:3px;font-size:12px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--muted)}
.step i{font-style:normal;font-weight:700;width:12px;text-align:center}
.step small{color:var(--muted);font-weight:500;margin-left:2px}
.step.done{background:var(--green-bg);border-color:#a9d8c0;color:var(--green)}
.step.now{border-color:var(--red);color:var(--red);font-weight:700}
.steps .arrow{color:#c4bba8;padding:0 3px;font-weight:400}
.steps.compact{margin:3px 0 0} .steps.compact .step{font-size:10.5px;padding:0 6px} .steps.compact .arrow{padding:0 1px}

/* ── v0.5: CUT は参考 ── */
.kchip.ref{background:#fff !important;color:var(--k-cut) !important;border:1px solid var(--k-cut);opacity:.85}
.g-ev.ref{background:#fff !important;color:var(--k-cut) !important;border:1px solid var(--k-cut);font-weight:600}
.evline.ref .t,.ag-item.ref .t{color:var(--muted)}
.g-group{position:sticky;left:0;padding:5px 10px;font-family:var(--hd);font-weight:700;font-size:12.5px;color:var(--muted);background:var(--surface);border-bottom:1px solid var(--line);border-top:1px solid var(--line)}
.g-lbl .memo{margin-left:0}
a.btn.sm{padding:2px 8px;font-size:13px;border-radius:6px}
a.btn.ghost{border-color:transparent;background:transparent;color:var(--muted)}