:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;color:#243c35;background:#f6f8f5;font-synthesis:none;line-height:1.6}
*{box-sizing:border-box}
body{margin:0}
[hidden]{display:none!important}
button,input{font:inherit}
button{cursor:pointer}
.page{max-width:800px;margin:0 auto;padding:46px 24px 64px}
.intro{margin-bottom:26px}
.brand{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:#466157;margin-bottom:26px}
.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#1f6355;color:#fff;letter-spacing:-1px;font-size:15px}
h1{font-size:30px;font-weight:750;line-height:1.45;letter-spacing:-.04em;margin:0 0 10px}
.subtitle{font-size:14px;color:#62736c;margin:0}
.panel{background:#fff;border:1px solid #dfe7e0;border-radius:18px;padding:24px;box-shadow:0 4px 22px #1b403005}
.controls{display:flex;align-items:flex-end;gap:16px}
.month-field{flex:1;display:grid;gap:6px;min-width:0;font-size:13px;font-weight:650}
.month-field input{width:100%;min-width:0;height:50px;padding:10px 14px;border:1px solid #cad8cf;border-radius:10px;background:#fff;color:#243c35;font-size:17px;font-weight:550}
.button{border-radius:10px;border:1px solid transparent;font-weight:650;white-space:nowrap;transition:background .15s}
.primary{background:#1f6355;color:#fff;min-height:50px;padding:12px 24px;font-size:15px}
.primary:hover{background:#184e44}
.primary span{font-size:21px;line-height:0;vertical-align:-1px;margin-left:10px}
.secondary{font-size:12px;background:#fff;border-color:#d9e2dc;color:#466157;padding:8px 12px}
.secondary:hover{background:#f2f6f2}
button:focus-visible,input:focus-visible{outline:3px solid #8cb8a8;outline-offset:3px}
.hint{margin:12px 0 18px;color:#728178;font-size:12px}
.conditions{display:flex;flex-wrap:wrap;gap:7px 18px;border-top:1px solid #edf0eb;padding-top:16px;font-size:12px;color:#6b7b73}
.conditions strong{color:#416052;font-weight:650}
.error{padding:10px 12px;background:#fff0ec;color:#9a422f;border-radius:8px;font-size:13px;margin:16px 0 0}
.storage-line{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px;margin-top:16px;color:#819087;font-size:11px}
#save-status{color:#1f6355;font-weight:650}
#save-status.unsaved{color:#9a422f}
button:disabled{cursor:default;opacity:.45}
.empty-state{text-align:center;font-size:13px;color:#839087;padding:36px 10px;margin:0}
.result{margin-top:20px}
.result-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
h2{margin:0;font-size:17px;font-weight:700}
.totals{display:grid;grid-template-columns:1fr 1fr;border-radius:12px;background:#edf5ef;margin-bottom:18px;padding:18px 20px;gap:16px}
.totals>div{display:grid;gap:4px}
.totals>div+div{border-left:1px solid #d2e4d9;padding-left:24px}
.totals span{font-size:12px;color:#667f70}
.totals strong{font-size:25px;letter-spacing:-.04em;font-weight:700;color:#1c5948;font-variant-numeric:tabular-nums}
.head-actions{display:flex;gap:8px}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px;white-space:nowrap;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:13px 10px;border-bottom:1px solid #edf0eb}
th{font-size:12px;color:#728178;font-weight:550;padding-top:7px;padding-bottom:10px}
th:last-child,td:last-child{text-align:right}
th:first-child,td:first-child{padding-left:3px}
th:last-child,td:last-child{padding-right:3px}
tbody tr:last-child td{border-bottom:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:520px){.page{padding:26px 16px 40px}.brand{margin-bottom:22px}h1{font-size:24px}.subtitle{font-size:13px}.panel{padding:18px;border-radius:14px}.controls{gap:10px}.primary{padding:12px 15px;font-size:13px}.primary span{margin-left:5px}.month-field input{font-size:15px;padding:10px}h2{font-size:15px}.totals{padding:15px 13px;gap:10px}.totals>div+div{padding-left:14px}.totals strong{font-size:21px}table{font-size:13px}th,td{padding:12px 8px}.conditions{gap:6px 14px}}
@media(max-width:350px){.controls{align-items:stretch;flex-direction:column}.totals strong{font-size:18px}.result-heading{align-items:flex-start}}
.person-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.person-fields label{display:grid;gap:6px;font-size:13px;font-weight:650;min-width:0}
.person-fields input{width:100%;height:44px;padding:8px 12px;border:1px solid #cad8cf;border-radius:10px;font-size:15px;color:#243c35;background:#fff}
.print-only{display:none}
.edit-hint{margin:-6px 0 12px}
.sheet-title{margin:0 0 8px;font-size:17px;font-weight:700}
.sheet-meta{display:flex;flex-wrap:wrap;gap:4px 24px;margin:0 0 12px;font-size:13px;color:#466157}
.sheet-meta strong{color:#243c35;font-weight:650}
.sheet-table{white-space:nowrap;min-width:700px}
.sheet-table th{background:#2c3e50;color:#fff;text-align:center;font-weight:600;font-size:12px;padding:8px 6px;border:1px solid #2c3e50}
.sheet-table td{text-align:center;padding:4px 5px;border:1px solid #e3e8e5;font-size:13px}
.sheet-table tbody tr:nth-child(even){background:#f8f9f9}
.sheet-table tbody tr.sat{background:#ebf5fb;color:#2471a3}
.sheet-table tbody tr.sun{background:#fdedec;color:#c0392b}
.sheet-table tbody tr:last-child td{border-bottom:1px solid #e3e8e5}
.sheet-table td:nth-child(7),.sheet-table td:nth-child(8){text-align:right}
.sheet-table td:last-child{text-align:left}
.sheet-table input,.sheet-table select{width:100%;height:32px;padding:3px 6px;border:1px solid #d9e2dc;border-radius:6px;background:#fff;color:#243c35;font-size:13px;text-align:center;font-variant-numeric:tabular-nums}
.sheet-table select{padding:3px 2px}
.sheet-table td:nth-child(3){width:78px}
.sheet-table td:nth-child(n+4):nth-child(-n+6){width:78px}
.sheet-table td:last-child input{text-align:left;min-width:120px}
.sheet-table input:disabled,.sheet-table select:disabled{background:transparent;border-color:transparent}
.sheet-table tr.invalid input{border-color:#d78f79;background:#fff7f4}
.sheet-table .total-row th,.sheet-table .total-row td{background:#f2f4f4;color:#243c35;font-weight:700;border:1px solid #d5dad8;text-align:center}
.sheet-table .total-row th{color:#243c35}
.sheet-table .total-row td:nth-child(n+4):nth-child(-n+5){text-align:center}
.sheet-table .total-row td:nth-child(6),.sheet-table .total-row td:nth-child(7){text-align:right}
.summary-table{width:auto;min-width:240px;margin-top:18px;font-size:13px}
.summary-table thead th{background:#2c3e50;color:#fff;font-weight:600;text-align:center;padding:7px 14px;border:1px solid #2c3e50}
.summary-table tbody th{background:#f8f9f9;color:#243c35;font-size:13px;font-weight:600;text-align:left;padding:6px 14px;border:1px solid #e3e8e5}
.summary-table tbody td{text-align:right;padding:6px 14px;border:1px solid #e3e8e5;font-variant-numeric:tabular-nums}
@media(max-width:520px){.person-fields{grid-template-columns:1fr}}
@media print{
  @page{size:A4 portrait;margin:8mm}
  html,body{background:#fff;height:auto}
  .page{max-width:none;padding:0;margin:0}
  .intro,.panel:first-of-type,.empty-state,.screen-only,noscript{display:none!important}
  .panel{border:0;box-shadow:none;padding:0;border-radius:0}
  .result{margin:0}
  .table-wrap{overflow:visible}
  .sheet-title{font-size:15pt;margin:0 0 2mm}
  .sheet-meta{font-size:9.5pt;margin:0 0 2mm;gap:2px 10mm}
  table{white-space:normal}
  .sheet-table{min-width:0;width:100%;font-size:8.5pt}
  .sheet-table th,.sheet-table td{padding:.7mm 1mm;font-size:8.5pt;line-height:1.2}
  .sheet-table input,.sheet-table select{border:0!important;background:transparent!important;height:auto;padding:0;font-size:8.5pt;line-height:1.2;appearance:none;-webkit-appearance:none;color:inherit;min-width:0}
  .sheet-table td:last-child input{min-width:0}
  .sheet-table,.sheet-table *,.summary-table,.summary-table *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .summary-table{margin-top:3mm;width:100%;min-width:0;font-size:8.5pt}
  .summary-table thead{display:none}
  .summary-table tbody{display:flex}
  .summary-table tbody tr{display:flex;flex-direction:column;flex:1}
  .summary-table tbody th{background:#2c3e50;color:#fff;text-align:center;padding:.8mm 1mm;font-size:8.5pt}
  .summary-table tbody td{text-align:center;padding:.8mm 1mm}
  tr{break-inside:avoid}
  #sheet{break-inside:avoid}
}
