/* ════ NIGHT-FLIGHT THEME ════
     A cool, modern aviation palette. Existing token names stay stable so the
     probability model and dynamic inline styles can remain untouched. */
  :root{
    --sky:#EEF3F8; --sky-2:#E2EAF2;
    --card:#FFFFFF;
    --navy:#0B1424; --navy-2:#152942; --navy-cell:#2A3D54;
    --ink:#132033; --ink-2:#405168; --mist:#66778B;
    --line:#D5E0EA; --line-2:#E6ECF2;
    --gold:#D98918; --gold-deep:#87520D; --gold-bright:#FFB74D;
    --gold-soft:#FFF3DA; --gold-line:#F1D39B;
    --on-navy:#F7FAFC; --on-navy-dim:#AEC1D5;
    --good:#1A7048; --good-soft:#E5F5EC;
    --red:#FF9A88; --amber:#FFC45E; --green:#75D69C; --green-bright:#9AE6B4;
    --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
    --ui:"Manrope",system-ui,-apple-system,sans-serif;
    --maxw:1120px;
    --measure:66ch;
  }
  *,*::before,*::after{box-sizing:border-box;}
  .icon{width:1em;height:1em;display:inline-block;vertical-align:-.13em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
  html,body{margin:0;padding:0;}
  html{overflow-x:clip;}                 /* hard stop on any horizontal overflow */
  *:focus-visible{outline:2.5px solid var(--gold-deep);outline-offset:3px;border-radius:6px;}  /* gold-deep clears WCAG 3:1 on the cream page + ivory cards */

  body{
    background:
      radial-gradient(900px 520px at 12% -10%, rgba(255,183,77,.17), transparent 68%),
      radial-gradient(900px 600px at 92% 12%, rgba(70,133,190,.14), transparent 70%),
      linear-gradient(rgba(19,32,51,.025) 1px, transparent 1px),
      linear-gradient(90deg,rgba(19,32,51,.025) 1px, transparent 1px),
      var(--sky);
    background-size:auto,auto,32px 32px,32px 32px,auto;
    color:var(--ink);
    font-family:var(--ui);
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
    overflow-x:clip;
    padding:28px 24px 80px;
  }
  /* warm amber hairline pinned to the very top edge — the departure-board signature */
  body::before{
    content:"";position:fixed;inset:0 0 auto 0;height:3px;z-index:70;pointer-events:none;
    background:linear-gradient(90deg,var(--gold-bright) 0%,var(--gold) 50%,var(--gold-deep) 100%);
  }
  /* ════ AMBIENT FIELD ════
     Static light fields add depth without competing with product motion. */
  body::after{
    content:"";position:fixed;inset:-30vmax;z-index:-1;pointer-events:none;
    background:
      radial-gradient(38vmax 30vmax at 18% 22%, rgba(255,183,77,.20), transparent 60%),
      radial-gradient(42vmax 34vmax at 84% 30%, rgba(70,133,190,.20), transparent 62%),
      radial-gradient(40vmax 32vmax at 60% 88%, rgba(120,90,200,.10), transparent 64%);
    filter:blur(10px);opacity:.58;transform:rotate(-3deg) scale(1.06);
  }
  @property --p{syntax:"<number>";inherits:false;initial-value:0;}
  @property --lo{syntax:"<number>";inherits:false;initial-value:0;}
  @property --hi{syntax:"<number>";inherits:false;initial-value:0;}
  @property --ring{syntax:"<color>";inherits:false;initial-value:#FFB74D;}

  /* Elements reveal only when they enter the viewport. Without JavaScript they
     remain visible, so progressive enhancement stays intact. */
  .js .reveal{opacity:0;transform:translateY(10px);}
  .js .reveal.is-visible{
    opacity:1;transform:none;
    transition:opacity .42s ease,transform .52s cubic-bezier(.22,.8,.24,1);
  }
  .wrap{width:100%;max-width:var(--maxw);margin:0 auto;}
  /* cap long body copy to a comfortable measure regardless of card width */
  .measure{max-width:var(--measure);}

  /* ════ HEADER ════ */
  .masthead{max-width:760px;margin:18px 0 32px;}
  .eyebrow{
    font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
    color:var(--gold-deep);margin:0 0 14px;display:flex;align-items:center;gap:9px;
    flex-wrap:wrap;min-width:0;
  }
  .eyebrow::before{content:"";width:22px;height:2px;background:var(--gold);border-radius:2px;flex:0 0 auto;}
  h1{
    font-weight:800;font-size:clamp(34px,5.2vw,56px);line-height:1.02;letter-spacing:-.045em;
    color:var(--ink);margin:0 0 14px;overflow-wrap:break-word;
  }
  .lead{font-size:18px;line-height:1.65;color:var(--ink-2);margin:0 0 16px;max-width:58ch;}
  .lead b{color:var(--ink);font-weight:700;}
  .disclaim{
    font-size:13.5px;line-height:1.6;color:var(--mist);max-width:var(--measure);
    border-left:3px solid var(--gold-line);padding:2px 0 2px 14px;margin:0;
  }

  /* ════ RESULT TICKET (hero) ════ */
  .ticket{
    background:linear-gradient(158deg, var(--navy) 0%, var(--navy-2) 100%);
    border:1px solid rgba(174,193,213,.16);border-radius:26px;color:var(--on-navy);
    padding:30px 28px 26px;margin:26px 0 14px;
    position:relative;overflow:hidden;
    box-shadow:0 28px 65px -30px rgba(11,20,36,.72), 0 2px 0 rgba(255,183,77,.9) inset;
  }
  .ticket::before{
    content:"";position:absolute;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg, var(--gold-bright), var(--gold));
  }
  .ticket::after{
    content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;
    background:radial-gradient(280px circle at var(--mx,50%) var(--my,28%),rgba(255,255,255,.085),transparent 68%);
    transition:opacity .28s ease;
  }
  @media (hover:hover){.ticket:hover::after{opacity:1;}}
  /* ════ ROUTE-DRIVEN FLIGHT PATH ════
     This draws once when two airport codes resolve; it never loops decoratively. */
  .flightpath{position:absolute;inset:0 0 auto 0;height:100px;overflow:hidden;pointer-events:none;z-index:1;}
  .route-code{
    position:absolute;top:17px;font:600 10px/1 var(--mono);letter-spacing:.14em;
    color:var(--on-navy-dim);opacity:.72;transition:color .25s,opacity .25s;
  }
  .route-code.origin{left:28px;}.route-code.destination{right:28px;text-align:right;}
  .flightpath.route-ready .route-code{color:var(--gold-bright);opacity:1;}
  .route-map{position:absolute;left:28px;right:28px;top:33px;width:calc(100% - 56px);height:52px;overflow:visible;}
  .route-base,.route-live{fill:none;stroke-linecap:round;}
  .route-base{stroke:rgba(174,193,213,.22);stroke-width:1.25;stroke-dasharray:2 7;}
  .route-live{stroke:var(--gold-bright);stroke-width:1.8;stroke-dasharray:1;stroke-dashoffset:1;opacity:.85;}
  .route-plane{
    position:absolute;width:18px;height:18px;left:24px;top:64px;color:var(--gold-bright);
    filter:drop-shadow(0 0 7px rgba(255,183,77,.5));opacity:0;transform:rotate(-12deg);
  }
  .flightpath.route-ready .route-live{animation:routeDraw .72s cubic-bezier(.2,.72,.22,1) forwards;}
  .flightpath.route-ready .route-plane{animation:routeFly .86s cubic-bezier(.2,.72,.22,1) forwards;}
  @keyframes routeDraw{to{stroke-dashoffset:0;}}
  @keyframes routeFly{
    0%{left:24px;top:64px;opacity:0;transform:rotate(-12deg) scale(.86);}
    15%{opacity:1;}
    52%{left:48%;top:35px;opacity:1;transform:rotate(-2deg) scale(1);}
    100%{left:calc(100% - 44px);top:62px;opacity:1;transform:rotate(8deg) scale(.92);}
  }
  /* the ticket content must sit above the motif */
  .ticket-top,#boardBody{position:relative;z-index:2;}
  /* perforation dots down the divider seam */
  .ticket-top{
    display:flex;justify-content:center;text-align:center;
    margin-bottom:22px;padding-top:54px;
  }
  .verdict-block{display:flex;flex-direction:column;align-items:center;}
  /* hierarchy: tiny label → HERO % → verdict word → range → confidence */
  .verdict-label{
    font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
    color:var(--on-navy-dim);opacity:.85;margin:0 0 10px;
  }
  .verdict{font-size:clamp(19px,5.2vw,23px);font-weight:700;line-height:1.16;margin:10px 0 0;color:var(--on-navy);letter-spacing:.005em;text-wrap:balance;}
  .probability-ring{
    --p:0;--ring:var(--gold-bright);
    width:210px;aspect-ratio:1;display:grid;place-items:center;position:relative;border-radius:50%;
    background:conic-gradient(var(--ring) calc(var(--p) * 1%),rgba(174,193,213,.14) 0);
    box-shadow:0 0 55px color-mix(in srgb, var(--ring) 32%, transparent),inset 0 0 0 1px rgba(255,255,255,.05);
    transition:--p .65s cubic-bezier(.22,.8,.24,1),--lo .65s ease,--hi .65s ease,--ring .35s ease,box-shadow .35s ease;
  }
  /* Thin outer arc is the model's P10–P90 uncertainty band. */
  .probability-ring::after{
    content:"";position:absolute;inset:-10px;border-radius:inherit;pointer-events:none;
    background:conic-gradient(transparent 0 calc(var(--lo) * 1%),rgba(174,193,213,.72) 0 calc(var(--hi) * 1%),transparent 0);
    -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
            mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  }
  .probability-ring::before{
    content:"";position:absolute;inset:12px;border-radius:inherit;
    background:linear-gradient(145deg,var(--navy-2),var(--navy));
    box-shadow:inset 0 0 30px rgba(0,0,0,.24);
  }
  .probability-core{position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:center;}
  .median-tick{position:absolute;inset:-5px;z-index:3;transform:rotate(calc(var(--p) * 3.6deg));transition:transform .65s cubic-bezier(.22,.8,.24,1);pointer-events:none;}
  .median-tick::before{content:"";position:absolute;top:-2px;left:50%;width:2px;height:10px;border-radius:2px;background:var(--on-navy);box-shadow:0 0 8px var(--ring);}
  .gauge-scale{position:absolute;z-index:3;font:500 8px/1 var(--mono);color:var(--on-navy-dim);opacity:.7;}
  .gauge-scale.zero{left:13px;bottom:13px}.gauge-scale.mid{top:13px;left:50%;transform:translateX(-50%)}.gauge-scale.full{right:10px;bottom:13px}
  @keyframes gaugeSettle{50%{box-shadow:0 0 78px color-mix(in srgb,var(--ring) 46%,transparent),inset 0 0 0 1px rgba(255,255,255,.08);}}
  .probability-ring.is-updating{animation:gaugeSettle .58s ease;}
  .pct{
    font-family:var(--mono);font-weight:600;font-size:clamp(58px,8vw,78px);line-height:.82;
    letter-spacing:-.04em;color:var(--gold-bright);
    font-variant-numeric:tabular-nums;display:inline-block;
    text-shadow:0 6px 22px rgba(232,154,51,.28);
  }
  .pct .sign{font-size:.4em;vertical-align:top;margin-left:3px;opacity:.55;font-weight:500;}
  .conf{margin-top:14px;padding-top:14px;border-top:1px solid rgba(244,233,210,.12);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;cursor:default;}
  .conf-label{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--on-navy-dim);}
  .cbar{display:inline-flex;gap:3px;}
  .cseg{width:11px;height:8px;border-radius:2px;display:inline-block;transition:background .15s;}
  .conf-txt{font-family:var(--mono);font-size:12px;font-weight:700;min-width:60px;text-align:left;}

  .ticket-seam{height:1px;background:repeating-linear-gradient(90deg,rgba(244,233,210,.22) 0 6px,transparent 6px 12px);margin:4px 0 18px;}

  .strip-label{
    display:flex;justify-content:space-between;align-items:center;gap:10px;
    font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
    color:var(--on-navy-dim);margin:0 0 30px;
  }
  .strip-label span:last-child{font-family:var(--mono);letter-spacing:.02em;text-transform:none;font-weight:500;}
  .seats{display:flex;gap:4px;align-items:flex-end;flex-wrap:nowrap;overflow-x:auto;margin-bottom:14px;padding-top:22px;}
  /* one-time staggered "boarding" fill — added only on first reveal (JS removes
     the .intro flag after it plays) so it never re-fires on every keystroke */
  .seats.intro .seat{animation:seatPop .5s cubic-bezier(.22,.61,.36,1) both;animation-delay:calc(var(--si,0) * 26ms);}
  @keyframes seatPop{from{opacity:0;transform:translateY(7px) scaleY(.62);}to{opacity:1;transform:none;}}
  .seat{
    flex:1 1 0;min-width:13px;max-width:32px;height:42px;border-radius:6px;
    background:var(--navy-cell);position:relative;transition:background .38s ease,box-shadow .38s ease,transform .22s ease;
  }
  .seat.state-change{animation:seatChange .38s cubic-bezier(.22,.8,.24,1) both;animation-delay:calc(var(--si,0) * 24ms);}
  @keyframes seatChange{50%{transform:translateY(-3px) scale(1.035);}100%{transform:none;}}
  .seat.clear{
    background:linear-gradient(180deg, var(--gold-bright) 0%, var(--gold) 100%);
    box-shadow:0 0 0 1px rgba(230,178,62,.35), 0 4px 10px -3px rgba(198,138,27,.6);
  }
  .seat.clear::after{
    content:"";position:absolute;bottom:6px;left:50%;transform:translateX(-50%);
    width:4px;height:4px;border-radius:50%;background:rgba(43,32,20,.55);
  }
  .seat .youtag{
    position:absolute;top:-23px;left:50%;transform:translateX(-50%);
    font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.06em;white-space:nowrap;transition:color .3s ease;
  }
  .seat .youtag::after{
    content:"";position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);
    border-left:4px solid transparent;border-right:4px solid transparent;border-top:6px solid currentColor;
  }
  .strip-rule{
    font-size:13px;font-weight:700;color:var(--on-navy);text-align:center;
    margin:0 0 12px;letter-spacing:.005em;
  }
  .cutoff-note{
    font-size:12px;color:var(--on-navy-dim);display:flex;justify-content:space-between;
    flex-wrap:wrap;gap:8px;border-top:1px solid rgba(244,233,210,.12);padding-top:13px;
  }
  .cutoff-note b{color:var(--on-navy);font-weight:700;}

  .ticket-hint{
    text-align:center;font-size:13px;color:var(--mist);margin:0 0 28px;
  }
  .ticket-hint::before{content:"";display:inline-block;width:7px;height:7px;margin:0 8px 2px 0;border-right:1.5px solid var(--gold-deep);border-bottom:1.5px solid var(--gold-deep);transform:rotate(45deg);}

  /* ════ RESULT ACTIONS (share / reset) ════ */
  .result-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:0 0 28px;}
  .action-btn{
    display:inline-flex;align-items:center;gap:8px;font-family:var(--ui);font-size:13.5px;font-weight:700;
    padding:9px 15px;border-radius:11px;cursor:pointer;color:var(--ink-2);
    background:var(--card);border:1.5px solid var(--line);
    transition:background .16s,border-color .16s,color .16s,transform .12s;
  }
  .action-btn:hover{background:var(--gold-soft);border-color:var(--gold-line);color:var(--gold-deep);}
  .action-btn:active{transform:scale(.97);}
  .action-btn .icon{width:15px;height:15px;}
  .action-btn--ghost{background:transparent;}
  .action-btn.copied{background:var(--good-soft);border-color:var(--good);color:var(--good);}

  /* flight-number lookup row */
  .flightlookup{display:flex;gap:9px;align-items:stretch;}
  .flightlookup input{flex:1 1 auto;min-width:0;}
  .flightlookup .action-btn{flex:0 0 auto;white-space:nowrap;}
  .help[data-kind="ok"]{color:var(--good);border-left-color:var(--good);}
  .help[data-kind="warn"]{color:var(--gold-deep);border-left-color:var(--gold-line);}

  /* ════ SECTIONS (inputs) ════ */
  .section{
    background:rgba(255,255,255,.92);border:1px solid rgba(213,224,234,.9);border-radius:22px;
    padding:28px;margin-bottom:22px;
    box-shadow:0 1px 2px rgba(11,20,36,.04),0 18px 45px -30px rgba(11,20,36,.35);
    backdrop-filter:blur(12px);
  }
  .section-head{display:flex;align-items:flex-start;gap:14px;margin:0 0 24px;}
  .step-index{
    width:38px;height:38px;flex:0 0 auto;display:grid;place-items:center;border-radius:12px;
    background:var(--navy);color:var(--gold-bright);font:600 11px/1 var(--mono);letter-spacing:.08em;
    box-shadow:0 8px 18px -10px rgba(11,20,36,.8);
  }
  .section-eyebrow{
    font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
    color:var(--gold-deep);margin:0 0 6px;
  }
  .section-title{font-size:21px;font-weight:800;color:var(--ink);margin:0;letter-spacing:-.025em;}

  .field{margin-bottom:22px;}
  .field:last-child{margin-bottom:0;}
  .label{display:block;font-size:14.5px;font-weight:700;color:var(--ink);margin:0 0 10px;}
  .hint{font-weight:400;color:var(--mist);font-size:13.5px;}

  /* one explanation style, everywhere */
  .help{
    font-size:13.5px;line-height:1.6;color:var(--mist);margin-top:10px;max-width:var(--measure);
    padding-left:13px;border-left:2px solid var(--line);
  }

  /* segmented buttons */
  .seg{display:flex;flex-wrap:wrap;gap:7px;}
  .seg button{
    font-family:var(--ui);font-size:14.5px;font-weight:700;
    padding:10px 16px;border-radius:11px;cursor:pointer;
    background:var(--card);color:var(--ink-2);border:1.5px solid var(--line);
    transition:background .16s,border-color .16s,color .16s,transform .12s,box-shadow .16s;
  }
  .seg button:hover{background:var(--gold-soft);border-color:var(--gold-line);color:var(--gold-deep);}
  .seg button:active{transform:scale(.975);}
  .seg button[aria-pressed="true"]{
    background:var(--navy);border-color:var(--navy);color:#fff;
    box-shadow:0 4px 12px -4px rgba(43,32,20,.5);
  }

  /* inputs */
  select,input[type=date],input[type=time],input[type=text],input[type=number]{
    width:100%;font-family:var(--ui);font-size:16px;color:var(--ink);
    padding:13px 15px;border-radius:12px;border:1.5px solid var(--line);
    background:var(--card);-webkit-appearance:none;appearance:none;transition:border-color .13s,box-shadow .13s;
  }
  select:focus,input[type=date]:focus,input[type=time]:focus,input[type=text]:focus,input[type=number]:focus{
    border-color:var(--gold);outline:none;box-shadow:0 0 0 3px rgba(198,138,27,.14);
  }
  select{
    cursor:pointer;padding-right:40px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236A5942' stroke-width='1.7' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 15px center;
  }
  input[type=text]{text-transform:uppercase;font-family:var(--mono);font-weight:700;letter-spacing:.1em;}

  /* route block */
  .airports{display:grid;grid-template-columns:1fr 36px 1fr;align-items:center;gap:10px;margin-bottom:12px;}
  .airports .arrow{text-align:center;color:var(--mist);font-size:18px;font-weight:700;}
  .route-detected{
    display:flex;align-items:center;gap:14px;
    background:linear-gradient(120deg,var(--gold-soft),#FFFDF8);
    border:1.5px solid var(--gold-line);border-radius:13px;padding:14px 16px;
  }
  .route-detected .rd-badge{
    flex:0 0 auto;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
    color:var(--gold-deep);background:#fff;border:1px solid var(--gold-line);border-radius:7px;padding:5px 8px;
  }
  .route-detected .rd-main{flex:1 1 auto;min-width:0;}
  .route-name{font-size:15px;font-weight:700;color:var(--ink);line-height:1.25;}
  .route-eg{font-family:var(--mono);font-size:12px;color:var(--mist);margin-top:3px;}
  .route-change{
    flex:0 0 auto;font-family:var(--ui);font-size:13px;font-weight:700;color:var(--gold-deep);
    background:none;border:none;cursor:pointer;padding:6px 2px;text-decoration:underline;text-underline-offset:3px;
  }
  .route-change:hover{color:var(--ink);}
  #routeManual .help{margin-top:10px;}
  /* route: make the two input paths (airports OR preset) read as explicit alternatives */
  .route-method-label{
    font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--gold-deep);margin:0 0 9px;display:flex;align-items:center;gap:8px;
  }
  .route-method-label .step-dot{
    flex:0 0 auto;width:17px;height:17px;border-radius:50%;background:var(--gold-soft);border:1px solid var(--gold-line);
    color:var(--gold-deep);font-size:10px;display:inline-flex;align-items:center;justify-content:center;
  }
  .route-or{
    display:flex;align-items:center;gap:12px;margin:16px 0;
    font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mist);
  }
  .route-or::before,.route-or::after{content:"";flex:1 1 auto;height:1px;background:var(--line);}

  /* context note (info) */
  .ctxnote{
    font-size:13.5px;line-height:1.6;color:var(--ink-2);max-width:var(--measure);
    background:#F4EEDD;border:1px solid var(--line-2);border-radius:11px;padding:12px 15px;margin-top:12px;
  }
  .ctxnote b{color:var(--gold-deep);font-weight:700;}

  /* inferred date line */
  .inferred{font-family:var(--mono);font-size:12.5px;color:var(--gold-deep);margin-top:11px;line-height:1.5;}

  /* grids */
  .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  @media (max-width:520px){.row2{grid-template-columns:1fr;}.airports{grid-template-columns:1fr;}.airports .arrow{display:none;}}

  /* toggle */
  .switch{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:700;color:var(--ink);cursor:pointer;user-select:none;}
  .switch input{
    appearance:none;-webkit-appearance:none;width:44px;height:25px;border-radius:13px;
    background:var(--sky-2);position:relative;cursor:pointer;transition:background .16s;flex:0 0 auto;
  }
  .switch input:checked{background:var(--navy);}
  .switch input::after{
    content:"";position:absolute;top:2.5px;left:2.5px;width:20px;height:20px;border-radius:50%;
    background:#fff;border:1px solid rgba(74,55,34,.20);box-shadow:0 1px 3px rgba(43,32,20,.3);transition:transform .16s;
  }
  .switch input:checked::after{transform:translateX(19px);}

  /* live seat inputs */
  .seatgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(124px,1fr));gap:13px;margin-top:4px;}
  .seatbox{border:1.5px solid var(--line);border-radius:13px;padding:13px 15px;background:var(--card);transition:border-color .13s,background .13s;}
  .seatbox label{display:block;font-size:12.5px;font-weight:700;color:var(--ink-2);margin-bottom:8px;}
  .seatbox input{
    width:100%;font-family:var(--mono);font-size:22px;font-weight:700;color:var(--ink);
    border:none;border-bottom:2px solid var(--line);padding:3px 0;background:none;border-radius:0;
  }
  .seatbox input:focus{box-shadow:none;border-bottom-color:var(--gold);}
  .seatbox.chased{border-color:var(--gold);background:var(--gold-soft);}
  .seatbox.chased label{color:var(--gold-deep);}
  .seatbox.chased input{border-bottom-color:var(--gold);}

  /* tiebreaker accordion */
  .more{margin-top:4px;}
  .more-toggle{
    font-family:var(--ui);font-size:14px;font-weight:700;color:var(--gold-deep);
    background:none;border:none;cursor:pointer;padding:8px 0;display:flex;align-items:center;gap:9px;
  }
  .more-toggle .chev{width:14px;height:14px;transition:transform .22s;display:inline-block;}
  .more.open .more-toggle .chev{transform:rotate(90deg);}
  .more-body{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;pointer-events:none;transition:grid-template-rows .34s cubic-bezier(.22,.8,.24,1),opacity .22s,padding .34s,visibility 0s .34s;padding-top:0;}
  .more-body-inner{overflow:hidden;}
  .more.open .more-body{grid-template-rows:1fr;opacity:1;visibility:visible;pointer-events:auto;padding-top:14px;transition-delay:0s;}
  .checks{display:flex;flex-direction:column;}
  .chk{display:flex;align-items:flex-start;gap:13px;padding:12px 0;cursor:pointer;border-top:1px solid var(--line-2);}
  .chk:first-child{border-top:none;}
  .chk input{margin-top:2px;width:18px;height:18px;accent-color:var(--gold);cursor:pointer;flex:0 0 auto;}
  .chk .ct{font-size:14.5px;color:var(--ink);font-weight:700;}
  .chk .cd{font-size:13px;color:var(--mist);margin-top:3px;line-height:1.45;}

  /* ════ WHY card ════ */
  .why-intro{font-size:15px;color:var(--ink-2);line-height:1.6;margin:0 0 18px;max-width:var(--measure);}
  .rd-row{
    display:flex;justify-content:space-between;align-items:baseline;gap:14px;
    padding:13px 0;border-top:1px solid var(--line-2);font-size:15px;
  }
  .rd-row:first-of-type{border-top:none;}
  .rd-row .k{color:var(--ink-2);}
  .rd-row .v{font-family:var(--mono);font-weight:700;color:var(--ink);text-align:right;font-size:14px;}
  .lever{
    background:linear-gradient(120deg,var(--gold-soft),#FCF6E8);border:1px solid var(--gold-line);
    border-radius:13px;padding:15px 17px;font-size:14.5px;line-height:1.6;color:var(--gold-deep);margin-top:16px;max-width:var(--measure);
  }
  .lever b{color:var(--ink);font-weight:700;}
  .window-strip{
    margin-top:16px;font-size:14px;line-height:1.6;color:var(--ink-2);max-width:var(--measure);
    background:#F4EEDD;border:1px solid var(--line-2);border-radius:11px;padding:13px 16px;
  }
  .window-strip.warn{background:var(--gold-soft);border-color:var(--gold-line);color:var(--gold-deep);}
  .bigmsg{
    background:#F4EEDD;border:1px solid var(--line-2);border-radius:13px;padding:17px;max-width:var(--measure);
    font-size:15px;line-height:1.6;color:var(--ink-2);
  }
  .bigmsg.ineligible{background:#F8E7DD;border-color:#EAC9B4;color:#9A4A24;}

  /* ════ how it works ════ */
  .note-details{margin-top:26px;border:1px solid var(--line-2);border-radius:14px;background:var(--card);overflow:hidden;}
  .note-details summary{
    display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:var(--ink-2);
    cursor:pointer;padding:16px 18px;user-select:none;list-style:none;
  }
  .note-details summary::-webkit-details-marker{display:none;}
  .note-details summary::before{content:"";width:7px;height:7px;border-right:1.5px solid var(--gold-deep);border-bottom:1.5px solid var(--gold-deep);transform:rotate(-45deg);transition:transform .2s;flex:0 0 auto;}
  .note-details[open] summary::before{transform:rotate(45deg);}
  .note-details summary:hover{color:var(--ink);}
  .note-body{font-size:13.5px;color:var(--mist);line-height:1.75;padding:0 18px 18px;border-top:1px solid var(--line-2);max-width:var(--measure);}
  .note-body b{color:var(--ink-2);font-weight:700;}

  .credit{
    font-size:12.5px;color:var(--mist);text-align:center;margin-top:30px;
    padding-top:18px;border-top:1px solid var(--line-2);letter-spacing:.02em;
  }
  .credit a{color:var(--gold-deep);text-decoration:none;font-weight:700;}

  /* ════ DESKTOP APP LAYOUT ════ */
  .calculator-layout{
    display:grid;grid-template-columns:minmax(360px,430px) minmax(0,1fr);
    gap:32px;align-items:start;
  }
  .result-rail,.input-stack{min-width:0;}
  .input-stack{
    position:relative;display:flex;flex-direction:column;gap:0;overflow:hidden;
    padding:0 30px 0 56px;background:rgba(255,255,255,.92);
    border:1px solid rgba(213,224,234,.9);border-radius:22px;
    box-shadow:0 1px 2px rgba(11,20,36,.04),0 18px 45px -30px rgba(11,20,36,.35);
    backdrop-filter:blur(12px);
  }
  .input-stack::before{content:"";position:absolute;left:28px;top:44px;bottom:44px;width:1px;background:linear-gradient(var(--gold-line),var(--line) 18%,var(--line) 82%,var(--gold-line));}
  .progress-marker{position:absolute;z-index:3;left:20px;top:0;width:17px;height:17px;color:var(--gold-deep);filter:drop-shadow(0 3px 5px rgba(11,20,36,.22));transform:translateY(36px) rotate(90deg);transition:transform .48s cubic-bezier(.22,.8,.24,1);pointer-events:none;}
  .input-stack .section{
    position:relative;margin:0;padding:30px 0;background:transparent;border:0;border-radius:0;
    box-shadow:none;backdrop-filter:none;border-bottom:1px solid var(--line-2);
  }
  .input-stack .section:last-of-type{border-bottom:0;}
  .input-stack .step-index{transition:background .22s,color .22s,box-shadow .22s,transform .22s;}
  .input-stack .section.is-active .step-index{background:var(--gold-bright);color:var(--navy);box-shadow:0 0 0 5px var(--gold-soft),0 10px 20px -12px rgba(11,20,36,.7);transform:translateY(-1px);}
  .reasoning-section{max-width:720px;margin:24px 0 0 auto;}

  @media (min-width:900px){
    .result-rail{position:sticky;top:24px;}
    .result-rail .ticket{margin-top:0;}
    .mini-summary{display:none;}
  }
  @media (max-width:899px){
    .calculator-layout{grid-template-columns:1fr;gap:0;}
    .reasoning-section{max-width:none;margin-top:0;}
  }
  @media (max-width:600px){
    .input-stack{padding:0 20px;}
    .input-stack::before,.progress-marker{display:none;}
  }

  /* ════ STICKY MINI-SUMMARY ════
     A slim bar that drops in once the result ticket scrolls out of view, so the
     headline number stays visible while editing inputs far down the page. It is a
     button: activating it jumps back to the full result. */
  .mini-summary{
    position:fixed;top:0;left:0;right:0;z-index:65;display:block;width:100%;cursor:pointer;
    border:none;border-bottom:2px solid var(--gold);text-align:left;font-family:var(--ui);
    background:linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 100%);
    box-shadow:0 10px 26px -12px rgba(43,32,20,.55);
    transform:translateY(-110%);transition:transform .26s ease;
  }
  .mini-summary.show{transform:translateY(0);}
  .mini-inner{
    max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;gap:10px 13px;
    padding:8px 20px;
  }
  .mini-tag{
    font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
    color:var(--on-navy-dim);flex:0 0 auto;
  }
  .mini-pct{
    font-family:var(--mono);font-size:21px;font-weight:700;letter-spacing:-.02em;color:var(--gold-bright);
    font-variant-numeric:tabular-nums;line-height:1;flex:0 0 auto;
  }
  .mini-pct .mini-sign{font-size:.6em;opacity:.6;margin-left:1px;}
  .mini-verdict{font-size:14px;font-weight:700;color:var(--on-navy);line-height:1;flex:0 1 auto;min-width:0;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .mini-band{font-family:var(--mono);font-size:11.5px;color:var(--on-navy-dim);margin-left:auto;flex:0 0 auto;}
  .mini-top{
    font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
    color:var(--gold-bright);flex:0 0 auto;
  }
  /* the mini bar sits on brown, so its focus ring uses bright amber (6:1 on brown) instead of the dark gold-deep */
  .mini-summary:focus-visible{outline-color:var(--gold-bright);outline-offset:-4px;}
  @media (max-width:520px){
    .ticket,.section{padding-left:20px;padding-right:20px;}
    .probability-ring{width:184px;}
    .mini-inner{padding-left:16px;padding-right:16px;gap:9px;}
    .mini-band{display:none;}              /* keep %, verdict + jump on small screens */
  }
  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{transition:none!important;scroll-behavior:auto!important;}
    .mini-summary{transition:none;}
    .route-live{stroke-dashoffset:0!important;}
    .route-plane{opacity:1!important;}
    .flightpath.route-ready .route-live,.flightpath.route-ready .route-plane,
    .probability-ring.is-updating,.seats.intro .seat{animation:none!important;}
    .js .reveal{opacity:1!important;transform:none!important;}
    body::after{opacity:.5;}
  }