/* ショートステイ予約管理システム — 共通スタイル */
/* 文字：Windows は BIZ UDPゴシック、Mac・iPhone はヒラギノ（BIZ UD フォントがないため） */
/* 日時・電話番号など（.nf）に使う Noto Sans JP。同じ大きさだと BIZ UDPゴシックより字が小さく見える（数字が細い）ので、112% にして見た目の大きさをそろえる（Mac・iPhone のヒラギノには関係しない） */
@font-face{font-family:"Noto Sans JP Num";src:local("Noto Sans JP"),local("Noto Sans JP Regular"),local("NotoSansJP-Regular");font-weight:100 900;size-adjust:112%}
:root{
  --bg:#f2f5f4; --surface:#ffffff; --surface-2:#e9efed; --ink:#1c2a27; --muted:#5a6a66; --line:#d3dcd9;
  --accent:#1e6c5f; --accent-ink:#ffffff; --accent-soft:#d6eae4;
  --male:#3a6bb3; --male-soft:#dbe6f6; --female:#b0476a; --female-soft:#f5dce4;
  --warn:#9a5a00; --warn-soft:#fbecd1; --bad:#b3261e; --bad-soft:#f9dedb; --ok:#2b7a31; --ok-soft:#dcefdc;
  --weekend:#f4efe8; --today:#e3f4e6; /* 当日＝薄い緑 */
  --sat:#2f63b0; --sat-bg:#f5f8fd; --sun:#c0392b; --sun-bg:#fdf5f5; /* 土曜＝薄い青、日曜・祝日＝薄い赤（男女の帯の色より薄く） */
  --placeholder:#aab5b2; /* 入力欄の例文（プレースホルダー）*/
  --f-body:"BIZ UDPGothic","BIZ UDPゴシック","Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic","Meiryo",system-ui,sans-serif;
  --f-display:var(--f-body);
  --f-form:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","BIZ UDPGothic","BIZ UDPゴシック","Yu Gothic","Meiryo",system-ui,sans-serif;
  --f-num:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP Num","Noto Sans JP","BIZ UDPGothic","BIZ UDPゴシック","Yu Gothic","Meiryo",system-ui,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.65}
a{color:var(--accent)}
button,input,select,textarea{font:inherit;color:inherit}
.nf{font-family:var(--f-num)} /* 数字を並べて読むところ（日程・電話番号など）は入力欄と同じ Noto Sans JP（数字の幅がそろう） */
input,select,textarea,.dt-btn{font-family:var(--f-form)} /* 入力欄・選択リスト・日付の欄は Noto Sans JP（数字の幅がそろう）。Mac・iPhone はヒラギノ */
button{text-align:center}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
header.top{background:var(--surface);border-bottom:1px solid var(--line)}
.top-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 20px;padding-block:12px}
.brand{display:flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.brand small{color:var(--muted);font-size:12px;letter-spacing:.06em}
.brand span{font-family:var(--f-display);font-weight:700;font-size:20px}
.who{display:flex;align-items:center;gap:12px;font-size:14px}
.who small{display:block;color:var(--muted);font-size:12px}
.who-id{display:flex;align-items:center;gap:8px;white-space:nowrap} .who-id .tag{margin-right:0}
.who-name{font-size:14px} a.who-name{color:inherit;text-decoration:none} a.who-name:hover{color:var(--accent);text-decoration:underline} /* ケアマネージャーは名前がマイページへのリンク */
.who-office{font-size:12px;color:var(--muted);padding-left:8px;border-left:1px solid var(--line)}
.who form{margin:0}
nav.tabs{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
nav.tabs .wrap{display:flex;gap:2px;overflow-x:auto}
nav.tabs .wrap>a:first-child{margin-left:auto} /* メニューは右寄せ（狭い画面では左から横スクロールできる） */
nav.tabs a{padding:12px 14px;color:var(--muted);text-decoration:none;border-bottom:3px solid transparent;white-space:nowrap;display:flex;gap:6px;align-items:center}
nav.tabs a[aria-current="page"]{color:var(--ink);font-weight:700;border-bottom-color:var(--accent)}
nav.tabs a:hover{color:var(--ink)}
.count{background:var(--warn);color:#fff;border-radius:999px;font-size:11px;padding:0 7px;line-height:18px;font-variant-numeric:tabular-nums}
/* フッターは画面の一番下に（中身が短いときは中身の下を空ける。長いときは中身のあとに続く） */
body{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
body>.wrap{width:100%}
.main{flex:1 0 auto;padding-block:24px 56px;display:flex;flex-direction:column;gap:18px}
.foot{color:var(--muted);font-size:12px;padding-block:16px 32px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px}
.foot-ver{color:var(--muted);font-variant-numeric:tabular-nums} a.foot-ver{text-decoration:none} a.foot-ver:hover{color:var(--accent);text-decoration:underline}
.changelog ul{margin:8px 0 0;padding-left:1.4em;display:flex;flex-direction:column;gap:6px;line-height:1.7}
.foot-right{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:flex-end}
.foot-link{color:var(--muted)} .foot-link:hover{color:var(--accent)}
/* 利用規約 */
.terms{max-width:820px;margin:0 auto;width:100%;line-height:1.85;gap:6px;} .panel.terms{padding:40px 48px} @media (max-width:640px){.panel.terms{padding:24px 20px}}
.terms h1{margin-bottom:16px;text-align:center} .terms h2{font-size:16px;margin:22px 0 12px;padding-left:10px;border-left:3px solid var(--accent)}
.terms p{margin:0 0 8px} .terms ul{margin:4px 0 10px;padding-left:1.5em} .terms li{margin:2px 0} .terms address{font-style:normal;line-height:1.9}
.changelog h2{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
h1,h2,h3{font-family:var(--f-display);margin:0;line-height:1.35;text-wrap:balance}
h1{font-size:22px} h2{font-size:19px} h3{font-size:16px}
.sub{color:var(--muted);font-size:13px;margin:2px 0 0}
p{margin:0}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.spread{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;justify-content:space-between}
.spread:has(> .filters) > :first-child:has(> h1){flex:1 1 320px} /* 見出しと切り替えボタンの行：狭くなったら説明文を折り返し、ボタンは右に残す（それでも入らなければ下の行へ） */
.stack{display:flex;flex-direction:column;gap:12px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px;display:flex;flex-direction:column;gap:12px;min-width:0}
.narrow{max-width:460px;margin:24px auto;width:100%}
.steps{display:flex;gap:6px;list-style:none;padding:0;margin:10px 0 0;font-size:12px;color:var(--muted)} .steps li{flex:1;text-align:center;padding:4px 0;border-bottom:3px solid var(--line)} .steps li[aria-current]{color:var(--accent);border-color:var(--accent);font-weight:700} /* パスワードを忘れた方：いまの段階 */
.send-off{display:none} form:has(input[name=notify]:not(:checked)) .send-off{display:inline} form:has(input[name=notify]:not(:checked)) .send-on{display:none} /* 仮パスワードの発行：「本人に送る」のチェックでボタンの文言を変える */
.code-input{font-family:var(--f-num);font-size:24px;letter-spacing:.4em;text-align:center} /* 認証番号の入力欄 */
.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:6px;border:1px solid var(--line);background:var(--surface);padding:8px 14px;border-radius:8px;cursor:pointer;font-size:14px;text-decoration:none;color:var(--ink);line-height:1.4}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}
.btn.danger{color:var(--bad);border-color:var(--bad)}
.btn.small{padding:4px 10px;font-size:13px}
/* フォームの主なボタン（保存・送信など）は入力欄と同じ高さで押しやすく。表の行の中のボタンは .small のまま */
.btn.lg{min-height:44px;padding:9px 28px;min-width:140px;font-size:15px}
/* 登録・申込などフォームの最後の送信ボタン：中央に大きく、戻るリンクはその下 */
.submit-row{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:6px}
.field-err{color:var(--bad);font-size:13px}
.field:has(.seg.center) .field-err{text-align:center} /* 中央のチェック（同意など）の下のエラーも中央 */
input.is-invalid{border-color:var(--bad);box-shadow:0 0 0 1px var(--bad)}
.submit-row .btn{min-width:min(280px,100%);min-height:52px;font-size:17px}
.btn.tall{min-height:44px}
.btn:disabled{opacity:.45;cursor:not-allowed}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.flash{border-radius:8px;padding:10px 14px;background:var(--ok-soft);border:1px solid var(--ok)}
.flash.err{background:var(--bad-soft);border-color:var(--bad)}
.flash.warn{background:var(--warn-soft);border-color:var(--warn)}
.pill{display:inline-flex;align-items:center;font-size:12px;padding:1px 9px;border-radius:999px;white-space:nowrap;font-weight:700}
.st-pending,.st-open{background:var(--warn-soft);color:var(--warn)}
.st-confirmed,.st-active,.st-answered{background:var(--ok-soft);color:var(--ok)}
.st-rejected,.st-closed,.st-suspended{background:var(--surface-2);color:var(--muted)}
.st-cancelled{background:var(--surface-2);color:var(--muted);text-decoration:line-through}
/* 大きく塗りつぶした札（申込の詳細の見出し） */
.pill.big{padding-left:14px;padding-right:14px;letter-spacing:.05em} /* 高さはふつうの札と同じ。色で目立たせる */
.pill.big.st-pending{background:var(--warn);color:#fff} .pill.big.st-confirmed{background:var(--ok);color:#fff} .pill.big.st-rejected{background:var(--muted);color:#fff} .pill.big.st-cancelled{background:var(--muted);color:#fff}
/* ショートメッセージの送信ログ */
.sl-ok{background:var(--ok-soft);color:var(--ok)} .sl-ng{background:var(--bad-soft,#fbe3e3);color:var(--bad)} .sl-test{background:var(--warn-soft);color:var(--warn)} .sl-log{background:var(--surface-2);color:var(--muted)}
.tbl.smslog td{vertical-align:top} .tbl.smslog .nowrap{white-space:nowrap}
.smslog-why{margin-top:4px;color:var(--bad);font-size:13px}
.g-M{color:var(--male)} .g-F{color:var(--female)}
.tag{font-size:11px;border:1px solid var(--line);border-radius:4px;padding:0 5px;color:var(--muted);white-space:nowrap;margin-right:4px}
.tag.role-admin{background:#3b4a6b;border-color:#3b4a6b;color:#fff;font-weight:700;padding:3px 8px} /* 上の名前の横の「管理者」：紺（ボタンの緑とは分ける） */
.tag.role-cm{background:#f6efe2;border-color:#e4d5b8;color:#7a5a24;font-weight:700;padding:3px 8px} /* ケアマネージャー：やさしいベージュ */
/* forms */
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 18px}
.field{display:flex;flex-direction:column;gap:5px;min-width:0}
.field.full{grid-column:1/-1}
.form.one{grid-template-columns:1fr} /* 上から順に1列で入れる（アカウント登録など） */
.field.row-start{grid-column:1/-1} /* 新しい行の左端から、行いっぱいに置く（選択ボタンを折り返さず横に並べる） */
.field.line-start{grid-column-start:1} /* 新しい行の左端から置く（前の行の右は空ける。事業所の欄をまとめて並べるときなど） */
.form.dt-split{grid-template-columns:max-content 120px;justify-content:start;column-gap:12px} /* 日付と時刻を詰めて並べる（日程・時刻の変更） */
.form .form.dt-split{grid-column:1/-1} /* フォームの中に入れたときは行いっぱい（日付・時刻の2列） */
.dt-split .dt-btn{width:100%} /* 入所日と退所日の枠の幅をそろえる（長いほうに合わせる） */
.field.row{flex-direction:row}
.field>label,.legend{font-size:13px;font-weight:700;color:var(--muted)}
.req{color:var(--bad);font-size:11px;margin-left:4px}
.label-note{font-weight:400;font-size:12px;margin-left:8px} /* 見出しの右に添える短い説明 */
/* 確認・お知らせの小さな画面（ブラウザの alert・confirm の代わり） */
.ui-dialog{border:0;border-radius:12px;padding:22px 24px;width:min(440px,calc(100vw - 32px));box-shadow:0 12px 32px rgba(28,42,39,.25);color:var(--ink);background:var(--surface)}
.ui-dialog::backdrop{background:rgba(28,42,39,.4)}
.ui-dialog p{margin:0 0 18px;line-height:1.7;white-space:pre-wrap;display:flex;justify-content:center;text-align:left} /* 1行なら中央、折り返したら左寄せ */
.ui-dialog .row{justify-content:center;gap:8px}
.help{font-size:12px;color:var(--muted)}
input[type=text],input[type=email],input[type=password],input[type=tel],input[type=number],input[type=date],input[type=month],select,textarea,.dt{border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:9px 11px;width:100%;min-width:0;line-height:inherit}
input[type=date],input[type=month]{padding-block:8px} /* 内側のカレンダーアイコンの分だけ高くなるので、上下の余白で揃える */
/* select はブラウザ標準の見た目だと高さが入力欄と揃わないため、見た目を外して▼を描く */
select{appearance:none;-webkit-appearance:none;padding-right:34px;cursor:pointer;background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235a6a66' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center}
/* 開いたときのリスト：対応するブラウザ（Chrome・Edge 135 以降）では項目の間隔を少し広げ、見た目をそろえる。ほかのブラウザ（iPhone など）は標準のリストのまま */
@supports (appearance:base-select){
  select,::picker(select){appearance:base-select}
  select::picker-icon{display:none} /* ▼は上の背景で描いている */
  ::picker(select){border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:4px;margin-top:4px;box-shadow:0 6px 20px rgba(0,0,0,.12)}
  option{padding:8px 12px;border-radius:6px;cursor:pointer}
  option::checkmark{display:none}
  option:hover,option:focus-visible{background:var(--surface-2);outline:none}
  option:checked{background:var(--accent-soft);color:var(--accent);font-weight:700}
}
/* 日時ピッカー（assets/pickers.js）：マス目の表。土曜＝水色、日曜・祝日＝ピンク、選べない日＝薄いグレー */
.field:has(.dt-btn){position:relative}
.dt-btn{display:block;text-align:left;cursor:pointer;color:var(--ink);background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%231e6c5f' stroke-width='2'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") no-repeat right 11px center;padding-right:38px}
.dt-btn.is-empty{color:var(--placeholder)}
.dt-btn:hover,.dt-btn[aria-expanded="true"]{border-color:var(--accent)}
.dt-btn[aria-expanded="true"]{box-shadow:0 0 0 3px var(--accent-soft)}
.dtp-backdrop{position:fixed;inset:0;z-index:40}
.dtp{--dtp-line:#9fb3ae;position:absolute;z-index:41;top:100%;left:0;margin-top:6px;width:390px;max-width:calc(100vw - 32px);background:#eef2f1;border-radius:6px;box-shadow:0 10px 28px rgba(28,42,39,.22);padding:12px;display:flex;flex-direction:column;gap:10px}
.dtp-nav{display:flex;align-items:center;background:var(--surface);border-radius:3px}
.dtp-month{flex:1;text-align:center;font-size:18px;font-weight:700;letter-spacing:.02em}
.dtp-arrow{width:48px;height:44px;border:0;background:none;font-size:16px;color:var(--ink);cursor:pointer}
.dtp-arrow:hover:not(:disabled){color:var(--accent)}
.dtp-arrow:disabled{color:var(--line);cursor:default}
.dtp-week{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-weight:700;font-size:15px;padding:2px 0}
.dtp-week .sat{color:var(--sat)} .dtp-week .sun{color:var(--sun)}
.dtp-grid{display:grid;grid-template-columns:repeat(7,1fr);border-top:1px solid var(--dtp-line);border-left:1px solid var(--dtp-line)}
.dtp-day{height:46px;border:0;border-right:1px solid var(--dtp-line);border-bottom:1px solid var(--dtp-line);background:var(--surface);font-size:16px;font-weight:700;color:var(--ink);cursor:pointer;font-variant-numeric:tabular-nums;border-radius:0;position:relative}
.dtp-day.sat{background:#e8f2fa}
.dtp-day.sun{background:#fbecf1}
.dtp-day.other{color:#a3aeab;font-weight:500;background:#f7f9f8}
.dtp-day.other.sat{background:#f4f8fc;color:#95aecb} .dtp-day.other.sun{background:#fdf6f8;color:#cfa0a9}
.dtp-day:hover:not(:disabled){background:var(--accent-soft);color:var(--accent)}
.dtp-day.today{box-shadow:inset 0 0 0 3px #7cc48a}
.dtp-day.r-in{background:var(--accent-soft)}
.dtp-day.r-start,.dtp-day.r-end{background:#9fd0b0}
.dtp-day.sel,.dtp-day.sel:hover{background:var(--accent);color:#fff}
.dtp-day:disabled{cursor:not-allowed} /* 予約できない日は色を変えず×印だけ（薄い表示は前月・翌月の日だけにして区別する） */
.dtp-day:disabled::after{content:"";position:absolute;inset:0;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d8c88' stroke-width='1.2' stroke-linecap='round'%3E%3Cpath d='M3 3l18 18M21 3L3 21'/%3E%3C/svg%3E") no-repeat center/42px 42px;opacity:.75}
.dtp-day.r-start:disabled::after{content:none}
.dtp-day.r-start:disabled{background:#9fd0b0;color:var(--ink)}
.dtp-day:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.dtp-time{display:flex;flex-direction:column;gap:6px;background:var(--surface);border-radius:3px;padding:10px}
.dtp-sub{font-size:13px;font-weight:700;color:var(--muted)}
.dtp-hours{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.dtp-mins{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.dtp-hour,.dtp-min{height:36px;padding:0;white-space:nowrap;border:1px solid var(--dtp-line);border-radius:3px;background:var(--surface);font-size:14px;font-weight:700;cursor:pointer;color:var(--ink)}
.dtp-hour:hover:not(:disabled),.dtp-min:hover:not(:disabled){background:var(--accent-soft);border-color:var(--accent)}
.dtp-hour.sel,.dtp-min.sel{background:var(--accent);border-color:var(--accent);color:#fff}
.dtp-hour:disabled,.dtp-min:disabled{background:#f1f3f3;color:#b5bfbc;cursor:not-allowed}
.dtp-note{font-size:12px;color:var(--muted)}
.dtp-foot{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 10px}
.dtp-current{font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.dtp-ok{min-height:40px;padding:6px 22px}
.dtp-acts{display:flex;gap:8px} /* キャンセルと選択を並べる */
.dtp-links{grid-column:1/-1;display:flex;justify-content:center;gap:24px}
.dtp-link{border:0;background:none;padding:4px 2px;font-size:15px;color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dtp-link:hover{color:var(--accent)}
/* 月の選択（月間利用一覧）：日付のカレンダーと同じ部品で、12か月を4列に */
.mp-wrap{position:relative;display:inline-block}
.mp-btn{width:auto;min-width:150px}
.dtp.mpp{width:300px;left:auto;right:0}
.dtp.dpp{left:auto;right:0}
.mp-grid{grid-template-columns:repeat(4,1fr)}
.mp-grid .dtp-day{height:48px;font-size:15px}
/* スマホ：画面下からの全幅表示 */
@media (max-width:640px){
  .dtp-backdrop{background:rgba(28,42,39,.35)}
  .dtp{position:fixed;top:auto;left:0;right:0;bottom:0;width:auto;max-width:none;margin:0;border-radius:14px 14px 0 0;padding:14px 14px calc(14px + env(safe-area-inset-bottom,0px));max-height:92vh;overflow:auto}
}
::placeholder{color:var(--placeholder);opacity:1}
textarea{min-height:90px;resize:vertical}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg.center{justify-content:center} .seg.center .help{flex-basis:100%;text-align:center} /* 送信ボタンのすぐ上の「知らせる」チェックは、ボタンに合わせて中央 */
.seg label{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:7px;padding:8px 16px 6px;cursor:pointer;font-size:14px;background:var(--surface);user-select:none} /* ボタンとして押すものなので、文字は選択させない */
.seg input{accent-color:var(--accent);margin:0;position:relative;top:-1px} /* 標準の余白はなくし、文字（和文は字面が上寄り）を1px下げたぶん丸は戻して、枠の中で丸と文字の中心をそろえる */
.seg label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
fieldset{border:0;padding:0;margin:0;min-width:0}
.section-title{font-family:var(--f-display);font-size:14px;color:var(--accent);grid-column:1/-1;border-bottom:1px solid var(--line);padding-bottom:4px;margin-top:16px}
.panel > :is(.section-title:first-child, input[type=hidden] + .section-title){margin-top:4px} /* 上に何もない見出し（枠のいちばん上）は詰める */
.hint{border-radius:8px;padding:10px 14px;font-size:14px;background:var(--surface-2)}
.hint.ok{background:var(--ok-soft)} .hint.warn{background:var(--warn-soft)} .hint.bad{background:var(--bad-soft)}
.errors{background:var(--bad-soft);border:1px solid var(--bad);border-radius:8px;padding:10px 14px}
.errors ul{margin:0;padding-left:20px}
/* lists */
.list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;background:var(--surface);overflow:hidden}
.item{display:grid;grid-template-columns:92px minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:12px 16px;border-top:1px solid var(--line);text-decoration:none;color:var(--ink)}
.item:first-child{border-top:0}
a.item:hover{background:var(--surface-2)}
.item .dates{font-variant-numeric:tabular-nums;font-weight:700}
.item .name{font-weight:700}
.meta{color:var(--muted);font-size:13px}
/* 申込状況：ボタンの数が行ごとに違っても列がずれないよう、ボタンの列の幅を決めて右にそろえる */
@media (min-width:761px){.st-list .item{grid-template-columns:92px minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) 290px}}
.st-list .acts{justify-content:flex-end}
/* 申し込み一覧：期間・ケアマネージャー・申し込み日時の列は幅を決めて、行ごとに列がずれないようにする（ケアマネージャーは長いときは折り返す） */
@media (min-width:761px){.idx-list .item{grid-template-columns:92px 150px minmax(0,1fr) 200px 120px}}
/* 期間の列も幅を決めて、利用者名との間を詰める（余った幅は利用者名と事業所の間にまわす）。一覧の幅が足りるときは期間を1行で、足りないときは「〜」の後ろで折り返す（ブラウザの拡大表示でも一覧の幅で決まるよう、画面の幅ではなく一覧の幅で切り替える） */
.idx-list{container-type:inline-size}
@container (min-width:950px){.idx-list .item{grid-template-columns:92px 290px minmax(0,1fr) 200px 120px}}
.idx-list .dates .d{white-space:nowrap}
.idx-list .idx-when{display:flex;flex-direction:column;align-items:flex-end;gap:4px;white-space:nowrap} .idx-list .idx-when .tag{margin-right:0} /* 「電話受付」の札は日時の上 */
@media (max-width:760px){.item{grid-template-columns:1fr auto}.item .c3,.item .c4{grid-column:1/-1}}
.empty{padding:32px 20px;text-align:center;color:var(--muted)}
.filters{display:flex;gap:6px;flex-wrap:wrap}
.filters a{min-width:122px;text-align:center;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:4px 12px;font-size:13px;text-decoration:none;color:var(--ink)}
.filters a[aria-current="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.filters.equal{display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;width:max-content;align-self:flex-start} /* 切り替えのボタンは同じ大きさ（最低122px、長い文字があればそれに幅をそろえる） */
@media (max-width:600px){.filters:not(.equal){flex:1 1 100%}.filters:not(.equal) a{min-width:max-content;flex:1 1 0;padding:4px 10px}.filters:not(.equal):has(>a:nth-child(5)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.filters:not(.equal):has(>a:nth-child(5)) a{min-width:0;padding:4px 6px}} /* スマートフォンでは最低幅をやめ、4つまでは1行に同じ幅で行いっぱいに並べる（5つ以上は1行に入らないので、同じ幅の3列に並べる） */
.kv{display:grid;grid-template-columns:120px minmax(0,1fr);gap:6px 14px;font-size:14px;margin:0}
.kv dt{color:var(--muted)} .kv dd{margin:0;overflow-wrap:anywhere}
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:860px){.cols{grid-template-columns:1fr}}
.scroller{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.tbl{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.tbl th,.tbl td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.tbl th{font-size:12px;color:var(--muted);font-weight:700;background:var(--surface-2);white-space:nowrap}
.tbl tr:last-child td{border-bottom:0}
.tbl td.c{text-align:center}
.tbl tr.we td{background:var(--weekend)}
.num0{color:var(--bad);font-weight:700}
.inline{display:inline}
/* candidates */
.cands{display:flex;flex-direction:column;gap:6px}
.moves{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
/* 部屋替えの欄の小さな部屋割り表 */
.mvgrid-wrap{border:1px solid var(--line)}
.mvgrid{border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums;min-width:100%}
.mvgrid th,.mvgrid td{border:1px solid var(--line);padding:0;text-align:center;height:30px;min-width:38px}
.mvgrid thead th{font-weight:700;line-height:1.2;padding:3px 2px;background:var(--surface-2)}
.mvgrid thead th small{display:block;font-weight:400;font-size:10px}
.mvgrid thead th.sat{color:var(--sat)} .mvgrid thead th.sun{color:var(--sun)}
.mvgrid tbody th{text-align:left;padding:0 8px;white-space:nowrap;background:var(--surface-2);font-weight:700}
.mvgrid td.own{background:var(--accent-soft);color:var(--accent);font-weight:700}
.mvgrid td.own.new{background:var(--accent);color:#fff}
.mvgrid td.own.clash{background:var(--accent-soft);color:var(--bad);font-weight:700;font-size:15px;box-shadow:inset 0 0 0 2px var(--bad)}
.sw.mv-new{background:var(--accent);border-color:var(--accent)}
.mv-tag{margin-left:6px;background:var(--accent);color:#fff}
.mvgrid td.g-M{background:var(--male-soft)} .mvgrid td.g-F{background:var(--female-soft)}
.mvgrid td.ng,.mv-ng{color:var(--bad);font-weight:700;font-size:15px;line-height:1}
.mvgrid td.g-X{background:repeating-linear-gradient(45deg,#eef1f0,#eef1f0 5px,#dfe5e3 5px,#dfe5e3 10px)} /* 使えない期間 */
.mv-ng{margin-right:4px}
.mvgrid td.free button{appearance:none;border:0;background:none;font:inherit;cursor:pointer;width:100%;display:flex;align-items:center;justify-content:center;height:30px;color:var(--muted);text-decoration:none;font-size:11px}
.mvgrid td.free button:hover{background:var(--accent);color:#fff}
.mvgrid td.free.off{background:repeating-linear-gradient(45deg,var(--surface),var(--surface) 4px,var(--surface-2) 4px,var(--surface-2) 8px)}
.mvgrid td.outday{background:repeating-linear-gradient(45deg,var(--surface),var(--surface) 4px,var(--surface-2) 4px,var(--surface-2) 8px);color:var(--muted);font-size:11px} /* 退所日のほかの部屋は、入所日と同じ斜線（選べない） */
.mvgrid td.outday.own-out{background:var(--accent-soft);color:var(--accent);font-weight:700}
.sw.mv-own{background:var(--accent-soft);border-color:var(--accent)}
.moves li{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cand{display:grid;grid-template-columns:auto auto 1fr;gap:4px 10px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:8px 12px;cursor:pointer;background:var(--surface)}
.cand:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.cand.blocked{opacity:.5;cursor:not-allowed}
.cand .cn{font-weight:700;font-variant-numeric:tabular-nums}
.cand .iss{grid-column:2/-1;display:flex;flex-wrap:wrap;gap:4px}
.mark{font-size:11px;font-weight:700;border-radius:4px;padding:1px 6px}
.mark.ok{background:var(--ok-soft);color:var(--ok)} .mark.warn{background:var(--warn-soft);color:var(--warn)} .mark.bad{background:var(--bad-soft);color:var(--bad)}
/* board */
/* 部屋割り表の操作：週の移動と今日は中央、開始日と表示日数は右 */
.board-title{display:flex;align-items:center;gap:14px;flex-wrap:wrap} /* 見出しの右に表示中の期間 */
.board-range{display:inline-flex;align-items:baseline;gap:10px;font-size:16px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;padding-left:14px;border-left:3px solid var(--line)} /* 押せる物と見分けられるよう、枠は付けず文字だけ */
.board-range small{font-size:12px;font-weight:400;color:var(--muted)}
@media (max-width:600px){.board-range{flex-wrap:wrap;white-space:nowrap;row-gap:0;font-size:15px}.board-range small{flex-basis:100%}} /* スマートフォンでは期間を1行に収め、「〜を表示中」はその下に */
.board-pending{margin-left:auto;font-size:16px;font-weight:700} /* 未割当の申し込みへのリンクは見出しの行の右端 */
.board-ctl{flex-basis:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px}
.board-nav{grid-column:2;display:flex;gap:6px}
.board-nav .btn{min-width:96px}
.board-pick{grid-column:3;justify-self:end;display:flex;gap:6px;align-items:center}
@media (max-width:760px){.board-ctl{grid-template-columns:1fr}.board-nav,.board-pick{grid-column:1;justify-self:center}}
.board{position:relative;--n:14;--lab:132px;--dmin:54px;min-width:calc(var(--lab) + var(--n) * var(--dmin));font-size:13px} /* 1日の幅は54pxより狭くしない（4週間以上は横にスクロールして見る。画面の幅には上限があるので、4週間の1日は54px） */
.board.short{--dmin:44px} /* 2週間は、狭い画面でも横にスクロールしないよう1日の幅を日付が入るところまで詰める */
.brow{display:grid;grid-template-columns:var(--lab) 1fr;border-top:1px solid var(--line)}
.brow:first-child{border-top:0}
.brow.room-start{border-top:2px solid var(--line)}
.blab{padding:6px 10px;display:flex;gap:4px;align-items:center;flex-wrap:nowrap;white-space:nowrap;border-right:1px solid var(--line);position:sticky;left:0;background:var(--surface);z-index:2;min-height:40px}
.btrack{position:relative;display:grid;grid-template-columns:repeat(var(--n),1fr);overflow:hidden;overflow:clip} /* 短い帯からはみ出した名前で、表が横に広がらないようにする */
.bcell{border-left:1px solid var(--line);min-height:40px}
.bcell:first-child{border-left:0}
.bcell.we{background:var(--weekend)} .bcell.sat-d{background:var(--sat-bg)} .bcell.hol-d{background:var(--sun-bg)} .bcell.td{background:var(--today)}
.bhead .bcell{text-align:center;padding:4px 0;line-height:1.25;min-height:0;font-variant-numeric:tabular-nums}
.bhead .bcell small{display:block;color:var(--muted);font-size:11px;margin-top:3px} /* 日付と曜日の間を少し空ける */
.sun{color:var(--sun)} .sat{color:var(--sat)}
.bsum .bcell{display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;color:var(--muted);min-height:0;padding:3px 0}
.bsum .blab{min-height:0;padding-top:3px;padding-bottom:3px} /* 空室・空きベッドの行は低く */
.bsum .bcell.full{color:var(--bad);font-weight:700}
.bar{position:absolute;z-index:1;top:calc(6px + var(--lane,0) * 44px);height:26px;box-sizing:border-box;border-radius:14px;padding:0 10px;display:flex;align-items:center;gap:4px;font-size:12px;font-weight:700;overflow:hidden;white-space:nowrap;border:1.5px solid;text-decoration:none;color:var(--ink)}
.bar.M{background:var(--male-soft);border-color:var(--male)}
.bar.F{background:var(--female-soft);border-color:var(--female)}
/* 利用者ごとの色（設定「施設情報」の「部屋割り表の帯の色」）。重複の赤い枠・使えない期間の灰色と見分けられる色にする */
.bar.p0{background:#dbe9f7;border-color:#4a7fc1} .bar.p1{background:#f8dfe6;border-color:#c0587a} .bar.p2{background:#dcf0e0;border-color:#3f8f55} .bar.p3{background:#fbe8cf;border-color:#c07a2c} .bar.p4{background:#e9e1f6;border-color:#7a5bb5}
.bar.p5{background:#d5efed;border-color:#2f8a86} .bar.p6{background:#f5efc4;border-color:#a08a1e} .bar.p7{background:#f0dfd3;border-color:#9a5f45} .bar.p8{background:#dfe4f3;border-color:#4f5fa0} .bar.p9{background:#f5dcf0;border-color:#a8489a}
.bar.blk{background:repeating-linear-gradient(45deg,#eef1f0,#eef1f0 6px,#dfe5e3 6px,#dfe5e3 12px);border-color:#9aa8a4;border-style:dashed;color:var(--muted);cursor:default} /* 使えない期間（修理・点検・使用停止） */
.bar.clipL{border-top-left-radius:0;border-bottom-left-radius:0;border-left-style:dashed}
.bar.clipR{border-top-right-radius:0;border-bottom-right-radius:0;border-right-style:dashed}
.bar.conflict{outline:2px solid var(--bad);outline-offset:1px}
/* 入所中の部屋替え：移る前の帯は右端を角にして▲▼（移る先の行の向き）、移ったあとの帯は左端を角にして▶ */
.bar.mv-out{border-top-right-radius:0;border-bottom-right-radius:0}
.bar.mv-in{border-top-left-radius:0;border-bottom-left-radius:0}
/* 部屋替えの線の矢印（移る前の帯 → 移ったあとの帯） */
.brow[style*="--lanes"] .btrack{min-height:max(66px,calc(var(--lanes) * 44px + 6px))} /* ベッドの行：1段＝帯と時刻で44px */
/* 帯の下の入所・退所の時刻（1段＝帯26px＋時刻の行） */
.bar-times{position:absolute;z-index:1;top:calc(6px + var(--lane,0) * 44px + 28px);display:flex;justify-content:space-between;gap:4px;font-size:11px;line-height:1;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;padding:0 2px}
.mv-lines{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0;color:#5a6a66} /* いつも表と同じ大きさ（表より大きくなって、横のスクロールが出ないように） */
.mv-lines .mv-line{fill:none;stroke:currentColor;stroke-width:1.6;stroke-dasharray:4 3}
.mv-lines .mv-M{color:var(--male)} .mv-lines .mv-F{color:var(--female)}
.bar.short{overflow:visible;z-index:2}
/* 部屋割り表：帯にマウスを乗せたときの吹き出し（名前・期間・事業所・備考など） */
.btip{position:absolute;z-index:50;width:max-content;max-width:min(400px,calc(100vw - 16px));padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px rgba(28,42,39,.18);font-size:13px;line-height:1.5;color:var(--ink);pointer-events:none}
.btip-t{font-weight:700;font-size:14px;margin-bottom:4px}
.btip dl{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:0}
.btip dt{color:var(--muted);white-space:nowrap} .btip dd{margin:0;font-variant-numeric:tabular-nums}
.btip dd.note{white-space:pre-wrap;overflow-wrap:anywhere}
@media print{.btip{display:none!important}}
/* 表の右端で切れる短い帯（期間の最後の日に入所など）で名前・時刻が入りきらないときは、右端にそろえて左へはみ出させる（右へは表の外になって見えないため）。入りきるかは board.php の JS で見て .end を付ける */
.bar.end,.bar-times.end{justify-content:flex-end}
/* ▶ はこの書体だと半角で小さく出るので、▼ と同じ大きさの三角を図で描く（文字は読み上げ用に残す） */
.legend-row{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--muted);align-items:center}
.sw{display:inline-block;width:22px;height:10px;border-radius:6px;border:1.5px solid;vertical-align:middle;margin-right:4px}
/* messages */
.thread{display:flex;flex-direction:column;gap:10px}
.msg{border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:var(--surface);max-width:680px}
.msg.mine{align-self:flex-end;background:var(--accent-soft);border-color:transparent}
.msg .meta{margin-bottom:4px}
.msg .body{white-space:pre-wrap;overflow-wrap:anywhere}
/* calendar */
#calendar{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px}
.fc{--fc-today-bg-color:var(--today);--fc-border-color:var(--line);--fc-button-bg-color:var(--accent);--fc-button-border-color:var(--accent);--fc-button-active-bg-color:#15524a;--fc-button-hover-bg-color:#185d52;--fc-event-border-color:transparent}
.fc .fc-toolbar-chunk:nth-child(2){display:flex;align-items:center;gap:12px}
.fc .fc-toolbar-title{font-size:18px}
/* 土曜＝薄い青、日曜・祝日＝薄い赤（部屋割り表と同じ）。今日は薄い緑を優先 */
.fc .fc-daygrid-day.fc-day-sat{background:var(--sat-bg)}
.fc .fc-daygrid-day.fc-day-sun,.fc .fc-daygrid-day.fc-day-hol{background:var(--sun-bg)}
.fc .fc-daygrid-day.fc-day-today{background:var(--today)}
.fc .fc-daygrid-day.fc-day-sat .fc-daygrid-day-number,.fc .fc-col-header-cell.fc-day-sat a{color:var(--sat)}
.fc .fc-daygrid-day.fc-day-sun .fc-daygrid-day-number,.fc .fc-daygrid-day.fc-day-hol .fc-daygrid-day-number,.fc .fc-col-header-cell.fc-day-sun a{color:var(--sun)}
.fc .fc-daygrid-day-top{flex-wrap:nowrap;align-items:center} /* 祝日名（左）と日付（右）を1行に */
.fc .hol-name{flex:1;min-width:0;order:1;font-size:10px;line-height:1.3;color:var(--sun);padding:2px 0 0 4px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc .can-apply:not(.is-full) .fc-daygrid-day-number{cursor:pointer;text-decoration:underline;text-underline-offset:3px;border-radius:999px;min-width:26px;text-align:center;margin:2px} /* 申し込める日の日付は押せる（押すとその日を入所日にして申し込み） */
.fc .can-apply:not(.is-full) .fc-daygrid-day-number:hover,.fc .can-apply:not(.is-full) .fc-daygrid-day-number:focus-visible{background:var(--accent);color:#fff!important;text-decoration:none;outline:none}
.fc .fc-list-day.fc-day-sat .fc-list-day-cushion{background:var(--sat-bg);color:var(--sat)}
.fc .fc-list-day.fc-day-sun .fc-list-day-cushion,.fc .fc-list-day.fc-day-hol .fc-list-day-cushion{background:var(--sun-bg);color:var(--sun)}
/* 予約カレンダーの棒：部屋割り表の帯と同じ（両端を丸く、男性＝青・女性＝ピンク）。申請中は点線、お断りは灰色 */
.fc .fc-daygrid-event.fc-h-event{border:1.5px solid;border-radius:0;font-weight:700;font-size:12px;padding:1px 2px}
.fc .fc-daygrid-event-harness{padding-bottom:4px} /* 期間が重なって上下に並ぶ帯の間を少し開ける */
.fc .fc-daygrid-day-frame .fc-daygrid-day-events{min-height:62px} /* 帯が少ない週でも、帯2本分の高さを取る */
.fc .fc-daygrid-event.fc-event-start{border-top-left-radius:14px;border-bottom-left-radius:14px;padding-left:8px;margin-left:8px} /* 入所日・退所日はマスの端から少し離す */
.fc .fc-daygrid-event.fc-event-end{border-top-right-radius:14px;border-bottom-right-radius:14px;padding-right:8px;margin-right:8px}
.fc .fc-daygrid-event.g-M{background:var(--male-soft);border-color:var(--male)}
.fc .fc-daygrid-event.g-F{background:var(--female-soft);border-color:var(--female)}
.fc .fc-daygrid-event.ev-pending{border-style:dashed;opacity:.85}
.fc .fc-daygrid-event.ev-pending.g-M{background:color-mix(in srgb,var(--male-soft) 45%,#fff)} .fc .fc-daygrid-event.ev-pending.g-F{background:color-mix(in srgb,var(--female-soft) 45%,#fff)} /* 申請中は背景を薄く */
.fc .fc-daygrid-event.ev-rejected{background:var(--surface-2);border-color:var(--line)}
.fc .fc-daygrid-event .fc-event-main,.fc .fc-daygrid-event .fc-event-title{color:var(--ink)}
.fc .fc-daygrid-event.ev-rejected .fc-event-title{color:var(--muted)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{nav.tabs,.who form,.no-print,.foot-link{display:none!important}body{background:#fff}} /* 印刷では、上のメニュー・ログアウト・画面の下のリンク（操作マニュアル・利用規約など）は出さない */
.tbl.monthly td{font-size:14px;white-space:nowrap} .tbl.monthly td.wrap{white-space:normal} /* 名前・日時・性別・電話番号は折り返さず、お部屋とケアマネージャーの列で幅を調整する */
.tbl.users td{padding-top:14px;padding-bottom:14px} /* アカウント一覧は行の高さに余裕を持たせる */
.tbl.users th:not(:last-child),.tbl.users td:not(:last-child){width:1%;white-space:nowrap;padding-right:32px} /* 列は中身の幅で左に詰め、余りはボタンの列へ */
.form .form.full{grid-column:1/-1}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* 設定（部屋）の表：入力欄は列幅いっぱい、備考が残りの幅を使う */
.tbl.rooms{min-width:900px;table-layout:fixed}
.tbl.rooms .c-move{width:44px}.tbl.rooms .c-name{width:220px}.tbl.rooms .c-type{width:120px}.tbl.rooms .c-beds{width:96px}.tbl.rooms .c-gender{width:130px}.tbl.rooms .c-act{width:64px}
.tbl.rooms th,.tbl.rooms td{padding:8px 6px}
.tbl.rooms td input,.tbl.rooms td select{width:100%}
.tbl.rooms .move{padding-right:0;cursor:grab}
.mover{display:inline-flex;flex-direction:column;border:1px solid var(--line);border-radius:6px;background:var(--surface);overflow:hidden}
.mover button{border:0;background:none;padding:0 8px;font-size:10px;line-height:17px;color:var(--muted);cursor:pointer}
.mover button:hover,.mover button:focus-visible{background:var(--accent-soft);color:var(--accent)}
.mover button+button{border-top:1px solid var(--line)}
.tbl.rooms tr.dragging td{opacity:.45}
.tbl.rooms tr.moved td{background:var(--accent-soft);transition:background .6s}
.tbl.rooms tr.changed td{background:var(--warn-soft)} /* 書き換えてまだ保存していない行 */
.tbl.rooms .new-row td{border-top:2px solid var(--line)}
.subtabs{display:flex;gap:4px;box-shadow:inset 0 -1px 0 var(--line);overflow-x:auto;overflow-y:hidden}
.tab-lead{margin-top:-6px}
.subtabs a{padding:8px 16px;text-decoration:none;color:var(--muted);font-weight:700;font-size:14px;border-bottom:3px solid transparent;white-space:nowrap}
.subtabs a:hover{color:var(--ink)}
.subtabs a[aria-current="page"]{color:var(--accent);border-bottom-color:var(--accent)}
.mailset .smtp-only{display:none}
.mailset:has(input[name=mail_method][value=smtp]:checked) .smtp-only{display:grid}
/* 送信方法が「送る」のときだけ、送信サービスとそのサービスの接続情報を出す */
.smsset .sms-on,.smsset .kddi-only{display:none}
.smsset:has(input[name=sms_use][value="1"]:checked) .sms-on{display:grid}
.smsset:has(input[name=sms_use][value="1"]:checked):has(select[name=sms_service] option[value=kddi]:checked) .kddi-only{display:grid}
@media print{@page{size:A4 landscape;margin:12mm}.tbl.monthly th,.tbl.monthly td{padding:4px 6px;font-size:11px}.tbl.monthly tr{break-inside:avoid}.tbl.monthly thead{display:table-header-group}.scroller{overflow:visible;border:0}.tbl.monthly a{color:inherit;text-decoration:none}}
.fc .fc-list-event.ev-pending,.fc .fc-list-event.ev-confirmed,.fc .fc-list-event.ev-rejected{background:none;color:var(--ink);border:0!important}
.fc .fc-list-event:hover td{background:var(--surface-2)}
.fc .fc-list-event.ev-confirmed .fc-list-event-dot{border-color:var(--accent)}
.fc .fc-list-event.ev-pending .fc-list-event-dot{border-color:var(--warn)}
.fc .fc-list-event.ev-rejected .fc-list-event-dot{border-color:var(--line)}
.fc .fc-list-event-time{display:none}
@media (max-width:640px){.fc .fc-toolbar{flex-wrap:wrap;gap:8px}.fc .fc-toolbar-title{font-size:16px}}
.field.test-row{display:grid;grid-template-columns:subgrid;column-gap:18px;row-gap:5px;align-items:center} /* 設定のテスト送信：送信先はほかの欄と同じ幅、その右の列に送るボタン、説明は1行 */
.test-row>label,.test-row>.help{grid-column:1/-1}
.test-row>.btn{justify-self:start}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden} /* 機械的な投稿よけの見えない欄（ご意見・ご要望・不具合報告） */
.fb-files{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px} /* 不具合報告に付ける画像の一覧 */
.fb-files li{display:flex;align-items:center;gap:10px;font-size:14px;overflow-wrap:anywhere}
.fb-files img{width:64px;height:48px;object-fit:cover;border:1px solid var(--line);border-radius:4px;flex:none}
.fb-files .btn{margin-left:auto;flex:none}
/* 連絡先（電話・メール）の行：先頭に小さなアイコン。アイコンは文字色で描く */
.contact{display:flex;align-items:center;gap:6px;margin-top:2px}
.contact a{color:inherit;text-decoration:none;overflow-wrap:anywhere} .contact a:hover{color:var(--accent);text-decoration:underline}
.ic{display:inline-block;width:15px;height:15px;flex:none;background:var(--muted);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.ic-tel{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E")}
.ic-mail{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='M22 6l-10 7L2 6'/%3E%3C/svg%3E")}
.time-pair{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap} .time-pair select{width:auto;min-width:110px} .time-pair label+select{margin-right:14px} /* 設定：入所・退所の標準の時刻 */
/* デモ（inc/demo.php）：画面の上の帯と、ログイン画面のボタン */
.demo-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 14px;padding:7px 16px;background:var(--warn-soft);border-bottom:1px solid var(--warn);color:var(--ink);font-size:.86rem;text-align:center}
.demo-bar form{margin:0}
.demo-bar a,.demo-bar button{font:inherit;background:none;border:0;padding:0;color:var(--accent);text-decoration:underline;cursor:pointer}
.demo-btns{display:grid;gap:10px}
@media print{.demo-bar{display:none}}