[hidden] { display:none !important; }
main a { text-decoration:underline; text-underline-offset:4px; }
main button, main input { font:inherit; }
main button, main input, .slot { min-height:44px; border:1px solid var(--ink); border-radius:0; color:var(--ink); background:var(--paper); }
main button { cursor:pointer; padding:10px 16px; }
main button:not(:disabled):hover { background:var(--ink); color:var(--paper); }
button:disabled, fieldset:disabled { opacity:.65; }
button:disabled { cursor:wait; }
input { width:100%; padding:10px; min-width:0; }
main { display:grid; grid-template-columns:1fr; max-width:1440px; margin:auto; min-height:calc(100vh - 140px); }
.intro { padding:clamp(72px, 10vw, 150px) 42px; border-right:1px solid var(--ink); }
.eyebrow { font-size:10px; letter-spacing:.1em; text-transform:uppercase; margin:0 0 28px; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(58px, 7.4vw, 112px); font-weight:500; line-height:.88; letter-spacing:-.065em; margin-bottom:34px; }
h1 em { font-family:var(--serif); font-weight:400; }
.meeting-details { margin-top:40px; font-size:14px; line-height:1.8; }
.booking-panel { justify-content:flex-start; padding:52px 42px 64px; min-width:0; width:100%; max-width:1184px; margin-inline:auto; }
#booking { display:grid; grid-template-columns:minmax(0,400px) minmax(0,1fr); gap:0 48px; grid-template-rows:min-content 1fr; max-width:1100px; align-items:start; }
#availability-form { grid-column:1; grid-row:1; min-width:0; }
#availability-status { grid-column:1; grid-row:2; overflow-wrap:anywhere; }
#booking-form { grid-column:2; grid-row:1 / span 2; min-width:0; }
h2, #record-title { font-weight:500; font-size:clamp(38px, 4vw, 64px); line-height:1; letter-spacing:-.05em; margin-bottom:32px; }
label, legend { display:block; margin-bottom:8px; font-size:14px; }
.name-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; }
.note { font:15px/1.4 var(--serif); margin:12px 0 24px; }
fieldset { border:0; padding:0; margin:0 0 20px; min-width:0; }
.slots { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.slot span { overflow-wrap:anywhere; }
#slot-legend { overflow-wrap:anywhere; }
.slot { display:flex; align-items:center; gap:8px; padding:10px; cursor:pointer; margin:0; }
.slot input { width:16px; height:16px; min-height:0; margin:0; accent-color:var(--ink); flex-shrink:0; }
.slot:has(input:checked) { outline:2px solid var(--ink); outline-offset:1px; }
.slot:has(input:focus-visible) { outline:2px dashed var(--ink); outline-offset:4px; }
.primary { display:flex; width:100%; justify-content:space-between; padding:18px; background:var(--ink); color:var(--paper); font-size:13px; letter-spacing:.07em; text-transform:uppercase; }
.primary:not(:disabled):hover { background:var(--button-hover); }
#record { border-top:1px solid var(--ink); padding-top:24px; overflow-wrap:anywhere; }
#management button { margin:0 8px 12px 0; }
#cancel-confirm { border-block:1px solid var(--ink); padding:20px 0 8px; margin:12px 0; }
[role=status]:not(:empty) { border-left:2px solid var(--ink); padding:8px 0 8px 14px; margin:20px 0; }
@media (max-width:900px) { main { grid-template-columns:1fr; } .intro { padding:64px 24px 40px; border-right:0; border-bottom:1px solid var(--ink); } h1 { font-size:clamp(58px,10vw,90px); } .booking-panel { padding:40px 24px 56px; } }
main[data-management] { display:block; min-height:calc(100vh - 140px); }
main[data-management] .intro { display:none; }
main[data-management] .booking-panel { max-width:760px; margin:auto; }
@media (max-width:540px) { .slots, .name-row { grid-template-columns:1fr; } }

.slot-day { min-width:0; }
.slot-day h3 { font-size:16px; font-weight:500; line-height:1.4; overflow-wrap:anywhere; }
.slot-day .slot { margin-bottom:8px; }

.calendar { width:100%; margin-bottom:16px; }
.calendar-header { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:12px; }
.calendar-header h3 { margin:0; min-width:0; overflow-wrap:anywhere; font-size:20px; font-weight:500; text-align:center; }
.calendar-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; }
.calendar-days > span { text-align:center; font-size:12px; padding:8px 0; }
.calendar-days button { padding:8px 0; min-width:0; }
.calendar-days button:disabled { border-color:transparent; color:color-mix(in srgb, var(--ink) 60%, var(--paper)); background:var(--paper); opacity:1; }
.calendar button:disabled { cursor:default; }
.calendar-days button[aria-pressed=true]:not(:disabled) { background:var(--ink); color:var(--paper); }
.calendar-days button[aria-current=date] { text-decoration:underline; text-underline-offset:4px; }
.calendar button:not(:disabled):focus-visible { outline:2px dashed var(--ink); outline-offset:2px; }
#calendar-selected { margin:12px 0 0; font-size:14px; overflow-wrap:anywhere; }
@media (max-width:900px) {
  #booking { grid-template-columns:minmax(0,1fr); }
  #booking-form { grid-column:1; grid-row:3; }
}
