/* excellentair Empty Flights — dark console theme, premium pass.
   Brand: excellentair navy #232B67 (design package). One lifted blue accent for wayfinding. */
/* dark is the default; the header and the 48-hour strip keep it in the light theme too (a night deck over paper),
   and so does the welcome card after sign-in, whose roundel and step icons are white */
:root,[data-theme=light] .deck,[data-theme=light] .welcome{
  --hi:#fff; --fg:255,255,255; --well:7,11,24; --bad-ink:#FFB5B0; --field:rgba(0,0,0,.25);
  --brand:#232B67; --brand-deep:#10142E;
  --bg:#070B18; --bg-2:#0A1022; --surface:#0F162B; --surface-2:#141D36; --surface-3:#1B2543; --surface-hi:#222D50;
  --line:rgba(var(--fg),.075); --line-strong:rgba(var(--fg),.15); --line-soft:rgba(var(--fg),.045); --hairline:rgba(var(--fg),.06);
  --ink:#EEF2F9; --ink2:#B4C0D6; --ink3:#95A3BD; --ink4:#7A89A6;
  --accent:#6E93FF; --accent-2:#9DB6FF; --accent-ink:#0B1220; --accent-glow:rgba(110,147,255,.28);
  --good:#3CC98A; --good-bg:rgba(60,201,138,.12); --warn:#F2B84B; --warn-bg:rgba(242,184,75,.12);
  --bad:#F2665E; --bad-bg:rgba(242,102,94,.13); --soon:#E8A33C; --soon-bg:rgba(232,163,60,.12);
  --font-brand:'Marcellus', Georgia, serif;
  --font-ui:'Albert Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --mono:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --card-grad:linear-gradient(180deg,var(--surface-2) 0%,var(--surface) 100%);
  --shadow:0 1px 0 rgba(var(--fg),.05) inset, 0 12px 34px -20px rgba(0,0,0,.9);
  --shadow-hover:0 1px 0 rgba(var(--fg),.08) inset, 0 22px 50px -24px rgba(0,0,0,.95);
  --shadow-lift:0 30px 80px -30px rgba(0,0,0,.9), 0 0 0 1px rgba(var(--fg),.06);
  --ease:cubic-bezier(.22,.61,.36,1); --r:14px; --r-lg:18px;
}
*{box-sizing:border-box}
html{color-scheme:dark}

/* ---------------------------------------------------------------- light: paper with a night deck (canvas option A, 2026-09-25) */
html[data-theme=light]{color-scheme:light;
  --hi:#10142E; --fg:16,20,46; --well:255,255,255; --bad-ink:#A8261F; --field:#FFFFFF;
  --bg:#F4F2ED; --bg-2:#EFECE5; --surface:#FFFFFF; --surface-2:#FAF9F6; --surface-3:#EFECE5; --surface-hi:#E8E5DD;
  --line:rgba(16,20,46,.10); --line-strong:rgba(16,20,46,.18); --line-soft:rgba(16,20,46,.06); --hairline:rgba(16,20,46,.08);
  --ink:#10142E; --ink2:#3B4466; --ink3:#5B6482; --ink4:#6B7390;
  --accent:#2F4FD8; --accent-2:#2A47C4; --accent-ink:#FFFFFF; --accent-glow:rgba(47,79,216,.22);
  --good:#1B8455; --good-bg:#E3F3EA; --warn:#A86400; --warn-bg:#FBEBD2;
  --bad:#C0362F; --bad-bg:#FBE4E2; --soon:#A86400; --soon-bg:#FBEBD2;
  --card-grad:#FFFFFF;
  --shadow:0 1px 2px rgba(16,20,46,.06),0 8px 24px -16px rgba(16,20,46,.18);
  --shadow-hover:0 1px 2px rgba(16,20,46,.08),0 14px 32px -18px rgba(16,20,46,.26);
  --shadow-lift:0 24px 60px -28px rgba(16,20,46,.35),0 0 0 1px rgba(16,20,46,.08)}
html[data-theme=light] body{background:var(--bg)}
html[data-theme=light] ::selection{color:#fff}
/* people's colours are picked for a dark page: deepen them on paper so initials stay readable */
/* primary buttons: the dark theme's light-blue gradient under white text is 2.9:1 on paper, the deep accent 6:1 */
html[data-theme=light] .btn.pri{background:var(--accent);box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 8px 18px -10px var(--accent)}
html[data-theme=light] .btn.pri:hover{background:var(--accent-2)}
/* the sticky save bar is paper too, not a navy block with its hint at 2.5:1 */
html[data-theme=light] .ed-actions.sticky{background:var(--surface);box-shadow:var(--shadow-hover)}
html[data-theme=light] .avatar:not(.on){color:color-mix(in srgb,var(--c) 55%,#10142E);border-color:color-mix(in srgb,var(--c) 75%,#10142E);background:color-mix(in srgb,var(--c) 16%,#fff)}
body{margin:0;background:radial-gradient(120% 60% at 50% -10%,#121A3A 0%,var(--bg) 55%) fixed,var(--bg);color:var(--ink);font:14px/1.45 var(--font-ui);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--accent-2);text-decoration:none}a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
main{max-width:1440px;margin:0 auto;padding:18px 24px 56px}
footer{text-align:center;color:var(--ink4);font-size:12px;padding:26px;letter-spacing:.2px}
footer p{margin:0}footer .imprint{margin-top:6px;font-size:11.5px;color:var(--ink4);opacity:.85}
.mono{font-family:var(--mono);font-size:12.5px;letter-spacing:-.1px}
.nw{white-space:nowrap}.rt{text-align:right}.w{color:var(--soon)}.hint{color:var(--ink3);font-size:12.5px}
.who{color:var(--ink4);font-size:12px}.dim{opacity:.5}
h1{font:400 26px/1.15 var(--font-brand);margin:0 0 12px;letter-spacing:.2px}h1 small,h2 small{font:12px var(--font-ui);color:var(--ink3);margin-left:8px}
h2{font:600 12px/1.2 var(--font-ui);margin:0 0 12px;color:var(--ink3);letter-spacing:1.2px;text-transform:uppercase}
.lede{margin:-4px 0 14px;color:var(--ink3);font-size:13px;max-width:70ch}.lede i{font-style:normal;color:var(--ink4);margin:0 6px}
::selection{background:var(--accent);color:var(--accent-ink)}
i.dot,.leg i{font-style:normal;color:var(--ink4)}

/* ---------------------------------------------------------------- logo */
.logo{display:inline-flex;align-items:center;gap:.28em;height:44px;color:var(--hi);font:400 40px/1 var(--font-brand);letter-spacing:-.01em}
.logo.nav{height:30px;font-size:27px}.logo.small{height:36px;font-size:33px}
.logo-roundel{height:1.05em;width:1.05em;display:block}
.logo-word{display:block;line-height:1;transform:translateY(.02em)}

.env{font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;padding:4px 9px;border-radius:6px;background:var(--surface-3);color:var(--ink)}
.env.env-clash{outline:2px dashed var(--bad);outline-offset:2px}
.env.env-production{background:var(--bad);color:#fff}.env.env-staging{background:var(--soon);color:#1a1200}.env.env-integration{background:var(--good);color:#04241a}.env.env-development{background:var(--surface-3);color:var(--ink2)}
button.lnk,a.lnk{background:none;border:0;color:var(--accent-2);cursor:pointer;font:inherit;padding:0;text-decoration:none}
button.lnk:hover,a.lnk:hover{text-decoration:underline}

/* ---------------------------------------------------------------- alerts & flashes */
.alerts{margin:0 0 14px}
.alert{display:flex;gap:12px;align-items:baseline;padding:10px 16px;border-radius:var(--r);background:var(--bad-bg);border:1px solid rgba(242,102,94,.35);margin-bottom:6px;font-size:12.5px}
.alert b{text-transform:capitalize;color:var(--bad)}.alert time{margin-left:auto;color:var(--ink3);font-family:var(--mono);font-size:12px}
.flash{padding:11px 16px;border-radius:var(--r);margin:0 0 14px;font-size:13px;border:1px solid var(--line);background:var(--surface)}
.flash.ok{background:var(--good-bg);border-color:rgba(60,201,138,.35)}
.flash.bad{background:var(--bad-bg);border-color:rgba(242,102,94,.35);color:var(--bad-ink)}
.al-mail{display:block;margin-top:3px;color:var(--ink3);font-size:12px}.al-mail.bad{color:var(--bad-ink)}

/* ---------------------------------------------------------------- page head, segmented filters */
.pagehead{display:flex;align-items:flex-start;gap:22px;margin:4px 0 16px;flex-wrap:wrap}
.pagehead h1{margin:0 0 4px}.pagehead .lede{margin:0}
.segments{display:inline-flex;gap:2px;padding:3px;border-radius:12px;background:var(--surface);border:1px solid var(--line);margin-left:auto;align-self:center}
.segments a{text-decoration:none;color:var(--ink2);padding:7px 13px;border-radius:9px;font-size:13px;font-weight:600;transition:background .15s,color .15s}
.segments a:hover{color:var(--hi);text-decoration:none}
.segments a.on{background:var(--surface-hi);color:var(--hi);box-shadow:0 1px 0 rgba(var(--fg),.08) inset}
.segments b{margin-left:6px;color:var(--ink3);font-weight:600;font-variant-numeric:tabular-nums}.segments a.on b{color:var(--accent-2)}
.basis{align-self:center;color:var(--ink3);font-size:12px}.basis b{color:var(--ink);margin-left:4px}
.bar{display:flex;align-items:center;gap:18px;margin:0 0 14px;flex-wrap:wrap}.bar h1{margin:0}.bar .hint{margin-left:auto}
.filters{display:flex;gap:2px;padding:3px;border-radius:11px;background:var(--surface);border:1px solid var(--line)}
.filters a{text-decoration:none;color:var(--ink2);padding:6px 12px;border-radius:8px;font-size:13px;font-weight:600}
.filters a.on{background:var(--surface-3);color:var(--hi)}
.subnav{display:flex;gap:2px;margin:0 0 16px}.subnav a{text-decoration:none;color:var(--ink3);padding:7px 13px;border-radius:9px;font-weight:600;font-size:13px}
.subnav a.on{background:var(--surface);border:1px solid var(--line);color:var(--hi)}

/* ---------------------------------------------------------------- cards, tables, forms */
.card{background:var(--card-grad);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 24px;margin:0 0 14px;box-shadow:var(--shadow)}
.card.narrow{max-width:480px}
.tbl{width:100%;border-collapse:collapse;font-size:13px}.tbl th{text-align:left;font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink3);padding:8px 10px;border-bottom:1px solid var(--line-strong)}
.tbl td{padding:10px 10px;border-bottom:1px solid var(--line-soft);vertical-align:middle}.tbl tr:hover td{background:rgba(var(--fg),.02)}
.tbl tr.tot td{font-weight:600;border-top:1px solid var(--line-strong)}
.tbl tr.bad td{background:var(--bad-bg)}.tbl tr.open td{background:var(--soon-bg)}.tbl td input{width:100%}
.kv{display:grid;grid-template-columns:190px 1fr;gap:7px 16px;margin:0}.kv dt{color:var(--ink3)}.kv dd{margin:0}
label{display:block;font-size:12px;font-weight:600;color:var(--ink2);margin:0 0 12px;letter-spacing:.2px}label small{font-weight:400;color:var(--ink4);margin-left:4px}
label.slot{display:flex;align-items:center;gap:8px}
input,select{display:block;width:100%;padding:9px 11px;border:1px solid var(--line-strong);border-radius:10px;font:inherit;background:rgba(var(--well),.6);color:var(--ink);margin-top:5px;transition:border-color .15s,box-shadow .15s,background .15s}
input:hover,select:hover{border-color:rgba(var(--fg),.22)}
input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);background:rgba(var(--well),.85)}
input::placeholder{color:var(--ink4)}
input[readonly]{background:var(--surface);color:var(--ink3)}input[type=checkbox]{width:auto;display:inline;margin:0;accent-color:var(--accent)}
select option{background:var(--surface-2)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:0 14px}.grid7{display:grid;grid-template-columns:repeat(7,1fr) auto;gap:0 10px;align-items:end;margin:0 0 14px}
.span2{grid-column:span 2}.actions{display:flex;gap:8px;align-items:center;margin:0 0 10px}
form.inline{display:inline-flex;gap:6px;align-items:center}form.inline input{margin:0;width:auto}
.btn{display:inline-block;padding:8px 14px;border:1px solid var(--line-strong);border-radius:10px;background:linear-gradient(180deg,var(--surface-3),var(--surface-2));color:var(--ink);font:600 12.5px var(--font-ui);cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,transform .08s,box-shadow .15s;box-shadow:0 1px 0 rgba(var(--fg),.06) inset}
.btn:hover{border-color:rgba(var(--fg),.26);text-decoration:none;background:linear-gradient(180deg,var(--surface-hi),var(--surface-3))}.btn:active{transform:translateY(1px)}
.btn.pri{background:linear-gradient(180deg,#7FA0FF,#6389F5);color:var(--accent-ink);border-color:transparent;box-shadow:0 1px 0 rgba(var(--fg),.35) inset,0 8px 18px -10px var(--accent)}.btn.pri:hover{background:linear-gradient(180deg,#93AEFF,#6E93FF)}
.btn.dgr{color:var(--bad-ink)}.btn.dgr:hover{background:var(--bad-bg);border-color:rgba(242,102,94,.4)}
.pill{display:inline-block;padding:3px 10px;border-radius:9px;font-size:12px;font-weight:700;background:var(--surface-3);color:var(--ink2);text-transform:capitalize;letter-spacing:.3px}
.pill.s-published,.pill.s-ok,.pill.o-ok{background:var(--good-bg);color:var(--good)}.pill.s-hold{background:var(--soon-bg);color:var(--soon)}
.pill.s-blocked,.pill.o-failed{background:var(--bad-bg);color:var(--bad)}.pill.o-skipped_unchanged{background:var(--surface-3)}
.pill.l-base{background:rgba(110,147,255,.16);color:var(--accent-2)}.pill.l-tax{background:var(--soon-bg);color:var(--soon)}.pill.l-fee{background:var(--good-bg);color:var(--good)}
.chip{display:inline-block;padding:2px 8px;border-radius:7px;border:1px solid var(--line-strong);font:600 12px var(--font-ui);color:var(--ink2);letter-spacing:.4px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.empty{padding:38px;text-align:center;color:var(--ink3);background:var(--surface);border:1px dashed var(--line-strong);border-radius:var(--r-lg)}.empty b{display:block;color:var(--ink)}
.back{display:inline-block;margin:0 0 12px;font-size:13px;text-decoration:none}
.flag{display:inline-block;width:22px;height:16.5px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px rgba(var(--fg),.12);vertical-align:-2px}

/* ---------------------------------------------------------------- leg cards: the tail is the identifier */
.leg{display:grid;grid-template-columns:212px minmax(0,1fr) 268px;grid-template-areas:"hero route price" "hero edit actions" "bd bd bd";gap:8px 20px;align-items:center;
  padding:16px 20px 16px 8px;margin:0 0 12px;background:var(--card-grad);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);position:relative;overflow:hidden;
  transition:border-color .2s var(--ease),transform .2s var(--ease),box-shadow .2s var(--ease)}
.leg::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ink4)}
.leg::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 120% at 0% 50%,rgba(110,147,255,.07),transparent 60%)}
.leg:hover{border-color:var(--line-strong);transform:translateY(-1px);box-shadow:var(--shadow-hover)}
.leg.s-published::before{background:var(--good)}.leg.s-hold::before{background:var(--soon)}.leg.s-blocked::before{background:var(--bad)}
.leg.s-blocked::after{background:radial-gradient(60% 120% at 0% 50%,rgba(242,102,94,.10),transparent 60%)}
.leg > *{position:relative;z-index:1}
.leg-route{grid-area:route;display:flex;flex-direction:column;gap:8px;min-width:0;padding:0 14px}
.leg-route .day{font-size:12px;color:var(--ink3);font-weight:600;letter-spacing:.2px}.leg-route .day .mono{color:var(--ink4);font-weight:400}
.leg-route .route{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,1.1fr) minmax(0,1fr);align-items:center;gap:16px}
.leg-route .apt{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"flag code" "flag sub" "flag time";column-gap:10px;row-gap:2px;align-items:center;min-width:0}
.leg-route .apt .flag{grid-area:flag;width:26px;height:19.5px;border-radius:3px;box-shadow:0 0 0 1px rgba(var(--fg),.12)}
.leg-route .apt.arr{grid-template-columns:1fr auto;grid-template-areas:"code flag" "sub flag" "time flag";text-align:right;justify-self:end}
.leg-route .apt.arr em u{margin:0 6px 0 0}.leg-route .apt.arr em{display:flex;justify-content:flex-end;gap:0}.leg-route .apt.arr em u{order:-1}
.leg-route .apt b{grid-area:code;font:700 30px/1 var(--font-ui);letter-spacing:.01em;color:var(--hi)}
.leg-route .apt small{grid-area:sub;font-size:12px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.leg-route .apt em{grid-area:time;font-style:normal;font-size:13px;color:var(--ink2);font-weight:600}.leg-route .apt em u{text-decoration:none;font-family:var(--mono);font-weight:400;font-size:12px;color:var(--ink4);margin-left:6px}
.leg-route .arrow{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:120px}
.leg-route .arrow::before{content:"";width:100%;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--ink3) 30%,var(--accent-2));position:relative}
.leg-route .arrow i{font-size:12px;color:var(--ink3);white-space:nowrap}
.leg-route .reason{font-size:12.5px;color:var(--bad-ink);padding:8px 12px;border-radius:10px;background:var(--bad-bg);border:1px solid rgba(242,102,94,.3);align-self:flex-start}
.leg-route .reason a{margin-left:8px;font-weight:600;color:var(--hi)}
.leg-price{grid-area:price;display:flex;flex-direction:column;gap:4px;align-items:flex-end;text-align:right;align-self:end;padding:36px 0 2px}
.leg-price .lbl{font-size:12px;letter-spacing:1.3px;text-transform:uppercase;color:var(--ink4)}.leg-price .lbl i{font-style:normal;color:var(--ink4);opacity:.8;margin-left:4px;text-transform:none;letter-spacing:0}
.leg-price .amount{display:inline-flex;flex-direction:column;align-items:flex-end;padding:8px 14px 7px;border-radius:12px;
  background:linear-gradient(180deg,var(--good-bg),color-mix(in srgb,var(--good-bg) 40%,transparent));border:1px solid color-mix(in srgb,var(--good) 30%,transparent)}
.leg-price .amount .pv-n{font-size:34px}.leg-price .amount .pv-c{font-size:17px}
.leg-price .calc{font-size:12px;color:var(--ink3);text-decoration:none}.leg-price .calc:hover{color:var(--accent-2)}
.leg-price .ovr{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:6px;background:var(--soon-bg);color:var(--soon);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.6px}
.leg-edit{grid-area:edit;padding:12px 14px 12px;border-radius:14px;background:rgba(var(--well),.55);border:1px solid var(--line);box-shadow:0 1px 0 rgba(var(--fg),.04) inset}
.deck-head{display:flex;align-items:baseline;gap:10px;margin:0 0 10px}
.deck-head b{font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:var(--ink2)}.deck-head span{font-size:12px;color:var(--ink4)}
.fields{display:grid;gap:12px;align-items:start}                 /* its columns: see "the offer fields' columns" */
.field{margin:0;display:flex;flex-direction:column;gap:5px;min-width:0}
.field .fl{margin:0;font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--ink2)}.field .fl i{font-style:normal;font-weight:500;color:var(--ink4);text-transform:none;letter-spacing:0;margin-left:5px}
.field .fi{position:relative;display:block}
.field input{margin:0;height:46px;padding:10px 12px;font:600 16px var(--font-ui);background:rgba(var(--fg),.04);border:1px solid var(--line-strong);border-radius:11px;color:var(--hi);font-variant-numeric:tabular-nums}
.field input::placeholder{color:var(--ink4);font-weight:500}
.field input:focus{background:rgba(110,147,255,.08);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.field .fi em{position:absolute;right:12px;top:50%;transform:translateY(-50%);font:600 12px var(--font-ui);letter-spacing:.6px;text-transform:uppercase;color:var(--ink4);pointer-events:none}
.field .fi em + input,.field .fi input:has(+ em){padding-right:56px}
.field .fi input{padding-right:58px}.field.wide .fi input{padding-right:12px}
.field small{font-size:12px;color:var(--ink4)}
.field.wide{grid-column:span 1}
.leg-actions{grid-area:actions;display:flex;flex-direction:column;align-items:flex-end;gap:8px;align-self:end;min-width:0}
.leg-actions .who{text-align:right}.leg-actions .who i{font-style:normal;color:var(--ink4);margin:0 4px}
.leg-actions .btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.leg-actions .btn{min-width:0;text-align:center}

/* ---------------------------------------------------------------- aircraft imagery (T-tail icons) */
.tail-thumb{display:block;height:52px;width:auto;margin:-6px 0 2px -6px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.55))}
.reg-cell{display:flex;align-items:center;gap:10px}.reg-cell .tail-thumb{height:40px;margin:0}.reg-cell input{margin:0}
.card.with-hero{position:relative;overflow:hidden;padding-right:380px;min-height:230px}
.card.with-hero .hero-img{position:absolute;right:0;top:-30px;height:290px;width:auto;pointer-events:none;filter:drop-shadow(0 20px 40px rgba(0,0,0,.6));mask-image:linear-gradient(90deg,transparent,#000 25%)}
.routehead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:34px}
.routehead .flag{width:30px;height:22.5px;vertical-align:-3px}
.routehead .to{width:56px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--ink3),var(--accent-2))}
.routehead small{font-size:12.5px}
.tails-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin:0 0 14px}
.tails-gallery figure{margin:0;padding:12px 12px 12px;border-radius:var(--r-lg);background:radial-gradient(120% 90% at 30% 0%,#1B2760 0%,#0F1636 45%,var(--surface) 100%);border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden;text-align:center;transition:transform .2s var(--ease),border-color .2s}
.tails-gallery figure:hover{transform:translateY(-2px);border-color:var(--line-strong)}
.tails-gallery img{display:block;width:100%;height:auto;filter:drop-shadow(0 14px 24px rgba(0,0,0,.6))}
.tails-gallery figcaption{display:flex;flex-direction:column;gap:2px;margin-top:6px;font-size:12px}
.tails-gallery figcaption b{font:800 15px var(--font-ui);color:var(--hi);letter-spacing:.06em}.tails-gallery figcaption span{color:var(--ink3);font-family:var(--mono);font-size:12px}
@media (max-width:1100px){.card.with-hero{padding-right:24px}.card.with-hero .hero-img{display:none}}

/* ---------------------------------------------------------------- status steps (the welcome card after sign-in) */
@keyframes fade{to{opacity:1}}
.boot-line{height:2px;background:var(--line-strong);border-radius:2px;overflow:hidden;margin:0 0 18px}
.boot-line i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-2));box-shadow:0 0 14px var(--accent-glow);transition:width .45s var(--ease)}
.boot-steps{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:13px}
.boot-steps li{display:grid;grid-template-columns:18px 118px 1fr;gap:12px;align-items:baseline;color:var(--ink4);transition:color .3s}
.boot-steps li::before{content:"";width:8px;height:8px;border-radius:50%;border:1.5px solid var(--ink4);justify-self:center;align-self:center;transition:all .3s var(--ease)}
.boot-steps li b{font-weight:600;color:var(--ink3)}.boot-steps li span{font-family:var(--mono);font-size:12px;color:var(--ink4);letter-spacing:-.1px}
.boot-steps li.active{color:var(--ink)}.boot-steps li.active b{color:var(--ink)}.boot-steps li.active span{color:var(--ink3)}
.boot-steps li.active::before{border-color:var(--accent-2);box-shadow:0 0 0 4px var(--accent-glow);animation:pulse-b 1s var(--ease) infinite}
.boot-steps li.done b{color:var(--ink2)}.boot-steps li.done span{color:var(--ink2)}
.boot-steps li.done::before{border-width:0;background:var(--good);box-shadow:0 0 10px rgba(60,201,138,.5)}
.boot-steps li.done.s-warn::before{background:var(--warn);box-shadow:0 0 10px rgba(242,184,75,.5)}.boot-steps li.done.s-warn span{color:var(--warn)}
.boot-steps li.done.s-fail::before{background:var(--bad);box-shadow:0 0 10px rgba(242,102,94,.5)}.boot-steps li.done.s-fail span{color:var(--bad-ink)}
.boot-steps.compact{gap:7px;font-size:12.5px}.boot-steps.compact li{grid-template-columns:16px 90px 1fr}
@keyframes pulse-b{0%,100%{box-shadow:0 0 0 3px var(--accent-glow)}50%{box-shadow:0 0 0 7px rgba(110,147,255,.08)}}
@keyframes sweep{to{transform:translateX(100%)}}

/* ---------------------------------------------------------------- welcome after sign-in */
.welcome{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:rgba(7,13,26,.86);backdrop-filter:blur(10px);transition:opacity .6s var(--ease)}
.welcome.out{opacity:0;pointer-events:none}
.welcome-card{width:min(380px,calc(100% - 40px));text-align:center;display:grid;justify-items:center;gap:14px;padding:30px;border-radius:20px;background:var(--surface);border:1px solid var(--line-strong);box-shadow:var(--shadow-lift)}
.welcome-card .logo{color:var(--hi)}
.welcome-card .boot-steps{width:100%;text-align:left}.welcome-card .boot-line{width:100%;margin:6px 0 0}
.welcome-title{font:400 18px var(--font-brand);color:var(--hi)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-delay:0s !important;transition-duration:.01ms !important}
}


/* ---------------------------------------------------------------- leg state: rail, tint, tag */
.leg::before{width:8px}
.leg.s-published{border-color:rgba(60,201,138,.28);background:linear-gradient(180deg,rgba(60,201,138,.10),rgba(60,201,138,.03) 40%),var(--card-grad)}
.leg.s-hold{border-color:rgba(232,163,60,.32);background:linear-gradient(180deg,rgba(232,163,60,.12),rgba(232,163,60,.03) 40%),var(--card-grad)}
.leg.s-blocked{border-color:rgba(242,102,94,.38);background:linear-gradient(180deg,rgba(242,102,94,.14),rgba(242,102,94,.04) 45%),var(--card-grad)}
.leg.s-published:hover{box-shadow:var(--shadow-hover),0 0 0 1px rgba(60,201,138,.25)}.leg.s-hold:hover{box-shadow:var(--shadow-hover),0 0 0 1px rgba(232,163,60,.3)}.leg.s-blocked:hover{box-shadow:var(--shadow-hover),0 0 0 1px rgba(242,102,94,.35)}
.state-tag{position:absolute;top:0;right:0;z-index:2;display:flex;align-items:center;gap:8px;padding:7px 14px 7px 12px;border-radius:0 0 0 14px;font-weight:800;letter-spacing:.4px}
.state-tag svg{width:16px;height:16px}
.state-tag .pill{background:transparent;padding:0;font-size:12px;color:inherit}
.state-tag.s-published{background:rgba(60,201,138,.18);color:var(--good)}
.state-tag.s-hold{background:rgba(232,163,60,.2);color:var(--soon)}
.state-tag.s-blocked{background:rgba(242,102,94,.22);color:var(--bad-ink)}

/* ---------------------------------------------------------------- route graphic and day timeline */
.leg-route .path{display:flex;flex-direction:column;align-items:center;min-width:0;width:100%;position:relative;padding-top:6px}
.leg-route .path .arc{width:100%;height:40px;overflow:visible}
.leg-route .path .track{fill:none;stroke:rgba(var(--fg),.14);stroke-width:2}
.leg-route .path circle{fill:var(--ink2)}
.leg-route .path .plane{position:absolute;top:-4px;left:50%;width:22px;height:22px;transform:translateX(-50%) rotate(90deg);fill:#fff;filter:drop-shadow(0 4px 8px rgba(0,0,0,.6))}
.leg-route .path i{font-size:12px;color:var(--ink2);font-weight:600;white-space:nowrap;margin-top:-6px}.leg-route .path i u{text-decoration:none;color:var(--ink4);margin:0 3px}
/* ---------------------------------------------------------------- control deck */
.leg-actions{gap:10px}
.switch{display:inline-flex;padding:3px;border-radius:12px;background:rgba(var(--well),.6);border:1px solid var(--line-strong)}
.switch .sw{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;white-space:nowrap;border:0;border-radius:9px;background:transparent;color:var(--ink3);font:700 12.5px var(--font-ui);cursor:pointer;transition:background .15s,color .15s}
.switch .sw svg{width:14px;height:14px}
.switch .sw:hover:not(:disabled){color:var(--hi);background:rgba(var(--fg),.06)}
.switch .sw.on{color:#04241a;background:linear-gradient(180deg,#5ADBA0,#3CC98A);box-shadow:0 1px 0 rgba(var(--fg),.35) inset,0 6px 16px -8px var(--good);cursor:default}
.switch .sw.hold.on{color:#1a1200;background:linear-gradient(180deg,#F7C55A,#E8A33C);box-shadow:0 1px 0 rgba(var(--fg),.35) inset,0 6px 16px -8px var(--soon)}
.switch .sw:disabled{opacity:1}
.btn.save{display:inline-flex;align-items:center;gap:7px}.btn.save svg{width:14px;height:14px}
.btn.ghost{background:transparent;border-color:var(--line-strong);color:var(--ink2)}.btn.ghost:hover{background:rgba(var(--fg),.06)}

.leg-actions .btn{white-space:nowrap}

/* ---------------------------------------------------------------- breakdown panel inside the card */
.bd-toggle svg{width:14px;height:14px;transition:transform .2s var(--ease)}.bd-toggle{display:inline-flex;align-items:center;gap:6px}
.bd-toggle.open svg{transform:rotate(180deg)}.bd-toggle.open{background:rgba(var(--fg),.08);color:var(--hi)}
.leg-breakdown{grid-area:bd;margin-top:6px;padding:14px 16px 12px;border-radius:14px;background:rgba(var(--well),.5);border:1px solid var(--line)}
.leg-breakdown .bd{width:100%;border-collapse:collapse;font-size:13px}
.leg-breakdown .bd th{text-align:left;font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink4);padding:4px 8px 8px;border-bottom:1px solid var(--line)}
.leg-breakdown .bd td{padding:7px 8px;border-bottom:1px solid var(--line-soft)}
.leg-breakdown .bd tr.tot td{font-weight:600;border-top:1px solid var(--line);color:var(--ink2)}.leg-breakdown .bd tr.tot small{font-weight:400;color:var(--ink4)}
.leg-breakdown .bd tr.tx td{color:var(--hi);font-size:14px}.leg-breakdown .bd tr.w td{color:var(--soon)}
.bd-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:12px;color:var(--ink4)}

/* ---------------------------------------------------------------- Empty Flights identity: the name on its board */
.applogo{display:inline-flex;align-items:center;color:var(--hi);font-size:22px;line-height:1}
.applogo.nav{font-size:19px}
.applogo.small{font-size:18px}
/* splash: the ticket slides in, then the seat outline draws itself */
.welcome-card .applogo{margin-top:-6px}

/* ---------------------------------------------------------------- console panel */
.console{display:grid;grid-template-columns:minmax(300px,1.5fr) repeat(3,minmax(0,1fr));gap:12px;margin:0 0 18px;position:relative}
.c-health,.c-tile{border-radius:var(--r-lg);border:1px solid var(--line);background:var(--card-grad);box-shadow:var(--shadow);padding:14px 16px;min-width:0;position:relative;overflow:hidden}
.c-health{display:flex;flex-direction:column;gap:12px;justify-content:space-between}
.console .lamp{display:flex;align-items:center;gap:12px}
.console .lamp i{width:12px;height:12px;border-radius:50%;background:var(--ink4);box-shadow:0 0 0 4px rgba(var(--fg),.05);flex:none}
.console .lamp b{display:block;font:600 15px var(--font-ui);color:var(--hi)}.console .lamp span{font-size:12px;color:var(--ink4);letter-spacing:.3px}
.console.s-ok .lamp i{background:var(--good);box-shadow:0 0 0 4px var(--good-bg),0 0 18px var(--good);animation:pulse 2.4s var(--ease) infinite}
.console.s-soon .lamp i{background:var(--soon);box-shadow:0 0 0 4px var(--soon-bg)}
.console.s-warn .lamp i{background:var(--bad);box-shadow:0 0 0 4px var(--bad-bg),0 0 18px var(--bad)}
.console.s-none .lamp i{background:var(--ink4)}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px var(--good-bg),0 0 18px var(--good)}50%{box-shadow:0 0 0 8px rgba(60,201,138,.05),0 0 6px var(--good)}}
.mixbar{display:flex;height:8px;border-radius:4px;overflow:hidden;background:rgba(var(--fg),.06);gap:2px}
.mixbar i{display:block;min-width:0;transition:flex .6s var(--ease)}.mixbar i[style*="flex:0"],.mixbar i[style*="flex: 0"]{display:none}
.mixbar .pub,.mixlegend .pub{background:var(--good)}.mixbar .hold,.mixlegend .hold{background:var(--soon)}.mixbar .blk,.mixlegend .blk{background:var(--bad)}
.mixlegend{display:flex;gap:14px;margin-top:8px;font-size:12px;color:var(--ink3)}
.mixlegend a{display:inline-flex;align-items:center;gap:6px;color:var(--ink3);text-decoration:none}.mixlegend a:hover{color:var(--hi)}
.mixlegend i{width:8px;height:8px;border-radius:2px;display:inline-block}.mixlegend b{color:var(--hi);font-variant-numeric:tabular-nums}
.c-tile{display:flex;flex-direction:column;gap:8px;color:inherit;text-decoration:none;transition:border-color .15s,transform .15s}
a.c-tile:hover{border-color:var(--line-strong);transform:translateY(-1px);text-decoration:none}
.c-tile .t-head{display:flex;align-items:center;gap:9px}.c-tile .t-head img,.c-tile .t-head svg{width:18px;height:18px;flex:none;color:var(--ink2)}
.c-tile .t-head b{font-size:12px;letter-spacing:1.3px;text-transform:uppercase;color:var(--ink2)}.c-tile .t-head span{margin-left:auto;font:600 13px var(--font-ui);color:var(--hi);font-variant-numeric:tabular-nums}
.c-tile .t-body{display:flex;flex-direction:column;gap:2px;font-size:12.5px;color:var(--ink3);flex:1}.c-tile .t-body b{color:var(--hi);font-weight:600}.c-tile .t-body a{color:var(--accent-2)}
.c-tile .t-body .err{color:var(--bad-ink)}
.c-tile.bad{border-color:rgba(242,102,94,.35);background:linear-gradient(180deg,rgba(242,102,94,.12),rgba(242,102,94,.03) 40%),var(--card-grad)}
.c-tile.alerts .t-head span{background:var(--surface-3);padding:1px 8px;border-radius:9px}.c-tile.alerts.bad .t-head span{background:var(--bad);color:#fff}
.t-act{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;margin-top:2px;padding:7px 12px;border-radius:9px;border:1px solid var(--line-strong);background:rgba(var(--fg),.04);color:var(--ink);font:600 12px var(--font-ui);cursor:pointer;transition:background .15s,border-color .15s}
.t-act svg{width:13px;height:13px}.t-act:hover{background:rgba(110,147,255,.14);border-color:var(--accent)}
.t-act.busy{opacity:.7;pointer-events:none}.t-act.busy svg{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.c-note{grid-column:1 / -1;padding:9px 14px;border-radius:10px;font-size:12.5px;border:1px solid var(--line);background:var(--surface)}
.c-note.wait{color:var(--accent-2);border-color:rgba(110,147,255,.35)}.c-note.ok{color:var(--good);border-color:rgba(60,201,138,.35)}.c-note.bad{color:var(--bad-ink);border-color:rgba(242,102,94,.4)}
@media (max-width:1100px){.console{grid-template-columns:1fr 1fr}.c-health{grid-column:1 / -1}}
@media (max-width:720px){.console{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- filter bar */
.filterbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;margin:0 0 12px;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--card-grad);box-shadow:var(--shadow)}
.filterbar .segments{margin:0}
.filterbar .segments a.k-published.on{background:var(--good-bg);color:var(--good)}.filterbar .segments a.k-hold.on{background:var(--soon-bg);color:var(--soon)}
.filterbar .segments a.k-blocked.on,.filterbar .segments a.k-attention.on{background:var(--bad-bg);color:var(--bad-ink)}
.filterbar .segments a.on b{color:inherit}
.filterbar .search{position:relative;flex:1 1 260px;margin:0;min-width:200px}
.filterbar .search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--ink4)}
.filterbar .search input{margin:0;padding-left:34px;height:38px;border-radius:10px;font-size:13px}
.filterbar .sel{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;letter-spacing:.8px;text-transform:uppercase;color:var(--ink4)}
.filterbar .sel select{margin:0;height:38px;width:auto;font-size:13px;border-radius:10px;text-transform:none;letter-spacing:0}
.filterbar .chips{display:inline-flex;gap:4px;padding:3px;border-radius:11px;background:var(--surface);border:1px solid var(--line)}
.filterbar .chip{border:0;background:transparent;color:var(--ink3);padding:6px 11px;border-radius:8px;font:600 12px var(--font-ui);cursor:pointer;letter-spacing:.2px}
.filterbar .chip:hover{color:var(--hi);background:rgba(var(--fg),.06)}.filterbar .chip.on{background:var(--surface-hi);color:var(--hi);box-shadow:0 1px 0 rgba(var(--fg),.08) inset}
.filterbar .clear{font-size:12.5px;color:var(--ink3);margin-left:auto}.filterbar .clear:hover{color:var(--hi)}
.active{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-4px 0 14px;font-size:12.5px;color:var(--ink3)}
.active .tag{display:inline-flex;gap:5px;padding:4px 10px;border-radius:9px;background:rgba(110,147,255,.12);color:var(--accent-2);text-decoration:none;border:1px solid rgba(110,147,255,.3)}.active .tag b{color:var(--hi)}

/* ---------------------------------------------------------------- breakdown, grouped and graphical */
.leg-breakdown[hidden]{display:none}
.leg-breakdown{padding:16px 18px 12px;display:flex;flex-direction:column;gap:14px}
.bd-top{display:flex;flex-direction:column;gap:8px}
.bd-bar{display:flex;height:12px;border-radius:6px;overflow:hidden;gap:2px;background:rgba(var(--fg),.05)}
.bd-bar i{display:block;min-width:4px;transition:flex .4s var(--ease)}
.bd-bar .l-base,.bd-legend .l-base,.bd-group.l-base header b::before{background:var(--accent)}
.bd-bar .l-tax,.bd-legend .l-tax,.bd-group.l-tax header b::before{background:var(--soon)}
.bd-bar .l-fee,.bd-legend .l-fee,.bd-group.l-fee header b::before{background:var(--good)}
.bd-legend{display:flex;gap:16px;font-size:12px;color:var(--ink3)}.bd-legend span{display:inline-flex;align-items:center;gap:6px}.bd-legend i{width:9px;height:9px;border-radius:2px;display:inline-block}
.bd-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.bd-group{border-radius:12px;border:1px solid var(--line);background:rgba(var(--fg),.025);padding:12px 14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.bd-group header b{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--hi)}.bd-group header b::before{content:"";width:8px;height:8px;border-radius:2px;display:inline-block}
.bd-group header span{display:block;font-size:12px;color:var(--ink4);margin-top:3px;line-height:1.35}
.bd-group ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;flex:1}
.bd-group li{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;padding:7px 0;border-top:1px solid var(--line-soft)}
.bd-group li b{display:block;font-size:13px;color:var(--ink)}.bd-group li small{display:block;color:var(--ink4);font-size:12px;margin-top:2px}
.bd-group li em{font-style:normal;color:var(--hi);font-variant-numeric:tabular-nums;white-space:nowrap}
.bd-group .none{margin:0;color:var(--ink4);font-size:12px;flex:1;padding:8px 0;border-top:1px solid var(--line-soft)}
.bd-group footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:8px;font-size:12px;letter-spacing:.8px;text-transform:uppercase;color:var(--ink4)}
.bd-group footer em{font-style:normal;color:var(--ink2);font-size:13px;letter-spacing:0;text-transform:none}
.bd-totals{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.bd-totals .tot{border-radius:12px;border:1px solid var(--line);padding:12px 14px;display:flex;flex-direction:column;gap:2px;background:rgba(var(--fg),.025)}
.bd-totals .tot span{font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink4)}
.bd-totals .tot b{font:700 22px var(--font-ui);color:var(--hi);font-variant-numeric:tabular-nums}.bd-totals .tot small{font-size:12px;color:var(--ink4)}
.bd-totals .tot.tx{background:linear-gradient(180deg,rgba(110,147,255,.22),rgba(110,147,255,.08));border-color:rgba(110,147,255,.45)}
.bd-totals .tot.tx b{color:var(--hi);text-shadow:0 0 18px var(--accent-glow)}
.bd-totals .tot.ovr{border-color:rgba(232,163,60,.45);background:linear-gradient(180deg,rgba(232,163,60,.16),rgba(232,163,60,.05))}.bd-totals .tot.ovr b{color:var(--soon)}
@media (max-width:900px){.bd-groups{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- leg hero: tall tail with the identity superimposed */
.leg .state-tag{border-radius:0 0 0 14px}


/* ---------------------------------------------------------------- responsive: console and filters */
@media (max-width:1180px){.console{grid-template-columns:1fr 1fr}.c-health{grid-column:1 / -1}.c-tile.alerts{grid-column:1 / -1}}
@media (max-width:720px){.console{grid-template-columns:1fr}.c-tile.alerts{grid-column:auto}}
@media (max-width:900px){.filterbar .segments{flex-basis:100%;overflow-x:auto;scrollbar-width:none}.filterbar .search{flex-basis:100%}.filterbar .clear{margin-left:0}}
.filterbar .segments a{white-space:nowrap}
.pagehead{flex-wrap:wrap;gap:10px 18px}

/* ---------------------------------------------------------------- responsive: leg cards */
@media (max-width:1180px){
  .leg{grid-template-columns:184px minmax(0,1fr);grid-template-areas:"hero route" "hero price" "hero edit" "actions actions" "bd bd";gap:10px 18px}
  .leg-route{padding-top:30px}                                     /* clears the state ribbon in the corner */
  .leg-price{flex-direction:row;align-items:baseline;justify-content:flex-start;text-align:left;gap:10px;flex-wrap:wrap}
  .leg-price .lbl{order:1}.leg-price .amount{order:0}.leg-price .calc{order:2;margin-left:auto}
  .leg-actions{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
  .leg-actions .who{order:3;flex-basis:100%;text-align:left}
}
@media (max-width:860px){
  .leg{grid-template-columns:1fr;grid-template-areas:"hero" "route" "price" "edit" "actions" "bd";padding:0 16px 16px 8px;gap:12px}
  .leg-route{padding-top:0}
  .leg-route .route{gap:10px}.leg-route .path{min-width:100px}.leg-route .apt b{font-size:24px}
  .leg-actions .btns{justify-content:flex-start}
}
@media (max-width:520px){
  .leg-route .route{grid-template-columns:1fr;grid-template-areas:none}.leg-route .path{width:100%;min-width:0}.leg-route .path .arc{height:26px}
  .leg-price .amount .pv-n{font-size:26px}.leg-price .amount .pv-c{font-size:14px}
}

.c-tile .t-head img.lh{width:20px;height:20px}
.boot-steps li b .step-ic{width:12px;height:12px;object-fit:contain;vertical-align:-2px;margin-right:6px;opacity:.9}

/* ================================================================ people: avatars with a stable colour per person */
.avatar{--c:var(--ink3);display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:color-mix(in srgb,var(--c) 22%,transparent);color:var(--c);border:1.5px solid color-mix(in srgb,var(--c) 60%,transparent);font:800 12px var(--font-ui);letter-spacing:.04em;flex:none;text-decoration:none}
.avatar.sm{width:24px;height:24px;font-size:12px}
.avatar.sys{border-style:dashed;font-size:12px}
.avatar.on{background:var(--c);color:#0B1220;box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 30%,transparent)}
a.avatar:hover{text-decoration:none;transform:translateY(-1px)}
.people{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.people .avatar+.avatar{margin-left:-8px}
.people .hs-sum{margin-left:10px;font-size:12.5px;color:var(--ink3)}

/* ================================================================ price steppers and the reason field */
.fi.stepper{display:flex;align-items:stretch}
.fi.stepper input{flex:1;border-radius:0;text-align:center;padding-right:44px;padding-left:12px}
.fi.stepper .step{width:40px;border:1px solid var(--line-strong);background:rgba(var(--fg),.04);color:var(--ink2);font:600 18px/1 var(--font-ui);cursor:pointer;flex:none}
.fi.stepper .step:first-child{border-radius:11px 0 0 11px;border-right:0}.fi.stepper .step:last-of-type{border-radius:0 11px 11px 0;border-left:0}
.fi.stepper .step:hover{background:rgba(110,147,255,.16);color:var(--hi)}
.fi.stepper em{right:52px}
.field.note input{border-style:dashed}

/* ================================================================ change history: people, price line, events */
.leg-history{grid-column:1 / -1;padding:16px 18px 12px;display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--line);margin-top:4px}
.leg-history[hidden]{display:none}
.leg-history.open,.leg-breakdown.open{border-top:0;padding:0;margin:0}
.hs-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hs-now{display:flex;align-items:baseline;gap:10px}.hs-now span{font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink4)}.hs-now b{font:700 20px var(--font-ui);color:var(--hi);font-variant-numeric:tabular-nums}.hs-now small{font-size:12px;color:var(--soon)}
.spark{position:relative;border-radius:12px;background:rgba(var(--fg),.025);border:1px solid var(--line);padding:10px 12px 6px}
.spark svg{display:block;width:100%;height:72px}
.spark .base{stroke:rgba(var(--fg),.18);stroke-width:1;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
.spark .line{fill:none;stroke:var(--accent);stroke-width:2.2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.spark-marks{position:absolute;left:12px;right:12px;top:10px;height:72px;pointer-events:none}
.spark-marks .mk{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--c);border:2px solid var(--bg);box-shadow:0 0 0 2px var(--c);transform:translate(-50%,-50%);pointer-events:auto}
.spark-axis{display:flex;justify-content:space-between;font-size:12px;color:var(--ink4);margin-top:4px;letter-spacing:.3px}
.hs-events{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.hs-events li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:12px;align-items:start;padding:8px 10px;border-radius:10px}
.hs-events li:hover{background:rgba(var(--fg),.03)}
.hs-events li.price{background:rgba(110,147,255,.06);border:1px solid rgba(110,147,255,.14)}
.hs-events li.sys .ev b{color:var(--ink3)}
.hs-events .ev-line{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:13px}.hs-events .ev-line b{color:var(--hi)}.hs-events .ev-line span{color:var(--ink3)}
.hs-events .ev-line em{font-style:normal;color:var(--ink2);padding:1px 7px;border-radius:6px;background:rgba(var(--fg),.05)}.hs-events .ev-line em.new{color:var(--hi);background:rgba(110,147,255,.18)}
.hs-events .arr{width:14px;height:8px;display:inline-block;background:linear-gradient(90deg,var(--ink4),var(--ink4)) center/100% 1.5px no-repeat;position:relative}
.hs-events .arr::after{content:"";position:absolute;right:0;top:1px;width:6px;height:6px;border-top:1.5px solid var(--ink4);border-right:1.5px solid var(--ink4);transform:rotate(45deg)}
.hs-events q{display:block;margin-top:4px;font-size:12.5px;color:var(--ink2);quotes:"“" "”";font-style:italic}
.hs-events time{font-size:12px;color:var(--ink4);white-space:nowrap;padding-top:3px}
.hs-events .ent{color:var(--accent-2);text-decoration:none;font-weight:600}.hs-events .ent:hover{color:var(--hi)}
.hs-toggle b{margin-left:4px;padding:0 6px;border-radius:7px;background:rgba(var(--fg),.1);font-size:12px}

/* ================================================================ activity page */
.people-filter{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.people-filter .avatar+.avatar{margin-left:-6px}
.people-filter .tag{display:inline-flex;gap:6px;align-items:center;padding:4px 10px;border-radius:9px;background:rgba(110,147,255,.12);color:var(--hi);font-size:12px;margin-left:8px}.people-filter .tag a{color:var(--ink3);text-decoration:none}
.filterbar .count{margin-left:auto;font-size:12.5px;color:var(--ink3)}.filterbar .count .warn{font-style:normal;color:var(--soon)}
.filterbar a.chip{text-decoration:none}
.day{margin:0 0 18px}.day h2{margin:0 0 8px;padding:0 10px}
.hs-events.feed li{background:var(--card-grad);border:1px solid var(--line)}.hs-events.feed li.price{border-color:rgba(110,147,255,.3)}

/* ================================================================ leg detail */
.detail-head{padding-bottom:20px}
.detail-top{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:14px;max-width:900px}
.fact{border-radius:12px;border:1px solid var(--line);background:rgba(var(--fg),.025);padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.fact span{font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink4)}.fact b{font:700 20px var(--font-ui);color:var(--hi)}.fact small{font-size:12px;color:var(--ink4)}
.fact.tx{background:linear-gradient(180deg,rgba(110,147,255,.22),rgba(110,147,255,.08));border-color:rgba(110,147,255,.45)}
.detail-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:14px;margin:0 0 14px}
.detail-grid .card{margin:0}
.detail-head .reason{margin:14px 0 0;font-size:12.5px;color:var(--bad-ink);padding:8px 12px;border-radius:10px;background:var(--bad-bg);border:1px solid rgba(242,102,94,.3);display:inline-block}
@media (max-width:1100px){.detail-grid{grid-template-columns:1fr}}

/* ================================================================ settings shell */
.setnav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 18px}
.setnav .tile{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:12px;row-gap:2px;padding:14px 16px;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--card-grad);box-shadow:var(--shadow);color:var(--ink2);text-decoration:none;transition:border-color .15s,transform .15s}
.setnav .tile svg{grid-row:1 / span 2;width:30px;height:30px;color:var(--ink3);align-self:center}
.setnav .tile b{font-size:14px;color:var(--hi)}.setnav .tile span{font-size:12px;color:var(--ink4)}.setnav .tile span i{font-style:normal;color:var(--soon)}
.setnav .tile:hover{border-color:var(--line-strong);transform:translateY(-1px);text-decoration:none}
.setnav .tile.on{border-color:rgba(110,147,255,.5);background:linear-gradient(180deg,rgba(110,147,255,.16),rgba(110,147,255,.04) 60%),var(--card-grad)}.setnav .tile.on svg{color:var(--accent-2)}
.setnav .tile.warn:not(.on){border-color:rgba(232,163,60,.35)}
@media (max-width:900px){.setnav{grid-template-columns:1fr 1fr}}

/* ================================================================ pricing rules by layer */
.cconds{display:flex;gap:5px;flex-wrap:wrap}
.cchip{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:7px;background:rgba(var(--fg),.06);border:1px solid var(--line);font-size:12px;color:var(--ink2)}.cchip .flag{width:14px;height:10.5px;border-radius:2px}.cchip.any{color:var(--ink4);border-style:dashed}
.vpill{display:inline-block;padding:2px 8px;border-radius:7px;font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;background:var(--surface-3);color:var(--ink2)}
.vpill.active{background:var(--good-bg);color:var(--good)}.vpill.upcoming{background:rgba(110,147,255,.16);color:var(--accent-2)}.vpill.expired{background:var(--bad-bg);color:var(--bad-ink)}

/* ================================================================ rule editor */
.rule-editor{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:14px;align-items:start}
.rule-editor .card{margin:0}
.ed-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px}.ed-head h1{margin:0}.ed-head .who{display:inline-flex;align-items:center;gap:8px}
.ed-sec{border:0;padding:14px 0;margin:0;border-top:1px solid var(--line-soft)}
.ed-sec legend{padding:0 0 10px;font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:var(--ink2);font-weight:700}.ed-sec legend small{font-weight:400;text-transform:none;letter-spacing:0;color:var(--ink4);margin-left:8px}
.segs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.segs.small{display:inline-flex;gap:0;padding:3px;border-radius:11px;background:var(--surface);border:1px solid var(--line)}
.seg{position:relative;display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(var(--fg),.025);cursor:pointer;margin:0;color:var(--ink2)}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg b{font-size:13px;color:var(--hi)}.seg small{font-size:12px;color:var(--ink4)}
.seg:has(input:checked){border-color:var(--accent);background:rgba(110,147,255,.14);box-shadow:0 0 0 3px var(--accent-glow)}
.seg.l-tax:has(input:checked){border-color:var(--soon);background:var(--soon-bg);box-shadow:0 0 0 3px rgba(232,163,60,.2)}.seg.l-fee:has(input:checked){border-color:var(--good);background:var(--good-bg);box-shadow:0 0 0 3px rgba(60,201,138,.2)}
.segs.small .seg{padding:7px 14px;border:0;background:transparent;border-radius:8px;box-shadow:none}.segs.small .seg b{font-size:12.5px;color:var(--ink3)}
.segs.small .seg:has(input:checked){background:var(--surface-hi);box-shadow:none}.segs.small .seg:has(input:checked) b{color:var(--hi)}
.ed-grid{display:grid;gap:12px}.ed-grid.amount{grid-template-columns:minmax(0,1.6fr) 180px 90px auto;align-items:end}
.ed-grid.matches{grid-template-columns:repeat(4,minmax(0,1fr))}.ed-grid.validity{grid-template-columns:200px 200px}.ed-grid.airports{grid-template-columns:100px 100px minmax(0,2fr) 90px minmax(0,1fr) 120px 120px}
.field input.big{font-size:22px;font-weight:700;height:52px}
.ed-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--line-soft)}
.ed-actions.sticky{position:sticky;bottom:12px;padding:12px 16px;border-radius:14px;background:rgba(15,22,43,.92);border:1px solid var(--line);backdrop-filter:blur(10px)}
.delta{font-size:12px;font-weight:700;padding:1px 6px;border-radius:6px}.delta.up{background:var(--good-bg);color:var(--good)}.delta.down{background:var(--bad-bg);color:var(--bad-ink)}
@media (max-width:1100px){.rule-editor{grid-template-columns:1fr}.ed-grid.matches{grid-template-columns:1fr 1fr}.ed-grid.amount{grid-template-columns:1fr 1fr}}

/* ================================================================ aircraft cards */
.fleet-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.tailcard{display:flex;flex-direction:column;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--card-grad);box-shadow:var(--shadow);overflow:hidden;margin:0}
.tailcard.inactive{opacity:.6}
.tc-hero{position:relative;padding:14px 14px 8px;display:flex;flex-direction:column;gap:6px;background:radial-gradient(120% 100% at 50% 100%,rgba(110,147,255,.18),transparent 60%),linear-gradient(180deg,rgba(var(--fg),.03),rgba(var(--well),.35));overflow:hidden}
/* the whole tail, stabiliser tips included, across the card under its registration (the -full render) */
.tc-hero img{display:block;width:100%;height:auto;aspect-ratio:1200/620;object-fit:contain;margin-top:-4px;filter:drop-shadow(0 14px 20px rgba(0,0,0,.55))}
.tc-hero .tc-reg{order:-1;align-self:flex-start;font:800 20px var(--font-ui);color:var(--hi);letter-spacing:.03em;padding-right:72px}
.tc-hero .tc-type{position:absolute;right:12px;top:12px;padding:3px 9px;border-radius:8px;background:rgba(var(--well),.7);border:1px solid var(--line-strong);font:700 12px var(--font-ui);color:var(--accent-2);letter-spacing:.6px}
.tc-hero.empty{min-height:150px;align-items:center;justify-content:center;border-bottom:1px dashed var(--line)}.tc-hero.empty .tc-reg{color:var(--ink4);font-size:16px;padding-right:0}
.tc-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 14px 4px}
.tc-fields .field input{height:40px;font-size:14px}
.tc-actions{display:flex;align-items:center;gap:8px;padding:10px 14px 14px}.tc-actions .grow{flex:1}
.toggle{display:inline-flex;align-items:center;gap:8px;margin:0;cursor:pointer;font-size:12px;color:var(--ink2)}
.toggle input{position:absolute;opacity:0;pointer-events:none}
.toggle i{width:34px;height:20px;border-radius:10px;background:var(--surface-3);border:1px solid var(--line-strong);position:relative;transition:background .15s}
.toggle i::after{content:"";position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--ink3);transition:transform .15s,background .15s}
.toggle:has(input:checked) i{background:rgba(60,201,138,.35);border-color:var(--good)}.toggle:has(input:checked) i::after{transform:translateX(14px);background:var(--good)}
/* the real radio or checkbox inside a .seg or .toggle is invisible, so keyboard focus shows on the control drawn for it */
.seg:has(input:focus-visible),.toggle:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.toggle{border-radius:6px}
.btn.dgr.ghost{border-color:rgba(242,102,94,.3)}

/* ================================================================ airport rows and account rows */
.apt-editor{margin:0 0 14px}.apt-editor h2{margin-bottom:12px}
.apt-rows{display:flex;flex-direction:column;gap:6px}
.apt-row{display:grid;grid-template-columns:36px 90px minmax(0,1.6fr) minmax(0,1fr) 150px auto;gap:16px;align-items:center;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card-grad)}
.apt-row.bad{border-color:rgba(242,102,94,.35);background:linear-gradient(180deg,rgba(242,102,94,.1),rgba(242,102,94,.03)),var(--card-grad)}
.apt-row .flag{width:32px;height:24px;border-radius:4px;box-shadow:0 0 0 1px rgba(var(--fg),.12)}.apt-row .flag.none{display:inline-block;background:var(--surface-3)}
.ar-codes b{display:block;font:800 18px var(--font-ui);color:var(--hi);letter-spacing:.04em}.ar-codes small{color:var(--ink4)}
.ar-name b{display:block;font-size:13.5px;color:var(--hi)}.ar-name small{font-size:12px;color:var(--ink4)}
.ar-geo{font-size:12px;color:var(--ink3)}.ar-geo small{display:block;font-size:12px;color:var(--ink4);letter-spacing:.8px;text-transform:uppercase;font-family:var(--font-ui)}
.ar-actions{display:flex;gap:6px;justify-content:flex-end}.ar-actions .inline{display:inline}
.apt-row.user{grid-template-columns:36px minmax(0,1.6fr) 130px minmax(0,1fr) auto}
@media (max-width:900px){.apt-row{grid-template-columns:36px 80px minmax(0,1fr) auto}.ar-geo,.ar-state{display:none}.ed-grid.airports{grid-template-columns:1fr 1fr}}

/* ================================================================ general settings */
.gset header{display:flex;align-items:baseline;gap:12px;margin:0 0 6px}.gset header h2{margin:0}.gset header span{font-size:12px;color:var(--ink4)}
.grow-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:20px;padding:14px 0;border-top:1px solid var(--line-soft);align-items:start}
.gl b{display:block;font-size:13.5px;color:var(--hi);text-transform:capitalize}.gl small{display:block;font-size:12px;color:var(--ink3);margin:3px 0 6px;line-height:1.45}
.changed{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink4)}
.gi input,.gi textarea{margin:0}
textarea{display:block;width:100%;padding:9px 11px;border:1px solid var(--line-strong);border-radius:10px;font:inherit;background:rgba(var(--well),.6);color:var(--ink);resize:vertical;line-height:1.45}
textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
textarea.mono{font-family:var(--mono);font-size:12.5px}
@media (max-width:800px){.grow-row{grid-template-columns:1fr}}

/* ================================================================ uploads and alerts */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 16px}
.tile-s{border-radius:var(--r-lg);border:1px solid var(--line);background:var(--card-grad);box-shadow:var(--shadow);padding:14px 16px;display:flex;flex-direction:column;gap:4px;min-width:0}
.tile-s>span{font-size:12px;letter-spacing:1.3px;text-transform:uppercase;color:var(--ink4)}.tile-s>span small{text-transform:none;letter-spacing:0;margin-left:6px}
.tile-s b{font:700 20px var(--font-ui);color:var(--hi)}.tile-s small{font-size:12px;color:var(--ink3)}
.tile-s.ok{border-color:rgba(60,201,138,.3)}.tile-s.bad{border-color:rgba(232,163,60,.35)}
.tile-s .dot{display:inline-block;width:7px;height:7px;border-radius:2px;margin:0 4px 0 8px;vertical-align:1px}.tile-s .dot.ok{background:var(--good);margin-left:0}.tile-s .dot.bad{background:var(--bad)}.tile-s .dot.skip{background:var(--ink4)}
.bars{display:flex;align-items:flex-end;gap:2px;height:44px;margin-top:6px}
.bars i{flex:1;min-width:3px;border-radius:2px 2px 0 0;background:var(--ink4);min-height:3px}.bars i.o-ok{background:var(--good)}.bars i.o-failed{background:var(--bad)}.bars i.o-skipped_unchanged{background:rgba(var(--fg),.14)}
.uplist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.uplist li{display:grid;grid-template-columns:14px 170px auto auto 70px 190px minmax(0,1fr) auto;gap:14px;align-items:center;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card-grad)}
.uplist li.none{display:block;border:0;background:none;padding:0}
.uplist .lamp{width:10px;height:10px;border-radius:50%;background:var(--ink4)}.uplist li.o-ok .lamp{background:var(--good);box-shadow:0 0 10px var(--good)}.uplist li.o-failed .lamp{background:var(--bad);box-shadow:0 0 10px var(--bad)}
.uplist li.o-failed{border-color:rgba(242,102,94,.3)}
.up-when b{display:block;font-size:13px;color:var(--hi)}.up-when small{color:var(--ink4)}
.up-legs b{font:700 16px var(--font-ui);color:var(--hi)}.up-legs small{color:var(--ink4);margin-left:4px}
.up-hash small{display:block;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--ink4)}.up-hash code{color:var(--ink2)}
.up-msg{font-size:12.5px;color:var(--ink3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.up-act .btn small{color:var(--ink4);margin-left:4px;font-weight:400}
.uplist.alerts li{grid-template-columns:14px 170px minmax(0,1fr) minmax(0,1.6fr) 150px}
.uplist.attempts li{grid-template-columns:14px 170px minmax(0,1fr) auto}     /* failed sign-ins: when, the email tried, from where */
.up-kind b{font-size:13px;color:var(--hi)}.up-cleared small{display:block;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--ink4)}
.alerts-open{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px;margin:0 0 16px}
.alert-card{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:var(--r-lg);border:1px solid rgba(242,102,94,.4);background:linear-gradient(180deg,rgba(242,102,94,.16),rgba(242,102,94,.04)),var(--card-grad)}
.alert-card .lamp{width:12px;height:12px;border-radius:50%;background:var(--bad);box-shadow:0 0 0 4px var(--bad-bg),0 0 16px var(--bad);margin-top:4px;flex:none}
.alert-card b{display:block;color:var(--hi);font-size:14px}.alert-card span{display:block;font-size:12.5px;color:var(--ink2);margin:3px 0}.alert-card small{color:var(--ink4)}
/* narrower: the hash goes, and so does an accepted upload's message; a failed upload's reason and an
   alert's message move to a full-width line of their own (order puts them last). The email tried in
   a failed sign-in keeps its column */
@media (max-width:1100px){.tiles{grid-template-columns:1fr 1fr}.uplist li{grid-template-columns:14px 150px auto auto minmax(0,1fr) auto}.up-hash,.up-msg{display:none}
  .uplist.alerts li{grid-template-columns:14px 150px minmax(0,1fr) auto}.uplist.attempts li{grid-template-columns:14px 150px minmax(0,1fr) auto}
  .uplist.alerts .up-msg,.uplist li.o-failed .up-msg{display:block;grid-column:2 / -1;order:1;white-space:normal}
  .uplist.attempts li .up-msg{display:block;grid-column:auto;order:0;white-space:nowrap}}
/* phones: a row wraps instead of pushing Download off the screen */
@media (max-width:600px){
  .uplist li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
  .uplist .lamp{flex:none}.uplist .up-when{flex:1 1 auto;min-width:0}
  .uplist.alerts .up-msg,.uplist li.o-failed .up-msg{flex:1 1 100%;min-width:0}.uplist.attempts li .up-msg{flex:1 1 100%;order:1;white-space:normal;overflow-wrap:anywhere}
  .uplist .up-act{flex:1 1 100%;order:2}.uplist .up-act:empty{display:none}}
/* action deck: Save on its own row, the two panel toggles beneath */
.leg-actions .btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;max-width:268px}
.leg-actions .btns .save{grid-column:1 / -1;justify-content:center}
.leg-actions .btns .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 10px}
.leg-actions .btns .btn svg{width:14px;height:14px;flex:none}
@media (max-width:1180px){.leg-actions .btns{grid-template-columns:auto auto auto;width:auto;max-width:none}.leg-actions .btns .save{grid-column:auto}}

/* ================================================================ offer deck: graphical fields */
.field .fl{display:flex;align-items:center;gap:6px}.field .fl svg{width:14px;height:14px;color:var(--accent-2);flex:none}
.seatrow{display:flex;gap:3px;margin-top:2px}
.seatrow .seat{width:14px;height:14px;fill:rgba(var(--fg),.12);transition:fill .15s}.seatrow .seat.on{fill:var(--accent)}
.fi.stepper input{padding-left:8px;padding-right:8px}
.fi.money .cur{position:absolute;left:46px;top:50%;transform:translateY(-50%);font:700 14px var(--font-ui);color:var(--accent-2);pointer-events:none;z-index:1}
.fi.money input{padding-left:26px;text-align:right;padding-right:10px}
.fi.icon svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--ink4);pointer-events:none}
.fi.icon input{padding-left:36px}
.field small .ovr{color:var(--soon);text-transform:uppercase;letter-spacing:.6px;font-size:12px}
.field.note input{border-style:dashed}
.field .fl{white-space:nowrap;min-width:0}.field .fl i{overflow:hidden;text-overflow:ellipsis;min-width:0}

/* hints under the fields carry the explanation and may wrap; placeholders stay short */
.field small{line-height:1.4;white-space:normal}
.field input{font-size:15px}
.fi.icon input{padding-left:34px}
/* the offer fields' columns, one set per width and the only .fields columns in this file: an
   unconditional rule after the narrow ones would win at every width and cut the fields off on a phone */
.fields{grid-template-columns:196px 220px minmax(0,1fr) minmax(0,1fr)}
@media (max-width:1180px){.fields{grid-template-columns:160px 210px minmax(0,1fr) minmax(0,1fr)}.field.wide{grid-column:span 2}}
@media (max-width:860px){.fields{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.fields{grid-template-columns:1fr}.field.wide{grid-column:auto}}

/* ================================================================ partner tiles: the logos carry the indicator */
.c-tile.partner{display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;row-gap:10px;align-items:start;padding:14px 16px 14px 14px}
.c-tile.partner .badge{grid-row:1 / span 2;position:relative;width:64px;height:64px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#2A3670,#141B3F);box-shadow:0 10px 24px -12px rgba(0,0,0,.9),0 1px 0 rgba(var(--fg),.12) inset;border:1px solid rgba(var(--fg),.1)}
.c-tile.partner .badge img{width:38px;height:38px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
.c-tile.partner .badge.lh{background:linear-gradient(160deg,#0B2168,#05164D)}
.c-tile.partner .badge.lh img{width:42px;height:42px}
.c-tile.partner .badge .lamp{position:absolute;right:-5px;bottom:-5px;width:16px;height:16px;border-radius:50%;background:var(--ink4);border:3px solid var(--surface)}
.c-tile.partner.s-ok .badge .lamp{background:var(--good);box-shadow:0 0 10px var(--good);animation:pulse-sm 2.4s var(--ease) infinite}
.c-tile.partner.s-soon .badge .lamp{background:var(--soon)}.c-tile.partner.s-warn .badge .lamp{background:var(--bad);box-shadow:0 0 10px var(--bad)}
.c-tile.partner.s-warn .badge{border-color:rgba(242,102,94,.5)}.c-tile.partner.s-warn .badge img{filter:saturate(.3) brightness(.85)}
@keyframes pulse-sm{0%,100%{box-shadow:0 0 0 0 rgba(60,201,138,.5),0 0 10px var(--good)}50%{box-shadow:0 0 0 5px rgba(60,201,138,0),0 0 4px var(--good)}}
.c-tile.partner .t-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.c-tile.partner .t-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.c-tile.partner .t-head b{font:700 15px var(--font-ui);color:var(--hi);letter-spacing:0;text-transform:none}.c-tile.partner .t-head .sub{font-size:12px;color:var(--ink4);margin-left:0}
.c-tile.partner .t-status{font:600 13px var(--font-ui);color:var(--good)}
.c-tile.partner.s-soon .t-status{color:var(--soon)}.c-tile.partner.s-warn .t-status{color:var(--bad-ink)}.c-tile.partner.s-none .t-status{color:var(--ink3)}
.c-tile.partner .t-body{flex-direction:row;gap:12px;flex-wrap:wrap;font-size:12px}
.c-tile.partner .t-act{grid-column:2;margin-top:0}
.c-tile.partner.busy .badge .lamp,.c-tile.partner .t-act.busy~.badge .lamp{background:var(--accent)}
@media (max-width:720px){.c-tile.partner{grid-template-columns:52px minmax(0,1fr)}.c-tile.partner .badge{width:52px;height:52px;border-radius:14px}.c-tile.partner .badge img{width:30px;height:30px}}

/* ================================================================ per-leg cost lines */
.extras{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px dashed var(--line)}
.ex-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--ink2)}.ex-label svg{width:13px;height:13px;color:var(--accent-2)}.ex-label i{font-style:normal;font-weight:500;text-transform:none;letter-spacing:0;color:var(--ink4)}
.ex-chip{display:inline-flex;align-items:center;gap:7px;padding:4px 6px 4px 10px;border-radius:9px;border:1px solid var(--line-strong);background:rgba(var(--fg),.04);font-size:12px}
.ex-chip b{color:var(--hi);font-weight:600}.ex-chip em{font-style:normal;color:var(--ink);font-variant-numeric:tabular-nums}.ex-chip small{color:var(--ink4);font-size:12px}
.ex-chip.l-tax{border-color:rgba(232,163,60,.4);background:rgba(232,163,60,.08)}.ex-chip.l-fee{border-color:rgba(60,201,138,.4);background:rgba(60,201,138,.08)}
.ex-chip .ex-rm{border:0;background:transparent;color:var(--ink4);font-size:15px;line-height:1;cursor:pointer;padding:0 4px;border-radius:5px}.ex-chip .ex-rm:hover{color:var(--hi);background:var(--bad-bg)}
.ex-add{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
.ex-add input,.ex-add select{margin:0;height:34px;padding:6px 10px;font-size:13px;border-radius:9px;width:auto}
.ex-add input[name=name]{width:170px}.ex-add .ex-amt{position:relative}.ex-add .ex-amt input{width:96px;padding-left:24px;text-align:right}.ex-add .ex-amt .cur{position:absolute;left:9px;top:50%;transform:translateY(-50%);font:700 12px var(--font-ui);color:var(--accent-2)}
.ex-add select{padding-right:26px}
.btn.sm{padding:6px 12px;font-size:12.5px}
.bd-group li.extra{background:rgba(var(--fg),.03);margin:0 -6px;padding:7px 6px;border-radius:8px;border-top:0}
.xtag{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:5px;font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;background:rgba(110,147,255,.18);color:var(--accent-2);vertical-align:1px}
@media (max-width:860px){.ex-add{margin-left:0;flex-wrap:wrap}}









































.btn.save .long{margin-left:0}




/* ================================================================ manual */
.manual{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;align-items:start}
.manual-toc{position:sticky;top:76px;padding:14px 16px;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--card-grad);font-size:12.5px;max-height:calc(100vh - 100px);overflow:auto}
.manual-toc ul{list-style:none;margin:0;padding:0}.manual-toc li{margin:0}.manual-toc > ul > li{margin:0 0 6px}
.manual-toc a{display:block;color:var(--ink2);text-decoration:none;padding:3px 0}.manual-toc a:hover{color:var(--hi)}
.manual-toc ul ul{padding-left:12px;border-left:1px solid var(--line-soft);margin:2px 0 6px}.manual-toc ul ul a{color:var(--ink3);font-size:12px}
.manual-body{min-width:0;max-width:960px}
.manual-body h2{font:400 26px/1.15 var(--font-brand);letter-spacing:.2px;text-transform:none;color:var(--hi);margin:36px 0 10px;padding-top:18px;border-top:1px solid var(--line)}
.manual-body h2:first-child{margin-top:0;border-top:0;padding-top:0}
.manual-body h3{font:600 15px var(--font-ui);letter-spacing:0;text-transform:none;color:var(--hi);margin:24px 0 8px}
.manual-body p,.manual-body li{font-size:13.5px;line-height:1.6;color:var(--ink2)}.manual-body li{margin:0 0 4px}
.manual-body strong{color:var(--hi)}.manual-body code{font-family:var(--mono);font-size:12px;background:rgba(var(--fg),.06);padding:1px 6px;border-radius:5px}
.manual-body img{display:block;max-width:100%;height:auto;border-radius:12px;border:1px solid var(--line-strong);box-shadow:var(--shadow-lift);margin:12px 0 18px}
.manual-body table{width:100%;border-collapse:collapse;font-size:13px;margin:8px 0 16px}.manual-body th{text-align:left;font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink3);padding:8px 10px;border-bottom:1px solid var(--line)}
.manual-body td{padding:8px 10px;border-bottom:1px solid var(--line-soft);color:var(--ink2);vertical-align:top}
.manual-body blockquote{margin:12px 0;padding:10px 14px;border-left:3px solid var(--accent);background:rgba(110,147,255,.08);border-radius:0 10px 10px 0}.manual-body blockquote p{margin:0}
@media (max-width:1000px){.manual{grid-template-columns:1fr}.manual-toc{position:static;max-height:none}}

/* ================================================================ aircraft type colours
   One hue per type, spread far apart and kept clear of the state colours (green published,
   amber on hold, red blocked) and of the accent blue, so a type is never read as a state.
   A variant such as CJ3+ slugs to cj3 and inherits the family colour. */
.t-cj1{--type:#6ED0F5}
.t-cj2{--type:#38C6DE}
.t-cj3{--type:#A98BFF}
.t-cj4{--type:#F58FC6}
.t-unknown{--type:var(--ink3)}
[data-theme=light] .t-cj1{--type:#0A6F96}[data-theme=light] .t-cj2{--type:#0B6E80}[data-theme=light] .t-cj3{--type:#5B3DC4}[data-theme=light] .t-cj4{--type:#B02A5B}

/* the type badge on a leg card: bigger than the call sign beside it, and tinted */

/* the type filter chips */
.filterbar .chip.type{font:700 13.5px var(--font-ui);letter-spacing:.08em;padding:7px 14px;color:var(--type,var(--ink3))}
.filterbar .chip.type:hover{color:var(--hi);background:color-mix(in srgb,var(--type,#fff) 18%,transparent)}
.filterbar .chip.type.on{color:var(--hi);background:color-mix(in srgb,var(--type,var(--accent)) 30%,transparent);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--type,var(--accent)) 60%,transparent) inset}

/* aircraft card corner badge */
.tc-hero .tc-type{font:800 14px/1 var(--font-ui);letter-spacing:.1em;padding:6px 11px;border-radius:10px;
  color:var(--type,var(--accent-2));
  border-color:color-mix(in srgb,var(--type,var(--accent-2)) 55%,transparent);
  background:linear-gradient(180deg,color-mix(in srgb,var(--type,var(--accent-2)) 24%,rgba(var(--well),.8)),rgba(var(--well),.86))}

/* the aircraft-type condition on a pricing rule */
.cchip.type{font:700 12px var(--font-ui);letter-spacing:.06em;padding:3px 9px;color:var(--type,var(--ink2));
  border-color:color-mix(in srgb,var(--type,var(--line)) 45%,transparent);
  background:color-mix(in srgb,var(--type,#fff) 14%,transparent)}



/* ================================================================ the schedule, made legible
   Times, block time and distance were quieter than the airport codes and the price, which put the
   operationally useful numbers last. UTC leads because that is what the file, Leon and Lufthansa all
   speak; local sits beneath it as the human check. */
.leg-route .day{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink2);letter-spacing:.1px}
.leg-route .day svg{width:15px;height:15px;color:var(--ink4);flex:none}
.leg-route .day b{color:var(--hi);font-weight:700}
.leg-route .day .mono{color:var(--ink3);font-weight:400;font-size:12.5px}

/* the airport block: room between the flag, the code and the times */
.leg-route .apt{column-gap:13px;row-gap:4px}
.leg-route .apt.arr{column-gap:13px}
.leg-route .route{gap:18px}

/* UTC large, local small beneath it; tabular figures so departure and arrival line up */
.leg-route .apt em{font-style:normal;display:flex;flex-direction:column;align-items:flex-start;gap:1px;line-height:1.2;padding-top:1px}
.leg-route .apt em u{text-decoration:none;font:700 22px/1.15 var(--font-ui);color:var(--hi);
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;margin:0}
.leg-route .apt em span{font:400 12px/1.2 var(--mono);color:var(--ink3);letter-spacing:-.02em;white-space:nowrap}
.leg-route .apt.arr em{align-items:flex-end;justify-content:flex-start;gap:1px}
.leg-route .apt.arr em u{order:0;margin:0}          /* the block stacks now, so the old mirror-order is wrong */
.leg-route .apt.arr em span{order:0}

/* block time and distance as two figures under the arc */
.leg-route .path i.meta{display:flex;align-items:center;gap:8px;margin-top:0;font-style:normal;white-space:nowrap}
.leg-route .path i.meta b{font:700 14px var(--font-ui);color:var(--hi);font-variant-numeric:tabular-nums;
  padding:2px 9px;border-radius:8px;background:rgba(var(--fg),.07);border:1px solid var(--line)}
.leg-route .path i.meta span{font:600 12.5px var(--font-ui);color:var(--ink2);font-variant-numeric:tabular-nums}













/* ================================================================ the legs overview
   One row per leg, grouped by departure day; a row opens its full card in place. */
.nextfile{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:10px 14px;border-radius:12px;border:1px solid var(--line);
  background:var(--card-grad);color:var(--ink2);text-decoration:none;font-size:13px}
.nextfile svg{width:16px;height:16px;color:var(--ink3);flex:none}
.nextfile b{color:var(--hi)}.nextfile em{margin-left:auto;font-style:normal;color:var(--accent-2);font-weight:600}
.nextfile:hover{border-color:var(--line-strong);text-decoration:none}
.nextfile.pending{border-color:rgba(110,147,255,.45);background:linear-gradient(180deg,rgba(110,147,255,.14),rgba(110,147,255,.04)),var(--card-grad)}
.nextfile.pending svg{color:var(--accent-2)}

.filterbar details.more{position:relative}
.filterbar details.more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;
  border-radius:10px;border:1px solid var(--line-strong);color:var(--ink2);font:600 13px var(--font-ui);user-select:none}
.filterbar details.more summary::-webkit-details-marker{display:none}
.filterbar details.more summary::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:4px}
.filterbar details.more[open] summary::after{transform:rotate(-135deg) translateY(-1px)}
.filterbar details.more summary b{padding:0 7px;border-radius:7px;background:var(--accent);color:var(--accent-ink);font-size:12px}
.filterbar details.more[open]{flex-basis:100%}
.filterbar details.more[open] summary{margin-bottom:10px}
.filterbar .more-body{display:flex;flex-wrap:wrap;gap:10px;align-items:center}

.attention-line{margin:0 0 12px;font-size:13px;color:var(--ink2);display:flex;align-items:center;gap:8px;flex-wrap:wrap}

.lgroup{margin:0 0 18px}
.lgroup-head{margin:0 0 8px;font:600 15px var(--font-ui);letter-spacing:0;text-transform:none;color:var(--hi);display:flex;align-items:baseline;gap:10px}
.lgroup-head small{font:400 13px var(--font-ui);color:var(--ink3);letter-spacing:0;text-transform:none;margin:0}
.ltable{display:flex;flex-direction:column;gap:6px}

.lrow{border-radius:12px;border:1px solid var(--line);background:var(--card-grad);box-shadow:var(--shadow);overflow:hidden;position:relative}
.lrow::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--ink4)}
.lrow.s-published::before{background:var(--good)}.lrow.s-hold::before{background:var(--soon)}.lrow.s-blocked::before{background:var(--bad)}
.lrow.s-blocked{border-color:rgba(242,102,94,.35)}
.lrow:hover{border-color:var(--line-strong)}
.lrow.open{border-color:rgba(110,147,255,.5);border-bottom-left-radius:0;border-bottom-right-radius:0}
.lrow.dirty{border-color:rgba(232,163,60,.6)}

.lr{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:grid;align-items:center;gap:16px;padding:8px 14px 8px 16px;
  grid-template-columns:150px minmax(150px,1.3fr) 118px 96px 80px 78px 120px minmax(110px,1fr) 18px}
.lr:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:12px}
.lr-tail{display:flex;align-items:center;gap:10px;min-width:0}
.lr-tail img{width:40px;height:44px;object-fit:cover;object-position:50% 38%;border-radius:8px;background:rgba(var(--fg),.04);flex:none}
.lr-tail > span{display:flex;flex-direction:column;gap:3px;min-width:0}
.lr-tail b{font:700 15px var(--font-ui);color:var(--hi);letter-spacing:.02em}
.tpill{align-self:flex-start;padding:1px 8px;border-radius:7px;font:800 12px/1.5 var(--font-ui);letter-spacing:.08em;
  color:var(--type,var(--accent-2));background:color-mix(in srgb,var(--type,var(--accent-2)) 18%,transparent);
  border:1px solid color-mix(in srgb,var(--type,var(--accent-2)) 45%,transparent)}
.lr-route{display:flex;align-items:center;gap:8px;min-width:0}
.lr-route b{font:700 20px var(--font-ui);color:var(--hi);letter-spacing:.02em}
.lr-route .flag{width:22px;height:16.5px;border-radius:3px;box-shadow:0 0 0 1px rgba(var(--fg),.12);flex:none}
.lr-route .arw{width:28px;height:2px;background:linear-gradient(90deg,var(--ink4),var(--accent-2));position:relative;flex:none}
.lr-route .arw::after{content:"";position:absolute;right:-1px;top:-3px;width:6px;height:6px;border-top:2px solid var(--accent-2);border-right:2px solid var(--accent-2);transform:rotate(45deg)}
.lr-dep{display:flex;flex-direction:column;gap:1px}
.lr-dep b{font:700 17px var(--font-ui);color:var(--hi);font-variant-numeric:tabular-nums}
.lr-dep small{font-size:12px;color:var(--ink3);white-space:nowrap}
.lr-count{font:600 13px var(--font-ui);padding:3px 9px;border-radius:8px;justify-self:start;white-space:nowrap;
  background:rgba(var(--fg),.06);color:var(--ink2);font-variant-numeric:tabular-nums}
.lr-count.u-near{background:rgba(242,102,94,.16);color:var(--bad-ink)}
.lr-count.u-day{background:rgba(232,163,60,.14);color:var(--soon)}
.lr-count.u-gone{color:var(--ink3)}
.lr-block,.lr-seats{display:flex;flex-direction:column;gap:1px;font:600 14px var(--font-ui);color:var(--ink);font-variant-numeric:tabular-nums}
.lr-block small,.lr-seats small{font:400 12px var(--font-ui);color:var(--ink3)}
.lr-price{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
.lr-price .pv-n{font-size:19px}.lr-price .pv-c{font-size:12px}.lr-price .pv-cur{font-size:10px}
.lr-price .pv-note{font-size:11px;color:var(--soon);white-space:nowrap}
.lr-flags{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;min-width:0}
.lr-chev{width:9px;height:9px;border-right:2px solid var(--ink3);border-bottom:2px solid var(--ink3);transform:rotate(45deg);margin-top:-4px;justify-self:end;transition:transform .15s}
.lrow.open .lr-chev{transform:rotate(-135deg);margin-top:4px}

.lflag{display:inline-flex;align-items:center;padding:2px 9px;border-radius:8px;font:700 12px/1.4 var(--font-ui);white-space:nowrap;
  max-width:220px;overflow:hidden;text-overflow:ellipsis;background:rgba(var(--fg),.07);color:var(--ink2)}
.lflag.new{background:rgba(110,147,255,.2);color:var(--hi)}
.lflag.check{background:rgba(232,163,60,.16);color:var(--soon)}
.lflag.hold{background:rgba(232,163,60,.16);color:var(--soon)}
.lflag.blocked{background:var(--bad-bg);color:var(--bad-ink)}
.lflag.dirty{background:rgba(232,163,60,.9);color:#1a1200}

/* the card under an open row */
.ltable form.leg{margin:-7px 0 6px;border-top-left-radius:0;border-top-right-radius:0;border-color:rgba(110,147,255,.5)}
.ltable form.leg.dirty{border-color:rgba(232,163,60,.6)}
.dirty-note{align-self:flex-end;padding:3px 10px;border-radius:8px;background:rgba(232,163,60,.9);color:#1a1200;font:700 12px var(--font-ui)}
.checked-note{display:block;text-align:right;font-size:12px;color:var(--good)}
.checked-note.todo{color:var(--soon)}
.leg-price .amount .unsaved{display:block;font:italic 600 12px var(--font-ui);color:var(--soon);margin-top:4px;text-align:right}

@media (max-width:1300px){
  .lr{grid-template-columns:140px minmax(140px,1.3fr) 110px 90px 64px 110px minmax(90px,1fr) 18px}
  .lr-seats{display:none}
}
@media (max-width:1100px){
  .lr{grid-template-columns:130px minmax(130px,1fr) 104px 88px 104px 18px;grid-template-areas:"tail route dep count price chev" "flags flags flags flags flags flags";row-gap:6px}
  .lr-block{display:none}
  .lr-tail{grid-area:tail}.lr-route{grid-area:route}.lr-dep{grid-area:dep}.lr-count{grid-area:count}.lr-price{grid-area:price}.lr-chev{grid-area:chev}
  .lr-flags{grid-area:flags;justify-content:flex-start}.lr-flags:empty{display:none}
}
@media (max-width:760px){
  .lr{grid-template-columns:1fr auto;grid-template-areas:"tail price" "route route" "dep count" "flags flags";gap:8px}
  .lr-chev{display:none}
  .lr-count{justify-self:end}
}

.c-tile.partner.s-local .badge .lamp{background:var(--ink3)}
.c-tile.partner.s-local .t-status{color:var(--ink2)}
.notice.local{margin:0 0 14px;padding:12px 16px;border-radius:12px;border:1px solid rgba(149,163,189,.45);background:rgba(149,163,189,.08);color:var(--ink2);font-size:13px}
.notice.local b{color:var(--hi)}.notice.local code{color:var(--hi)}

/* the next file on the Uploads page */
.nextcard .nc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.nextcard .nc-head h2{margin:0 0 4px}.nextcard .nc-head span{font-size:13px;color:var(--ink2)}
.ndiff{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.ndiff li{display:grid;grid-template-columns:90px 120px 220px minmax(0,1fr);gap:14px;align-items:center;padding:9px 12px;border-radius:10px;
  background:rgba(var(--fg),.03);border:1px solid var(--line-soft);font-size:13px}
.ndiff .nd-kind{font:700 12px var(--font-ui);padding:2px 8px;border-radius:7px;justify-self:start}
.ndiff .add .nd-kind{background:var(--good-bg);color:var(--good)}
.ndiff .chg .nd-kind{background:rgba(110,147,255,.18);color:var(--accent-2)}
.ndiff .rem .nd-kind{background:var(--bad-bg);color:var(--bad-ink)}
.ndiff b{color:var(--hi)}.ndiff em{font-style:normal;color:var(--ink2);display:flex;flex-wrap:wrap;gap:10px}
.ndiff .nd-ch i{font-style:normal;color:var(--hi)}
@media (max-width:900px){.ndiff li{grid-template-columns:1fr 1fr}}

/* the hidden attribute always wins over a component's own display rule */
[hidden]{display:none !important}

.gl b{text-transform:none}

/* ================================================================ account page */
.acct{display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);gap:14px;align-items:start}
.acct .card{margin:0}
.acct-head{display:flex;align-items:center;gap:14px;margin:0 0 16px}.acct-head h1{margin:0}.acct-head .lede{margin:2px 0 0}
.acct-head .avatar{width:44px;height:44px;font-size:14px}
.acct-head .warn{color:var(--soon);font-style:normal}
.confirm-box{margin:6px 0 14px;padding:12px 14px 2px;border-radius:12px;border:1px dashed rgba(110,147,255,.45);background:rgba(110,147,255,.06)}
.acct-more{margin-top:18px;padding-top:14px;border-top:1px solid var(--line-soft)}
.acct-more h2{margin:0 0 10px}
.acct-actions{display:flex;flex-wrap:wrap;gap:8px}
.acct-history h2{margin-bottom:10px}
@media (max-width:1000px){.acct{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- the 48-hour strip: its own sky, lighter than the deck */
:root{
  --tp-bg:linear-gradient(180deg,#131E3B 0%,#0E1731 100%); --tp-edge:rgba(157,182,255,.12); --tp-sep:rgba(157,182,255,.14);
  --tp-line:rgba(157,182,255,.26); --tp-tick:rgba(157,182,255,.22); --tp-tick-day:rgba(157,182,255,.36); --tp-band:rgba(157,182,255,.05);
  --tp-ink:#DCE5F7; --tp-dim:#93A5C9; --tp-faint:#8195BC; --tp-strong:#FFFFFF;
  --tp-dot:#7FA0FF; --tp-ring:#0F1832; --tp-dot-glow:rgba(127,160,255,.55); --tp-now:#9DB6FF; --tp-now-glow:rgba(157,182,255,.7); --tp-hold:#F2B84B;
  --tp-grid:rgba(157,182,255,.07); --tp-head:rgba(157,182,255,.1);
  --tp-bar:linear-gradient(180deg,rgba(138,168,255,.62),rgba(104,140,245,.36)); --tp-bar-edge:rgba(196,211,255,.6); --tp-bar-glow:rgba(110,147,255,.5);
  --tp-bar-hold:linear-gradient(180deg,rgba(246,194,98,.55),rgba(226,160,48,.3)); --tp-bar-hold-edge:rgba(250,212,140,.62); --tp-bar-hold-glow:rgba(242,184,75,.4);
  --tp-bar-bad:linear-gradient(180deg,rgba(246,120,112,.6),rgba(222,82,74,.34)); --tp-bar-bad-edge:rgba(255,176,168,.62); --tp-bar-bad-glow:rgba(242,102,94,.45)}
html[data-theme=light]{
  --tp-bg:linear-gradient(180deg,#E4EDFA 0%,#F2F6FC 100%); --tp-edge:rgba(31,63,140,.12); --tp-sep:rgba(31,63,140,.14);
  --tp-line:rgba(31,63,140,.22); --tp-tick:rgba(31,63,140,.2); --tp-tick-day:rgba(31,63,140,.34); --tp-band:rgba(47,79,216,.05);
  --tp-ink:#1A2548; --tp-dim:#4F5F84; --tp-faint:#56668C; --tp-strong:#10142E;
  --tp-dot:#2F4FD8; --tp-ring:#F2F6FC; --tp-dot-glow:rgba(47,79,216,.25); --tp-now:#2F4FD8; --tp-now-glow:rgba(47,79,216,.3); --tp-hold:#A86400;
  --tp-grid:rgba(31,63,140,.07); --tp-head:rgba(31,63,140,.1);
  --tp-bar:linear-gradient(180deg,rgba(47,79,216,.26),rgba(47,79,216,.14)); --tp-bar-edge:rgba(47,79,216,.55); --tp-bar-glow:rgba(47,79,216,.18);
  --tp-bar-hold:linear-gradient(180deg,rgba(168,100,0,.22),rgba(168,100,0,.1)); --tp-bar-hold-edge:rgba(168,100,0,.5); --tp-bar-hold-glow:rgba(168,100,0,.15);
  --tp-bar-bad:linear-gradient(180deg,rgba(192,54,47,.22),rgba(192,54,47,.1)); --tp-bar-bad-edge:rgba(192,54,47,.55); --tp-bar-bad-glow:rgba(192,54,47,.15)}

/* ================================================================ the deck
   The header as an instrument panel: push-button keys with a lamp for the page you are on, two
   annunciators for Leon and Lufthansa, and below it a 48-hour strip of the legs about to fly.
   Chosen from the menu bar canvas (E, warning states), 2026-09-24. */
.deck{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:18px;height:72px;padding:0 24px;
  background:#0A0D17;border-top:1px solid rgba(var(--fg),.06);box-shadow:0 1px 0 #1B2543,0 10px 30px -18px rgba(0,0,0,.9)}
body.env-production .deck{box-shadow:inset 0 3px 0 var(--bad),0 1px 0 #1B2543,0 10px 30px -18px rgba(0,0,0,.9)}
.deck .env{flex:none}
.dk-brand{display:flex;flex-direction:column;gap:7px;flex:none;text-decoration:none}
.dk-brand:hover{text-decoration:none}
.dk-ea{display:flex;align-items:center;gap:8px;color:var(--hi);font:400 24px/1 var(--font-brand);letter-spacing:-.1px}
.dk-ea img{width:23px;height:23px;display:block}
.dk-el{display:flex;align-items:center;line-height:1}
.dk-el .sf{--sf-w:12.5px;--sf-h:18px;--sf-fs:12px;--sf-gap:1.5px;flex-wrap:nowrap}

.dk-keys,.dk-anns{display:flex;gap:5px;padding:4px;border-radius:11px;background:#05070D;
  box-shadow:0 2px 7px rgba(0,0,0,.85) inset,0 0 0 1px rgba(var(--fg),.045),0 1px 0 rgba(var(--fg),.05)}
.dk-keys{flex:0 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none}
.dk-keys::-webkit-scrollbar{display:none}
/* on a laptop or wider the keys never shrink into a hidden scroller: the Leon and Lufthansa modules
   give way instead (see .ann), so Manual and Offers stay in sight whatever else the header carries */
@media (min-width:1281px){.dk-keys{flex-shrink:0}}
/* A key: a sculpted face with an icon over its label and a lamp strip set into its lower edge. It
   stands proud of the panel until it is the page you are on; then it is pressed in and its lamp
   lights the face from below. */
.dk-key{position:relative;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;min-width:60px;height:56px;box-sizing:border-box;
  padding:9px 13px 0;border-radius:8px;color:var(--ink3);text-decoration:none;font:700 11px/1 var(--font-ui);letter-spacing:1.25px;text-transform:uppercase;white-space:nowrap;
  background:linear-gradient(180deg,#1F2744 0%,#161C32 58%,#12182B 100%);border:1px solid rgba(255,255,255,.06);border-top-color:rgba(255,255,255,.13);
  box-shadow:0 1px 0 rgba(255,255,255,.07) inset,0 -2px 0 rgba(0,0,0,.28) inset,0 3px 0 #03050B,0 5px 10px -2px rgba(0,0,0,.65);
  transition:color .15s,background .15s,transform .08s,box-shadow .08s}
.dk-key .ic{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.8;transition:opacity .15s,color .15s}
.dk-key .lb{display:block}
.dk-key .lt{position:absolute;left:16px;right:16px;bottom:7px;height:3px;border-radius:2px;background:#070A14;
  box-shadow:0 1px 1px rgba(0,0,0,.9) inset,0 1px 0 rgba(255,255,255,.07);transition:background .2s,box-shadow .2s}
.dk-key:hover{color:var(--hi);text-decoration:none;background:linear-gradient(180deg,#252E4E 0%,#1A2139 58%,#151B30 100%)}
.dk-key:hover .ic{opacity:1}
.dk-key:hover .lt{background:rgba(110,147,255,.32)}
.dk-key:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 1px 0 #03050B,0 2px 4px -1px rgba(0,0,0,.6)}
.dk-key:focus-visible,.ann:focus-visible,.dk-me summary:focus-visible,.dk-leg:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.dk-key.on{color:#FFFFFF;transform:translateY(2px);border-color:rgba(110,147,255,.3);border-top-color:rgba(0,0,0,.4);
  background:radial-gradient(90% 70% at 50% 118%,rgba(110,147,255,.34),transparent 72%),linear-gradient(180deg,#121830 0%,#19213D 100%);
  box-shadow:0 3px 7px rgba(0,0,0,.65) inset,0 1px 0 #03050B,0 0 0 1px rgba(110,147,255,.08)}
.dk-key.on .ic{opacity:1;color:#B5C8FF;filter:drop-shadow(0 0 5px rgba(110,147,255,.55))}
.dk-key.on .lt{background:linear-gradient(90deg,#7FA0FF,#A9C0FF 50%,#7FA0FF);box-shadow:0 0 6px var(--accent),0 0 16px rgba(110,147,255,.6)}
.dk-key.warn .ic{color:var(--warn);opacity:1}
.dk-key.warn .lt{background:var(--warn);box-shadow:0 0 6px var(--warn),0 0 14px rgba(242,184,75,.5)}
.dk-key.on.warn{background:radial-gradient(90% 70% at 50% 118%,rgba(242,184,75,.28),transparent 72%),linear-gradient(180deg,#121830 0%,#19213D 100%)}
.dk-key .cnt{position:absolute;top:4px;right:4px;min-width:16px;height:16px;padding:0 4px;box-sizing:border-box;border-radius:8px;background:var(--warn);color:#1A1200;
  font:800 11px/16px var(--font-ui);letter-spacing:0;text-align:center;box-shadow:0 0 0 2px #151B30,0 0 10px rgba(242,184,75,.5)}

.dk-anns{margin-left:auto;flex:0 1 auto;min-width:0}
/* Leon and Lufthansa as instrument modules: the source's emblem in a status ring, its name with a
   small lamp, and the reading on a recessed display lit in the state's colour. --c is the state:
   green in sync, amber getting old, red failing, slate not set up. The ring turns while a sync runs. */
.ann{--c:#7A89A6;--c-glow:rgba(122,137,166,.25);position:relative;container-type:inline-size;display:flex;align-items:center;gap:10px;width:184px;flex:0 1 auto;min-width:56px;height:56px;box-sizing:border-box;padding:0 10px 0 9px;border-radius:8px;
  cursor:pointer;text-align:left;font:inherit;color:var(--ink2);
  background:linear-gradient(180deg,#1C2340 0%,#141A2F 58%,#10152A 100%);border:1px solid rgba(255,255,255,.06);border-top-color:rgba(255,255,255,.12);
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 -2px 0 rgba(0,0,0,.28) inset,0 3px 0 #03050B,0 5px 10px -2px rgba(0,0,0,.65);transition:background .15s,transform .08s}
.ann:hover{background:linear-gradient(180deg,#222A4A 0%,#181F37 58%,#131930 100%)}
.ann:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 1px 0 #03050B}
.ann.s-ok{--c:#3CC98A;--c-glow:rgba(60,201,138,.45)}
.ann.s-soon{--c:#F2B84B;--c-glow:rgba(242,184,75,.45)}
.ann.s-warn{--c:#F2665E;--c-glow:rgba(242,102,94,.5)}
.ann.s-local{--c:#8FA3D6;--c-glow:rgba(143,163,214,.3)}
.ann-badge{position:relative;flex:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 35% 30%,#253052,#0B1022 70%);box-shadow:0 0 0 2px var(--c),0 0 12px var(--c-glow),0 2px 4px rgba(0,0,0,.6) inset;transition:box-shadow .3s}
.ann-badge img{width:17px;height:17px;display:block;object-fit:contain}
.ann-badge::before{content:"";position:absolute;inset:-5px;border-radius:50%;opacity:0;
  background:conic-gradient(from 0deg,transparent 0 60%,var(--c) 100%);-webkit-mask:radial-gradient(circle,transparent 20px,#000 21px);mask:radial-gradient(circle,transparent 20px,#000 21px)}
.ann.busy .ann-badge::before{opacity:1;animation:spin 1s linear infinite}
.ann-txt{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.ann .nm{display:flex;align-items:center;justify-content:space-between;gap:6px;font:800 11px/1 var(--font-ui);letter-spacing:.16em;text-transform:uppercase;color:#E6ECFA}
.ann .led{flex:none;width:7px;height:7px;border-radius:50%;background:var(--c);box-shadow:0 0 6px var(--c),0 0 12px var(--c-glow)}
.ann.s-ok .led{animation:ann-breathe 2.8s ease-in-out infinite}
.ann.s-warn .led{animation:ann-blink 1s steps(2,start) infinite}
.ann .st{display:block;padding:4px 6px 3px;border-radius:4px;background:#04060C;box-shadow:0 1px 2px rgba(0,0,0,.9) inset,0 1px 0 rgba(255,255,255,.05);
  font:500 11px/1.1 var(--mono);letter-spacing:.02em;text-transform:uppercase;color:var(--c);text-shadow:0 0 6px var(--c-glow);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ann.busy{pointer-events:none}
.ann.busy .st{opacity:.75}
@keyframes ann-breathe{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes ann-blink{to{visibility:hidden}}
@media (prefers-reduced-motion:reduce){.ann .led,.ann.busy .ann-badge::before{animation:none}}

.dk-me{position:relative;flex:none}
.dk-me summary{list-style:none;width:36px;height:36px;box-sizing:border-box;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;
  border:1px solid color-mix(in srgb,var(--c) 70%,transparent);background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--c);font:700 12px/1 var(--font-ui);letter-spacing:.5px}
.dk-me summary::-webkit-details-marker{display:none}
.dk-me[open] summary{box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 25%,transparent)}
.dk-menu{position:absolute;right:0;top:calc(100% + 12px);width:250px;padding:6px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line-strong);
  box-shadow:var(--shadow-lift);display:flex;flex-direction:column;gap:2px;z-index:60}
.dk-who{margin:0 0 4px;padding:10px 10px 12px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.dk-who b{color:var(--hi);font-size:14px}.dk-who span{color:var(--ink3);font-size:12px;overflow:hidden;text-overflow:ellipsis}
.dk-menu a,.dk-menu button{display:block;width:100%;text-align:left;padding:9px 10px;border-radius:8px;color:var(--ink2);font:600 13px var(--font-ui);background:none;border:0;cursor:pointer;text-decoration:none}
.dk-menu a:hover,.dk-menu button:hover{background:rgba(var(--fg),.06);color:var(--hi);text-decoration:none}
.dk-menu form{margin:0}

/* the 48-hour strip (canvas variant B, 2026-09-27): a clock, the two days with every flight as a bar from
   departure to landing on one of two rows, and the counts */
.dk-tape{display:flex;align-items:stretch;height:80px;padding:0 24px;background:var(--tp-bg);border-bottom:1px solid var(--tp-edge);box-shadow:0 1px 0 rgba(255,255,255,.04) inset}
.dk-clock{width:112px;flex:none;display:flex;flex-direction:column;justify-content:center;gap:6px;padding-right:18px;border-right:1px solid var(--tp-sep)}
.dk-clock span{font:600 10px/1 var(--font-ui);letter-spacing:1.6px;color:var(--tp-faint)}
.dk-clock b{font:500 24px/1 var(--mono);color:var(--tp-strong);letter-spacing:-.5px;white-space:nowrap;font-variant-numeric:tabular-nums}
.dk-clock em{font:500 10.5px/1 var(--font-ui);font-style:normal;letter-spacing:1.2px;color:var(--tp-dim);white-space:nowrap}
.dk-track{position:relative;flex:1 1 auto;min-width:0;margin-left:18px}
.dk-bands{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.dk-band{position:absolute;top:0;bottom:0;width:50%;background:var(--tp-band)}
.dk-tick{position:absolute;top:26px;bottom:6px;width:1px;background:var(--tp-grid)}
.dk-tick.day{top:0;bottom:0;background:var(--tp-tick-day)}
.dk-tick em{position:absolute;top:-17px;left:5px;font:500 10.5px/1 var(--mono);font-style:normal;color:var(--tp-faint);white-space:nowrap}
.dk-tick.day em{top:10px;left:10px;font:600 10.5px/1 var(--font-ui);letter-spacing:1.4px;color:var(--tp-ink)}
.dk-tick.day em small{font:inherit;color:var(--tp-dim)}
.dk-now{position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--tp-now);box-shadow:0 0 12px var(--tp-now-glow);z-index:1}
.dk-now::before{content:"";position:absolute;left:-4px;top:0;border:5px solid transparent;border-top:6px solid var(--tp-now);border-bottom:0}
.dk-leg{position:absolute;top:34px;height:16px;min-width:8px;box-sizing:border-box;border-radius:5px;z-index:2;text-decoration:none;
  background:var(--tp-bar);border:1px solid var(--tp-bar-edge);box-shadow:0 0 14px -3px var(--tp-bar-glow);transition:filter .15s,box-shadow .15s,transform .15s var(--ease)}
.dk-leg.row-1{top:56px}
.dk-leg.s-hold{background:var(--tp-bar-hold);border-color:var(--tp-bar-hold-edge);box-shadow:0 0 14px -3px var(--tp-bar-hold-glow)}
.dk-leg.s-blocked{background:var(--tp-bar-bad);border-color:var(--tp-bar-bad-edge);box-shadow:0 0 14px -3px var(--tp-bar-bad-glow)}
.dk-leg:hover,.dk-leg:focus-visible{text-decoration:none;filter:brightness(1.18);transform:translateY(-1px);box-shadow:0 0 18px -2px var(--tp-bar-glow)}
.dk-leg .dk-bar{display:none}
.dk-lab{position:absolute;left:calc(100% + 8px);top:50%;transform:translateY(-50%);white-space:nowrap;pointer-events:none;
  font:500 11px/1 var(--mono);letter-spacing:.2px;color:var(--tp-ink)}
.dk-lab em{font-style:normal;color:var(--tp-faint);margin-left:3px}
.dk-leg.lab-l .dk-lab{left:auto;right:calc(100% + 8px)}
.dk-leg.no-lab .dk-lab{display:none}
.dk-leg.s-hold .dk-lab{color:var(--tp-hold)}.dk-leg.s-blocked .dk-lab{color:var(--bad-ink)}
.dk-empty{position:absolute;left:16px;top:42px;font:500 11.5px/1 var(--mono);color:var(--tp-faint)}
.dk-tip{position:absolute;top:76px;width:max-content;min-width:240px;max-width:300px;box-sizing:border-box;padding:13px 15px;z-index:60;border-radius:12px;background:var(--surface-2);border:1px solid var(--line-strong);
  box-shadow:0 18px 40px -12px rgba(0,0,0,.9);display:flex;flex-direction:column;gap:9px;pointer-events:none}
.dk-tip .r{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dk-tip .rt{font:700 16px/1 var(--font-ui);color:var(--hi);letter-spacing:.3px}
.dk-tip .tag{font:700 11px/1 var(--font-ui);letter-spacing:.4px;padding:4px 8px;border-radius:999px;color:var(--good);background:var(--good-bg);white-space:nowrap}
.dk-tip .tag.s-hold{color:var(--warn);background:var(--warn-bg)}.dk-tip .tag.s-blocked{color:var(--bad-ink);background:var(--bad-bg)}
.dk-tip .tm{display:flex;align-items:baseline;gap:8px;white-space:nowrap}.dk-tip .tm b{font:600 15px/1 var(--mono);color:var(--hi)}.dk-tip .tm span{font:500 12px/1 var(--mono);color:var(--ink3)}
.dk-tip .ft{display:flex;justify-content:space-between;gap:12px;padding-top:9px;border-top:1px solid var(--line)}
.dk-tip .rg{font:500 12px/1 var(--mono);color:var(--ink2);letter-spacing:.4px}.dk-tip .bk{font:500 12px/1 var(--mono);color:var(--ink4)}
.dk-tip .why{font-size:12px;line-height:1.35;color:var(--bad-ink)}
.dk-sum{flex:none;display:flex;align-items:center;gap:22px;padding-left:20px;margin-left:18px;border-left:1px solid var(--tp-sep)}
.dk-sum span{display:flex;flex-direction:column-reverse;gap:6px;white-space:nowrap;font:600 10px/1 var(--font-ui);letter-spacing:1.4px;color:var(--tp-faint);text-transform:uppercase}
.dk-sum span[hidden]{display:none}
.dk-sum b{font:500 22px/1 var(--mono);letter-spacing:0;color:var(--tp-strong)}.dk-sum .h b{color:var(--tp-hold)}.dk-sum .x b{color:var(--bad-ink)}

/* narrower screens: shed words before anything is clipped. Wider breakpoints first, so the narrower
   ones after them win */
@media (max-width:1600px){.dk-key{padding:9px 10px 0;min-width:56px;letter-spacing:1px}.deck{gap:14px}}
@media (max-width:1540px){.deck .env-development{display:none}}
@media (max-width:1400px){.dk-brand{flex-direction:row;align-items:center;gap:10px}.dk-ea span{display:none}.dk-ea img{width:26px;height:26px}
  .dk-el .sf{--sf-w:11px;--sf-h:16px;--sf-fs:10.5px}}
@media (max-width:1480px){                                      /* laptops: slimmer modules, the switch without room to spare */
  .ann{width:162px;gap:8px;padding:0 8px 0 7px}.ann-badge{width:30px;height:30px}.ann-badge img{width:15px;height:15px}
  .ann-badge::before{-webkit-mask:radial-gradient(circle,transparent 17px,#000 18px);mask:radial-gradient(circle,transparent 17px,#000 18px)}
  .ann .st{font-size:10.5px;letter-spacing:0;padding:3px 5px}}
@media (max-width:1280px){
  .ann{width:56px;padding:0;justify-content:center}
  .deck{gap:14px}.deck .env{letter-spacing:.4px;padding:4px 6px}
  .dk-key{padding:9px 8px 0;min-width:52px;letter-spacing:.5px}
  .dk-keys{scrollbar-width:thin;scrollbar-color:#2A3456 transparent}}   /* when the keys still do not fit, the row shows it scrolls */
/* A module too narrow for its name shows the ring alone. The name and reading stay for screen readers
   (and the title for the mouse), and the lamp stays on the ring's shoulder with a shape for the state, so the
   state is never told by colour alone: a solid dot in sync, a hollow ring getting old, a ! failing. */
@container (max-width:141px){
  .ann-badge{margin:0 auto}
  .ann-txt{position:absolute;inset:0;pointer-events:none}
  .ann .nm .t,.ann .st{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .ann .led{position:absolute;left:calc(50% + 9px);top:calc(50% - 18px);width:9px;height:9px;box-shadow:0 0 0 2px #10152A,0 0 8px var(--c-glow)}
  .ann.s-soon .led{background:#10152A;border:2px solid var(--c);box-sizing:border-box}
  .ann.s-warn .led{width:14px;height:14px;left:calc(50% + 7px);top:calc(50% - 21px);display:flex;align-items:center;justify-content:center;font:900 11px/1 var(--font-ui);color:#1A0503}
  .ann.s-warn .led::after{content:"!"}
}
@media (max-width:1040px){.dk-sum{display:none}}
@media (max-width:900px){
  .deck{position:relative;flex-wrap:wrap;height:auto;padding:10px 16px;row-gap:10px}.dk-keys{order:5;flex-basis:100%}
  .dk-tape{padding:0 16px}.dk-clock{width:74px;padding-right:12px}.dk-clock b{font-size:18px}.dk-clock em{display:none}.dk-track{margin-left:12px}}


/* ================================================================ price rules
   Base prices as a table, taxes and fees read as sentences, a builder that asks plain questions,
   and one real upcoming leg priced beside every screen so a rule is never edited blind. */
.pf.l-base,.pr-sec.l-base,.pr-dot.l-base,.pr-lines .l-base,.k-route,.k-base{--lc:var(--accent)}
.pf.l-tax,.pr-sec.l-tax,.pr-dot.l-tax,.pr-lines .l-tax,.k-tax{--lc:var(--soon)}
.pf.l-fee,.pr-sec.l-fee,.pr-dot.l-fee,.pr-lines .l-fee,.k-fee{--lc:var(--good)}

.pr-formula{display:flex;align-items:stretch;gap:10px;margin:0 0 18px;flex-wrap:wrap}
.pr-formula .pf{flex:1 1 170px;display:flex;flex-direction:column;gap:4px;padding:12px 16px;border-radius:14px;border:1px solid var(--line);background:var(--card-grad);text-decoration:none}
.pr-formula a.pf:hover{border-color:var(--line-strong);text-decoration:none}
.pr-formula .pf b{display:flex;align-items:center;gap:8px;color:var(--hi);font-size:14px}
.pr-formula .pf b::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--lc,var(--ink3))}
.pr-formula .pf span{font-size:12px;color:var(--ink3);line-height:1.35}
.pr-formula .pf.total{background:rgba(110,147,255,.08);border-color:rgba(110,147,255,.35)}
.pr-formula .pf.total b::before{background:var(--hi);border-radius:50%}
.pr-formula>i{align-self:center;font:600 22px var(--font-ui);font-style:normal;color:var(--ink4)}

.pr-layout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px;align-items:start}
.pr-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.pr-side{position:sticky;top:88px;min-width:0}
.pr-sec{border-radius:var(--r-lg);border:1px solid var(--line);background:var(--card-grad);box-shadow:var(--shadow);padding:18px 20px;scroll-margin-top:90px}
.pr-sec>header,.pr-group>header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:start;margin:0 0 14px}
.pr-sec>header h2{display:flex;align-items:center;gap:9px;margin:0;font:600 17px var(--font-ui);letter-spacing:0;text-transform:none;color:var(--hi)}
.pr-sec>header h2 i{width:11px;height:11px;border-radius:3px;background:var(--lc)}
.pr-sec>header p,.pr-group>header p{grid-column:1;margin:0;font-size:13px;line-height:1.45;color:var(--ink3);max-width:78ch}
.pr-sec>header .btn,.pr-group>header .btn{grid-column:2;grid-row:1 / span 2;align-self:center;white-space:nowrap}
.pr-problems{padding:12px 16px;border-radius:12px;border:1px solid rgba(242,102,94,.45);background:var(--bad-bg);color:var(--bad-ink);font-size:13px}
.pr-problems ul{margin:6px 0 0;padding-left:18px}.pr-problems li{margin-top:3px}

.pr-table-wrap{overflow-x:auto;border-radius:12px;border:1px solid var(--line)}
.pr-table{width:100%;border-collapse:collapse}
.pr-table th,.pr-table td{padding:10px 12px;border-bottom:1px solid var(--line-soft);text-align:left;vertical-align:middle}
.pr-table tr:last-child>*{border-bottom:0}
.pr-table thead th{font:700 12px var(--font-ui);letter-spacing:1px;text-transform:uppercase;color:var(--ink3);background:rgba(var(--fg),.025);white-space:nowrap}
.pr-table tbody th{width:130px;white-space:nowrap}
.pr-table tbody th small{display:block;margin-top:5px;font-size:12px;font-weight:500;color:var(--ink4)}
.pr-cell{display:flex;align-items:center;gap:6px;height:46px;padding:0 12px;border-radius:10px;border:1px solid var(--line-strong);background:var(--field);cursor:text;transition:border-color .15s,box-shadow .15s,background .15s;min-width:120px}
.pr-cell>span{font-weight:600;color:var(--ink3)}
.pr-cell input,.pr-cell input:focus,.pr-money input,.pr-money input:focus,.pr-cut input,.pr-cut input:focus{margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;outline:0}
.pr-cell input{flex:1;min-width:0;color:var(--hi);font:700 17px var(--font-ui);font-variant-numeric:tabular-nums}
.pr-cell:focus-within,.pr-money:focus-within,.pr-cut:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.pr-cell.empty{border-style:dashed;border-color:rgba(242,102,94,.5)}
.pr-cell.empty input::placeholder{color:var(--bad-ink);font-size:13px;font-weight:600}
.pr-cell.dirty{border-color:var(--warn);background:rgba(242,184,75,.08)}
.pr-table-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:12px}
.pr-dirty{margin-right:auto;font-size:13px;color:var(--warn)}

.pr-bands{margin-top:14px;border-radius:12px;border:1px solid var(--line);background:rgba(var(--fg),.02);scroll-margin-top:90px}
.pr-bands summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:10px;padding:12px 14px;font-size:13px;font-weight:600;color:var(--ink2)}
.pr-bands summary::-webkit-details-marker{display:none}
.pr-bands summary::before{content:"";width:7px;height:7px;border-right:1.6px solid var(--ink3);border-bottom:1.6px solid var(--ink3);transform:rotate(-45deg);align-self:center;transition:transform .15s}
.pr-bands[open] summary::before{transform:rotate(45deg)}
.pr-bands summary span{font:500 12px var(--mono);color:var(--ink4)}
.pr-bands form{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:0 14px 14px}
.pr-bands p{margin:0;font-size:13px;line-height:1.45;color:var(--ink3);max-width:78ch}
.pr-cuts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pr-cut0{font:600 13px var(--mono);color:var(--ink3);padding:0 4px}
.pr-cut{display:flex;align-items:center;gap:6px;height:40px;padding:0 10px;border-radius:9px;border:1px solid var(--line-strong);background:var(--field)}
.pr-cut input{width:64px;color:var(--hi);font:600 14px var(--mono)}
.pr-cut span{font-size:12px;color:var(--ink4)}
.pr-cut.add{border-style:dashed}

.pr-group{margin-top:20px;padding-top:16px;border-top:1px solid var(--line-soft);scroll-margin-top:90px}
.pr-group h3{margin:0;font:600 15px var(--font-ui);color:var(--hi)}
.pr-empty{margin:0;padding:12px 14px;border:1px dashed var(--line);border-radius:12px;color:var(--ink4);font-size:13px}
.pr-rule{display:grid;grid-template-columns:12px minmax(0,1fr) 140px 150px 30px;gap:14px;align-items:center;margin-top:8px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(var(--fg),.02);color:inherit;text-decoration:none;transition:border-color .15s,background .15s}
.pr-rule:first-of-type{margin-top:0}
.pr-rule:hover{border-color:var(--line-strong);background:rgba(var(--fg),.045);text-decoration:none}
.pr-rule.ended{opacity:.55}
.pr-dot{width:10px;height:10px;border-radius:3px;background:var(--lc)}
.pr-rule-main b{display:block;margin-bottom:3px;font-size:14px;color:var(--hi)}
.pr-rule-main>span{font-size:13px;line-height:1.4;color:var(--ink2)}
.pr-rule-amt{text-align:right}.pr-rule-amt b{display:block;font:700 18px var(--font-ui);color:var(--hi);font-variant-numeric:tabular-nums}.pr-rule-amt small{font-size:12px;color:var(--ink3)}
.pr-rule-when{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.pr-rule-when small{font-size:12px;color:var(--ink4)}

.pr-effect{display:flex;flex-direction:column;gap:12px}
.pr-words{padding:14px 16px;border-radius:14px;border:1px solid color-mix(in srgb,var(--lc) 45%,transparent);background:color-mix(in srgb,var(--lc) 9%,transparent)}
.pr-words span{font:700 12px var(--font-ui);letter-spacing:1.2px;text-transform:uppercase;color:var(--lc)}
.pr-words p{margin:6px 0 0;font-size:15px;line-height:1.45;color:var(--hi)}
.pr-err{margin:0;padding:10px 14px;border-radius:12px;border:1px solid rgba(242,102,94,.45);background:var(--bad-bg);color:var(--bad-ink);font-size:13px;line-height:1.4}
.pr-ex,.pr-changes{padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:var(--card-grad);box-shadow:var(--shadow)}
.pr-ex header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.pr-ex h3,.pr-changes h3{margin:0;font:700 12px var(--font-ui);letter-spacing:1.2px;text-transform:uppercase;color:var(--ink3)}
.pr-ex select.pr-leg{width:auto;max-width:250px;margin:0;padding:6px 9px;font-size:12px}
.pr-ex-leg{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 10px;font-size:12.5px;color:var(--ink3)}
.pr-ex-leg b{font-size:16px;color:var(--hi)}
.pr-lines{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.pr-lines li{display:grid;grid-template-columns:8px minmax(0,1fr) auto 58px;gap:10px;align-items:baseline;padding:7px 8px;border-radius:8px;font-size:13px}
.pr-lines li i{width:8px;height:8px;border-radius:2px;background:var(--lc);align-self:center}
.pr-lines li span{color:var(--ink2)}
.pr-lines li em{margin-left:6px;white-space:nowrap;font-style:normal;font-size:12px;font-weight:700;color:var(--accent-2)}
.pr-lines li b{color:var(--hi);text-align:right;font-variant-numeric:tabular-nums}
.pr-lines li small{font-size:12px;color:var(--ink4)}
.pr-lines li.mine{background:rgba(110,147,255,.12);box-shadow:inset 0 0 0 1px rgba(110,147,255,.45)}
.pr-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:6px;padding:10px 8px 0;border-top:1px solid var(--line);font-size:13px;color:var(--ink2)}
.pr-total b{font:700 20px var(--font-ui);color:var(--hi);font-variant-numeric:tabular-nums}.pr-total b small{font-size:12px;font-weight:600;color:var(--ink3)}
.pr-total.sub{margin-top:0;padding-top:4px;border-top:0}.pr-total.sub b{font-size:14px;color:var(--ink2)}
.pr-note{margin:10px 0 0;font-size:12.5px;line-height:1.4;color:var(--ink3)}
.pr-changes ol{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:40vh;overflow:auto}
.pr-changes li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 10px;padding:8px 10px;border-radius:10px;border:1px solid var(--line-soft);background:rgba(var(--fg),.03)}
.pc-leg b{display:block;font-size:13px;color:var(--hi)}.pc-leg small{font-size:12px;color:var(--ink4)}
.pc-price{display:flex;align-items:center;gap:6px}
.pc-price em{font:600 13px var(--mono);font-style:normal;color:var(--ink3)}.pc-price em.new{color:var(--hi)}.pc-price em.bad{color:var(--bad-ink)}
.pc-price .arr{width:12px;height:1.5px;background:var(--ink4)}
.pc-why{flex-basis:100%;font-size:12px;color:var(--bad-ink)}

.pr-builder{padding:22px 24px}
.pr-b-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px}.pr-b-head h1{margin:0}
.pr-b-head .who{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink4)}
.pr-kinds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 4px}
.pr-kind{position:relative;display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-strong);background:rgba(var(--fg),.02);cursor:pointer;transition:border-color .15s,background .15s}
.pr-kind input{position:absolute;opacity:0;pointer-events:none}
.pr-kind b{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--hi)}.pr-kind b::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--lc)}
.pr-kind small{font-size:12px;color:var(--ink3)}
.pr-kind:has(input:checked){border-color:var(--lc);background:color-mix(in srgb,var(--lc) 12%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--lc) 20%,transparent)}
.pr-kind:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.pr-step{display:grid;grid-template-columns:30px minmax(0,1fr);gap:14px;padding:18px 0;border-top:1px solid var(--line-soft)}
.pr-step .n{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:700 13px var(--font-ui);color:var(--accent-2);background:rgba(110,147,255,.14);border:1px solid rgba(110,147,255,.35)}
.pr-step h2{margin:3px 0 10px;font:600 16px var(--font-ui);letter-spacing:0;text-transform:none;color:var(--hi)}
.pr-step .hint{margin:8px 0 0;line-height:1.45;max-width:70ch}
.pr-amount{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pr-money{display:flex;align-items:center;gap:8px;width:220px;height:52px;padding:0 16px;border-radius:12px;border:1px solid var(--line-strong);background:var(--field)}
.pr-money>span{font:600 20px var(--font-ui);color:var(--ink3)}
.pr-money input{flex:1;min-width:0;color:var(--hi);font:700 24px var(--font-ui);font-variant-numeric:tabular-nums}
.pr-fixed{font-size:14px;font-weight:600;color:var(--ink2)}
.pr-route{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.pr-route label,.pr-when>label{display:flex;flex-direction:column;gap:2px}
.pr-route label span,.pr-when>label span{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--ink3)}
.pr-route input{width:190px;font:700 19px var(--mono);letter-spacing:1px;text-transform:uppercase}
.pr-route i{padding-bottom:10px;font-style:normal;font-size:22px;color:var(--ink4)}
.pr-conds{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.pr-cond{border-radius:12px;border:1px solid var(--line);background:rgba(var(--fg),.02);transition:border-color .15s,background .15s}
.pr-cond:has(.pr-cond-q input:checked){border-color:rgba(110,147,255,.45);background:rgba(110,147,255,.06)}
.pr-cond-q{display:flex;align-items:center;gap:10px;padding:11px 14px;cursor:pointer;font-size:14px;font-weight:600;color:var(--ink2)}
.pr-cond-q input{width:18px;height:18px}
.pr-cond:has(.pr-cond-q input:checked) .pr-cond-q{color:var(--hi)}
.pr-cond-a{padding:0 14px 12px 42px}
.pr-cond:not(:has(.pr-cond-q input:checked)) .pr-cond-a{display:none}
.pr-cond-a>select,.pr-cond-a>input{width:min(320px,100%);margin:0}
.pr-chips{display:flex;flex-wrap:wrap;gap:8px}
.pr-chip{position:relative;cursor:pointer}.pr-chip input{position:absolute;opacity:0;pointer-events:none}
.pr-chip .cchip{padding:7px 14px;font-size:13px;border:1px solid transparent;opacity:.6;transition:opacity .15s}
.pr-chip:hover .cchip{opacity:.85}
.pr-chip input:checked+.cchip{opacity:1;border-color:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 22%,transparent)}
.pr-chip input:focus-visible+.cchip{outline:2px solid var(--accent);outline-offset:2px}
.pr-dist{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--ink3)}.pr-dist input{width:90px;margin:0}
.pr-name{width:min(460px,100%);margin:0}
.pr-when{display:flex;align-items:flex-end;gap:28px;flex-wrap:wrap}
.pr-when input[type=date]{width:180px}
.pr-ends{display:flex;flex-direction:column;gap:6px}
.pr-radio{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink2);cursor:pointer}
.pr-radio input[type=radio]{width:16px;height:16px;margin:0;accent-color:var(--accent)}
.pr-radio input[type=date]{margin:0}
.pr-ends .pr-radio:not(:has(input[type=radio]:checked)) input[type=date]{opacity:.4}
.pr-b-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:16px;border-top:1px solid var(--line-soft)}
.pr-b-actions .dgr{margin-left:auto}
.pr-confirm{margin:0 0 14px;padding:16px 20px;border-color:rgba(242,102,94,.5)}
.pr-confirm h2{margin:0 0 6px;font:600 16px var(--font-ui);letter-spacing:0;text-transform:none;color:var(--hi)}
.pr-confirm p{margin:0;font-size:13px;color:var(--ink2)}.pr-confirm form{display:flex;gap:8px;margin-top:12px}

@media (max-width:1150px){.pr-layout{grid-template-columns:minmax(0,1fr)}.pr-side{position:static}}
@media (max-width:760px){
  .pr-formula{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pr-formula>i{display:none}.pr-kinds{grid-template-columns:1fr}
  .pr-rule{grid-template-columns:12px minmax(0,1fr) auto}.pr-rule-when,.pr-rule-who{display:none}
  .pr-sec>header,.pr-group>header{grid-template-columns:1fr}.pr-sec>header .btn,.pr-group>header .btn{grid-column:1;grid-row:auto;justify-self:start}
  .pr-builder{padding:18px 16px}.pr-cond-a{padding-left:14px}}

/* the light/dark switch: one panel lighting switch, day to night. A recessed track with the sun at
   one end and the moon at the other; the knob slides across carrying the one in use, glowing amber
   by day and blue by night, with a few stars in the track at night. */
.dk-theme{display:flex;flex:none;padding:4px;border-radius:11px;background:#05070D;
  box-shadow:0 2px 7px rgba(0,0,0,.85) inset,0 0 0 1px rgba(255,255,255,.045),0 1px 0 rgba(255,255,255,.05)}
.dk-switch{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100px;height:56px;box-sizing:border-box;padding:0;border-radius:8px;cursor:pointer;
  background:linear-gradient(180deg,#1F2744 0%,#161C32 58%,#12182B 100%);border:1px solid rgba(255,255,255,.06);border-top-color:rgba(255,255,255,.13);
  box-shadow:0 1px 0 rgba(255,255,255,.07) inset,0 -2px 0 rgba(0,0,0,.28) inset,0 3px 0 #03050B,0 5px 10px -2px rgba(0,0,0,.65);font:inherit}
.dk-switch:focus-visible{outline:2px solid #6E93FF;outline-offset:2px}
.sw-track{position:relative;display:block;width:72px;height:26px;border-radius:13px;background:#05070D;overflow:hidden;
  box-shadow:0 2px 5px rgba(0,0,0,.9) inset,0 0 0 1px rgba(255,255,255,.06),0 1px 0 rgba(255,255,255,.06);transition:background .35s}
.sw-end{position:absolute;top:6px;width:14px;height:14px;fill:none;stroke:#46506E;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:opacity .3s}
.sw-end.sun{left:7px}.sw-end.moon{right:7px}
.sw-stars{position:absolute;inset:0;opacity:0;transition:opacity .4s;
  background:radial-gradient(1px 1px at 18px 8px,#C9D6FF,transparent),radial-gradient(1px 1px at 30px 17px,#9DB6FF,transparent),radial-gradient(1.2px 1.2px at 42px 7px,#E2E9FF,transparent),radial-gradient(1px 1px at 12px 18px,#9DB6FF,transparent)}
.sw-knob{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  transition:transform .45s cubic-bezier(.3,1.35,.5,1),background .35s,box-shadow .35s}
.sw-knob svg{position:absolute;width:13px;height:13px;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:opacity .25s,transform .45s}
.sw-caps{display:flex;gap:10px;font:800 9.5px/1 var(--font-ui);letter-spacing:.14em;text-transform:uppercase}
.sw-caps b{font-weight:800;color:#56607E;transition:color .3s,text-shadow .3s}
/* night (the default) */
.dk-switch .sw-track{background:linear-gradient(90deg,#05070D 30%,#0C1633)}
.dk-switch .sw-stars{opacity:1}
.dk-switch .sw-end.moon{opacity:0}
.dk-switch .sw-knob{transform:translateX(46px);background:radial-gradient(circle at 34% 30%,#E4EBFF 0%,#9DB6FF 45%,#4F6FE0 100%);
  box-shadow:0 0 0 1px rgba(10,16,40,.5),0 0 12px rgba(110,147,255,.75),0 2px 4px rgba(0,0,0,.6)}
.dk-switch .sw-knob .moon{stroke:#18244F;fill:#18244F;opacity:1}
.dk-switch .sw-knob .sun{stroke:#7A4A00;opacity:0;transform:rotate(-90deg)}
.dk-switch .sw-caps .d{color:#B5C8FF;text-shadow:0 0 8px rgba(110,147,255,.6)}
/* day */
[data-theme=light] .dk-switch .sw-track{background:linear-gradient(90deg,#2A2310,#05070D 70%)}
[data-theme=light] .dk-switch .sw-stars{opacity:0}
[data-theme=light] .dk-switch .sw-end.moon{opacity:1}
[data-theme=light] .dk-switch .sw-end.sun{opacity:0}
[data-theme=light] .dk-switch .sw-knob{transform:translateX(0);background:radial-gradient(circle at 34% 30%,#FFF4CC 0%,#F6C454 50%,#D08A12 100%);
  box-shadow:0 0 0 1px rgba(60,40,0,.5),0 0 12px rgba(246,196,84,.8),0 2px 4px rgba(0,0,0,.6)}
[data-theme=light] .dk-switch .sw-knob .sun{opacity:1;transform:rotate(0)}
[data-theme=light] .dk-switch .sw-knob .moon{opacity:0}
[data-theme=light] .dk-switch .sw-caps .d{color:#56607E;text-shadow:none}
[data-theme=light] .dk-switch .sw-caps .l{color:#F6C454;text-shadow:0 0 8px rgba(246,196,84,.55)}
.dk-switch:hover .sw-caps b{color:#8C97B6}
.dk-switch:hover .sw-caps .d,[data-theme=light] .dk-switch:hover .sw-caps .l{color:#FFFFFF}
[data-theme=light] .dk-switch:hover .sw-caps .d{color:#8C97B6}
@media (prefers-reduced-motion:reduce){.sw-knob,.sw-knob svg,.sw-track,.sw-stars{transition:none}}
/* laptops: the switch without room to spare. After the rules above, which would otherwise win */
@media (max-width:1480px){.dk-switch{width:84px}.sw-track{width:64px}.dk-switch .sw-knob{transform:translateX(38px)}}
@media (max-width:560px){.deck{gap:10px}.dk-switch{width:84px;height:44px;gap:0}.sw-caps{display:none}.ann{width:50px;min-width:50px;height:48px}}

/* ================================================================ broker offers (early access)
   Composer on the left, the email exactly as brokers get it on the right. */
.of-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:4px 0 16px;flex-wrap:wrap}
.of-head h1{display:flex;align-items:center;gap:12px;margin:4px 0 6px}
.of-head .lede{margin:0}
.of-head-actions{display:flex;gap:8px}
.of-head-actions .btn b{margin-left:4px;color:var(--ink3)}
.of-early{font:700 12px/1 var(--font-ui);letter-spacing:.8px;text-transform:uppercase;padding:5px 8px;border-radius:7px;color:var(--warn);background:var(--warn-bg);border:1px dashed color-mix(in srgb,var(--warn) 55%,transparent)}
.of-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,660px);gap:16px;align-items:start}
.of-layout.brokers{grid-template-columns:minmax(0,1fr) 400px}
.of-form,.of-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.of-step{padding:16px 18px}
.of-step h2{display:flex;align-items:center;gap:10px;margin:0 0 12px;font:600 16px var(--font-ui);letter-spacing:0;text-transform:none;color:var(--hi)}
.of-step h2 small{font-size:12px;font-weight:500;color:var(--ink3)}
.of-step h2 .n{width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:13px;color:var(--accent-2);background:rgba(110,147,255,.14);border:1px solid rgba(110,147,255,.35)}
.of-step label{display:block;margin-top:10px;font-size:13px;font-weight:600;color:var(--ink2)}
.of-step label small{font-weight:500;color:var(--ink4);margin-left:6px}
.of-manage{margin-left:auto;font-size:13px;font-weight:600}
.of-mode{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;font-size:13px;color:var(--ink3)}
.of-legs,.of-brokers,.of-sent{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.of-leg{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:11px;border:1px solid var(--line);background:rgba(var(--fg),.02);transition:border-color .15s,background .15s}
.of-leg.on{border-color:rgba(110,147,255,.5);background:rgba(110,147,255,.07)}
.of-leg label{margin:0}
.of-pick{flex:1;display:flex !important;align-items:center;gap:12px;cursor:pointer;min-width:0}
.of-pick input,.of-brokers input{width:18px;height:18px;margin:0;flex:none}
.of-leg-when{display:flex;flex-direction:column;gap:2px;width:120px;flex:none}
.of-leg-when b{font:600 13px var(--mono);color:var(--hi)}.of-leg-when small{font-size:12px;color:var(--ink4);font-weight:500}
.of-leg-route{display:flex;flex-direction:column;gap:3px;min-width:0}
.of-leg-route b{font-size:16px;color:var(--hi);letter-spacing:.3px}.of-leg-route b i{font-style:normal;color:var(--accent)}
.of-leg-route small{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--ink3)}
.of-price{display:flex !important;align-items:center;gap:6px;width:150px;flex:none;height:40px;padding:0 10px;border-radius:9px;border:1px solid var(--line-strong);background:var(--field)}
.of-price span{color:var(--ink3);font-weight:600}
.of-price input,.of-price input:focus{margin:0;padding:0;border:0;background:none;box-shadow:none;outline:0;color:var(--hi);font:700 15px var(--font-ui);font-variant-numeric:tabular-nums}
.of-price input::placeholder{color:var(--ink4);font-weight:600}
.of-price:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.of-leg:not(.on) .of-price{opacity:.45}
.of-mode-request .of-price{visibility:hidden}
.of-bk-tools{display:flex;gap:8px;margin-bottom:8px}.of-bk-tools input{margin:0}
.of-brokers{max-height:320px;overflow:auto}
.of-brokers label,.of-sent li{display:flex !important;align-items:center;gap:10px;margin:0;padding:8px 10px;border-radius:10px;border:1px solid var(--line-soft);cursor:pointer}
.of-sent li{cursor:default}
.of-sent li.off{opacity:.55}
.of-brokers label:has(input:checked){border-color:rgba(110,147,255,.5);background:rgba(110,147,255,.07)}
.of-bk{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.of-bk b{font-size:14px;color:var(--hi)}.of-bk small{font-size:12px;font-weight:500;color:var(--ink3);overflow:hidden;text-overflow:ellipsis}
.of-note{font-style:italic}.of-err{color:var(--bad-ink) !important}
.of-st.sent{color:var(--good);background:var(--good-bg)}.of-st.saved{color:var(--accent-2);background:rgba(110,147,255,.14)}
.of-st.failed{color:var(--bad-ink);background:var(--bad-bg)}.of-st.test{color:var(--warn);background:var(--warn-bg)}
.of-none{margin:0;padding:12px 14px;border:1px dashed var(--line);border-radius:10px;color:var(--ink3);font-size:13px}
.of-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 2px}
.of-actions .hint{flex-basis:100%;margin:0}
.of-send b{margin:0 1px}
.of-preview{position:sticky;top:88px;padding:0;overflow:hidden}
.of-preview header{display:flex;align-items:baseline;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line)}
.of-preview header b{color:var(--hi);font-size:14px}.of-preview header small{color:var(--ink3);font-size:12px}
.of-frame{display:block;width:100%;height:calc(100vh - 150px);min-height:560px;border:0;background:#EFECE5}
.of-list{padding:6px}
.of-row{display:grid;grid-template-columns:150px minmax(0,1fr) 170px 40px;gap:14px;align-items:center;padding:12px 14px;border-radius:11px;color:inherit;text-decoration:none}
.of-row:hover{background:rgba(var(--fg),.04);text-decoration:none}
.of-row+.of-row{border-top:1px solid var(--line-soft)}
.of-when{font-size:12.5px;color:var(--ink3)}
.of-subj{display:flex;flex-direction:column;gap:3px;min-width:0}.of-subj b{color:var(--hi);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.of-subj small{font-size:12px;color:var(--ink3)}
.of-to{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink2)}
.of-empty{padding:28px;text-align:center}.of-empty h2{margin-bottom:8px}.of-empty p{margin:0;color:var(--ink3)}
.acct-early{margin:14px 0 0;padding:12px 14px;border:1px dashed color-mix(in srgb,var(--warn) 45%,transparent);border-radius:12px}
.acct-early legend{padding:0 6px;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--warn)}
.acct-early legend small{text-transform:none;letter-spacing:0;font-weight:500;color:var(--ink3);margin-left:6px}
.acct-early label small{display:block;margin:2px 0 0 26px;font-size:12px;color:var(--ink3)}
@media (max-width:1180px){.of-layout,.of-layout.brokers{grid-template-columns:minmax(0,1fr)}.of-preview{position:static}.of-frame{height:720px}}
@media (max-width:640px){.of-leg{flex-wrap:wrap}.of-price{width:100%}.of-leg-when{width:auto}.of-row{grid-template-columns:minmax(0,1fr) auto}.of-when,.of-by{display:none}}

/* ---------------------------------------------------------------- cabin seat picker (leg card) and seat dots (list) */
.cabinf .fl i{font-style:normal;font-weight:500;color:var(--ink3);margin-left:6px}
.cabin-wrap{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:6px}
.cabin{position:relative;flex:none}
.cabin-img{position:absolute;left:0;display:block;transform:rotate(-90deg);transform-origin:top left;pointer-events:none;border-radius:4px}
/* Seat markers as cabin mood lighting: a seat on offer glows emerald through its cushion under a fine
   rim, its number on a glass medallion set in the middle of the seat; a seat held back goes grey
   under fine hatching, its medallion slate. */
.cseat{position:absolute;box-sizing:border-box;padding:0;cursor:pointer;border-radius:30% / 26%;
  background:radial-gradient(75% 70% at 50% 50%,rgba(52,211,153,.26),rgba(52,211,153,.07) 72%);
  border:1.5px solid rgba(110,231,183,.95);
  box-shadow:0 0 0 1px rgba(4,40,28,.35),0 0 18px 2px rgba(52,211,153,.42),inset 0 0 18px rgba(52,211,153,.32),inset 0 1px 0 rgba(255,255,255,.25);
  transition:background .2s,box-shadow .2s,border-color .2s}
.cseat b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:28px;height:28px;box-sizing:border-box;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font:800 12px/1 var(--font-ui);letter-spacing:0;color:#FFFFFF;
  background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.28),rgba(255,255,255,0) 42%),radial-gradient(circle,#0E3B2C 0%,#07231A 100%);
  border:1.5px solid #6EE7B7;box-shadow:0 0 0 3px rgba(4,30,22,.35),0 0 14px rgba(52,211,153,.65),0 4px 10px rgba(0,0,0,.45);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);transition:transform .2s cubic-bezier(.3,1.4,.5,1),background .2s,border-color .2s,box-shadow .2s}
.cseat:hover{background:radial-gradient(75% 70% at 50% 50%,rgba(52,211,153,.38),rgba(52,211,153,.12) 72%);
  box-shadow:0 0 0 1px rgba(4,40,28,.35),0 0 26px 4px rgba(52,211,153,.6),inset 0 0 22px rgba(52,211,153,.45),inset 0 1px 0 rgba(255,255,255,.3)}
.cseat:hover b{transform:translate(-50%,-50%) scale(1.1)}
.cseat:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.cseat.held{border:1.5px dashed rgba(203,211,230,.55);box-shadow:none;
  background:repeating-linear-gradient(135deg,rgba(9,13,26,.5) 0 5px,rgba(9,13,26,.28) 5px 10px);
  -webkit-backdrop-filter:grayscale(1) brightness(.7);backdrop-filter:grayscale(1) brightness(.7)}
.cseat.held b{color:rgba(226,231,242,.8);border-color:rgba(203,211,230,.6);
  background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.18),rgba(255,255,255,0) 42%),radial-gradient(circle,#343B55 0%,#232840 100%);
  box-shadow:0 0 0 3px rgba(9,13,26,.3),0 3px 8px rgba(0,0,0,.4)}
.cseat.held:hover{border-color:rgba(203,211,230,.9);background:repeating-linear-gradient(135deg,rgba(9,13,26,.36) 0 5px,rgba(9,13,26,.18) 5px 10px)}
.cabin-side{display:flex;flex-direction:column;gap:10px;min-width:170px}
.cabin-side p{margin:0;font-size:13px;color:var(--ink2)}
.cabin-side .cabin-n{font:700 26px/1 var(--font-ui);color:var(--hi);margin-right:4px}
.cabin-quick{display:flex;gap:6px}
.cabin-legend{display:flex;align-items:center;gap:6px;font-size:12px !important;color:var(--ink3) !important}
.cabin-legend .k{width:16px;height:12px;border-radius:4px;display:inline-block;box-sizing:border-box}.cabin-legend .k.on{background:rgba(52,211,153,.25);border:1.5px solid #6EE7B7;box-shadow:0 0 8px rgba(52,211,153,.6)}
.cabin-legend .k.off{background:repeating-linear-gradient(135deg,rgba(120,128,150,.5) 0 3px,rgba(120,128,150,.2) 3px 6px);border:1.5px dashed var(--ink3);margin-left:8px}
.sdots{display:flex;gap:2px;margin-bottom:3px}
.sdots i{width:6px;height:6px;border-radius:50%;box-sizing:border-box;border:1.3px solid var(--line-strong)}
.sdots i.on{background:var(--accent);border-color:var(--accent)}
.lr-seats b small{font:500 12px var(--font-ui);color:var(--ink3)}
.fields .field.cabinf{grid-column:1 / -1;order:9;padding-top:4px;border-top:1px solid var(--line-soft)}

/* ---------------------------------------------------------------- route map in the leg card's flight band
   The track over the land around it (elp.domain.routemap), fetched when the card opens and framed
   by splash.js inside --map-pad, the room kept clear for what is laid over it. */
:root{
  --map-sea:#091230; --map-land:#1C2B55; --map-coast:rgba(157,182,255,.5); --map-border:rgba(157,182,255,.22);
  --map-track:#9DB6FF; --map-glow:rgba(110,147,255,.45); --map-code:#FFFFFF; --map-halo:rgba(10,19,48,.9)}
html[data-theme=light]{
  --map-sea:#C9DAF0; --map-land:#FBFCFE; --map-coast:rgba(31,63,140,.4); --map-border:rgba(31,63,140,.2);
  --map-track:#2F4FD8; --map-glow:rgba(47,79,216,.22); --map-code:#10142E; --map-halo:rgba(247,249,253,.95)}
.rmap{position:absolute;inset:0;background:var(--map-sea);--map-pad:40px 80px 40px 520px}
.rmap svg{display:block;width:100%;height:100%}
.rmap[data-state=loading]{background:linear-gradient(100deg,transparent 30%,rgba(var(--fg),.05) 50%,transparent 70%) 0 0/200% 100%;animation:rm-wait 1.2s linear infinite}
@keyframes rm-wait{to{background-position:-200% 0}}
.rm-land{fill:var(--map-land)}
.rm-coast{fill:none;stroke:var(--map-coast);stroke-width:.8;stroke-linejoin:round}
.rm-border{fill:none;stroke:var(--map-border);stroke-width:.7;stroke-dasharray:3 2}
.rm-glow{fill:none;stroke:var(--map-glow);stroke-width:7;stroke-linecap:round}
.rm-track{fill:none;stroke:var(--map-track);stroke-width:2.2;stroke-linecap:round}
.rm-apt{fill:none;stroke:var(--map-track);stroke-width:11;stroke-linecap:round}
.rm-apt.hole{stroke:var(--map-sea);stroke-width:5}          /* departure an open ring, arrival a solid dot */
.rm-plane{fill:var(--map-track);filter:drop-shadow(0 0 3px var(--map-glow))}
.rm-trail{fill:none;stroke:var(--map-track);stroke-linecap:round;opacity:0;filter:brightness(1.35) drop-shadow(0 0 4px var(--map-track))}   /* the flight's wake, set by splash.js */
.rm-code{display:none}                            /* set as .rm-tag over the map instead */
/* the airport codes as a split-flap departures board: letters on flap tiles split across the middle,
   a small amber DEP or ARR beside them; the board stays dark in both themes, as a real one would */
.rm-tag{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:3px;padding:4px;border-radius:7px;white-space:nowrap;pointer-events:none;
  background:linear-gradient(180deg,#15171D,#0B0C10);border:1px solid rgba(255,255,255,.1);
  box-shadow:0 10px 22px -8px rgba(0,0,0,.8),0 0 0 1px rgba(0,0,0,.5),0 1px 0 rgba(255,255,255,.07) inset}
.rm-tag i{align-self:stretch;display:flex;align-items:center;padding:0 5px 0 4px;margin-right:1px;font:800 9px/1 var(--font-ui);letter-spacing:.14em;font-style:normal;
  color:#FFB938;text-shadow:0 0 6px rgba(255,185,56,.45);font-size:10px}
.rm-tag .sf{--sf-w:22px;--sf-h:30px;--sf-fs:18px;--sf-gap:3px}

/* ================================================================ leg card: the flight band
   Design A of the "Leg card redesign" canvas, chosen 2026-09-25. With the tail pictures gone the
   registration carries the aircraft: written large on the route map across the top of the card, the
   type's colour under it. Below, the route and the price, then the cabin with the offer beside it. */
/* a price: the whole number large, the cents small and lighter, the currency a small label (_price.html) */
.pv{display:inline-flex;align-items:baseline;gap:1px;font-variant-numeric:tabular-nums;white-space:nowrap}
.pv b{font:700 1em/1 var(--font-ui);color:var(--hi);letter-spacing:-.01em}
.pv .pv-c{font-weight:600;color:var(--ink3)}
.pv .pv-cur{margin-left:5px;font:700 .5em/1 var(--font-ui);letter-spacing:.12em;color:var(--ink3)}
.plate{display:inline-flex;align-items:baseline;font:800 16px/1 var(--font-ui);letter-spacing:.04em;color:var(--hi);white-space:nowrap}
.plate i{font-style:normal;color:var(--ink4)}
.lr-tail{gap:8px}
.lr-tail > .plate{flex-direction:row;gap:0;padding:6px 9px 5px;border-radius:8px;font-size:17px;background:rgba(var(--well),.7);
  border:1px solid color-mix(in srgb,var(--type,var(--accent-2)) 50%,transparent)}
.lr-tail .tpill{align-self:center}
@media (min-width:1301px){.lr{grid-template-columns:170px minmax(150px,1.3fr) 118px 96px 80px 78px 120px minmax(110px,1fr) 18px}}
@media (max-width:1300px) and (min-width:1101px){.lr{grid-template-columns:160px minmax(140px,1.3fr) 110px 90px 64px 110px minmax(90px,1fr) 18px}}
@media (max-width:1100px) and (min-width:761px){.lr{grid-template-columns:150px minmax(130px,1fr) 104px 88px 104px 18px}}

.ltable form.leg{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden}
.fb-band{position:relative;height:250px;overflow:hidden;border-bottom:1px solid var(--line);
  background:radial-gradient(120% 120% at 80% 100%,rgba(110,147,255,.16),transparent 60%),rgba(var(--well),.35)}
.fb-band.with-map{background:var(--map-sea)}
.fb-band::after{content:"";position:absolute;inset:0 auto 0 0;z-index:0;width:540px;max-width:70%;pointer-events:none;   /* just past the name: the map beyond stays clear */
  background:linear-gradient(90deg,var(--surface-2) 0%,color-mix(in srgb,var(--surface-2) 90%,transparent) 58%,transparent 100%)}
.fb-tail{position:absolute;right:6%;bottom:-18%;height:130%;width:auto;filter:drop-shadow(0 22px 30px rgba(0,0,0,.6))}
.fb-id{position:absolute;left:32px;top:26px;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:10px;max-width:calc(100% - 64px)}
.fb-k{font:700 11px var(--font-ui);letter-spacing:.18em;text-transform:uppercase;color:var(--ink3)}
.plate.big{font-size:72px;line-height:.9;letter-spacing:.02em}
.fb-stripe{width:230px;max-width:100%;height:4px;border-radius:2px;background:var(--type,var(--accent))}
.fb-chips{display:flex;gap:8px;flex-wrap:wrap;padding-top:2px}
.fb-chip{padding:5px 10px;border-radius:8px;background:rgba(var(--well),.72);border:1px solid rgba(var(--fg),.14);font:600 13px var(--font-ui);color:var(--ink2)}
.fb-chip.type{color:var(--type,var(--accent-2));border-color:color-mix(in srgb,var(--type,var(--accent-2)) 50%,transparent);font-weight:800;letter-spacing:.1em}
.fb-chip.strong{color:var(--hi);font-weight:700;letter-spacing:.06em}
.fb-order{font-size:12px;color:var(--ink3)}
.fb-band .state-tag{z-index:2}
.ltable form.leg::before{z-index:3;width:5px}       /* the state stripe runs down the map band too, as wide as the row's above it */

.fb-route{display:grid;grid-template-columns:minmax(0,1fr) 300px;align-items:center;gap:24px;padding:20px 32px;border-bottom:1px solid var(--line-soft)}
.fb-route > *,.fb-main > *,.ltable form.leg > *{grid-area:auto}   /* the old card's named areas mean nothing here */
.fb-route .leg-route{padding:0}
html[data-theme=light] .leg-route .path .plane{fill:var(--accent);filter:none}
.fb-route .leg-route .apt b{font-size:40px}
.fb-route .leg-route .apt em{font-size:15px}
.fb-route .leg-price{padding:0 0 0 24px;border-left:1px solid var(--line);align-self:stretch;justify-content:center}
.fb-route .leg-price .amount .pv-n{font-size:40px}.fb-route .leg-price .amount .pv-c{font-size:20px}

.fb-main{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;padding:22px 32px 18px;align-items:start}
.fb-main.has-cabin{grid-template-columns:minmax(0,1fr) 380px}
.fb-cabin{display:flex;flex-direction:column;gap:14px;min-width:0}
.fb-cabin .cabin{position:relative;width:100%;max-width:840px}
.fb-cabin .cabin-img{position:static;display:block;width:100%;height:auto;transform:none}
.fb-cabin .cseat b{width:30px;height:30px;font-size:13px}
.fb-cabin .cabin-side{flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px 20px;min-width:0}
.fb-cabin .cabin-side .cabin-n{font-size:30px}
.fb-main .leg-edit{align-self:start;min-width:0}
.fb-main.has-cabin .fields{grid-template-columns:1fr}
.fb-main.has-cabin .fields .field.wide{grid-column:auto}
.ltable form.leg > .extras{margin:0 32px;padding:12px 0 4px;border-top:1px solid var(--line-soft)}
.ltable form.leg > .leg-actions{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 16px;padding:14px 32px 20px}
.ltable form.leg > .leg-actions .switch{margin-right:auto}
.ltable form.leg > .leg-actions .btns{display:flex;flex-wrap:wrap;width:auto;max-width:none;justify-content:flex-end}
.ltable form.leg > .leg-breakdown,.ltable form.leg > .leg-history{margin:0 32px 24px}

@media (max-width:1180px){
  .fb-main.has-cabin{grid-template-columns:1fr}
  .fb-main.has-cabin .fields{grid-template-columns:1fr 1fr}
  .fb-route{grid-template-columns:1fr}
  .fb-route .leg-price{border-left:0;padding:14px 0 0;border-top:1px solid var(--line-soft);flex-direction:row;align-items:baseline;justify-content:flex-start;text-align:left;gap:12px;flex-wrap:wrap}
  .fb-band .rmap{--map-pad:36px 48px 36px 400px}
  .fb-band::after{width:420px}
  .fb-band .plate.big{font-size:56px}
}
@media (max-width:860px){
  .fb-band{height:320px}
  .fb-band .rmap{--map-pad:170px 24px 20px 24px}
  .fb-band::after{width:100%;max-width:none;background:linear-gradient(180deg,var(--surface-2) 0%,color-mix(in srgb,var(--surface-2) 85%,transparent) 36%,transparent 58%)}
  .fb-id{left:18px;top:18px;gap:8px}
  .plate.big{font-size:52px}
  .fb-route,.fb-main{padding-left:16px;padding-right:16px}
  .fb-route .leg-route .apt b{font-size:30px}
  .fb-main.has-cabin .fields{grid-template-columns:1fr}
  .ltable form.leg > .extras,.ltable form.leg > .leg-breakdown,.ltable form.leg > .leg-history{margin-left:16px;margin-right:16px}
  .ltable form.leg > .leg-actions{padding:12px 16px 18px}
}

/* the airport names, as prominent as the codes: under the codes in the list row, and set large in
   the card's route line with the ICAO code as a small tag beside the time */
.lr-route{flex-direction:column;align-items:flex-start;justify-content:center;gap:4px}
.lr-codes{display:flex;align-items:center;gap:8px}
.lr-names{max-width:100%;font:600 12.5px/1.2 var(--font-ui);color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lr-names i{font-style:normal;font-weight:500;color:var(--ink4);margin:0 2px}
.fb-route .leg-route .apt{grid-template-areas:"flag code" "flag nm" "flag sub" "flag time";row-gap:3px}
.fb-route .leg-route .apt.arr{grid-template-areas:"code flag" "nm flag" "sub flag" "time flag"}
.fb-route .leg-route .apt .nm{grid-area:nm;font:600 17px/1.25 var(--font-ui);color:var(--hi);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}
.fb-route .leg-route .apt small{justify-self:start;font:500 11px/1 var(--mono);letter-spacing:.06em;color:var(--ink3);padding:3px 6px;border-radius:5px;background:rgba(var(--fg),.06);margin:2px 0 4px}
.fb-route .leg-route .apt.arr small{justify-self:end}
@media (max-width:860px){.fb-route .leg-route .apt .nm{font-size:15px;max-width:200px}}

/* ================================================================ split-flap boards
   A departures board's letters: one tile each, split across the middle, warm-white letters on
   near-black; the board stays dark in both themes, as a real one would. Sized by --sf-w, --sf-h,
   --sf-fs and --sf-gap; splash.js flips them (window.splitFlap). */
.sf{display:inline-flex;align-items:center;flex-wrap:wrap;gap:var(--sf-gap,2px);vertical-align:middle}
.sf .sf-t{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:var(--sf-w,19px);height:var(--sf-h,26px);
  border-radius:calc(var(--sf-h,26px) * .12);overflow:hidden;background:linear-gradient(180deg,#2A2D35 0%,#1E2027 49.5%,#141519 50.5%,#0F1013 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 -1px 0 rgba(0,0,0,.6) inset,0 1px 2px rgba(0,0,0,.6)}
.sf .sf-t::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;margin-top:-.5px;background:rgba(0,0,0,.85);box-shadow:0 1px 0 rgba(255,255,255,.05)}
.sf .sf-t > span{font:700 var(--sf-fs,16px)/1 var(--font-ui);letter-spacing:0;color:#F3EEDF;text-shadow:0 1px 0 rgba(0,0,0,.6);transform-origin:50% 50%}
.sf .sf-t.acc > span{color:#9DB6FF}
.sf .sf-t.gap{width:calc(var(--sf-w,19px) * .45);background:none;box-shadow:none}.sf .sf-t.gap::after{display:none}
.sf .sf-t.tick > span{animation:sf-flap .065s linear}
/* the upper flap falls over the new letter, as on a mechanical board */
.sf .sf-t::before{content:"";position:absolute;left:0;right:0;top:0;height:50%;z-index:1;pointer-events:none;opacity:0;
  background:linear-gradient(180deg,#30333C,#1E2027);transform-origin:50% 100%}
.sf .sf-t.tick::before{animation:sf-fall .065s linear}
@keyframes sf-fall{0%{opacity:1;transform:perspective(60px) rotateX(0);filter:brightness(1.15)}100%{opacity:1;transform:perspective(60px) rotateX(-90deg);filter:brightness(.45)}}
@keyframes sf-flap{0%{transform:perspective(70px) rotateX(0);filter:brightness(1)}50%{transform:perspective(70px) rotateX(-72deg);filter:brightness(.55)}100%{transform:perspective(70px) rotateX(0);filter:brightness(1)}}
@media (prefers-reduced-motion:reduce){.sf .sf-t.tick > span,.sf .sf-t.tick::before{animation:none}}
.sf .sf-w{display:inline-flex;gap:var(--sf-gap,2px);flex-wrap:nowrap}      /* a word's tiles stay together; lines wrap between words */
.sf-sr,.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}   /* .sr: read out, not seen */
/* the app's name on its board: in the header, on the sign-in page and on the welcome card */
.applogo .sf{--sf-w:.78em;--sf-h:1.1em;--sf-fs:.72em;--sf-gap:.08em;flex-wrap:nowrap}
/* the board's housing: the tiles on one grid in a dark frame, a blank tile for the space */
.sf.sf-board{flex-wrap:nowrap;padding:calc(var(--sf-h,26px) * .14);border-radius:calc(var(--sf-h,26px) * .2);
  background:linear-gradient(180deg,#121319 0%,#07080B 100%);border:1px solid rgba(255,255,255,.07);
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 0 0 1px rgba(0,0,0,.55),0 6px 18px -8px rgba(0,0,0,.8)}
.sf .sf-t.blank > span{visibility:hidden}
.default-save{position:absolute;left:-9999px;width:1px;height:1px;padding:0;border:0;opacity:0;pointer-events:none}   /* Enter saves (ops.html) */
/* the legs filter bar's default button: first in the form, so Enter in the search box applies the
   search; never seen */
.filterbar .fb-default{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);padding:0;margin:-1px;border:0}
/* status.json cannot be reached: every lamp goes grey and the texts say since when, until it can */
.console.stale .lamp i,.console.stale .c-tile.partner .badge .lamp{background:var(--ink4);box-shadow:none;animation:none}
.console.stale .c-tile.partner .t-status{color:var(--ink3)}
/* a card's map that could not be had because the session ended */
.rmap .rm-hint{position:absolute;right:24px;bottom:16px;margin:0;max-width:280px;font:600 12.5px var(--font-ui);color:var(--ink3);text-align:right}

/* ---------------------------------------------------------------- sign-in (2026-09-27): an operations map beside a
   clean panel. The form is there from the first frame; the map draws itself in behind it. The map is a decoration
   of public airports around Memmingen, never our legs: the page is public. */
.gx-body{margin:0;background:#050913;overflow:hidden}
.gx{position:fixed;inset:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,500px);background:#050913;color:var(--ink)}
.gx-visual{position:relative;overflow:hidden;background:radial-gradient(90% 80% at 55% 45%,#0C1737 0%,#070E22 55%,#050913 100%)}
.gx-map{position:absolute;inset:0;width:100%;height:100%;animation:gx-in 1.2s var(--ease) both}
.gx-land{fill:#0D1936}
.gx-coast{fill:none;stroke:#6E93FF;stroke-opacity:.32;stroke-width:.8px;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.gx-border{fill:none;stroke:#8FA9FF;stroke-opacity:.14;stroke-width:.7px;vector-effect:non-scaling-stroke;stroke-dasharray:3 3}
.gx-arc{fill:none;stroke:#6E93FF;stroke-opacity:.14;stroke-width:.45;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;animation:gx-draw 1.5s var(--ease) calc(.2s + var(--i) * .07s) forwards}
.gx-trail{fill:none;stroke:#9DB6FF;stroke-opacity:.5;stroke-width:.6;stroke-linecap:butt}
.gx-plane{fill:#C9D7FF;fill-opacity:.8}
.gx-apt{opacity:0;animation:gx-show .5s var(--ease) calc(.15s + var(--i) * .04s) forwards}
.gx-apt .core{fill:#9FB2E0}
.gx-apt .ping{fill:none;stroke:#6E93FF;stroke-width:.6;transform-box:fill-box;transform-origin:center;opacity:0;
  animation:gx-ping 6s ease-out calc(1s + var(--i) * .41s) infinite}
.gx-apt text{font:500 4.4px var(--mono);fill:#6A7DA8;letter-spacing:.35px}
.gx-apt.hub .core{fill:#E4EBFF}
.gx-apt.hub text{fill:#DCE4F7;font-weight:600;font-size:5.4px}
.gx-grid{position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(143,169,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(143,169,255,.05) 1px,transparent 1px);
  background-size:64px 64px;mask-image:radial-gradient(75% 70% at 55% 45%,#000 20%,transparent 100%)}
.gx-shade{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(5,9,19,.96) 0%,rgba(5,9,19,.55) 30%,rgba(5,9,19,0) 55%),
             linear-gradient(180deg,rgba(5,9,19,.75) 0%,rgba(5,9,19,0) 22%),
             linear-gradient(90deg,rgba(5,9,19,0) 70%,rgba(5,9,19,.7) 100%)}
.gx-pitch{position:absolute;z-index:2;left:48px;right:48px;bottom:44px;animation:gx-rise .9s var(--ease) .1s both}
.gx-brand{display:grid;justify-items:start;gap:clamp(16px,2.4vh,26px);margin:0 0 clamp(28px,5vh,48px)}
.gx-brand .logo{height:clamp(56px,7.5vw,96px);font-size:clamp(50px,6.8vw,88px);filter:drop-shadow(0 14px 40px rgba(0,0,0,.6))}
.gx-brand .applogo{font-size:clamp(28px,3.2vw,44px);filter:drop-shadow(0 10px 30px rgba(0,0,0,.55))}
.gx-flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.gx-flow li{position:relative;padding-right:22px}
.gx-flow li:not(:last-child)::after{content:"";position:absolute;left:46px;right:10px;top:18px;height:1px;
  background:linear-gradient(90deg,transparent,#B7C8FF,transparent) no-repeat,rgba(110,147,255,.22);background-size:30% 100%,100% 100%;
  animation:gx-pipe 2.6s linear infinite}
.gx-flow li:nth-child(2)::after{animation-delay:1.3s}
.gx-node{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:#BFD0FF;
  background:#0A1330;border:1px solid rgba(110,147,255,.3);box-shadow:0 0 20px -6px rgba(110,147,255,.6) inset}
.gx-node img,.gx-node svg{width:18px;height:18px;object-fit:contain}
.gx-flow b{display:block;margin-top:12px;font:600 14px var(--font-ui);color:#fff}
.gx-flow small{display:block;margin-top:3px;font-size:12px;color:var(--ink3)}

.gx-panel{position:relative;z-index:3;display:flex;flex-direction:column;min-width:0;padding:30px 48px 26px;overflow:auto;
  background:linear-gradient(180deg,#0C1328 0%,#080D1C 100%);box-shadow:-40px 0 80px -30px rgba(0,0,0,.7);animation:gx-slide .5s var(--ease) both}
.gx-panel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;
  background:linear-gradient(180deg,rgba(110,147,255,0),rgba(110,147,255,.65) 35%,rgba(110,147,255,.15) 75%,rgba(110,147,255,0))}
.gx-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.gx-env{display:inline-flex;align-items:center;gap:8px;padding:5px 11px 5px 10px;border-radius:999px;border:1px solid rgba(143,169,255,.2);
  font:500 10.5px/1.2 var(--mono);letter-spacing:1.5px;text-transform:uppercase;color:var(--ink2)}
.gx-env i{width:6px;height:6px;border-radius:50%;background:var(--warn);box-shadow:0 0 8px var(--warn)}
.gx-env.env-staging i{background:var(--accent);box-shadow:0 0 8px var(--accent)}
.gx-env.env-production i{background:var(--good);box-shadow:0 0 8px var(--good)}
.gx-clock{display:inline-flex;align-items:baseline;gap:7px;font-family:var(--mono)}
.gx-clock b{font-weight:500;font-size:14px;letter-spacing:.6px;color:#fff;font-variant-numeric:tabular-nums}
.gx-clock small{font-size:10px;letter-spacing:1.6px;color:var(--ink4)}
.gx-form{width:100%;max-width:392px;align-self:center;margin-top:auto;padding:36px 0 26px}
.gx-form h1{margin:0 0 26px;font:600 30px/1.1 var(--font-ui);letter-spacing:-.022em;color:#fff}
.gx-field{display:block;margin:0 0 16px}
.gx-field > span:first-child{display:block;margin:0 0 7px;font:500 12.5px var(--font-ui);color:var(--ink2)}
.gx-input{display:flex;align-items:center;height:50px;border-radius:12px;background:rgba(3,7,18,.65);border:1px solid rgba(143,169,255,.17);
  transition:border-color .15s,box-shadow .2s,background .15s}
.gx-input:hover{border-color:rgba(143,169,255,.3)}
.gx-input:focus-within{border-color:#6E93FF;background:rgba(6,11,26,.9);box-shadow:0 0 0 4px rgba(110,147,255,.15),0 0 28px -8px rgba(110,147,255,.55)}
.gx-input > svg{width:18px;height:18px;flex:none;margin-left:15px;color:var(--ink4);transition:color .15s}
.gx-input:focus-within > svg{color:#9DB6FF}
.gx-input input,.gx-input input:hover,.gx-input input:focus{flex:1;width:auto;min-width:0;height:100%;margin:0;padding:0 14px 0 12px;border:0;border-radius:0;
  background:transparent;box-shadow:none;outline:0;color:#fff;font:400 15px var(--font-ui)}
.gx-input input::placeholder{color:#5E6D8C}
.gx-input input:-webkit-autofill{-webkit-text-fill-color:#fff;caret-color:#fff;transition:background-color 99999s}
.gx-peek{flex:none;display:grid;place-items:center;width:40px;height:40px;margin-right:5px;padding:0;border:0;border-radius:9px;background:transparent;color:var(--ink4);cursor:pointer}
.gx-peek:hover{color:#fff;background:rgba(255,255,255,.05)}.gx-peek[aria-pressed=true]{color:#9DB6FF}
.gx-peek:focus-visible{outline:2px solid #6E93FF;outline-offset:1px}
.gx-peek svg{width:18px;height:18px}
.gx-go{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:50px;margin-top:10px;
  border:0;border-radius:12px;background:linear-gradient(180deg,#8AA8FF 0%,#5D84F6 100%);color:#06102C;font:650 15px var(--font-ui);cursor:pointer;
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 12px 30px -12px rgba(110,147,255,.8);transition:transform .08s,box-shadow .2s,filter .2s}
.gx-go svg{width:18px;height:18px;transition:transform .2s var(--ease)}
.gx-go:hover{filter:brightness(1.07);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 16px 36px -12px rgba(110,147,255,.95)}
.gx-go:hover svg{transform:translateX(3px)}
.gx-go:active{transform:translateY(1px)}
.gx-go:focus-visible{outline:2px solid #fff;outline-offset:3px}
.gx-go::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);transform:translateX(-100%)}
.gx-form.busy .gx-go{pointer-events:none}.gx-form.busy .gx-go::after{animation:sweep 1.1s linear infinite}
.gx-status{min-height:18px;margin-top:12px;font:12px var(--mono);color:var(--ink3);text-align:center}
.gx-err{display:flex;gap:10px;align-items:flex-start;margin:0 0 20px;padding:12px 14px;border-radius:12px;font-size:13px;line-height:1.45;
  background:rgba(242,102,94,.1);border:1px solid rgba(242,102,94,.35);color:#FFC2BD}
.gx-err svg{width:18px;height:18px;flex:none}
.gx-sys{position:relative;overflow:hidden;width:100%;max-width:392px;align-self:center;border-radius:16px;
  background:linear-gradient(180deg,rgba(143,169,255,.05),rgba(143,169,255,.015));border:1px solid rgba(143,169,255,.12);
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 18px 40px -24px rgba(0,0,0,.8)}
.gx-sys::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--sys-c,#6E93FF),transparent);opacity:.7;transition:background .4s}
.gx-sys.s-ok{--sys-c:#3CC98A}.gx-sys.s-warn{--sys-c:#F2B84B}.gx-sys.s-fail{--sys-c:#F2665E}
.gx-sys-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 16px 11px;border-bottom:1px solid rgba(143,169,255,.08)}
.gx-live{display:inline-flex;align-items:center;gap:13px;font:500 10.5px var(--mono);letter-spacing:1.6px;text-transform:uppercase;color:var(--ink3)}
.gx-live i{position:relative;width:6px;height:6px;border-radius:50%;background:var(--sys-c,#6E93FF);box-shadow:0 0 8px var(--sys-c,#6E93FF)}
.gx-live i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--sys-c,#6E93FF);animation:gx-radar 2.4s ease-out infinite}
.gx-sys-sum{font:500 11px var(--mono);color:var(--ink3);transition:color .3s}
.gx-sys-sum.s-ok{color:#6FE0AB}.gx-sys-sum.s-warn{color:var(--warn)}.gx-sys-sum.s-fail{color:var(--bad-ink)}
.gx-steps{list-style:none;margin:0;padding:6px 8px;display:grid}
.gx-steps li{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px;border-radius:10px;transition:background .2s}
.gx-steps li:hover{background:rgba(143,169,255,.04)}
.gx-steps li + li::before{content:"";position:absolute;left:50px;right:8px;top:0;height:1px;background:rgba(143,169,255,.06)}
.gx-ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:#BFD0FF;background:#0A1330;border:1px solid rgba(143,169,255,.16)}
.gx-ic img{width:15px;height:15px;object-fit:contain}
.gx-ic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.gx-tx{display:grid;gap:3px;min-width:0}
.gx-tx b{font-weight:600;font-size:13px;color:#fff;line-height:1.2}
.gx-tx small{font:11px/1.35 var(--mono);color:var(--ink4);overflow-wrap:anywhere}
.gx-steps li:not(.done) .gx-tx small{color:transparent;border-radius:4px;width:62%;
  background:linear-gradient(90deg,rgba(143,169,255,.06) 20%,rgba(143,169,255,.18) 50%,rgba(143,169,255,.06) 80%) 0 0/200% 100%;animation:gx-shimmer 1.3s linear infinite}
.gx-pill{display:inline-flex;align-items:center;gap:6px;min-width:22px;height:22px;padding:0 9px 0 8px;border-radius:999px;font:500 10px/1 var(--mono);font-style:normal;
  letter-spacing:.9px;text-transform:uppercase;color:var(--ink4);border:1px solid rgba(143,169,255,.14);background:rgba(143,169,255,.04)}
.gx-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:rgba(143,169,255,.35);animation:gx-blink 1s ease-in-out infinite}
.gx-steps li.done .gx-pill{animation:gx-pop .45s var(--ease) both}
.gx-steps li.done .gx-tx small{animation:gx-show .4s ease both;opacity:0}
.gx-steps li.s-ok .gx-pill{color:#6FE0AB;border-color:rgba(60,201,138,.35);background:rgba(60,201,138,.08)}
.gx-steps li.s-ok .gx-pill::before{background:#3CC98A;box-shadow:0 0 0 0 rgba(60,201,138,.6);animation:gx-beat 2.2s ease-out infinite}
.gx-steps li.s-warn .gx-pill{color:#F7C872;border-color:rgba(242,184,75,.35);background:rgba(242,184,75,.08)}
.gx-steps li.s-warn .gx-pill::before{background:#F2B84B;animation:none}
.gx-steps li.s-fail .gx-pill{color:#FFB5B0;border-color:rgba(242,102,94,.4);background:rgba(242,102,94,.1)}
.gx-steps li.s-fail .gx-pill::before{background:#F2665E;animation:gx-blink .8s ease-in-out infinite}
.gx-steps li.s-ok .gx-ic{border-color:rgba(60,201,138,.28)}.gx-steps li.s-warn .gx-ic{border-color:rgba(242,184,75,.3)}.gx-steps li.s-fail .gx-ic{border-color:rgba(242,102,94,.35)}
.gx-sys-foot{display:flex;align-items:center;gap:12px;padding:9px 16px 12px;font:10.5px var(--mono);color:var(--ink4);letter-spacing:.3px}
.gx-scan{flex:1;height:2px;border-radius:2px;background:rgba(143,169,255,.08);overflow:hidden}
.gx-scan i{display:block;width:34%;height:100%;border-radius:2px;background:linear-gradient(90deg,transparent,var(--sys-c,#6E93FF),transparent);
  animation:gx-sweep 2.8s ease-in-out infinite;opacity:.45}
.gx-sys.busy .gx-scan i{animation-duration:1s;opacity:1}
@keyframes gx-radar{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.5);opacity:0}}
@keyframes gx-shimmer{to{background-position:-200% 0}}
@keyframes gx-pop{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
@keyframes gx-beat{0%{box-shadow:0 0 0 0 rgba(60,201,138,.55)}70%,100%{box-shadow:0 0 0 6px rgba(60,201,138,0)}}
@keyframes gx-sweep{0%{transform:translateX(-110%)}100%{transform:translateX(310%)}}
.gx-foot{display:grid;gap:5px;margin-top:auto;padding-top:26px;font:500 10px/1.5 var(--mono);letter-spacing:1px;text-transform:uppercase;color:var(--ink4)}
.gx-foot .imprint{font:400 11.5px var(--font-ui);letter-spacing:.1px;text-transform:none;opacity:.85}
@keyframes gx-in{from{opacity:0;transform:scale(1.025)}to{opacity:1;transform:none}}
@keyframes gx-draw{to{stroke-dashoffset:0}}
@keyframes gx-show{to{opacity:1}}
@keyframes gx-ping{0%{opacity:.35;transform:scale(.8)}60%,100%{opacity:0;transform:scale(4)}}
@keyframes gx-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes gx-slide{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
@keyframes gx-blink{50%{opacity:.3}}
@keyframes gx-pipe{from{background-position:-60% 0,0 0}to{background-position:160% 0,0 0}}
@media (max-width:1100px){.gx{grid-template-columns:minmax(0,1fr) 420px}.gx-panel{padding:26px 34px 22px}}
@media (max-width:900px){
  .gx-body{overflow:auto}
  .gx{position:static;display:block;min-height:100vh}
  .gx-visual{height:300px}
  .gx-pitch{left:20px;right:20px;bottom:24px}.gx-brand{margin:0;gap:14px}.gx-brand .logo{height:52px;font-size:46px}.gx-brand .applogo{font-size:26px}.gx-flow{display:none}
  .gx-panel{padding:22px 20px 20px;box-shadow:none;animation:none}
  .gx-panel::before{top:0;left:0;right:0;bottom:auto;width:auto;height:1px;background:linear-gradient(90deg,transparent,rgba(110,147,255,.6),transparent)}
  .gx-form{padding:26px 0 22px}
}
@media (max-height:760px) and (min-width:901px){.gx-brand{margin-bottom:24px}.gx-form{padding:24px 0 18px}}
@media (prefers-reduced-motion:reduce){.gx-trail,.gx-plane,.gx-apt .ping{display:none}.gx-arc{stroke-dashoffset:0}.gx-flow li::after{animation:none}}