:root { color-scheme: light; --ink:#12223c; --muted:#56657b; --blue:#2155d7; --line:#dde4ee; --surface:#fff; --bg:#f2f5fa; --maybe:#fff0ba; font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color:var(--ink); background:var(--bg); font-size:16px; }
* { box-sizing:border-box; }
body { margin:0; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.4; }
[hidden] { display:none !important; }
a { color:inherit; }
.site-header { max-width:1240px; margin:auto; padding:24px 32px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:750; text-decoration:none; font-size:1.1rem; }
.brand-mark { display:grid; place-items:center; width:36px; height:36px; background:var(--blue); color:#fff; border-radius:10px; font-family:Georgia, serif; font-size:1.5rem; }
.brand-year { color:var(--muted); font-weight:400; }
main { max-width:1176px; margin:auto; padding:16px 0 48px; }
.intro { padding:12px 0 24px; max-width:720px; }
.eyebrow,.step { font-size:.75rem; font-weight:750; letter-spacing:.13em; color:var(--blue); margin:0 0 10px; }
h1 { font-family:Georgia, 'Times New Roman',serif; font-size:clamp(2.5rem,5vw,3.8rem); font-weight:500; letter-spacing:-.055em; margin:0 0 12px; line-height:1.05; }
.intro>p:last-child { font-size:1.05rem; color:var(--muted); line-height:1.6; margin:0; max-width:590px; }
h2 { font-size:1.35rem; margin:0 0 12px; letter-spacing:-.03em; line-height:1.3; }
h3 { font-size:1.1rem; margin:0 0 12px; }
p { line-height:1.6; }
.muted,.field-help,.small { color:var(--muted); }
.muted { margin:0 0 18px; font-size:.94rem; }
.tabs { display:flex; gap:22px; border-bottom:1px solid var(--line); margin-bottom:24px; }
.tab { background:none; border:0; border-bottom:3px solid transparent; color:var(--muted); padding:12px 0 16px; font-weight:650; }
.tab.active { border-color:var(--blue); color:var(--blue); }
.badge { background:#e0e8fa; color:var(--blue); padding:2px 7px; border-radius:6px; margin-left:5px; font-size:.8rem; }
.workspace { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:24px; align-items:start; }
.main-column,.side-column { display:grid; gap:22px; min-width:0; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:28px; }
.identity { display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:center; }
.identity h2 { margin:0; }
label { display:block; font-size:.88rem; font-weight:650; margin-bottom:8px; }
input:not([type=checkbox]),select,textarea { width:100%; padding:12px 14px; border:1px solid #c9d3e2; border-radius:9px; background:#fff; color:var(--ink); }
textarea { resize:vertical; min-height:110px; }
input::placeholder,textarea::placeholder { color:#718099; }
:focus-visible { outline:3px solid #7496ef; outline-offset:3px; }
.preferences label:not(:first-of-type) { margin-top:22px; }
.optional { color:var(--muted); font-weight:400; font-size:.8rem; }
.field-help { font-size:.8rem; margin:0 0 10px; }
.preferences .field-help:last-child { margin:12px 0 0; }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.pill { color:var(--blue); background:#eaf0ff; border-radius:8px; padding:7px 10px; font-size:.85rem; white-space:nowrap; }
.selection-tools { display:flex; gap:8px; margin:22px 0; flex-wrap:wrap; }
.mode { display:flex; align-items:center; gap:8px; border:1px solid var(--line); background:#fff; padding:9px 14px; border-radius:8px; color:var(--muted); font-size:.88rem; }
.mode.active { border-color:var(--blue); box-shadow:inset 0 0 0 1px var(--blue); color:var(--ink); }
.swatch { width:10px; height:10px; border-radius:3px; }
.swatch.available { background:var(--blue); }
.swatch.maybe { background:#e0b139; }
.month-navigation { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.month-navigation h3 { margin:0; }
.icon-button { min-width:40px; min-height:40px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); font-size:1.5rem; line-height:1; }
.weekdays,.calendar { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:7px; }
.weekdays { margin-bottom:9px; text-align:center; color:var(--muted); font-size:.8rem; }
.day { position:relative; aspect-ratio:1.23; min-height:46px; padding:6px; border:1px solid #e4e9f1; border-radius:9px; background:#f8faff; color:var(--ink); font-size:1rem; font-weight:600; }
.day:hover:not(:disabled) { border-color:var(--blue); background:#e9f0ff; }
.day.selected { background:var(--blue); color:#fff; border-color:var(--blue); }
.day.selected:hover { background:#1b46b5; }
.day.maybe { background:var(--maybe); border-color:#e9c75e; color:#694d00; }
.day.outside { background:none; border-color:transparent; opacity:.25; }
.day .check { position:absolute; right:7px; bottom:4px; font-size:.75rem; }
.calendar-footer { display:flex; gap:14px; justify-content:space-between; align-items:center; margin-top:20px; }
.calendar-footer .muted { margin:0; font-size:.8rem; }
.text-button { border:0; background:none; color:var(--blue); padding:6px 0; font-size:.88rem; font-weight:600; }
.destinations { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.destination { display:flex; text-align:left; align-items:center; gap:12px; background:#f8faff; padding:16px; border:1px solid var(--line); border-radius:10px; font-weight:600; font-size:.95rem; }
.destination .destination-box { width:20px; height:20px; border:1px solid #b4c2d8; border-radius:5px; flex-shrink:0; display:grid; place-items:center; font-size:.8rem; }
.destination.selected { border-color:var(--blue); background:#eef3ff; color:var(--blue); }
.destination.selected .destination-box { background:var(--blue); color:#fff; border-color:var(--blue); }
.checkbox-line { display:flex; align-items:center; gap:9px; margin:18px 0 0; font-size:.9rem; }
input[type=checkbox] { width:19px; height:19px; accent-color:var(--blue); }
.summary-card { background:#102654; color:#fff; padding:28px; border-radius:18px; }
.summary-card .eyebrow { color:#9dbfff; }
.summary-card h2 { font-family:Georgia,serif; font-size:1.8rem; font-weight:400; }
.summary { display:grid; gap:10px; padding:16px 0 22px; border-top:1px solid #ffffff26; }
.summary>div { display:flex; justify-content:space-between; font-size:.9rem; color:#c4d3ec; }
.summary strong { color:#fff; }
.button { border:1px solid var(--line); border-radius:9px; padding:11px 16px; font-size:.9rem; font-weight:650; }
.button.subtle { background:#fff; color:var(--ink); }
.button.primary { background:var(--blue); color:#fff; border-color:var(--blue); width:100%; padding:14px; }
.summary-card .primary { background:#fff; color:#173c89; border:0; }
.small { font-size:.78rem; margin:14px 0 0; }
.summary-card .small { color:#bacbe7; }
.save-status { font-size:.88rem; color:#c9e5ff; margin:12px 0 0; }
.notice { background:#e8efff; border:1px solid #c7d8ff; color:#24427f; padding:14px 18px; border-radius:10px; margin:0 0 20px; font-size:.9rem; line-height:1.5; }
.notice.error { background:#fff0f0; border-color:#eec5c5; color:#8c2828; }
.notice.success { background:#eaf7f0; border-color:#b7dfc9; color:#175236; }
.loading { padding:60px 0; color:var(--muted); }
.results-heading { display:flex; justify-content:space-between; gap:20px; align-items:center; margin:30px 0; }
.results-heading .muted { margin:0; }
.results-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:24px; }
.result-row { padding:14px 0; border-bottom:1px solid #edf0f5; }
.result-row:last-child { border:0; }
.date-result { text-align:left; width:100%; border:0; border-bottom:1px solid #edf0f5; background:transparent; color:var(--ink); }
.result-title { display:flex; justify-content:space-between; gap:16px; align-items:center; font-size:.94rem; }
.result-title strong { font-weight:650; }
.result-meta { font-size:.82rem; color:var(--muted); margin-top:6px; }
.bar { width:100%; height:7px; border-radius:4px; background:#edf1f8; margin-top:10px; overflow:hidden; }
.bar>span { display:block; height:100%; background:var(--blue); border-radius:4px; }
.crew-title { margin:30px 0 12px; }
.crew-chip { display:inline-block; padding:7px 10px; background:#eef3fb; border-radius:7px; font-size:.85rem; margin:0 7px 7px 0; overflow-wrap:anywhere; }
.empty { color:var(--muted); padding:18px 0; line-height:1.6; }
dialog { width:min(460px,calc(100% - 32px)); max-height:80vh; border:1px solid var(--line); border-radius:18px; padding:25px; color:var(--ink); }
dialog::backdrop { background:#12223c88; }
.dialog-heading { display:flex; align-items:center; gap:15px; justify-content:space-between; margin-bottom:20px; }
.dialog-heading h2 { margin:0; }
.person { display:flex; justify-content:space-between; gap:18px; padding:12px 0; border-bottom:1px solid var(--line); font-size:.9rem; }
.person span:first-child { overflow-wrap:anywhere; }
footer { text-align:center; color:#6a7d99; letter-spacing:.12em; font-size:.75rem; padding:20px 20px 32px; }
@media(max-width:1240px) { main { padding-left:32px; padding-right:32px; } }
@media(max-width:920px) { .workspace { grid-template-columns:minmax(0,1fr) 280px; gap:18px; } .card,.summary-card { padding:22px; } .identity { grid-template-columns:1fr; gap:14px; } }
@media(max-width:760px) { .workspace,.results-grid { grid-template-columns:1fr; } main { padding:12px 18px 32px; } .site-header { padding:18px; } .brand-year { display:none; } .site-header .button { font-size:.8rem; padding:9px 11px; } .intro { padding-top:12px; } .card,.summary-card { padding:22px; } .identity { grid-template-columns:1fr; } .calendar { gap:5px; } .weekdays { gap:5px; } .day { aspect-ratio:1; min-height:40px; } .day .check { right:4px; bottom:2px; font-size:.65rem; } .results-heading { align-items:start; } .results-heading .button { flex-shrink:0; } }
@media(max-width:380px) { .card { padding:17px; } .day { min-height:35px; } .destinations { grid-template-columns:1fr; } .mode { padding:8px 10px; } .calendar-footer { flex-wrap:wrap; } .results-heading { flex-direction:column; } }
@media(prefers-reduced-motion:no-preference) { button { transition:background-color .12s,border-color .12s; } }