
:root{
  --bg:#14161B; --panel:#1C1F26; --panel2:#22262F; --line:#2A2E37; --line2:#343945;
  --ink:#ECE8DF; --mut:#9AA0AB; --dim:#6B7079;
  --amber:#E9A13B; --amber2:#F5C168; --red:#E05252; --green:#46B586; --blue:#5B9BD5; --purple:#9B7EDE;
  --rail:224px;
  --rail-bg:#101216; --topbar-bg:rgba(20,22,27,.92); --login-bg1:#232833;
  --row-hover:rgba(255,255,255,.02); --btn-pri-ink:#14161B; --shadow:rgba(0,0,0,.5);
  --wknd:rgba(233,161,59,.04);
}
/* ===== ライトテーマ（明・帳場） ===== */
html[data-theme=light]{
  /* 鶏バルHIGOYAブランド（シフト勤怠システムと同一パレット：クリーム紙×深紅×金×木目） */
  --bg:#f2e9d5; --panel:#fffdf4; --panel2:#f7efdc; --line:#e4d6b6; --line2:#d9c69c;
  --ink:#3b2a1a; --mut:#8a7355; --dim:#b5a68c;
  --amber:#c8992e; --amber2:#9a731d; --red:#a92325; --green:#2e7d54; --blue:#2E6DA8; --purple:#6F4FC4;
  --pri:#b3282d; --pri-d:#8e1e23; --gold-l:#e7c876; --wood:#2b1c10; --wood2:#3b2917;
  --rail-bg:#2b1c10; --topbar-bg:rgba(43,28,16,.97); --login-bg1:#3b2917;
  --row-hover:rgba(59,42,26,.04); --btn-pri-ink:#FFFFFF; --shadow:rgba(59,42,26,.18);
  --wknd:rgba(179,40,45,.05);
}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:15px}
body{background:var(--bg);color:var(--ink);font-family:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:.92rem;background:var(--bg);border:1px solid var(--line2);color:var(--ink);border-radius:6px;padding:6px 8px;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--amber)}
input[type=number]{text-align:right;font-variant-numeric:tabular-nums}
::placeholder{color:var(--dim)}
.num{font-variant-numeric:tabular-nums;letter-spacing:-.01em}
a{color:var(--amber2)}

/* ===== login ===== */
#login{position:fixed;inset:0;background:radial-gradient(1200px 700px at 70% -10%,var(--login-bg1) 0%,var(--bg) 60%);display:flex;align-items:center;justify-content:center;z-index:100}
.login-card{width:340px;text-align:center}
.brand-mark{font-size:.78rem;letter-spacing:.55em;color:var(--amber);margin-bottom:6px}
.brand{font-size:1.7rem;font-weight:800;letter-spacing:.12em;margin-bottom:2px}
.brand small{display:block;font-size:.72rem;font-weight:400;color:var(--mut);letter-spacing:.3em;margin-top:6px}
.pin-dots{display:flex;gap:14px;justify-content:center;margin:30px 0 18px}
.pin-dots span{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--line2);transition:.15s}
.pin-dots span.on{background:var(--amber);border-color:var(--amber)}
.pin-pad{display:grid;grid-template-columns:repeat(3,74px);gap:12px;justify-content:center}
.pin-pad button{height:58px;border-radius:12px;background:var(--panel);border:1px solid var(--line);font-size:1.25rem;font-weight:600;transition:.12s}
.pin-pad button:hover{border-color:var(--amber);color:var(--amber2)}
.pin-pad button:active{transform:scale(.96)}
#pinMsg{height:22px;font-size:.8rem;color:var(--red);margin-top:12px}
.login-roles{margin-top:22px;font-size:.72rem;color:var(--dim);letter-spacing:.08em}

/* ===== shell ===== */
#app{display:none}
#app.on{display:block}
#rail{position:fixed;left:0;top:0;bottom:0;width:var(--rail);background:var(--rail-bg);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:16px 12px;z-index:50;overflow-y:auto;scrollbar-width:none}
#rail::-webkit-scrollbar{display:none}
.rail-logo{font-weight:800;letter-spacing:.14em;font-size:1.02rem;color:var(--amber);padding:6px 8px 16px;border-bottom:1px solid var(--line);margin-bottom:14px}
.rail-logo small{display:block;font-size:.64rem;font-weight:600;color:var(--mut);letter-spacing:.3em;margin-top:4px}
.rail-btn{width:100%;text-align:left;padding:11px 12px;margin:2px 0;border-radius:9px;font-size:.88rem;letter-spacing:.04em;color:var(--mut);border:1px solid transparent;transition:.12s;display:flex;align-items:center;gap:9px;white-space:nowrap;overflow:hidden}
.rail-btn::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--line2);transform:rotate(45deg);flex-shrink:0;transition:.12s}
.rail-btn:hover{color:var(--ink);background:var(--panel)}
.rail-btn:hover::before{background:var(--amber2)}
.rail-btn.on{color:var(--amber);background:linear-gradient(90deg,rgba(233,161,59,.14),rgba(233,161,59,.03));border-color:rgba(233,161,59,.35);font-weight:700}
.rail-btn.on::before{background:var(--amber)}
.rail-sep{border-top:1px solid var(--line);margin:8px 0}
.rail-out{margin-top:auto;color:var(--dim)}

#topbar{position:fixed;left:var(--rail);right:0;top:0;height:56px;background:var(--topbar-bg);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 22px;z-index:40}
#topbar .tb-title{font-weight:700;letter-spacing:.06em;font-size:1.02rem}
#topbar .tb-sub{font-size:.72rem;color:var(--dim);letter-spacing:.12em}
.tb-spacer{flex:1}
.role-badge{font-size:.72rem;padding:4px 12px;border-radius:99px;letter-spacing:.15em;border:1px solid}
.role-owner{color:var(--amber);border-color:rgba(233,161,59,.5)}
.role-manager{color:var(--blue);border-color:rgba(91,155,213,.5)}
.role-staff{color:var(--green);border-color:rgba(70,181,134,.5)}
#monthSel{font-weight:700}

#view{margin-left:var(--rail);padding:76px clamp(16px,2.2vw,42px) 60px;max-width:none}

/* ===== components ===== */
.grid{display:grid;gap:14px}
.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:1fr 1fr}}

.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.panel h3{font-size:.8rem;color:var(--mut);letter-spacing:.2em;font-weight:600;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.panel h3::before{content:"";width:8px;height:8px;background:var(--amber);border-radius:2px;transform:rotate(45deg)}
.tile .t-label{font-size:.72rem;color:var(--mut);letter-spacing:.18em}
.tile .t-val{font-size:1.85rem;font-weight:800;margin:4px 0 2px}
.tile .t-sub{font-size:.75rem;color:var(--dim)}
.pos{color:var(--green)}.neg{color:var(--red)}.warn{color:var(--amber2)}
.alert-strip{border:1px solid rgba(224,82,82,.45);background:rgba(224,82,82,.08);border-radius:10px;padding:10px 14px;font-size:.85rem;margin-bottom:14px}
.alert-strip.ok{border-color:rgba(70,181,134,.4);background:rgba(70,181,134,.07)}
.alert-strip b{color:var(--red)}
.alert-strip.ok b{color:var(--green)}
table.dt{width:100%;border-collapse:collapse;font-size:.85rem}
table.dt th{font-size:.7rem;color:var(--mut);letter-spacing:.1em;font-weight:600;text-align:right;padding:6px 8px;border-bottom:1px solid var(--line2);white-space:nowrap}
table.dt th:first-child,table.dt td:first-child{text-align:left}
table.dt td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.dt tr:hover td{background:var(--row-hover)}
table.dt td input,table.dt td select{width:100%;min-width:70px;padding:4px 6px;font-size:.85rem}
table.dt td input.mini{min-width:52px;width:64px}
.scrollx{overflow-x:auto}
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:8px;font-size:.85rem;font-weight:600;border:1px solid var(--line2);background:var(--panel2);transition:.12s;letter-spacing:.04em}
.btn:hover{border-color:var(--amber);color:var(--amber2)}
.btn.pri{background:var(--amber);color:var(--btn-pri-ink);border-color:var(--amber)}
.btn.pri:hover{background:var(--amber2);color:var(--btn-pri-ink)}
.btn.danger{color:var(--red);border-color:rgba(224,82,82,.4)}
.btn.sm{padding:4px 10px;font-size:.76rem}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px;flex-wrap:wrap}
.tab{padding:9px 16px;font-size:.85rem;color:var(--mut);border-bottom:2px solid transparent;letter-spacing:.06em}
.tab.on{color:var(--amber);border-bottom-color:var(--amber);font-weight:700}
.chip{display:inline-block;font-size:.68rem;padding:2px 8px;border-radius:99px;border:1px solid var(--line2);color:var(--mut);letter-spacing:.06em}
.chip.a{color:var(--amber);border-color:rgba(233,161,59,.4)}
.chip.g{color:var(--green);border-color:rgba(70,181,134,.4)}
.chip.r{color:var(--red);border-color:rgba(224,82,82,.4)}
.chip.b{color:var(--blue);border-color:rgba(91,155,213,.4)}
.kv{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px dashed var(--line);font-size:.88rem}
.kv b{font-variant-numeric:tabular-nums}
.mismatch input{border-color:var(--red)!important;background:rgba(224,82,82,.08)}
.help{font-size:.75rem;color:var(--dim);line-height:1.7}
.sec-title{font-size:1.05rem;font-weight:800;letter-spacing:.08em;margin:26px 0 12px;display:flex;align-items:center;gap:10px}
.sec-title::after{content:"";flex:1;border-top:1px solid var(--line)}
.rank-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:.88rem}
.rank-no{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800;background:var(--panel2);flex-shrink:0}
.rank-row.top .rank-no{background:rgba(233,161,59,.18);color:var(--amber)}
.rank-row.bad .rank-no{background:rgba(224,82,82,.14);color:var(--red)}
.bar-bg{flex:1;height:8px;background:var(--panel2);border-radius:4px;overflow:hidden}
.bar-fg{height:100%;border-radius:4px}
.shift-grid td{padding:2px!important;text-align:center!important;min-width:34px;cursor:pointer;user-select:none}
.shift-grid td.wknd{background:var(--wknd)}
.shift-cell{display:block;padding:5px 2px;border-radius:5px;font-size:.72rem;font-weight:700}
.sc-早{background:rgba(91,155,213,.2);color:var(--blue)}
.sc-遅{background:rgba(155,126,222,.2);color:var(--purple)}
.sc-通{background:rgba(233,161,59,.2);color:var(--amber)}
.sc-休{color:var(--dim)}
.zero-day th{color:var(--red)!important}
.note-item{border-left:3px solid var(--amber);padding:8px 14px;margin-bottom:10px;background:var(--panel2);border-radius:0 8px 8px 0}
.note-item .n-meta{font-size:.72rem;color:var(--dim);margin-bottom:2px}
.quad{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.quad .q{border-radius:10px;padding:12px;border:1px solid var(--line);min-height:110px}
.quad .q h4{font-size:.78rem;letter-spacing:.12em;margin-bottom:8px}
.quad .q ul{list-style:none;font-size:.8rem;color:var(--mut)}
.quad .q li{padding:2px 0}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:90}
.modal{background:var(--panel);border:1px solid var(--line2);border-radius:14px;padding:22px;width:min(560px,92vw);max-height:86vh;overflow-y:auto}
.form-row{display:flex;gap:10px;margin-bottom:10px;align-items:center;flex-wrap:wrap}
.form-row label{font-size:.78rem;color:var(--mut);width:110px;flex-shrink:0}
.form-row input,.form-row select{flex:1;min-width:120px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--amber);color:var(--amber2);padding:10px 22px;border-radius:99px;font-size:.85rem;z-index:99;box-shadow:0 8px 30px var(--shadow)}
svg text{font-family:inherit}

/* print */
.print-only{display:none}
@media print{
  body{background:#fff;color:#111}
  #rail,#topbar,.no-print{display:none!important}
  #view{margin:0;padding:0;max-width:none}
  .panel{border-color:#ccc;background:#fff;break-inside:avoid}
  .panel h3{color:#333}
  table.dt th{color:#333;border-color:#999}
  table.dt td{border-color:#ddd;color:#111}
  input,select{border:none;background:none;color:#111}
  .print-only{display:block}
}

/* ===== theme toggle ===== */
.theme-tgl{width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:var(--panel);font-size:1rem;display:inline-flex;align-items:center;justify-content:center;transition:.12s;flex-shrink:0}
.theme-tgl:hover{border-color:var(--amber)}
.login-tgl{position:fixed;top:16px;right:16px;z-index:110}

/* ===== responsive：タブレット（〜1024px） ===== */
@media(max-width:1024px){
  :root{--rail:196px}
  #view{padding:72px 16px 56px}
  #topbar{padding:0 14px;gap:10px}
  .panel{padding:14px}
  .rail-btn{font-size:.84rem;padding:10px 10px;letter-spacing:.06em}
}
/* ===== responsive：スマホ（〜768px）— 下部ナビ ===== */
@media(max-width:768px){
  html{font-size:14px}
  /* 縦書きレール → 下部横スクロールナビ */
  #rail{top:auto;bottom:0;left:0;right:0;width:auto;height:58px;flex-direction:row;align-items:stretch;padding:0 6px calc(env(safe-area-inset-bottom,0px)*0.6);border-right:none;border-top:1px solid var(--line);overflow-y:hidden;overflow-x:auto}
  .rail-logo{display:none}
  .rail-sep{display:none}
  .rail-btn{width:auto;padding:0 12px;margin:8px 2px;font-size:.78rem;letter-spacing:.04em;white-space:nowrap}
  .rail-btn::before{display:none}
  .rail-out{margin-top:8px;margin-left:auto}
  #topbar{left:0;height:52px;padding:0 10px;gap:8px}
  #topbar .tb-title{font-size:.9rem;letter-spacing:.02em}
  #topbar .tb-sub{display:none}
  .role-badge{padding:3px 8px;font-size:.66rem;letter-spacing:.06em}
  #monthSel{max-width:110px}
  #view{margin-left:0;padding:64px 10px calc(76px + env(safe-area-inset-bottom,0px))}
  .g2,.g3,.g4{grid-template-columns:1fr}
  .panel{padding:12px;overflow-x:auto}
  .tile .t-val{font-size:1.5rem}
  .quad{grid-template-columns:1fr}
  .form-row label{width:96px}
  .tabs{overflow-x:auto;flex-wrap:nowrap}
  .tab{white-space:nowrap;padding:9px 12px}
  .login-card{width:min(320px,88vw)}
  .pin-pad{grid-template-columns:repeat(3,minmax(64px,74px))}
  .pin-pad button{height:54px}
  .modal{width:min(560px,94vw);padding:16px}
  .toast{bottom:calc(70px + env(safe-area-inset-bottom,0px));width:max-content;max-width:92vw}
}
/* ごく小さい端末 */
@media(max-width:380px){
  #topbar .tb-title{font-size:.8rem}
  .rail-btn{padding:0 10px;font-size:.74rem}
}

/* ===== login form (account) ===== */
.login-form{display:flex;flex-direction:column;gap:12px;margin:28px 0 4px}
.login-form input{height:44px;font-size:1rem;text-align:center}
.acct-inactive{opacity:.45}

/* ===== version tag ===== */
.ver-tag{margin-top:14px;font-size:.68rem;color:var(--dim);letter-spacing:.12em}
.rail-ver{font-size:.66rem;color:var(--dim);text-align:center;padding:8px 0 2px;letter-spacing:.1em}
@media(max-width:768px){.rail-ver{display:none}}

/* ================================================
   v2.0 高級POP デザインパス
================================================ */
/* 見出しに勢いを */
h3{font-size:.95rem;letter-spacing:.14em;display:flex;align-items:center;gap:8px}
h3::before{content:"";width:4px;height:16px;border-radius:2px;background:linear-gradient(180deg,var(--amber),var(--amber2));box-shadow:0 0 8px rgba(233,161,59,.5)}
/* KPIタイル：グラデ枠＋光沢 */
.tile{position:relative;border:1px solid var(--line);background:
  linear-gradient(160deg,var(--panel) 60%,var(--panel2));overflow:hidden}
.tile::after{content:"";position:absolute;top:-40%;right:-20%;width:70%;height:120%;
  background:radial-gradient(closest-side,rgba(233,161,59,.10),transparent);pointer-events:none}
.tile .t-val{font-size:1.85rem;letter-spacing:.02em}
/* パネル */
.panel{border-radius:16px;box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 6px 22px rgba(0,0,0,.10)}
html[data-theme=light] .panel{box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 6px 20px rgba(80,60,20,.07)}
/* トップバー：ガラス感 */
#topbar{backdrop-filter:blur(10px) saturate(1.3)}
/* ナビ選択：光る */
.rail-btn.on{box-shadow:0 0 14px rgba(233,161,59,.18)}
/* チップ強化 */
.chip{border-radius:999px;padding:3px 10px;font-weight:600}
.chip.r{color:var(--red);border-color:var(--red)}
.cat-chip{display:inline-flex;align-items:center;padding:4px 12px;border-radius:999px;font-size:.78rem;font-weight:700;letter-spacing:.08em;
  background:linear-gradient(90deg,rgba(233,161,59,.2),rgba(233,161,59,.06));color:var(--amber);border:1px solid rgba(233,161,59,.4)}
/* 警告帯 */
.warnband{padding:11px 16px;border-radius:12px;border:1px solid rgba(224,82,82,.5);
  background:linear-gradient(90deg,rgba(224,82,82,.14),rgba(224,82,82,.03));color:var(--red);font-weight:600;font-size:.88rem}
/* KPIストリップ（一覧入力の下部固定サマリー） */
.kpi-strip{position:sticky;bottom:10px;display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:16px;
  padding:12px 18px;border-radius:14px;border:1px solid var(--line2);background:var(--topbar-bg);backdrop-filter:blur(10px);
  box-shadow:0 8px 24px rgba(0,0,0,.18);font-size:.86rem;color:var(--mut)}
.kpi-strip b{color:var(--ink);font-size:1rem}
.kpi-strip .pos b{color:var(--green)}.kpi-strip .neg b{color:var(--red)}
/* 折りたたみ（マスタ等） */
.fold{margin-top:12px;border:1px dashed var(--line2);border-radius:12px;overflow:hidden}
.fold summary{cursor:pointer;padding:10px 14px;font-size:.82rem;color:var(--mut);letter-spacing:.06em;user-select:none;list-style:none}
.fold summary::-webkit-details-marker{display:none}
.fold summary::after{content:"▾";float:right;transition:.15s}
.fold[open] summary::after{transform:rotate(180deg)}
.fold summary:hover{color:var(--amber)}
.fold-body{padding:4px 14px 14px;border-top:1px dashed var(--line2)}
/* エクセル型シート */
table.sheet{width:100%;border-collapse:collapse;font-size:.85rem}
table.sheet th{font-size:.72rem;color:var(--mut);font-weight:600;text-align:left;padding:6px 8px;border-bottom:1px solid var(--line2);letter-spacing:.06em}
table.sheet td{padding:4px 6px;border-bottom:1px solid var(--line)}
table.sheet input,table.sheet select{width:100%;min-width:70px;background:transparent;border:1px solid transparent;border-radius:6px;padding:6px 8px}
table.sheet input:hover,table.sheet select:hover{border-color:var(--line2)}
table.sheet input:focus,table.sheet select:focus{border-color:var(--amber);background:var(--panel2)}
table.sheet .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink)}
.exp-cat{margin-bottom:14px}
.exp-cat-h{display:flex;align-items:center;gap:12px;margin-bottom:4px}
.exp-cat-h .num{margin-left:auto;font-size:.85rem;color:var(--mut)}
input.mism{border-color:var(--red)!important;background:rgba(224,82,82,.08)!important}
tr.wknd-row td{background:var(--wknd)}
/* 分析バー */
.ana-bar{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ana-bar select{max-width:140px}
/* 横棒（曜日別） */
.hbar{display:flex;align-items:center;gap:10px;margin:7px 0}
.hbar-l{width:24px;text-align:center;font-weight:700;color:var(--mut)}
.hbar-l.wk{color:var(--amber)}
.hbar-track{flex:1;height:18px;background:var(--panel2);border-radius:9px;overflow:hidden}
.hbar-fill{height:100%;border-radius:9px;background:linear-gradient(90deg,var(--amber2),var(--amber));box-shadow:0 0 10px rgba(233,161,59,.35)}
.hbar-v{min-width:120px;text-align:right;font-variant-numeric:tabular-nums;font-size:.85rem}
.hbar-v small{color:var(--dim)}
/* ヒートマップ */
table.heat{width:100%;border-collapse:separate;border-spacing:4px}
table.heat th{font-size:.72rem;color:var(--mut);padding:4px}
table.heat td{height:44px;border-radius:8px;text-align:center;font-size:.78rem;font-variant-numeric:tabular-nums;background:var(--panel2)}
table.heat td small{color:var(--dim);font-size:.62rem}
/* シフトセル */
.shift-grid td.on-cell{background:linear-gradient(180deg,rgba(233,161,59,.20),rgba(233,161,59,.06));color:var(--amber);font-weight:700;cursor:pointer;font-size:.72rem;white-space:nowrap}
.shift-grid td.off-cell{color:var(--dim);cursor:pointer}
.shift-grid td:not(.on-cell):not(.off-cell)[data-cell]{cursor:pointer}
.shift-grid td[data-cell]:hover{outline:2px solid var(--amber);outline-offset:-2px;border-radius:4px}
/* ドロップゾーン */
.dropzone{border:2px dashed var(--line2);border-radius:16px;padding:34px 20px;text-align:center;cursor:pointer;transition:.15s;background:var(--panel)}
.dropzone:hover,.dropzone.over{border-color:var(--amber);background:linear-gradient(180deg,rgba(233,161,59,.08),transparent);box-shadow:0 0 24px rgba(233,161,59,.12)}
.dz-inner{color:var(--mut);font-size:.95rem;line-height:1.9}
/* 資料カード */
.doc-card{display:flex;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);transition:.15s}
.doc-card:hover{border-color:var(--amber);transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.15)}
.doc-ic{font-size:1.8rem}
.doc-meta{flex:1;min-width:0}
.doc-meta b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.9rem}
.doc-act{display:flex;flex-direction:column;gap:4px}
/* チェックリスト */
label.ck{display:block;padding:8px 6px;border-bottom:1px dashed var(--line);cursor:pointer;font-size:.9rem}
label.ck:hover{color:var(--amber)}
label.ck input{margin-right:10px;accent-color:var(--amber);width:16px;height:16px}
.grid.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:1100px){.grid.g3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.grid.g3{grid-template-columns:1fr}
  .kpi-strip{position:static;font-size:.78rem;gap:8px}
  .ana-bar{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
  .hbar-v{min-width:96px}}
/* 労働者名簿カード */
table.roster-card{width:100%;border-collapse:collapse}
table.roster-card th{width:120px;background:var(--panel2);font-weight:600;font-size:.82rem;letter-spacing:.1em;padding:12px;border:1px solid var(--line2);text-align:left;vertical-align:top}
table.roster-card td{padding:12px;border:1px solid var(--line2);font-size:.92rem}
#rosterPrint{display:none}
@media print{
  body.print-roster #app,body.print-roster #login,body.print-roster .modal-bg{display:none!important}
  body.print-roster #rosterPrint{display:block!important;padding:40px}
  body.print-roster #rosterPrint table.roster-card th{background:#f2f2f2;color:#000;border:1px solid #333}
  body.print-roster #rosterPrint table.roster-card td{color:#000;border:1px solid #333}
}

/* ================================================
   v2.3 ブランド統一（シフト勤怠システムとデザイン統合）
   ライトテーマ＝HIGOYA標準テーマ
================================================ */
html[data-theme=light] body{font-weight:500}
/* 木目サイドバー（PC/タブレット） */
html[data-theme=light] #rail{background:linear-gradient(180deg,#241608,var(--wood) 45%,#170e06)}
@media(min-width:769px){html[data-theme=light] #rail{border-right:2px solid var(--amber)}}
@media(max-width:768px){html[data-theme=light] #rail{border-top:2px solid var(--amber);background:linear-gradient(180deg,var(--wood2),var(--wood))}}
html[data-theme=light] .rail-btn{color:#e9dcc2;font-weight:700}
html[data-theme=light] .rail-btn:hover{color:var(--gold-l);background:rgba(200,153,46,.12)}
html[data-theme=light] .rail-btn.on{background:var(--pri);color:#fff;box-shadow:0 2px 8px rgba(179,40,45,.45);border-radius:10px}
html[data-theme=light] .rail-ver{color:#a8916b}
/* トップバー：木目×金ライン */
html[data-theme=light] #topbar{border-bottom:2px solid var(--amber)}
html[data-theme=light] #topbar .tb-title{color:#f7efdc}
html[data-theme=light] #topbar .tb-sub{color:#cdb891}
html[data-theme=light] #topbar select{background:#3b2917;color:#f7efdc;border:1.5px solid rgba(231,200,118,.55);border-radius:8px}
html[data-theme=light] #topbar select:focus{border-color:var(--gold-l);box-shadow:none}
html[data-theme=light] #topbar .btn{background:rgba(231,200,118,.1);color:var(--gold-l);border:1.5px solid rgba(231,200,118,.5)}
html[data-theme=light] #topbar .btn:hover{background:rgba(231,200,118,.22)}
html[data-theme=light] #topbar .theme-tgl{background:rgba(231,200,118,.1);color:var(--gold-l);border-color:rgba(231,200,118,.5)}
html[data-theme=light] #topbar .role-badge{background:var(--pri);color:#fff;border:1px solid var(--gold-l)}
/* 主要ボタン：深紅（シフト勤怠準拠） */
html[data-theme=light] .btn.pri{background:var(--pri);color:#fff;border:1.5px solid var(--gold-l);font-weight:800}
html[data-theme=light] .btn.pri:hover{background:var(--pri-d)}
html[data-theme=light] .btn{border-radius:10px}
html[data-theme=light] .btn.danger{color:var(--red);border-color:var(--red)}
/* パネル：カード紙＋点線見出し */
html[data-theme=light] .panel{background:var(--panel);border:1.5px solid var(--line2);border-radius:16px;box-shadow:var(--shadow) 0 2px 10px}
html[data-theme=light] h3{border-bottom:2px dotted var(--line2);padding-bottom:8px;color:var(--ink)}
html[data-theme=light] h3::before{background:linear-gradient(180deg,var(--pri),var(--amber));box-shadow:none}
/* KPIタイル：紙×金縁 */
html[data-theme=light] .tile{background:var(--panel);border:1.5px solid var(--line2)}
html[data-theme=light] .tile .t-val{color:var(--pri)}
html[data-theme=light] .tile .t-val.pos{color:var(--green)}
html[data-theme=light] .tile .t-val.neg{color:var(--red)}
/* タブ */
html[data-theme=light] .tab.on{background:var(--pri);color:#fff;border-color:var(--pri)}
/* 下部ナビ（スマホ） */
/* ログイン画面：木目背景×金縁カード */
html[data-theme=light] #login{background:linear-gradient(160deg,#241608,var(--wood) 45%,#170e06)}
html[data-theme=light] .login-card{background:var(--panel2);border:2px solid var(--amber);border-radius:20px;padding:30px 24px 24px;outline:1px solid rgba(200,153,46,.5);outline-offset:5px;box-shadow:0 14px 40px rgba(0,0,0,.45)}
html[data-theme=light] .brand-mark{color:var(--amber)}
html[data-theme=light] .brand{color:var(--pri)}
/* 入力フォーカス */
html[data-theme=light] input:focus,html[data-theme=light] select:focus,html[data-theme=light] textarea:focus{border-color:var(--pri);box-shadow:0 0 0 2px rgba(179,40,45,.12)}
/* KPIストリップ・警告帯 */
html[data-theme=light] .kpi-strip{background:rgba(255,253,244,.95);border-color:var(--line2)}
html[data-theme=light] .warnband{border-color:var(--red)}
/* チップ */
html[data-theme=light] .chip.a{color:var(--amber2);border-color:var(--amber)}
html[data-theme=light] .chip.g{color:var(--green);border-color:var(--green)}
html[data-theme=light] .cat-chip{background:linear-gradient(90deg,rgba(200,153,46,.18),rgba(200,153,46,.06));color:var(--amber2);border-color:var(--amber)}
/* 使い方マニュアル */
.hlp{border:1.5px solid var(--line2);border-radius:12px;margin:8px 0;background:var(--panel2)}
.hlp summary{padding:12px 14px;font-weight:800;cursor:pointer;list-style:none;display:flex;align-items:center}
.hlp summary::after{content:"＋";margin-left:auto;color:var(--amber2);font-weight:900}
.hlp[open] summary::after{content:"−"}
.hlp-b{padding:0 16px 14px;line-height:1.9;font-size:.92rem}
.hlp-b b{color:var(--amber2)}
@media print{.hlp{break-inside:avoid;border-color:#999}#rail,#topbar,.btn{display:none!important}}
/* NG曜日ボタンの曜日色（土=青／日=赤）v2.6.1 */
.ngd.d-sat:not(.pri){color:var(--blue);border:1px solid var(--blue)}
.ngd.d-sun:not(.pri){color:var(--red);border:1px solid var(--red)}
/* v2.8 サイドバーのグループ見出し＆トップバーのシフト勤怠ボタン */
.rail-grp{font-size:.68rem;letter-spacing:.18em;color:var(--dim);padding:14px 14px 4px;font-weight:800;border-top:1px solid rgba(255,255,255,.06);margin-top:6px}
.rail-grp:first-of-type{border-top:none;margin-top:0}
html[data-theme=light] .rail-grp{color:#a8916b;border-top-color:rgba(231,200,118,.18)}
.tb-wt{border:1.5px solid rgba(231,200,118,.55);border-radius:99px;padding:5px 12px;font-size:.82rem;font-weight:800;background:rgba(231,200,118,.1);color:var(--gold-l,#e7c876);cursor:pointer;white-space:nowrap}
.tb-wt:hover{background:rgba(231,200,118,.25)}
html:not([data-theme=light]) .tb-wt{color:var(--amber)}
@media(max-width:768px){.rail-grp{display:none}.tb-wt{padding:4px 8px;font-size:.74rem}}
