:root { --navy:#16324f; --blue:#1769aa; --pale:#eef6fb; --green:#147d4c; --red:#b3261e; --amber:#9a6700; --border:#d7e0e8; --text:#17212b; --muted:#617080; }
  * { box-sizing:border-box; }
  body { margin:0; background:#f5f7f9; color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif; line-height:1.55; }
  .app-header { display:flex; justify-content:space-between; align-items:center; padding:20px 18px; color:#fff; background:linear-gradient(135deg,var(--navy),#245f8f); }
  .brand-lockup { display:flex; align-items:center; gap:11px; min-width:0; }
  .brand-mark { display:grid; place-items:center; width:64px; height:64px; flex:0 0 64px; overflow:hidden; border:1px solid rgba(255,255,255,.55); border-radius:10px; background:#fff; color:var(--navy); font-size:20px; font-weight:900; }
  .brand-mark span,.brand-mark img { grid-area:1/1; }
  .brand-mark img { width:100%; height:100%; padding:2px; object-fit:contain; background:#fff; }
  .store-name { margin:0 0 1px; color:#fff; font-size:14px; font-weight:850; line-height:1.25; }
  .app-header h1 { margin:0; font-size:25px; }
  .eyebrow { margin:0 0 3px; font-size:11px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:#6d7f90; }
  .app-header .eyebrow { color:#d8e9f7; }
  .badge { background:#fff2cc; color:#6b4d00; border-radius:999px; padding:5px 9px; font-size:11px; font-weight:800; }
  main { max-width:680px; margin:0 auto; padding:14px 12px 100px; }
  .card { background:#fff; border:1px solid var(--border); border-radius:14px; padding:16px; margin:0 0 12px; box-shadow:0 2px 8px rgba(22,50,79,.05); }
  .card h2 { margin:0 0 8px; font-size:18px; }
  .mock-card { border-color:#f0c36d; background:#fffaf0; }
  label { display:block; font-weight:700; margin:0 0 6px; }
  select,input,textarea { width:100%; font:inherit; color:inherit; background:#fff; border:1px solid #aebbc7; border-radius:9px; padding:11px 10px; }
  textarea { resize:vertical; }
  .inline-control { display:grid; grid-template-columns:1fr auto; gap:8px; }
  .help,.counter { margin:7px 0 0; color:var(--muted); font-size:12px; }
  .counter { text-align:right; }
  .staff-name { margin:0; color:var(--blue); font-weight:800; }
  .period-card h2 { font-size:22px; margin:4px 0; }
  .period-card p { margin:4px 0; }
  .deadline { color:var(--red); font-weight:800; }
  .status-line { padding-top:8px; border-top:1px solid var(--border); color:var(--muted); }
  .policy-card { border-left:5px solid var(--blue); background:var(--pale); }
  .policy-card p { margin:0; }
  .section-title { font-size:19px; margin:20px 4px 9px; }
  .day-card { background:#fff; border:1px solid var(--border); border-radius:13px; margin:0 0 9px; overflow:hidden; }
  .day-row { display:flex; justify-content:space-between; align-items:center; padding:14px; }
  .date-label { font-size:17px; font-weight:800; }
  .date-label.saturday { color:#1769aa; }
  .date-label.sunday { color:#b3261e; }
  .day-status { font-size:12px; color:var(--muted); }
  .switch-wrap { display:flex; align-items:center; gap:8px; font-weight:700; }
  .switch-wrap input { width:42px; height:24px; accent-color:var(--green); }
  .time-panel { display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:center; padding:0 14px 14px; background:#f3faf6; }
  .time-panel.hidden { display:none; }
  .time-panel label { margin:0; font-size:12px; color:var(--muted); }
  .time-field select { margin-top:3px; }
  .button { min-height:44px; border:0; border-radius:10px; padding:10px 15px; font:inherit; font-weight:800; cursor:pointer; }
  .button:disabled { opacity:.55; cursor:wait; }
  .button-primary { color:#fff; background:var(--blue); }
  .button-secondary { color:var(--navy); background:#e8eef3; }
  .full { width:100%; margin-top:16px; }
  .sticky-actions { position:sticky; bottom:0; display:grid; grid-template-columns:1fr 1.35fr; gap:8px; padding:10px 0; background:linear-gradient(transparent,#f5f7f9 18%); }
  .alert { border-radius:10px; padding:12px; margin:0 0 12px; white-space:pre-wrap; }
  .alert-error { color:#7a1712; background:#fdecea; border:1px solid #f3b7b3; }
  .alert-pending { color:#5c4300; background:#fff6d8; border-color:#ead58c; }
  .alert-success { color:#0f5a36; background:#eaf7ef; border:1px solid #abd9be; }
  .notice { padding:10px; margin:8px 0; border-radius:9px; background:#eef6fb; }
  .center { text-align:center; }
  .hidden { display:none !important; }
  dialog { width:min(92vw,580px); max-height:88vh; border:0; border-radius:16px; padding:0; box-shadow:0 16px 50px rgba(0,0,0,.25); }
  dialog::backdrop { background:rgba(10,25,39,.55); }
  .dialog-body { padding:20px; }
  .summary-list { margin:10px 0; padding:0; list-style:none; }
  .summary-list li { border-left:4px solid var(--green); padding:10px 12px; margin:0 0 8px; background:#eef8f2; font-weight:750; border-radius:5px; }
  .all-unavailable { padding:16px; background:#fff0ef; border:2px solid var(--red); border-radius:10px; color:#801c16; font-weight:900; text-align:center; }
  .submit-notice { font-weight:800; }
  .dialog-actions { display:grid; grid-template-columns:1fr 1.2fr; gap:8px; margin-top:18px; }
  .toast { position:fixed; left:50%; bottom:18px; transform:translateX(-50%); z-index:20; width:min(90vw,520px); padding:13px; border-radius:11px; background:#173f2d; color:#fff; text-align:center; box-shadow:0 5px 20px rgba(0,0,0,.25); }
  @media (max-width:380px) { .dialog-actions,.sticky-actions { grid-template-columns:1fr; } .app-header { align-items:flex-start; } }