/* Version 3: neutral palette, accessible holiday states and landscape layouts. */
header{background:#111;color:#fff;padding-inline-start:max(18px,env(safe-area-inset-right));padding-inline-end:max(18px,env(safe-area-inset-left))}header small{color:#fff}header button{color:#fff}
.arrows{align-items:center;flex-shrink:0}.arrows #today{background:#ddd;border-color:#ddd;width:auto;padding-inline:10px;font-size:13px}
.month-bar{gap:7px}.month-bar h2{font-size:30px}
.days .holiday,.days .holiday.in-range{background:#dedede;color:#444}.week .friday{color:#777}
.days .today{box-shadow:inset 0 0 0 2px #111}.days .holiday.today{background:#bcbcbc;color:#111;font-weight:bold}
.holiday-note{font-size:12px;color:#666;margin-top:12px}.overdue-panel{border-top:3px solid #111;margin-top:28px;padding-top:18px}.overdue-panel h2{font-size:21px;margin-bottom:12px}
.overdue-task{display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;align-items:start;padding:14px 0;border-bottom:1px solid #ddd;cursor:pointer}.overdue-task input{width:24px;height:24px;accent-color:#555;margin:0}.overdue-text{display:block;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8}.overdue-task time{display:block;margin-top:5px}.overdue-panel .empty{text-align:start;padding:10px 0}
#addActivity{background:#e4e4e4;border-color:#d0d0d0;color:#111}main:has(#addActivity)>#save{background:#505050;border-color:#505050;color:#fff}#shareDay{background:#888;border-color:#888;color:#111}#dayTasks{background:#c4c4c4;border-color:#c4c4c4;color:#111}
.format-options .icon{font-size:27px}.format-options label:has(input:checked){background:#eee}.format-options input{flex-shrink:0}.export-page{margin-top:15px}.export-page .meta{display:block;text-align:center;margin-top:6px}.export-page .export-preview{margin-top:0}
dialog{max-height:calc(100dvh - 24px);overscroll-behavior:contain}.activity,.range-field,.calendar-panel,.overdue-panel{min-width:0}
@media (orientation:landscape) and (min-width:480px){
  #app{width:100%;max-width:960px;min-height:100dvh}
  header{padding-block:10px}header small{font-size:9px;margin-bottom:3px}header h1{font-size:24px}
  main{padding-inline-start:max(24px,env(safe-area-inset-right));padding-inline-end:max(24px,env(safe-area-inset-left));padding-top:14px}
  .days button,.blank{height:48px}.month-bar{margin-bottom:10px}.week{padding-block:5px}.month-bar h2{font-size:27px}
  main:has(#addActivity){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
  main:has(#addActivity)>.date-head,main:has(#addActivity)>#activities{grid-column:1/-1}
  #activities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:14px}#activities .empty{grid-column:1/-1}.activity{margin-block:7px}
  .date-head{padding-bottom:12px;margin-bottom:12px}.date-head .meta{margin:5px 0}
  #archiveList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  #exportResult .export-ready{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px}#exportResult .export-ready>h2,#exportResult .export-ready>p,#shareFiles,#downloadFiles{grid-column:1/-1}
  dialog{max-width:500px;padding:14px 20px}.dialog-top{margin-bottom:10px}#picker .days button,#picker .blank{height:44px}#picker .month-bar{margin-bottom:5px}
}
@media(max-width:350px){.month-bar h2{font-size:25px}.arrows{gap:2px}.arrows button{width:42px}.arrows #today{padding-inline:7px}}


/* Report actions keep their requested top-to-bottom order in both orientations. */
main:has(#addActivity)>#dayTasks,main:has(#addActivity)>#addActivity,main:has(#addActivity)>#save,main:has(#addActivity)>#shareDay{grid-column:1/-1}
.days .day-marker{position:absolute;inset-inline-start:7px;bottom:6px;width:10px;height:10px;border-radius:50%;background:#df3028;box-shadow:0 0 0 1px #fff}

/* Full-width black bar; the content column and notch-safe brand row are independent. */
:root{--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-left:env(safe-area-inset-left,0px)}
#siteHeader{display:block;width:100%;padding:0;background:#111;color:white;border:0;position:sticky;top:0;z-index:2}
.header-inner{max-width:375px;width:100%;margin-inline:auto;display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:calc(18px + var(--safe-top));padding-bottom:16px;padding-inline-start:max(18px,var(--safe-right));padding-inline-end:max(18px,var(--safe-left));min-height:92px}
.header-brand{display:flex;align-items:center;gap:10px;min-width:0}.header-heading{min-width:0}.header-heading h1{font-size:24px;line-height:1.4;overflow-wrap:normal}.header-heading small{font-size:9px;letter-spacing:.6px;white-space:nowrap}
.brand-logo{display:block;width:42px;height:46px;object-fit:contain;padding:3px;background:#fff;flex:0 0 42px}.header-actions{flex-shrink:0}
#app{min-height:calc(100dvh - 92px - var(--safe-top))}
@media(max-width:350px){.header-inner{padding-inline:12px;gap:6px}.header-brand{gap:7px}.header-heading h1{font-size:20px}.header-heading small{font-size:8px}}
@media(orientation:landscape) and (min-width:480px){.header-inner{max-width:960px;padding-top:calc(10px + var(--safe-top));padding-bottom:10px;min-height:66px}.header-heading h1{font-size:24px}.brand-logo{height:44px;width:41px;flex-basis:41px}#app{min-height:calc(100dvh - 66px - var(--safe-top))}}

@media print{#siteHeader{display:none!important}}