.kana-tabs{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.kana-tabs button{min-width:44px;padding:7px 12px;font-size:15px}.kana-tabs button.active{color:white;background:var(--teal);border-color:var(--teal)}.progress-count{color:var(--muted);font-size:15px;margin:8px 0}.hero-progress small{display:inline-block;margin-top:5px}.stage{font-size:15px}.canonical-header{display:flex;gap:10px;align-items:center}.history-record{padding:14px 0;border-bottom:1px solid var(--line)}.history-record p{margin:4px 0}.draft-label{background:#6a635a;color:white;padding:8px;text-align:center;font-family:sans-serif;font-weight:700;margin-bottom:12px}.paper.draft .write{outline-color:#777}.paper.draft .write td{color:#5d5750}.review-dialog{width:580px}.review-values{margin:20px 0;max-height:45vh;overflow:auto}.review-values>div{display:grid;grid-template-columns:1fr 1.3fr;gap:15px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px;overflow-wrap:anywhere}.review-dialog .actions{justify-content:space-between}.is-working::before{content:'';display:inline-block;width:15px;height:15px;margin-right:9px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-2px;animation:save-spin .8s linear infinite}@keyframes save-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.is-working::before{animation:none}}@media(max-width:600px){.stages{grid-template-columns:1fr;gap:20px}.stage strong{display:inline-block;margin-left:15px}.stage .progress-count{margin-left:12px}.review-values>div{grid-template-columns:1fr;gap:3px}}

.month-selector{flex-shrink:0;display:grid;gap:5px;color:var(--muted);font-size:14px}.month-button{font-size:22px;font-weight:700;color:var(--teal);min-width:205px;padding:12px 17px}.calendar-year{display:flex;align-items:center;justify-content:space-between;margin:12px 0 22px}.calendar-year strong{font-size:24px}.calendar-months{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.calendar-months button{font-size:20px;min-height:62px}.usage-note{margin-top:12px}.live-preview{margin-top:22px;border-top:1px solid var(--line);padding-top:20px}.demo-caption{margin-top:12px}.paper-dialog .paper .write td{font-size:clamp(12px,2.1cqw,19px)}.paper-dialog .paper .write .company{font-size:clamp(10px,2.12cqw,17px);letter-spacing:-.05em;white-space:nowrap}.paper-dialog .paper .write .signature{font-size:clamp(10px,1.7cqw,15px);white-space:nowrap}.paper.demo .write{outline-color:#bb2c2c}.paper.demo .write td{color:#b42323}.paper.demo .draft-label{background:#754809}@media(max-width:600px){.month-button{font-size:18px;min-width:155px}.paper-dialog .paper .write td{font-size:clamp(9px,2.1cqw,14px)}.paper-dialog .paper .write .company{font-size:clamp(6px,2.12cqw,12px)}.paper-dialog .paper .write .signature{font-size:clamp(6px,1.7cqw,11px)}}


.month-left{margin:0 0 24px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}.month-left>span{font-weight:700;color:#61787b}.month-left>div{display:flex;gap:8px}.month-left .month-button{font-size:24px;padding:12px 24px;border-color:#126d70}.coverage-panel{padding:18px 20px;margin:16px 0;border:1px solid #c9dedf;border-left:5px solid #126d70;background:#f3faf9;border-radius:10px}.coverage-panel.needs-review{background:#fff7eb;border-color:#d5a153}.coverage-panel p{margin:8px 0}.certificate-list{border-top:1px solid #dbe4e5;margin-top:24px;padding-top:16px}.certificate-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0;border-bottom:1px solid #dbe4e5}.certificate-list>.primary{margin-top:16px}.date-trigger{text-align:left;min-height:48px}.date-dialog{max-width:min(460px,calc(100vw - 24px))}.date-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;text-align:center}.date-grid button{padding:7px 0;min-height:46px;font-size:18px}.date-grid button.today{box-shadow:inset 0 -4px #db9829}.date-grid>span{font-size:14px;padding:6px 0}.date-grid>span:first-child{color:#b52628}.date-grid>span:nth-child(7){color:#17668e}

/* Compact centered dialogs: keep touch targets, reduce surrounding whitespace. */
dialog{width:560px;max-width:calc(100vw - 32px);max-height:80vh;max-height:80dvh;margin:auto;padding:20px;border-radius:12px;overflow:auto}
dialog .dialog-head{margin-bottom:14px;gap:12px}dialog h2{font-size:20px;line-height:1.5}dialog .coverage-panel{padding:12px 14px;margin:12px 0}dialog .actions{gap:8px}
dialog.paper-dialog{width:720px;max-width:calc(100vw - 32px);max-height:min(80dvh,760px)}
dialog .dialog-head{position:sticky;top:-20px;background:white;z-index:2;padding:8px 0;border-bottom:1px solid var(--line)}
dialog.review-dialog{width:480px}.review-values{margin:12px 0;max-height:40vh}
dialog.month-dialog{width:360px;padding:18px}.month-dialog .calendar-year{margin:0 0 12px}.month-dialog .calendar-year strong{font-size:20px}.month-dialog .calendar-months{gap:8px}.month-dialog .calendar-months button{font-size:16px;min-height:44px;padding:8px}
dialog.date-dialog{width:376px;max-width:calc(100vw - 24px);padding:16px}.date-dialog .calendar-year{margin:0 0 8px}.date-dialog .calendar-year h3{margin:0;font-size:19px}.date-dialog .calendar-year button{padding:7px 14px}.date-dialog p{font-size:14px;line-height:1.5;margin:8px 0}.date-grid{gap:3px}.date-grid button{min-height:44px;font-size:16px;padding:4px 0}.date-grid>span{padding:3px 0}.date-dialog .actions{margin-top:12px}.month-left .month-button{font-size:21px;padding:8px 16px}


.staff-row{display:grid;grid-template-columns:70px 1fr 1.1fr 110px;gap:12px;padding:16px 0;border-bottom:1px solid var(--line);align-items:center}.staff-row .staff-error{grid-column:2/-1;margin:0}.staff-result{padding:16px 0;border-bottom:1px solid var(--line)}.staff-result label{margin:8px 0}.batch-row{padding:16px 0;border-bottom:1px solid var(--line)}.batch-money{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:12px 0}.batch-money span{font-size:14px;color:var(--muted)}.batch-money b{display:block;font-size:19px;color:#213c40}.batch-row>.check{font-size:17px}.batch-row>div:last-child{display:flex;justify-content:space-between;align-items:center;gap:8px}.entry-head{flex-wrap:wrap}#staff-message{white-space:pre-line}@media(max-width:600px){.staff-row{grid-template-columns:1fr 1fr}.staff-row>.check,.staff-row .staff-error{grid-column:1/-1}.batch-money{gap:6px}.batch-money b{font-size:16px}}
.top .user{display:flex;flex-flow:row nowrap;align-items:center;justify-content:flex-end;gap:12px;margin-left:auto;min-width:0;font-size:14px}
.top .user .badge{display:inline-flex;flex:0 0 auto;width:max-content;white-space:nowrap;padding:3px 9px}
.top .user .user-name{display:block;min-width:0;max-width:24ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.top .user button{flex:0 0 auto;white-space:nowrap;font-size:14px}
.patient-row{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1.25fr) 156px}
.patient-row .row-action{width:100%;white-space:normal;overflow-wrap:anywhere;font-size:14px;padding:10px 8px;min-height:46px}
.patient-row .badge{max-width:100%;overflow-wrap:anywhere}
@media(max-width:850px){.patient-row{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1.1fr) 156px;gap:10px}}
@media(max-width:600px){
 .top{flex-wrap:wrap;gap:6px}
 .top .brand{flex-basis:100%}
 .top .user{max-width:100%;gap:8px}
 .top .user .user-name{max-width:none;flex:0 1 auto}
 .patient-row{grid-template-columns:minmax(0,1fr);gap:8px}
 .patient-row .row-action{grid-column:1;justify-self:stretch;min-height:44px;margin-top:4px}
}

/* Monthly workspace: compact progress while preserving readable touch controls. */
.monthly-heading{margin-bottom:12px}.monthly-title{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:10px}.monthly-title h1{margin:0}.monthly-title>.muted{font-size:14px}.monthly-heading .month-left{flex-direction:row;align-items:center;margin:0;gap:12px}.monthly-heading .month-left button{min-height:44px}.monthly-heading .month-button{font-size:19px}
.hero-progress{grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:12px 20px;padding:16px 20px;margin-bottom:12px}.hero-progress .stages{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.hero-progress .big,.hero-progress .stage strong{display:inline-block;font-size:26px;line-height:1.25;margin:4px 8px 0 0}.hero-progress>div:first-child>.muted{display:block;font-size:14px}.hero-progress .stage{font-size:14px}.hero-progress .stage strong{display:block}.hero-progress .progress-count{display:inline-block;font-size:14px;margin:4px 0}.hero-progress .meter{margin-top:7px}.hero-progress small{margin-top:0}.progress-explanation{grid-column:1/-1;margin:0;border-top:1px solid var(--line)}.progress-explanation summary{font-size:14px;min-height:44px;padding:10px 0 0}.progress-explanation p{font-size:14px;margin:6px 0 0}.monthly-heading~.chips{margin-bottom:12px}.monthly-heading~.card .kana-tabs{margin:10px 0;padding:10px 0}.monthly-heading~.card .toolbar{margin-bottom:10px}
.recorded-stamp{display:inline-flex;align-items:center;justify-content:center;border:2px solid #126d70;border-radius:5px;padding:2px 8px;color:#126d70;background:#f1faf8;font-size:14px;font-weight:700;line-height:1.5;white-space:nowrap}.paper-completion{display:flex;align-items:center;gap:14px;padding:12px 14px;margin:12px 0;background:#f1faf8;border:1px solid #c9dedf;border-radius:8px;font-size:14px;overflow-wrap:anywhere}.paper-completion strong{display:block;margin-bottom:3px}.paper-completion>.recorded-stamp{flex-shrink:0}
@media(min-width:601px) and (max-width:900px){main{padding-top:20px}.hero-progress,.hero-progress .stages{gap:12px}.hero-progress{padding:14px}.monthly-heading~.card .toolbar{gap:8px}.monthly-heading~.card .toolbar button{font-size:14px;padding:8px 10px;min-height:44px}}
@media(max-width:600px){.monthly-title{gap:4px}.monthly-title>.muted{flex-basis:100%}.hero-progress{grid-template-columns:1fr 1fr}.hero-progress .stages{display:contents}.hero-progress .stage strong{margin-left:0}.hero-progress .stage .progress-count{margin-left:0}.monthly-heading .month-left{gap:8px}.paper-completion{align-items:flex-start}}
/* Keep tablet controls on one line without reducing tap targets. */
.hero-progress .stage{display:grid;grid-template-columns:auto 1fr;align-content:start}.hero-progress .stage strong{display:inline-block;margin:4px 8px 0 0;grid-column:1}.hero-progress .stage .progress-count{align-self:center;margin:4px 0 0}.hero-progress .stage .meter{grid-column:1/-1}.hero-progress .progress-explanation summary{padding:8px 0;min-height:44px}
.monthly-heading~.chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:3px}.monthly-heading~.chips button{flex-shrink:0;white-space:nowrap;min-height:44px;padding:8px 12px}.monthly-heading~.card .kana-tabs{flex-wrap:nowrap;overflow-x:auto}.monthly-heading~.card .kana-tabs button{flex-shrink:0;min-height:44px}
/* Keep the selected month below the title at the left on every screen width. */
.monthly-heading{display:block}.monthly-heading .month-left{justify-content:flex-start}

.hero-progress .stage-label{grid-column:1/-1}.hero-progress{gap:8px 20px;padding-top:12px;padding-bottom:8px}

/* Clear operation feedback with an accessible reduced-motion fallback. */
dialog.navigation-dialog{width:360px;max-width:calc(100vw - 32px);padding:20px}dialog.navigation-dialog h2{font-size:20px}dialog.navigation-dialog p{font-size:14px;margin:10px 0 18px}dialog.navigation-dialog .actions{justify-content:flex-end;margin-top:0}dialog.navigation-dialog[open]{animation:dialog-appear .16s ease-out}
#request-feedback{display:none;position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:100;padding:10px 18px;border:1px solid #bed9d9;border-radius:8px;background:#fff;color:#126d70;box-shadow:0 4px 18px #143f4222;font-size:14px;font-weight:700;pointer-events:none}#request-feedback.visible{display:flex;align-items:center;gap:9px}#request-feedback.visible::before{content:'';width:15px;height:15px;border:2px solid #bbd7d7;border-top-color:#126d70;border-radius:50%;animation:save-spin .8s linear infinite}
#notice.show{animation:notice-appear .2s ease-out}@keyframes notice-appear{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}@keyframes dialog-appear{from{opacity:0;translate:0 5px}to{opacity:1;translate:0 0}}@media(prefers-reduced-motion:reduce){#request-feedback.visible::before,#notice.show,dialog.navigation-dialog[open]{animation:none}}

#app:has(.app-version){min-height:100dvh;display:flex;flex-direction:column}#app:has(.app-version)>main{width:100%;flex:1}.app-version{padding:14px 20px;text-align:center;font-size:14px;line-height:1.7;color:var(--muted);border-top:1px solid var(--line);background:white}.auth-version{line-height:1.7}@media print{.app-version,#request-feedback{display:none!important}}

/* Shared feedback standard: centre, non-blocking, responsive. */
#notice,#request-feedback{position:fixed;top:45%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:max-content;max-width:calc(100vw - 32px);box-sizing:border-box;overflow-wrap:anywhere;z-index:100001}
@media(max-height:420px){#notice,#request-feedback{top:40%;max-height:calc(100dvh - 24px);overflow:auto}}
@media print{#notice,#request-feedback{display:none!important}}

/* Keep utilization month visually distinct from the later visit/report month. */
.monthly-heading{display:block}.monthly-title{margin-bottom:14px}.usage-month{padding:17px 20px;background:#fff3e2;border:1px solid #e6b872;border-left:5px solid #cc7e20;border-radius:12px}.usage-month-main{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.usage-month-label{display:block;color:#765122;font-size:13px;font-weight:700;margin-bottom:5px}.usage-month .month-left{margin:0}.usage-month .month-left>div{display:flex;gap:6px;align-items:center}.usage-month .month-button{font-size:25px;line-height:1.3;font-weight:800;background:white;color:#17364a;min-height:46px}.usage-month-flow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0 5px;line-height:1.6}.usage-month>p:last-child{margin:0}.usual-month{font-size:13px;min-height:40px}.pending-reports{border:1px solid #e7be87;background:#fffaf2;border-radius:10px;padding:14px 18px;margin:0 0 18px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.pending-reports p{margin:4px 0}.pending-months{display:flex;gap:8px;flex-wrap:wrap}.pending-months button{border-color:#be883d;color:#744812;font-weight:700}.paper-context{border-radius:8px;border:1px solid #e7be87;background:#fff3e2;padding:12px 16px;margin-bottom:14px;display:grid;gap:3px}.paper-context>span{font-size:12px;color:#765122}.paper-context>strong{font-size:26px;color:#213c4c}.paper-context>b{font-size:19px}.paper-context>small{color:#526d78}.report-button{min-height:48px}.recorded-stamp{max-width:100%;white-space:normal}.paper-completion{overflow-wrap:anywhere}
@media(max-width:600px){.usage-month{padding:12px}.usage-month .month-button{font-size:20px;padding:8px}.usage-month .month-left button:not(.month-button){padding:8px 12px}.usage-month-main{gap:10px}.usage-month-flow{font-size:14px;gap:4px}.paper-context>strong{font-size:23px}.pending-reports{padding:12px}.report-button{width:100%}.brand small{font-size:12px}}

/* Selected compact month design: utilization month is the single primary date. */
.usage-month.compact-month{background:#fff2dc;border:0;border-top:4px solid #d6973d;padding:16px 22px;border-radius:13px;color:#173c44}
.compact-month-main{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.compact-month-label{font-size:15px;font-weight:700}.compact-month-date{font-size:20px;line-height:1.5;margin-top:3px}.compact-month-date strong{font-size:38px;white-space:nowrap}
.compact-month-picker{display:grid;gap:4px;font-size:14px;color:#745a31}.compact-month-picker button{font-size:16px;min-height:44px;background:#fff;color:#173c44;padding:8px 12px}
.compact-month h2{font-size:18px;line-height:1.6;margin:10px 0 0}.compact-month>p:last-child{font-size:14px;line-height:1.7;margin:6px 0 0}
.nav{flex-wrap:wrap;overflow:visible;gap:6px}.nav button{white-space:nowrap}.nav-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;padding:1px 6px;border-radius:20px;background:#a93927;color:white;font-size:14px;margin-left:5px}
.issue-options{border:1px solid var(--line);border-radius:9px;margin:18px 0;padding:12px}.issue-options legend{font-weight:700;font-size:16px}.issue-options .check{margin:5px 0;padding:9px;min-height:44px}
.issue-item{padding:18px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.issue-item:first-child{padding-top:0}.issue-item:last-child{border-bottom:0}.issue-item .entry-head{align-items:flex-start;gap:12px}.issue-item p{margin:8px 0}.issue-item h2{margin:0}
.note-preview{padding:14px;background:#f2f7f7;border-radius:8px}.note-preview p{white-space:pre-wrap;overflow-wrap:anywhere}
.staff-directory-head,.staff-directory-row{display:grid;grid-template-columns:minmax(160px,1.4fr) minmax(95px,.8fr) minmax(155px,1.2fr) minmax(125px,1fr) minmax(145px,.9fr);gap:14px}
.staff-directory-head{background:#f1f6fa;padding:16px;font-weight:700}.staff-directory-row{padding:18px 16px;border-bottom:1px solid var(--line);font-size:15px;align-items:start}.staff-directory-row:last-child{border:0}.staff-directory-row>div{min-width:0;overflow-wrap:anywhere}.staff-directory-row small{display:block;font-size:14px;margin-top:5px;color:var(--muted)}.staff-actions{display:flex;flex-direction:column;align-items:stretch;gap:6px}.staff-actions button{min-height:40px;font-size:14px}
.staff-import-details{grid-column:1/-1}.staff-import-details summary{min-height:44px;padding:9px 0}.staff-row>.mini{grid-column:1/-1}.invoice-month-control{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap;background:#fff2dc;padding:14px 18px;border-radius:10px;margin-bottom:18px}.invoice-month-control strong{font-size:20px}
@media(max-width:900px){.staff-directory-head{display:none}.staff-directory-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.staff-actions{grid-column:1/-1;flex-direction:row;flex-wrap:wrap}.staff-directory-row{gap:10px 18px}}
@media(max-width:480px){.usage-month.compact-month{padding:14px 16px}.compact-month-date strong{font-size:34px}.compact-month h2{font-size:17px}.compact-month-main{gap:10px}.nav{gap:4px;padding-left:10px;padding-right:10px}.nav button{font-size:14px;padding:8px 10px}.staff-directory-row{padding:16px 0}.issue-item .entry-head{flex-wrap:wrap}}
