:root{
  /* 東急建設ブランド (brand.py より) */
  --green:#50B848; --green-d:#3A8A34; --green-l:#EAF6E8;
  --gold:#D6A017;  --gold-d:#846200;  --gold-l:#FFF8E6;
  --red:#C0392B;   --red-l:#FDECEA;
  --ink:#333333; --mut:#777777; --paper:#FAFAFA; --card:#fff; --line:#E5E5E5;
  /* 状態色（在席=緑 / 在宅=金 / 研修=濃緑 / 外出=金濃 / 不在=灰） */
  --present:var(--green); --tw:var(--gold); --train:var(--green-d);
  --out:var(--gold-d); --off:var(--mut);
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:"Meiryo","Hiragino Kaku Gothic ProN","Segoe UI",sans-serif;
  background:var(--paper);color:var(--ink);-webkit-text-size-adjust:100%}

/* ---- ヘッダ ---- */
.topbar{position:sticky;top:0;z-index:5;color:#fff;
  background:linear-gradient(180deg,var(--green-d),#2f7a2a);
  padding:env(safe-area-inset-top) 14px 0;box-shadow:0 2px 6px #0002}
.brandrow{display:flex;align-items:center;gap:9px;padding:9px 2px 6px}
.logo-wrap{background:#fff;border-radius:7px;padding:3px 6px;display:flex;align-items:center;box-shadow:0 1px 2px #0002}
.logo{height:30px;width:auto;display:block}
.brand{font-weight:800;font-size:18px;letter-spacing:.02em}
.tagline{font-size:11px;opacity:.85;margin-left:auto;font-weight:500;white-space:nowrap}
@media(max-width:560px){.tagline{display:none}}
.modechip{font-size:11px;font-weight:700;border:1px solid #ffffff80;border-radius:11px;
  padding:2px 9px;background:#ffffff1a;white-space:nowrap}
.modechip.toggle{cursor:pointer;background:#ffffff33;padding:5px 12px}
.modechip.toggle:active{background:#ffffff55}
.tabs{display:flex;gap:4px}
.tab{flex:1;background:transparent;border:0;color:#ffffffcc;font-size:15px;
  padding:11px 0;font-weight:600;border-bottom:3px solid transparent;cursor:pointer}
.tab.active{color:#fff;border-bottom-color:var(--gold)}

main{max-width:960px;margin:0 auto;padding:12px 10px 60px}

.notice{background:var(--gold-l);border:1px solid #e7cf8a;color:var(--gold-d);
  border-radius:10px;padding:10px 12px;font-size:13px;margin:6px 0 12px;line-height:1.6}

/* ---- 日付バー ---- */
.datebar{display:flex;align-items:center;justify-content:center;gap:14px;margin:6px 0 12px}
.datebar button{background:var(--card);border:1px solid var(--line);border-radius:8px;
  width:40px;height:38px;font-size:18px;cursor:pointer;color:var(--ink)}
.datebar .d{font-size:17px;font-weight:700;min-width:160px;text-align:center}
.datebar .today{font-size:12px;color:var(--green-d);border:1px solid var(--green);
  border-radius:8px;padding:0 12px;height:38px;background:#fff;cursor:pointer}

/* ---- 日次カード ---- */
.list{display:flex;flex-direction:column;gap:8px}
.row{display:flex;align-items:center;gap:12px;
  background:var(--card);border:1px solid var(--line);border-left:5px solid var(--line);
  border-radius:12px;padding:12px 14px}
.row.tap,.row.jump{cursor:pointer}
.row.tap:active,.row.jump:active{background:var(--green-l)}
.row.lpresent{border-left-color:var(--present)} .row.ltw{border-left-color:var(--tw)}
.row.ltrain{border-left-color:var(--train)} .row.lout{border-left-color:var(--out)}
.row.loff{border-left-color:var(--off)}
.dot{width:12px;height:12px;border-radius:50%;flex:none}
.who{display:flex;flex-direction:column;flex:none;width:auto;min-width:80px;max-width:170px}
.who .nm{font-weight:700;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who .as{font-size:11px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stwrap{min-width:0;flex:1}
.state{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dest{font-size:13px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ret{font-size:13px;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
.who .pos{font-size:11px;font-weight:600;color:var(--gold-d);background:var(--gold-l);
  border-radius:5px;padding:0 5px;margin-left:4px;white-space:nowrap}
.call{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  background:var(--green-l);color:var(--green-d);text-decoration:none;font-size:17px;border:1px solid #cfe6c9}
.call:active{background:var(--green);color:#fff}
.grouphd{font-size:13px;font-weight:800;color:var(--green-d);margin:14px 4px 7px;
  display:flex;align-items:center;gap:8px}
.grouphd::before{content:"";width:4px;height:15px;background:var(--green);border-radius:2px}
.addbtn{width:100%;margin-top:16px;background:#fff;border:1.5px dashed var(--green);color:var(--green-d);
  border-radius:12px;padding:14px;font:inherit;font-weight:700;font-size:15px;cursor:pointer}

/* 本人モード（マジックリンク） */
.me-wrap{max-width:460px;margin:8px auto;display:flex;flex-direction:column;gap:12px}
.me-hello{font-size:18px;font-weight:700;text-align:center;margin:8px 0}
.me-card{background:var(--card);border:1px solid var(--line);border-left:6px solid var(--line);
  border-radius:14px;padding:22px;text-align:center}
.me-state{font-size:30px;font-weight:800}
.me-win{font-size:15px;color:var(--mut);margin-top:4px}
.me-ok{margin-top:10px;color:var(--green-d);font-weight:700}
.me-todo{margin-top:10px;color:var(--red);font-weight:700}
/* 本人ページ: 3営業日カード */
.me-day{background:var(--card);border:1px solid var(--line);border-left:6px solid var(--line);
  border-radius:12px;padding:13px 15px}
.me-day.done{opacity:.92}
.me-day-head{display:flex;justify-content:space-between;align-items:baseline}
.me-day-date{font-weight:800;font-size:16px}
.me-ok2{color:var(--green-d);font-weight:700;font-size:12px}
.me-todo2{color:var(--red);font-weight:700;font-size:12px}
.me-day-state{font-size:16px;font-weight:700;margin:4px 0 10px}
.me-day-act{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.me-ok-btn{background:var(--green-d);color:#fff;border:0;border-radius:9px;padding:12px;font:inherit;font-weight:700;cursor:pointer}
.me-change{background:#fff;border:1.5px solid var(--green);color:var(--green-d);border-radius:9px;padding:12px;font:inherit;font-weight:700;cursor:pointer}
.big{padding:16px;font-size:17px}
.ghostbtn{background:#fff;border:1.5px solid var(--green);color:var(--green-d);
  border-radius:12px;font:inherit;font-weight:700;cursor:pointer;padding:14px}
.badge-llm{font-size:10px;color:#fff;background:var(--gold);border-radius:6px;padding:1px 5px;margin-left:6px;vertical-align:middle}

.c-present{color:var(--present)} .b-present{background:var(--present)}
.c-tw{color:var(--tw)} .b-tw{background:var(--tw)}
.c-train{color:var(--train)} .b-train{background:var(--train)}
.c-off{color:var(--off)} .b-off{background:var(--off)}
.c-out{color:var(--out)} .b-out{background:var(--out)}

/* ---- 週間グリッド（セル漏れ対策: table-layout:fixed + 省略） ---- */
.weekwrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:12px}
table.week{border-collapse:collapse;width:100%;min-width:600px;font-size:13px;table-layout:fixed}
.week col.cname{width:104px}
.week col.cday{width:64px}
.week th,.week td{border:1px solid var(--line);padding:6px 4px;text-align:center;overflow:hidden}
.week thead th{background:var(--green-l);color:var(--green-d)}
.week th.sat{color:#2563eb}.week th.sun{color:var(--red)}
.week td.nm,.week th.nm{text-align:left;font-weight:700;
  position:sticky;left:0;background:var(--card);z-index:1;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.week td.nm small{color:var(--mut)}
.week td.cell{font-weight:700;cursor:pointer;vertical-align:middle}
.week td.cell.present{color:#cfe6c9;font-weight:600}
.week tr.hl td{background:var(--gold-l);animation:hlflash 1.2s ease-out 2}
.week tr.hl td.nm{background:var(--gold-l)}
@keyframes hlflash{0%{background:var(--gold)}100%{background:var(--gold-l)}}
.cell .lbl{display:block;line-height:1.2}
.cell small{display:block;font-weight:400;color:var(--mut);font-size:10px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}

/* ---- 備考 ---- */
.rk{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:8px}
.rk .hd{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px;gap:8px}
.rk .nm{font-weight:700;font-size:16px}
.rk .meta{font-size:11px;color:var(--mut);white-space:nowrap}
.rk textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px;
  font:inherit;font-size:14px;min-height:54px;resize:vertical}
.rk .act{display:flex;justify-content:flex-end;margin-top:6px}
.rk .save{background:var(--green-d);color:#fff;border:0;border-radius:8px;padding:8px 16px;font-weight:700;cursor:pointer}
.hint{color:var(--mut);font-size:12px;margin:2px 4px 12px;line-height:1.7}

/* ---- ボード（壁モニタでも見やすく） ---- */
body.mode-board .who .nm{font-size:17px}
body.mode-board .state{font-size:16px}

/* ---- 編集シート ---- */
.sheet{position:fixed;inset:0;background:#0006;display:flex;align-items:flex-end;justify-content:center;z-index:20}
.sheet.hidden{display:none}
.sheet-card{background:#fff;width:100%;max-width:480px;border-radius:16px 16px 0 0;
  padding:16px 16px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px}
@media(min-width:560px){.sheet{align-items:center}.sheet-card{border-radius:16px}}
.sheet-head{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:17px}
.sheet .x{border:0;background:none;font-size:18px;cursor:pointer;color:var(--mut)}
.typegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.typebtn{border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:13px 4px;
  font:inherit;font-size:15px;font-weight:700;cursor:pointer;color:var(--ink)}
.typebtn.on{border-color:var(--green);background:var(--green-l);color:var(--green-d);box-shadow:0 0 0 1px var(--green)}
.onsite{margin:2px 0 0;text-align:center;color:var(--green-d);font-weight:700;font-size:15px;
  background:var(--green-l);border-radius:10px;padding:14px}
.detail{display:flex;flex-direction:column;gap:10px}
.detail.hidden,.onsite.hidden,.customtime.hidden{display:none}
.seclabel{font-size:12px;color:var(--mut);font-weight:700;margin-bottom:-4px}
.tinyhint{font-size:11px;color:var(--mut);margin:-2px 0 0;line-height:1.5}
.preset{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.chip{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:11px 4px;
  font:inherit;font-size:14px;font-weight:700;cursor:pointer;color:var(--ink)}
.chip.on{border-color:var(--gold);background:var(--gold-l);color:var(--gold-d);box-shadow:0 0 0 1px var(--gold)}
.customtime{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sheet label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--mut)}
.sheet input{font:inherit;font-size:16px;padding:11px;border:1px solid var(--line);border-radius:10px}
.primary{background:var(--green-d);color:#fff;border:0;border-radius:10px;padding:13px;font-size:16px;font-weight:700;cursor:pointer}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);
  background:#1c2420ee;color:#fff;padding:10px 18px;border-radius:20px;font-size:14px;z-index:30}
.toast.hidden{display:none}
.muted{color:var(--mut);text-align:center;padding:30px}
