/* latin-ext */
@font-face {
  font-family: 'Sora';
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url(/fonts/sora-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Sora';
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url(/fonts/sora-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root{--paper:#e9e1d3;--white:#f7f1e7;--ink:#1c1b18;--muted:#62594e;--accent:#f56538;--accent-ink:#a8391d;--light:#e2d8c9;--line:#cfc4b4;--font:'Sora',system-ui,sans-serif;font:16px/1.5 var(--font);color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit;color:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:none}button:focus-visible,a:focus-visible{outline:3px solid var(--accent-ink);outline-offset:3px}button:disabled{cursor:default;opacity:.42}a{color:inherit}h1,h2,h3,p{margin:0}h1,h2{font-family:var(--font);font-weight:550;line-height:1.1}h1{font-size:clamp(3rem,8vw,6.5rem);letter-spacing:-.06em}h2{font-size:clamp(1.65rem,4.4vw,2.8rem);letter-spacing:-.05em}.shell{width:min(1130px,calc(100% - 64px));margin-inline:auto}header{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:2}.top{display:flex;justify-content:space-between;align-items:center;min-height:76px;gap:10px}.brand{font:bold 2.1rem/1 var(--font);letter-spacing:-.06em;padding:0;white-space:nowrap}.brand span{display:inline-grid;place-items:center;background:var(--accent-ink);color:white;width:31px;height:31px;border-radius:50%;font:18px var(--font);vertical-align:3px;margin-right:4px;letter-spacing:0}.brand i{color:var(--accent-ink);font-style:normal}nav{display:flex;gap:6px}nav button,.solid,.outline,.quiet{min-height:44px;padding:9px 15px;border-radius:8px;font-size:.88rem;font-weight:650}nav button[aria-current],nav button:hover,.quiet:hover{background:var(--light)}.solid{background:var(--accent-ink);color:white}.solid:hover{background:#37312b}.outline{border:1px solid var(--line);background:var(--white)}.quiet{padding-inline:10px}.hero{margin-top:28px;border-radius:18px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;min-height:320px;background:#ded3c1;position:relative}.hero-copy{padding:32px 44px;display:flex;flex-direction:column;justify-content:center;align-items:start;gap:13px;min-width:0}.hero h1{overflow-wrap:anywhere}.hero-photo{background:#d8cbbb;min-height:210px;display:grid;place-items:center;position:relative}.hero-photo img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.hero-photo .plane{font-size:5rem;color:var(--accent-ink)}.eyebrow{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800}.hero-label{display:flex;gap:10px;align-items:center}.flag{font-size:1.5rem}.dates{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:.9rem;font-weight:600}.dates em,.badge{font-style:normal;background:#f8dccb;color:var(--accent-ink);border-radius:40px;padding:4px 10px;font-size:.72rem;font-weight:750;white-space:nowrap}.grid{display:grid;grid-template-columns:minmax(0, .93fr) minmax(0,1.07fr);gap:30px;margin-top:32px;align-items:start}.panel{border:1px solid var(--line);border-radius:15px;background:var(--white);padding:24px;min-width:0}.section-title{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:16px}.section-title .eyebrow{color:var(--accent-ink);margin-bottom:6px}.calendar-head span:first-letter{text-transform:uppercase}.calendar-head{display:flex;justify-content:space-between;align-items:center;margin:13px 0 8px;font-weight:700}.arrows{display:flex;gap:4px}.arrows button{width:44px;height:44px;border:1px solid var(--line);border-radius:8px;font-size:1.2rem}.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;text-align:center}.weekday{font-size:.67rem;font-weight:750;color:var(--muted);padding:4px 0}.date{min-width:0;min-height:45px;border-radius:7px;background:var(--light);font-size:.88rem;font-weight:700;position:relative;padding:3px 0}.date[disabled]{background:transparent;color:var(--muted)}.date[aria-current]{background:var(--accent-ink);color:white;opacity:1}.date[data-flight]{box-shadow:inset 0 -3px var(--accent)}.date small{display:block;font-size:.56rem;line-height:1}.legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:17px;color:var(--muted);font-size:.73rem}.legend span::before{content:'';display:inline-block;width:8px;height:8px;background:var(--accent-ink);border-radius:50%;margin-right:5px}.legend span+span::before{background:var(--accent)}.day-title{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.muted{color:var(--muted);font-size:.87rem}.event{display:grid;grid-template-columns:49px minmax(0,1fr);gap:12px;border-top:1px solid var(--line);padding:17px 0}.event:last-child{padding-bottom:0}.event time,.event .number{font-size:.79rem;font-weight:800;align-self:start;padding-top:3px}.event h3{font:550 1.2rem/1.25 var(--font);overflow-wrap:anywhere}.event p{font-size:.9rem;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere;margin-top:5px}.event-head{display:flex;justify-content:space-between;align-items:start;gap:6px}.event-head button{margin:-10px -6px -8px 0}.airline{display:flex;align-items:center;gap:8px;font-size:.77rem;color:var(--accent-ink);font-weight:800;margin:8px 0}.airline img{max-width:72px;height:29px;object-fit:contain}.page{margin-top:32px}.trip-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:12px}.trip-item{display:block;text-align:left;min-height:110px;border:1px solid var(--line);background:var(--white);border-radius:12px;padding:18px;overflow-wrap:anywhere}.trip-item strong{display:block;font:550 1.65rem var(--font)}.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}.utility{margin-top:22px}.empty{padding:20px 0;color:var(--muted)}footer{display:flex;justify-content:space-between;gap:10px;font-size:.68rem;letter-spacing:.09em;margin-top:30px;padding:19px 0 26px;border-top:1px solid var(--line);color:var(--muted)}dialog{border:1px solid var(--line);border-radius:16px;background:var(--white);color:var(--ink);width:min(560px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:22px}dialog::backdrop{background:#231b1466}form label{display:grid;gap:4px;font-size:.85rem;font-weight:700;margin:11px 0}input,textarea,select{width:100%;border:1px solid #a99d8e;background:white;border-radius:7px;padding:9px;min-height:44px;font-size:1rem}textarea{min-height:90px;resize:vertical}input[type=checkbox]{min-height:0;width:20px;height:20px}label.check{display:flex;align-items:center}.row{display:grid;grid-template-columns:1fr 1fr;gap:9px}.error,.danger{color:#a12a22}.error{font-size:.85rem;margin-top:8px}#toast:not(:empty){position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:5;background:var(--ink);color:white;padding:11px 16px;border-radius:9px;width:max-content;max-width:90vw;font-size:.88rem}.timeline{scroll-margin-top:86px}
@media(max-width:760px){.shell{width:calc(100% - 28px)}.top{min-height:62px}.brand{font-size:1.65rem}.brand span{width:24px;height:24px;font-size:14px;vertical-align:2px}.edit-top span{display:none}.edit-top{min-width:44px;padding:7px}.top nav{gap:0}.top nav button{padding:6px 9px;font-size:.81rem}.hero{margin-top:15px;grid-template-columns:1fr;min-height:0}.hero-copy{padding:22px;gap:7px}.hero-photo{min-height:150px}.grid{grid-template-columns:1fr;gap:14px;margin-top:14px}.panel{padding:14px}.page{margin-top:20px}.timeline{scroll-margin-top:72px}.section-title{margin-bottom:10px}.row{grid-template-columns:repeat(2,minmax(0,1fr))}}
[hidden]{display:none!important}.top-actions{display:flex;gap:5px;align-items:center}.actions a,.account{text-decoration:none;display:inline-flex;align-items:center}.page>.muted,dialog form>.muted{margin-top:10px}.account{white-space:nowrap}body:has(dialog[open]) #toast:not(:empty){display:none}
@media(max-width:760px){.top{flex-wrap:wrap;justify-content:space-between;padding:7px 0;gap:4px}.top nav{order:3;flex-basis:100%;justify-content:space-between}.top nav button{flex:1}.top-actions [data-action=share] span{display:none}.top-actions [data-action=share]{min-width:44px;padding:7px}.timeline{scroll-margin-top:120px}}


/* Warm neutrals, dark controls, and a single orange accent. */
body { min-height: 100vh; background: linear-gradient(145deg, #eee7db, var(--paper) 65%); }
header { background: #eee7dbf2; backdrop-filter: blur(12px); }
.brand { color: var(--ink); }
.brand span { background: var(--ink); color: var(--white); }
.brand i { color: var(--accent-ink); }
nav { gap: 3px; padding: 3px; border-radius: 999px; background: #e1d7c8; }
nav button, .solid, .outline, .quiet { border-radius: 999px; }
nav button[aria-current] { background: var(--ink); color: var(--white); }
nav button:not([aria-current]):hover, .quiet:hover, .outline:hover { background: #d9cdbc; }
.solid { background: var(--ink); color: var(--white); }
.solid:hover { background: #3a3028; }

.hero { border: 1px solid var(--line); border-radius: 24px; }
.hero-copy { padding: 40px clamp(24px, 5vw, 62px); }
.hero h1 { font-weight: 700; }
.hero-label { color: #4e4133; }
.hero-photo .plane {
  display: grid;
  place-items: center;
  width: 112px;
  height: 112px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--ink);
}
.dates em { background: #eee5d6; color: var(--ink); }
.panel, .trip-item { border-radius: 20px; }
.timeline .section-title .eyebrow { color: var(--accent-ink); }
.trip-item:hover { border-color: var(--accent-ink); }
.event time, .event .number {
  padding: 5px 3px;
  border-radius: 8px;
  text-align: center;
  background: #e9dfd0;
  color: #493c30;
}
dialog { border-radius: 20px; box-shadow: 0 18px 48px #21180d24; }
input, textarea, select { background: #fffbf4; border-radius: 10px; }
input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid var(--accent-ink);
  outline-offset: 1px;
}

/* Calendar */
.planner-calendar { background: #f0e8da; }
.calendar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.calendar-top .eyebrow { font-size: .7rem; letter-spacing: .15em; font-weight: 800; }
.calendar-display { margin: 16px 0 18px; }
.calendar-number {
  color: #d74b25;
  font-size: clamp(4.4rem, 10vw, 7.75rem);
  line-height: .94;
  font-weight: 800;
  letter-spacing: -.09em;
  font-variant-numeric: tabular-nums;
}
.calendar-caption {
  margin-top: 13px;
  display: flex;
  align-items: start;
  justify-content: space-between;
  text-transform: uppercase;
  font-size: clamp(1.15rem, 3vw, 1.7rem);
  line-height: 1.12;
}
.calendar-month { font-weight: 800; }
.calendar-year, .calendar-weekday { color: var(--muted); }
.calendar-weekday { font-weight: 700; }
.arrows button { border-radius: 50%; background: #f8f1e6; }
.arrows button:not(:disabled):hover { background: var(--light); }
.calendar { gap: clamp(3px, .65vw, 7px); }
.weekday { font-weight: 650; }
.date {
  display: grid;
  align-content: center;
  aspect-ratio: 1;
  min-height: 0;
  border-radius: 50%;
  background: var(--ink);
  color: var(--white);
  font-variant-numeric: tabular-nums;
}
.date:not(:disabled):not([aria-current]):hover { background: #544437; }
.date[disabled] { background: #ded4c5; color: var(--muted); opacity: 1; }
.date[aria-current] { background: var(--accent); color: var(--ink); }
.date[data-flight] { box-shadow: none; }
.date[data-flight] small { color: #ff9d75; }
.date[data-flight][aria-current] small { color: var(--ink); }
.date small { font-size: .67rem; }
.legend { gap: 6px 12px; }
.legend span::before { background: var(--ink); }
.legend span+span::before { background: var(--accent); }
.legend span:last-child::before { display: none; }

/* Entry screen */
.gate { display: grid; grid-template-columns: 1.1fr .9fr; min-height: 350px; padding: 0; overflow: hidden; }
.gate-copy { align-self: center; padding: clamp(24px, 5vw, 64px); }
.gate-copy .eyebrow { color: var(--accent-ink); margin-bottom: 12px; }
.gate h1 { font-size: clamp(2.1rem, 5vw, 4rem); font-weight: 750; }
.gate .muted { margin: 16px 0 22px; max-width: 37ch; }
.gate-art {
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 16px;
  min-width: 0;
  padding: clamp(18px, 4vw, 52px);
  background: linear-gradient(140deg, #e4d8c6, #ece2d3);
}
.gate-pin { color: #d74b25; font-size: clamp(4rem, 9vw, 7rem); font-weight: 800; line-height: .85; }
.gate-dots { display: grid; width: min(100%, 300px); grid-template-columns: repeat(7, 1fr); gap: 5px; }
.gate-dots i { aspect-ratio: 1; border-radius: 50%; background: #d3c7b6; }
.gate-dots i:nth-child(-n+5) { background: var(--ink); }
.gate-dots i:nth-child(6) { background: var(--accent); }

@media (max-width: 760px) {
  .top nav button { min-width: 0; }
  .hero, .panel, .trip-item { border-radius: 18px; }
  .hero-copy { padding: 20px; }
  .planner-calendar { padding: 14px 10px; }
  .calendar-top, .calendar-display, .legend { margin-inline: 4px; }
  .gate { grid-template-columns: 1fr; }
  .gate-copy { padding: 24px; }
  .gate-dots { width: min(100%, 245px); }
}

.trip-card { display: flex; flex-direction: column; align-items: stretch; gap: 4px; }
.trip-card .trip-item { flex: 1; }
.trip-card [data-action="delete-trip"] { align-self: flex-end; min-height: 44px; }
.event-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.event-actions:empty { display: none; }
.event-actions .outline { display: inline-flex; gap: 6px; align-items: center; padding-inline: 12px; min-height: 44px; text-decoration: none; }

/* Destination colors */
.trip-themed {
  --accent: var(--trip-primary);
  --accent-ink: color-mix(in srgb, var(--trip-primary) 33%, #100e13);
  --ink: color-mix(in srgb, var(--trip-primary) 25%, #100e13);
  --muted: color-mix(in srgb, var(--trip-secondary) 22%, #343038);
  --paper: color-mix(in srgb, var(--trip-secondary) 17%, white);
  --white: color-mix(in srgb, var(--trip-secondary) 6%, white);
  --light: color-mix(in srgb, var(--trip-secondary) 22%, white);
  --line: color-mix(in srgb, var(--trip-secondary) 32%, #d3d0d4);
  --trip-tint: color-mix(in srgb, var(--trip-primary) 15%, white);
  --trip-hover: color-mix(in srgb, var(--trip-interaction) 26%, white);
  --trip-focus: color-mix(in srgb, var(--trip-interaction) 50%, #100e13);
  --trip-cover: linear-gradient(125deg, var(--light), var(--trip-tint));
  color: var(--ink);
}
.trip-themed body { background: linear-gradient(145deg, var(--trip-tint), var(--paper) 65%); }
.trip-themed header { background: var(--paper); }
.trip-themed nav, .trip-themed .date[disabled] { background: var(--light); }
.trip-themed nav button:not([aria-current]):hover, .trip-themed .quiet:hover,
.trip-themed .outline:hover, .trip-themed .arrows button:not(:disabled):hover { background: var(--trip-hover); }
.trip-themed .hero, .palette-preview.trip-themed { background: var(--trip-cover); }
.trip-themed .hero-photo { background: var(--light); }
.trip-themed .hero-label, .trip-themed .calendar-number { color: var(--accent-ink); }
.trip-themed .planner-calendar, .trip-themed .arrows button,
.trip-themed input, .trip-themed textarea, .trip-themed select { background: var(--white); }
.trip-themed input, .trip-themed textarea, .trip-themed select { border-color: var(--line); }
.trip-themed .dates em, .trip-themed .badge, .trip-themed .event time,
.trip-themed .event .number, .trip-themed .event-actions .outline {
  background: var(--trip-tint);
  color: var(--accent-ink);
}
.trip-themed .event-actions .outline:hover { background: var(--trip-hover); }
.trip-themed nav button[aria-current], .trip-themed .date[aria-current],
.trip-themed .solid:not(:disabled):hover {
  background: var(--trip-interaction);
  color: var(--trip-on-interaction);
}
.trip-themed .date:not(:disabled):not([aria-current]):hover {
  background: var(--trip-hover);
  color: var(--ink);
}
.trip-themed :is(button, a, input, textarea, select):focus-visible { outline-color: var(--trip-focus); }
.trip-themed .legend span+span::before { background: var(--trip-interaction); }
.trip-themed .date[data-flight]:not([aria-current]) small { color: color-mix(in srgb, var(--trip-secondary) 30%, white); }
.trip-themed .date[aria-current] small { color: inherit; }
.trip-themed .date[data-flight]:not(:disabled):not([aria-current]):hover small { color: inherit; }
.trip-themed .hero-photo .plane, .palette-preview span { color: var(--trip-on-primary); }
.palette-preview p { color: var(--muted); }
.trip-palette { min-width: 0; border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px 12px; margin: 0; }
.trip-palette legend { padding-inline: 5px; font-weight: 700; }
.trip-palette .palette-toggle { display: flex; align-items: center; gap: 8px; }
.palette-toggle input { width: 18px; min-height: 18px; margin: 0; }
.trip-palette p { margin: 5px 0 10px; font-size: .8rem; }
.palette-options input[type=color] { padding: 4px; min-height: 44px; }
.palette-preview { margin-top: 8px; padding: 10px; border-radius: 10px; }
.palette-preview span { display: inline-block; padding: 5px 9px; border-radius: 20px; background: var(--trip-primary); font-size: .75rem; font-weight: 700; }
.palette-preview .preview-selected { background: var(--trip-interaction); color: var(--trip-on-interaction); }
