@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/space-grotesk-latin.woff2) format('woff2')}@font-face{font-family:'Unbounded';font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/unbounded-latin.woff2) format('woff2')}@font-face{font-family:'Unbounded Fallback';font-style:normal;font-weight:400;src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('LiberationSans'),local('Roboto'),local('Roboto-Regular');size-adjust:133.16%;ascent-override:74.74%;descent-override:18.42%;line-gap-override:0%;unicode-range:U+20-7E,U+A0-B4,U+B6-FF,U+102,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+300-301,U+303-304,U+308-309,U+323,U+329,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2039-203A,U+2044,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}@font-face{font-family:'Unbounded Fallback';font-style:normal;font-weight:700;src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('LiberationSans-Bold'),local('Roboto Bold'),local('Roboto-Bold');size-adjust:131.11%;ascent-override:75.91%;descent-override:18.71%;line-gap-override:0%;unicode-range:U+20-7E,U+A0-B4,U+B6-FF,U+102,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+300-301,U+303-304,U+308-309,U+323,U+329,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2039-203A,U+2044,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}@font-face{font-family:'Unbounded Fallback';font-style:normal;font-weight:900;src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('LiberationSans-Bold'),local('Roboto Bold'),local('Roboto-Bold');size-adjust:134.49%;ascent-override:74.01%;descent-override:18.24%;line-gap-override:0%;unicode-range:U+20-7E,U+A0-B4,U+B6-FF,U+102,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+300-301,U+303-304,U+308-309,U+323,U+329,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2039-203A,U+2044,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}@font-face{font-family:'Space Grotesk Fallback';font-style:normal;font-weight:400;src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('LiberationSans'),local('Roboto'),local('Roboto-Regular');size-adjust:109.17%;ascent-override:90.14%;descent-override:26.75%;line-gap-override:0%;unicode-range:U+D,U+20-7E,U+A0-FF,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+300-301,U+303-304,U+308-309,U+323,U+2009,U+200B,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+2044,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}@font-face{font-family:'Space Grotesk Fallback';font-style:normal;font-weight:700;src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('LiberationSans-Bold'),local('Roboto Bold'),local('Roboto-Bold');size-adjust:101.59%;ascent-override:96.86%;descent-override:28.74%;line-gap-override:0%;unicode-range:U+D,U+20-7E,U+A0-FF,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+300-301,U+303-304,U+308-309,U+323,U+2009,U+200B,U+2013-2014,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+2044,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
.skip-link{position:absolute;left:8px;top:-80px;z-index:1000;background:#073A47;color:#fff;padding:12px 16px;border-radius:8px;font-weight:700;text-decoration:none}.skip-link:focus{top:8px;outline:3px solid #fff;box-shadow:0 0 0 6px #073A47}main:focus{outline:none}
:root{--bg:#EAF6F9;--panel:#fff;--panel2:#F1FAFB;--line:#D3E7EC;--ink:#073A47;--dim:#456B77;
  --accent:#0E9BB5;--accent-ink:#08708A;--accent2:#12B0CE;--coral:#FF6E7B;--coral-ink:#C0392F;--stop:#8A1F2C;--bad-wash:#FFE3E6;--gold:#E9B85A;--sea:#08536F;--on-warm:#0B2530;
  /* THE primary button, defined once (look-20): the design kit's .lk-btn. Coral to gold, the dark kit ink on both ends
     (5.9:1 on coral, 8.7:1 on gold; white would be 2.7:1 and 1.8:1). Every primary button reads these four tokens. */
  --btn-primary-bg:linear-gradient(120deg,var(--coral),var(--gold));--btn-primary-ink:var(--on-warm);
  --btn-primary-shadow:inset 0 1.5px 0 rgba(255,255,255,.55),inset 0 -1.5px 0 rgba(120,60,20,.25),0 8px 18px rgba(255,110,123,.35);
  --btn-primary-shadow-hover:inset 0 1.5px 0 rgba(255,255,255,.55),inset 0 -1.5px 0 rgba(120,60,20,.25),0 13px 26px rgba(255,110,123,.45);
  --display:'Unbounded','Unbounded Fallback',system-ui,sans-serif;--sans:'Space Grotesk','Space Grotesk Fallback',system-ui,sans-serif;
  --w-text:708px;--w-data:1028px;--w-gutter:26px}
*{box-sizing:border-box}
html{background-color:#E8F6F9}
body{margin:0;color:var(--ink);font:16px/1.7 var(--sans);
  background:radial-gradient(1100px 640px at 12% -12%,#D6F1F7 0%,transparent 60%),
    radial-gradient(900px 620px at 92% 4%,#FDEFE2 0%,transparent 55%),
    linear-gradient(180deg,#F3FBFC 0%,#E8F6F9 100%);background-attachment:fixed;min-height:100vh}
a{color:var(--accent-ink);text-decoration:none}a:hover{text-decoration:underline}
/* Header, matched to the in-app TopBar so the bar looks identical across the whole site. */
.site-head{display:flex;align-items:center;gap:4px;height:66px;padding:0 16px;margin-bottom:8px;
  background:rgba(255,255,255,.72);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:40}
.brand{font:700 17px var(--display);color:var(--ink);display:flex;align-items:center;gap:10px;margin-right:8px;min-height:44px}
.brand:hover{text-decoration:none}
.brand .mark{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;font-size:18px;color:#fff;
  background:linear-gradient(135deg,var(--accent),var(--sea));box-shadow:0 6px 16px rgba(10,110,150,.4)}
.brand .beta{margin-left:8px;align-self:center;font:800 9.5px var(--sans);letter-spacing:1px;color:#7A5312;
  background:var(--gold);border-radius:6px;padding:2px 6px}
.head-cta{font:700 13.5px/1 var(--display);display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;
  border:none;border-radius:999px;padding:0 16px;position:relative}
/* look-20: ONE primary button look site-wide, read from the --btn-primary-* tokens (the design kit's .lk-btn): header Plan
   button, hub top box, middle box, end banner and not-found button (the trip page's finder button reads the same tokens in triplook.mjs). Nothing below carries a
   colour of its own, so the buttons cannot drift apart again. */
.head-cta,main .top-cta a.go,main .l2lc a.btn,main .endcta a,main a.nf-cta{background:var(--btn-primary-bg);color:var(--btn-primary-ink);
  box-shadow:var(--btn-primary-shadow);text-decoration:none;white-space:nowrap;font-variant-emoji:text;cursor:pointer;
  transition:translate .5s cubic-bezier(.34,1.56,.64,1),scale .5s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease}
.head-cta:hover,main .top-cta a.go:hover,main .l2lc a.btn:hover,main .endcta a:hover,main a.nf-cta:hover{color:var(--btn-primary-ink);
  box-shadow:var(--btn-primary-shadow-hover);translate:0 -2px;text-decoration:none}
.head-cta:active,main .top-cta a.go:active,main .l2lc a.btn:active,main .endcta a:active,main a.nf-cta:active{translate:0 0;scale:.97;transition-duration:.08s}
main .top-cta a.go,main .l2lc a.btn,main .endcta a,main a.nf-cta{display:inline-block;text-align:center;
  font:700 16px/1.15 var(--display);padding:15px 28px;border-radius:999px;font-variant-emoji:text}
main .l2lc a.btn,main .endcta a{max-width:100%}
@media(max-width:620px){main .top-cta a.go,main .l2lc a.btn,main .endcta a,main a.nf-cta{white-space:normal;text-align:center;font-size:14px;padding:14px 18px;min-height:44px;box-sizing:border-box}}
.ic{flex:0 0 auto;vertical-align:-3px;margin-right:6px}.head-cta .ic{margin-right:0}
/* THE top bar (owner, 11 Oct 2026): one bar on every page, no sideways scroller and no arrow. Everything
   fits on one row from 1320px up (measured 15 Oct 2026: signed in, with Royal Up, the row needs 1,308 px at 13 px type); below that the links
   fold into a Menu button with a dropdown panel. Items, order and tips come from server/navitems.mjs,
   shared with web/src/TopBar.jsx, and the rules below are mirrored there (styles.css, .topbar / .tb-*).
   THE OWNER'S ORDER (12 Oct 2026): right after the logo the one primary button (Find legs, .head-cta), the
   tinted "you" pill (.ng-you: Planner, Your offers, Compare offers), the site links on plain ground
   (.ng-site), then at the right end Feedback and Sign in (.ng-end) or the avatar. One hover language for every item: a soft --bg pill fades up
   (160 ms) and a 2 px --accent line slides in under the label (180 ms); keyboard focus paints the same
   plus a ring; the page you are on keeps the line. Every item carries a one-line tip (.tip): a tooltip on
   hover and focus, a subtitle in the phone panel, nothing on a touch screen's hover. prefers-reduced-motion
   keeps every state, drops every move. */
.brand,.h-av,.menu-btn{flex:0 0 auto}
.head-cta{transition:translate .18s ease-out,scale .12s ease-out,box-shadow .18s ease-out}
.hnav{display:flex;align-items:center;flex:1 1 auto;min-width:0;gap:6px}
.ng{display:flex;align-items:center;gap:2px}
.ng-you{padding:4px;border-radius:999px;background:var(--panel2);border:1px solid var(--line)}
.ng-end{margin-left:auto}
.menu-btn{display:none}
.nav-pill,.tab{position:relative;display:inline-flex;align-items:center;gap:7px;font:700 13px/1.35 var(--sans);color:var(--dim);
  padding:8px 10px;border-radius:999px;white-space:nowrap;text-decoration:none;background:transparent;border:0;cursor:pointer;
  transition:color .16s ease-out,background-color .16s ease-out}
.nav-pill::after,.tab::after{content:"";position:absolute;left:10px;right:10px;bottom:4px;height:2px;border-radius:2px;background:var(--accent);
  transform:scaleX(0);transform-origin:left center;transition:transform .18s ease-out}
.nav-pill:hover,.tab:hover,.nav-pill:focus-visible,.tab:focus-visible{color:var(--ink);background:var(--bg);text-decoration:none}
/* Sign in stands out like the primary button (owner, 12 Oct 2026): a filled turquoise pill with a key */
.nav-pill.signin{color:#fff;border-radius:999px;background:linear-gradient(120deg,var(--accent-ink),var(--accent));padding:11px 18px;box-shadow:0 8px 18px rgba(10,115,135,.28);font-family:var(--display)}
.nav-pill.signin::before{content:'🔑';font-size:15px}
.nav-pill.signin::after{display:none}
.nav-pill.signin:hover,.nav-pill.signin:focus-visible{color:#fff;background:linear-gradient(120deg,var(--accent-ink),var(--accent));translate:0 -2px}
.nav-pill:hover::after,.tab:hover::after,.nav-pill:focus-visible::after,.tab:focus-visible::after,.nav-pill.on::after,.tab.on::after{transform:scaleX(1)}
.nav-pill.on,.tab.on{color:var(--accent-ink);background:var(--bg)}
.nav-pill .ic{display:none;margin:0;color:var(--accent-ink)}
.tab .ic{display:none;margin:0;color:var(--accent-ink)}
.site-head :is(a,button):focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.h-av{width:40px;height:40px;margin-left:4px;border-radius:50%;display:grid;place-items:center;position:relative;font:800 16px var(--display);color:var(--on-warm);
  background:linear-gradient(135deg,var(--gold),var(--coral));box-shadow:0 4px 12px rgba(233,184,90,.45);transition:box-shadow .16s ease-out}
.h-av:hover,.h-av:focus-visible{text-decoration:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--accent),0 4px 12px rgba(233,184,90,.45)}
/* The count of saved legs on the Planner: gold with the dark kit ink, as the beta tag. */
.tab .tb-badge{margin-left:2px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--gold);color:#5C3D0C;
  font:800 11.5px/20px var(--sans);text-align:center}
/* The tip: a dark card under the item, centred; at the right end (Feedback, Sign in, the avatar) it hangs from the item's right edge so it never leaves the window. */
.tip{--tx:-50%;position:absolute;top:calc(100% + 9px);left:50%;translate:var(--tx) -4px;z-index:50;pointer-events:none;opacity:0;visibility:hidden;
  font:600 13px/1.35 var(--sans);color:#fff;background:var(--ink);padding:8px 12px;border-radius:10px;white-space:nowrap;letter-spacing:0;text-transform:none;
  box-shadow:0 10px 24px rgba(7,58,71,.28);transition:opacity .15s ease-out,translate .15s ease-out,visibility 0s linear .15s}
.tip::before{content:"";position:absolute;top:-4px;left:50%;width:10px;height:10px;background:var(--ink);translate:-50% 0;rotate:45deg;border-radius:2px}
.ng-end .tip,.h-av .tip{--tx:0;left:auto;right:0}
.ng-end .tip::before,.h-av .tip::before{left:auto;right:16px;translate:0 0}
:is(.nav-pill,.tab,.h-av,.head-cta):hover>.tip{opacity:1;visibility:visible;translate:var(--tx) 0;transition-delay:.35s,.35s,0s}
:is(.nav-pill,.tab,.h-av,.head-cta):focus-visible>.tip{opacity:1;visibility:visible;translate:var(--tx) 0;transition-delay:0s}
@media(hover:none){.site-head .tip{display:none}}
@media(prefers-reduced-motion:reduce){
  .nav-pill,.tab,.nav-pill::after,.tab::after,.h-av,.head-cta,.tip{transition:none}
  .head-cta:hover,.head-cta:active{translate:0 0;scale:1}
}
@media(min-width:1800px){
  .site-head{gap:10px;padding:0 26px}
  .brand{font-size:20px;margin-right:16px}
  .nav-pill .ic{display:inline-block}
  .nav-pill,.tab{font-size:14px;padding:9px 13px}
  .nav-pill::after,.tab::after{left:13px;right:13px}
  .ng{gap:4px}
  .hnav{gap:10px}
  .h-av{width:42px;height:42px;font-size:17px}
  .head-cta{min-height:42px;padding:0 22px;font-size:14px}
}
@media(max-width:1799px){.brand .beta{display:none}}
/* The tight band (1320 to 1439): eleven things on one row at 13 px with nothing under 13 px, so the air
   between them gives a little instead (measured in the app: 1,284 px needed at the normal spacing, about 1,230 here). */
@media(min-width:1320px) and (max-width:1439px){
  .brand{margin-right:4px}
  .hnav{gap:4px}
  .nav-pill,.tab{padding:8px 7px}
  .nav-pill::after,.tab::after{left:7px;right:7px}
  .head-cta{padding:0 13px}
  .h-av{margin-left:2px}
}
/* sweep9 finding 14 (24 Oct 2026): four plain site links and a More button, so the wide bar reads at 15 px (16 px from
   1800) instead of eleven items at 13 px. More opens a small list under it (a tap, Enter or Space; Escape or a tap elsewhere
   closes it); each item there shows its tip under its name. Mirrors web/src/styles.css (.tb-more). In the narrow panel
   (below 1320) the button hides and the three items are listed in place. */
.nav-more{position:relative;display:flex}
.more-car{width:6px;height:6px;margin:-3px 0 0 1px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;rotate:45deg;transition:rotate .15s ease-out}
.nav-more.open .more-car{rotate:-135deg;margin-top:3px}
.nav-more.open .more-btn>.tip{display:none}
@media(min-width:1320px){
  .hnav-more :is(.nav-pill,.tab){font-size:15px}
  .hnav-more .head-cta{font-size:15px}
  .more-list{display:none;position:absolute;top:calc(100% + 8px);right:0;z-index:60;width:300px;flex-direction:column;align-items:stretch;gap:2px;
    padding:8px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 30px rgba(8,60,80,.16)}
  .nav-more.open .more-list{display:flex}
  .more-list .nav-pill{display:grid;grid-template-columns:22px minmax(0,1fr);grid-template-areas:"ic t" "ic d";column-gap:10px;row-gap:2px;
    align-items:center;white-space:normal;padding:10px 12px;border-radius:10px;text-align:left}
  .more-list .nav-pill::after{display:none}
  .more-list .nav-pill>.ic{grid-area:ic;display:block;width:20px;height:20px;margin:0;align-self:start}
  .more-list .nl-t{grid-area:t}
  .site-head .more-list .nav-pill>.tip{--tx:0;grid-area:d;position:static;display:block;translate:none;opacity:1;visibility:visible;transition:none;
    background:none;box-shadow:none;padding:0;border-radius:0;color:var(--dim);font:500 13.5px/1.35 var(--sans);white-space:normal;text-align:left}
  .more-list .tip::before{display:none}
}
@media(min-width:1800px){
  .hnav-more :is(.nav-pill,.tab){font-size:16px}
  .hnav-more .head-cta{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.more-car{transition:none}}
/* Narrow windows, tablets and phones: brand, avatar and a Menu button. The groups live in a dropdown
   panel under the bar in the same order: Find legs on top, the tinted "you" block, the site links, then
   Feedback and Sign in at the bottom. One row at every width, so the bar is sticky everywhere.
   THE PANEL IS ONE LIST (owner, 15 Oct 2026: at about 640 px the text ran off the screen and the rows looked
   misaligned). Every row, Find legs and Sign in included, is the same grid across the full width of the panel:
   a fixed 22 px icon column, then the title with its one-line explanation stacked under it, both wrapping. The
   tooltip's hover rules (centring by translate -50%) must not reach the explanation here: they slid its words
   half their width off the left edge. Mirrors web/src/styles.css; menuwidthtest.mjs measures both. */
@media(max-width:1319px){
  .site-head{height:60px;padding:0 16px;gap:10px}
  .brand{margin-right:auto}
  .h-av{width:42px;height:42px;font-size:17px;margin:0}
  .menu-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:11px;
    background:#fff;border:1.5px solid var(--line);color:var(--ink);font:700 14px var(--sans);cursor:pointer}
  .menu-btn:hover,.site-head.open .menu-btn{border-color:var(--accent-ink);color:var(--accent-ink)}
  .menu-btn .ic{margin:0}
  .hnav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:6px;
    padding:12px 16px 16px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(8,60,80,.16);
    max-height:calc(100vh - 60px);max-height:calc(100dvh - 60px);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}
  .site-head.open .hnav{display:flex}
  .ng{flex-direction:column;align-items:stretch;gap:2px}
  .ng-you{margin-top:2px;padding:4px 0;border:0;border-radius:14px;box-shadow:inset 0 0 0 1px var(--line)}
  .ng-site{margin-top:2px}
  .nav-more,.more-list{display:contents}
  .hnav .nav-pill.more-btn{display:none}
  .ng-end{margin:4px 0 0;padding-top:10px;border-top:1px solid var(--line);gap:8px}
  .hnav :is(.head-cta,.tab,.nav-pill){display:grid;grid-template-columns:22px minmax(0,max-content) minmax(0,1fr);grid-template-areas:"ic t b" "ic d d";
    column-gap:12px;row-gap:2px;align-items:center;justify-items:start;align-content:center;
    width:100%;min-width:0;min-height:52px;margin:0;padding:10px 14px;border:0;border-radius:12px;box-sizing:border-box;
    text-align:left;white-space:normal;font:700 16px/1.3 var(--sans)}
  .hnav :is(.head-cta,.tab,.nav-pill)::after{display:none}
  .hnav :is(.head-cta,.tab,.nav-pill)>.ic{grid-area:ic;display:block;width:20px;height:20px;margin:0;justify-self:center;align-self:start}
  .hnav :is(.nl-t,.cta-t){grid-area:t;min-width:0;overflow-wrap:anywhere}
  .hnav .tb-badge{grid-area:b;margin:0 0 0 -4px}
  .site-head .hnav :is(.head-cta,.tab,.nav-pill)>.tip{grid-area:d;position:static;display:block;width:auto;max-width:100%;min-width:0;
    translate:none;opacity:1;visibility:visible;transition:none;background:none;box-shadow:none;padding:0;border-radius:0;
    color:var(--dim);font:500 13.5px/1.35 var(--sans);white-space:normal;overflow-wrap:anywhere;text-align:left}
  .hnav .tip::before{display:none}
  .hnav .head-cta{font:700 16px/1.3 var(--display)}
  .site-head .hnav .head-cta>.tip{color:var(--on-warm);font-weight:600}
  .hnav .head-cta:is(:hover,:focus-visible,:active),.hnav .nav-pill.signin:is(:hover,:focus-visible){translate:none;scale:none}
  .hnav .nav-pill.signin{font:700 16px/1.3 var(--display);color:#fff;background:linear-gradient(120deg,#075E73,#0A7387);box-shadow:0 8px 18px rgba(10,115,135,.24)}
  .hnav .nav-pill.signin::before{grid-area:ic;justify-self:center;align-self:start;font-size:16px;line-height:20.8px}
  .site-head .hnav .nav-pill.signin>.tip{color:#E3F5F9}
  .site-head .hnav .nav-pill.signin:is(:hover,:focus-visible){color:#fff;background:linear-gradient(120deg,#064F61,#086577)}
  /* The avatar sits in the bar here, not in the panel: its hidden tooltip would still count toward the
     page's scroll width (measured 425 px on a 390 px phone), so it has none. */
  .h-av .tip{display:none}
}
@media(max-width:600px){
  .site-head{padding:0 12px;gap:8px}
  .hnav{padding:10px 12px 14px}
  .brand{font-size:15px;gap:7px}
  .brand .mark{width:30px;height:30px;font-size:15px}
  .h-av{width:34px;height:34px;font-size:14px}
}
@media(max-width:420px){
  .brand{font-size:14px;gap:6px}
  .brand .mark{width:28px;height:28px;font-size:14px}
  .menu-txt{display:none}
  .menu-btn{padding:0 11px}
}
@media(max-width:600px){
  .wrap{padding:8px 16px 60px}
  /* Nothing under 12px on a phone, and footer links get a tappable box rather than being 17px
     of underlined text wedged between two others. */
  .disc{font-size:14px}
  .site-foot{font-size:14px;padding:22px 16px}
  .foot-links{gap:0 18px}
  .site-foot .foot-links a{display:inline-block;padding:11px 0}
}
.wrap{max-width:calc(var(--w-text) + 2 * var(--w-gutter));margin:0 auto;padding:8px 26px 70px}
.wrap.wide{max-width:calc(var(--w-data) + 2 * var(--w-gutter))}
/* Drawn on big monitors only (wide.mjs): a contents list or related links beside a page of text. */
.rail{display:none}
.crumb{font-size:14px;color:var(--dim);margin:10px 0 20px}
/* sweep6: a breadcrumb link is 17-19px of text; its tap box is 44px tall (padding cancelled by margin, so the line does not grow) */
.crumb a,.crumbs a{display:inline-block;padding:13px 0;margin:-13px 0}
h1{font:900 40px/1.1 var(--display);letter-spacing:-.5px;margin:6px 0 14px}
.dek{font-size:20px;color:var(--sea);font-weight:500;margin:0 0 22px}
.endcta{margin:44px 0 0;padding:26px;border-radius:18px;text-align:center;background:linear-gradient(135deg,#0C7F96,#08536F);color:#fff}
.endcta h3{font:900 24px var(--display);margin:0 0 8px}
/* main p is capped at 90ch and sits at the left of its box: centre the box too, or on a wide screen the sentence drifts off the heading's axis. */
.endcta p{color:#fff;font-weight:600;margin:0 auto 16px;font-size:15px}
.endcta a{display:inline-block;background:#fff;color:var(--sea);font-weight:800;font-size:15px;padding:12px 26px;border-radius:12px}
.endcta a:hover{text-decoration:none;background:#F1FAFB}
.l2lc{margin:26px 0;padding:20px 22px;border-radius:16px;border:1.5px solid var(--accent);background:linear-gradient(180deg,#F2FBFD,#EAF6F9)}
.l2lc .k{font:700 13px var(--sans);letter-spacing:.6px;text-transform:uppercase;color:var(--accent-ink)}
.l2lc h3,.l2lc h2{font:800 19px var(--display);margin:6px 0 8px;color:var(--ink)}
.lb-links{margin:8px 0 0;padding-left:22px;line-height:1.7;font-size:17px}
.l2lc p{font-size:15px;color:var(--sea);margin:0 0 14px}
.l2lc a.btn{display:inline-block;background:var(--accent);color:#fff;font-weight:700;font-size:14px;padding:10px 18px;border-radius:10px}
.l2lc a.btn:hover{background:var(--accent2);text-decoration:none}
.disc{font-size:14px;color:var(--dim);margin-top:34px;padding-top:16px;border-top:1px solid var(--line);line-height:1.6}
.site-foot{max-width:calc(var(--w-data) + 2 * var(--w-gutter));margin:0 auto;padding:26px;color:var(--dim);font-size:14px;line-height:1.6;border-top:1px solid var(--line);text-align:center}
.site-foot a{color:var(--accent-ink)}
.site-foot p{margin:0}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 22px}
.foot-links a{display:inline-block;padding:6px 0;font-weight:600}
.foot-tag{margin-top:10px!important;text-wrap:balance}
.foot-note{margin-top:6px!important;max-width:760px;margin-left:auto!important;margin-right:auto!important;text-wrap:pretty}
.nb{white-space:nowrap}
main p,main li,main dd{max-width:90ch}
h1,h2,h3{text-wrap:balance}
@media(max-width:720px){h1{font-size:30px}}
:root{--lk-bg: #EAF6F9;--lk-panel: #FFFFFF;--lk-panel-2: #F1FAFB;--lk-line: #D3E7EC;--lk-ink: #073A47;--lk-dim: #4A6E7A;--lk-sea: #08536F;--lk-accent: #0A7387;--lk-accent-2: #12B0CE;--lk-coral: #FF6E7B;--lk-coral-ink: #C0392F;--lk-gold: #E9B85A;--lk-gold-ink: #7A5312;--lk-on-warm: #0B2530;--lk-warm-1: #FFF8E4;--lk-warm-2: #FFE7B0;--lk-warm-ink: #6B4508;--lk-good: #1B7A57;--lk-good-bg: #E2F5EC;--lk-sold: #B02A3C;--lk-sold-bg: #FDECEE;--lk-leg-1: #0E9BB5;--lk-leg-2: #FF6E7B;--lk-leg-3: #E9B85A;--lk-leg-4: #08536F;--lk-on-leg-4: #FFFFFF;--lk-rim-hi: rgba(255,255,255,.95);--lk-rim-lo: rgba(10,70,90,.20);--lk-emboss: inset 1.5px 1.5px 0 var(--lk-rim-hi), inset -1.5px -1.5px 0 var(--lk-rim-lo);--lk-drop-1: 0 6px 18px rgba(8,83,111,.10);--lk-drop-2: 0 18px 40px rgba(8,83,111,.22);--lk-foam-1: rgba(255,255,255,.75);--lk-foam-2: rgba(255,255,255,.35);--lk-drop-lift: 0 8px 22px rgba(8,83,111,.16);--lk-spread: 0 26px 44px rgba(8,83,111,.30);--lk-bar-sh: 0 4px 7px rgba(8,83,111,.28);--lk-bar-sh2: 0 14px 18px rgba(8,83,111,.28);--lk-r-s: 10px;--lk-r-m: 16px;--lk-r-l: 24px;--lk-display: 'Unbounded', 'Unbounded Fallback', system-ui, sans-serif;--lk-sans: 'Space Grotesk', 'Space Grotesk Fallback', system-ui, sans-serif;--lk-fs-0: 12px;--lk-fs-1: 13.5px;--lk-fs-2: 15px;--lk-fs-3: 17px;--lk-fs-4: 20px;--lk-fs-5: clamp(22px, 1.1vw + 14px, 30px);--lk-fs-6: clamp(28px, 2vw + 14px, 46px);--lk-fs-7: clamp(34px, 3vw + 14px, 64px);--lk-spring: cubic-bezier(.3, 1.45, .5, 1);--lk-glide: cubic-bezier(.45, 0, .2, 1);--lk-t-fly: .9s;--lk-t-lift: .9s;--lk-step: 90ms}@media (min-width: 1760px){:root{--lk-fs-0: 14px;--lk-fs-1: 15px;--lk-fs-2: 17px;--lk-fs-3: 19px}}@media (min-width: 2200px){:root{--lk-fs-0: 16px;--lk-fs-1: 18px;--lk-fs-2: 20px;--lk-fs-3: 23px;--lk-fs-4: 26px}}@supports (animation-timing-function: linear(0, 1)){:root{--lk-spring: linear(0, .251 3.3%, .51 6.7%, .739 10%, .918 13.3%, 1.042 16.7%, 1.115 20%, 1.145 23.3%, 1.145 26.7%, 1.126 30%, 1.097 33.3%, 1.065 36.7%, 1.037 40%, 1.014 43.3%, .998 46.7%, .988 50%, .983 53.3%, .982 56.7%, .984 60%, .988 63.3%, .991 66.7%, .995 70%, .998 73.3%, 1 76.7%, 1.002 86.7%, 1)}}.lk-night{--lk-bg: #06303D;--lk-panel: #0B4252;--lk-panel-2: #0E4C5F;--lk-line: rgba(127,230,240,.20);--lk-ink: #E6FAFD;--lk-dim: #9FDDE6;--lk-sea: #BDEFF5;--lk-accent: #7FE6F0;--lk-coral-ink: #FFB0B8;--lk-gold-ink: #FFD98A;--lk-good: #7BE0B4;--lk-good-bg: rgba(123,224,180,.14);--lk-sold: #FFA3AE;--lk-sold-bg: rgba(255,110,123,.16);--lk-leg-1: #BDEFF5;--lk-leg-4: #7FE6F0;--lk-on-leg-4: #0B2530;--lk-rim-hi: rgba(255,255,255,.22);--lk-rim-lo: rgba(0,0,0,.42);--lk-drop-1: 0 6px 18px rgba(0,0,0,.35);--lk-drop-2: 0 18px 40px rgba(2,26,34,.55);--lk-foam-1: rgba(255,255,255,.07);--lk-foam-2: rgba(255,255,255,.02);--lk-drop-lift: 0 8px 22px rgba(0,0,0,.4);--lk-spread: 0 26px 44px rgba(0,0,0,.5);--lk-bar-sh: 0 4px 7px rgba(0,0,0,.4);--lk-bar-sh2: 0 14px 18px rgba(0,0,0,.4)}.lk-paper{--lk-bg: #EAF6F9;--lk-panel: #FFFFFF;--lk-panel-2: #F1FAFB;--lk-line: #D3E7EC;--lk-ink: #073A47;--lk-dim: #4A6E7A;--lk-sea: #08536F;--lk-accent: #0A7387;--lk-coral-ink: #C0392F;--lk-gold-ink: #7A5312;--lk-good: #1B7A57;--lk-good-bg: #E2F5EC;--lk-sold: #B02A3C;--lk-sold-bg: #FDECEE;--lk-leg-1: #0E9BB5;--lk-leg-4: #08536F;--lk-on-leg-4: #FFFFFF;--lk-rim-hi: rgba(255,255,255,.95);--lk-rim-lo: rgba(10,70,90,.20);--lk-drop-1: 0 6px 18px rgba(8,83,111,.10);--lk-drop-2: 0 18px 40px rgba(8,83,111,.22);color: var(--lk-ink)}.lk-card-warm, .lk-stat-warm, .lk-band-sand, .lk-badge-away{--lk-ink: #6B4508;--lk-dim: #7C5C1E;--lk-sea: #7C5C1E;--lk-accent: #8A5E10;--lk-line: rgba(150,105,25,.25)}.lk-h1{font: 900 var(--lk-fs-7)/1.05 var(--lk-display);letter-spacing: -.5px;color: var(--lk-ink);margin: 0;text-wrap: balance}.lk-h2{font: 800 var(--lk-fs-5)/1.15 var(--lk-display);color: var(--lk-ink);margin: 0;text-wrap: balance}.lk-lead{font: 500 var(--lk-fs-4)/1.5 var(--lk-sans);color: var(--lk-sea);margin: 0;max-width: 62ch}.lk-small{font: 500 var(--lk-fs-1)/1.5 var(--lk-sans);color: var(--lk-dim)}.lk-card{position: relative;background: var(--lk-panel);color: var(--lk-ink);border: 1px solid var(--lk-line);border-radius: var(--lk-r-m);padding: var(--lk-pad, 20px);box-shadow: var(--lk-emboss), var(--lk-drop-1)}a.lk-card, .lk-lift{text-decoration: none;transition: translate .6s var(--lk-spring), box-shadow .25s ease}a.lk-card:hover, a.lk-card:focus-visible, .lk-lift:hover{translate: 0 -6px;box-shadow: var(--lk-emboss), var(--lk-drop-2);text-decoration: none}a.lk-card:active{translate: 0 -1px;transition-duration: .08s}.stat-row .stat{box-shadow: var(--lk-emboss), var(--lk-drop-1)}.lk-money b{font-weight: 800;font-variant-numeric: tabular-nums}.lk-money small{font: 500 var(--lk-fs-0)/1.3 var(--lk-sans);color: var(--lk-dim)}.lk-money{white-space: normal}.lk-badge{display: inline-flex;align-items: center;gap: 6px;min-height: 24px;padding: 2px 10px;border-radius: 999px;font: 700 calc(var(--lk-fs-0) + .5px)/1.3 var(--lk-sans);letter-spacing: .2px;white-space: nowrap;background: var(--lk-panel-2);color: var(--lk-sea);box-shadow: inset 1px 1px 0 var(--lk-rim-hi), inset -1px -1px 0 var(--lk-rim-lo)}.lk-badge-good{background: var(--lk-good-bg);color: var(--lk-good)}.lk-badge-sold{color: var(--lk-sold);background: repeating-linear-gradient(135deg, var(--lk-sold-bg) 0 6px, transparent 6px 12px), var(--lk-panel)}.lk-badge-sold::before{content: '';width: 10px;height: 10px;border-radius: 50%;border: 2px solid currentColor;background: linear-gradient(45deg, transparent 42%, currentColor 42% 58%, transparent 58%)}.lk-btn{display: inline-flex;align-items: center;justify-content: center;gap: 8px;min-height: 48px;padding: 0 28px;border: 0;border-radius: 999px;cursor: pointer;text-decoration: none;white-space: nowrap;font: 700 16px/1 var(--lk-display);color: var(--lk-on-warm);background: linear-gradient(120deg, var(--lk-coral), var(--lk-gold));box-shadow: inset 0 1.5px 0 rgba(255,255,255,.55), inset 0 -1.5px 0 rgba(120,60,20,.25), 0 8px 18px rgba(255,110,123,.35);transition: translate .5s var(--lk-spring), scale .5s var(--lk-spring), box-shadow .25s ease}.lk-btn:hover{translate: 0 -2px;text-decoration: none;color: var(--lk-on-warm);box-shadow: inset 0 1.5px 0 rgba(255,255,255,.55), inset 0 -1.5px 0 rgba(120,60,20,.25), 0 13px 26px rgba(255,110,123,.45)}.lk-btn:active{translate: 0 0;scale: .97;transition-duration: .08s}.lk-btn-2, .lk-btn-outline{background: var(--lk-panel);color: var(--lk-sea);box-shadow: inset 0 0 0 2px var(--lk-accent), var(--lk-drop-1)}.lk-btn-2:hover, .lk-btn-outline:hover{color: var(--lk-ink);box-shadow: inset 0 0 0 2px var(--lk-accent), var(--lk-drop-2)}.lk-btn-s{min-height: 44px;padding: 0 20px;font-size: 14px}@media (max-width: 600px){.lk-btn-wide{display: flex;width: 100%}}.lk-band{position: relative;padding: clamp(28px, 4vw, 64px) var(--w-gutter, 26px)}.lk-frame{max-width: var(--w-data, 1700px);margin: 0 auto}.lk-band-foam{background: linear-gradient(180deg, var(--lk-foam-1), var(--lk-foam-2));border-block: 1px solid var(--lk-line)}.lk-band-sand{background: linear-gradient(150deg, var(--lk-warm-1), #FFEFC9)}.lk-band-sea{color: var(--lk-ink);background: linear-gradient(160deg, #0D5568, #0A3D4E);padding-top: calc(clamp(28px, 4vw, 64px) + 14px);-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='16'%3E%3Cpath d='M0 16V8Q15 0 30 8T60 8T90 8T120 8V16Z'/%3E%3C/svg%3E") top left / 120px 16px repeat-x, linear-gradient(#000, #000) bottom / 100% calc(100% - 15px) no-repeat;mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='16'%3E%3Cpath d='M0 16V8Q15 0 30 8T60 8T90 8T120 8V16Z'/%3E%3C/svg%3E") top left / 120px 16px repeat-x, linear-gradient(#000, #000) bottom / 100% calc(100% - 15px) no-repeat}.lk-routebox{container-type: inline-size}.lk-route{--d: 1.1s;--gap: calc(var(--d) * .68);--ld: .12s;--lf: .6s;--top: 94px;--dot: 22px;--ring: 4px;--bar: 16px;--sw: 124px;--sh: 52px;--sl: var(--sw);--dock: 6px;--sink: 5px;--lift: 16px;--sd: calc(.25s + (var(--legs, 1) - 1) * (var(--d) + var(--gap)) + var(--d) + var(--ld) + var(--lf) + .25s);--to: calc(var(--dot) / -2 - var(--dock) + 2px);position: relative;display: flex;margin: 0;padding: 0 calc(var(--dot) / 2);list-style: none}.lk-route::before{content: '';position: absolute;left: calc(var(--dot) / 2);right: calc(var(--dot) / 2);top: calc(var(--top) + (var(--dot) - var(--bar)) / 2);height: var(--bar);border-radius: 999px;background: var(--lk-panel-2);box-shadow: inset 0 1.5px 2px rgba(7,58,71,.18)}.lk-leg{--lift: 12px;--k: 0;--t: calc(.25s + var(--k) * (var(--d) + var(--gap)));flex: var(--n, 7) 1 0;position: relative;min-width: 0;display: flex;flex-direction: column;padding: calc(var(--top) + var(--dot) + 14px) 0 0}.lk-leg:nth-child(2){--k: 1}.lk-leg:nth-child(3){--k: 2}.lk-leg:nth-child(4){--k: 3}.lk-leg:nth-child(5){--k: 4}.lk-leg:nth-child(6){--k: 5}.lk-leg:nth-child(7){--k: 6}.lk-leg:nth-child(8){--k: 7}.lk-bar{position: absolute;left: 0;right: 0;top: calc(var(--top) + (var(--dot) - var(--bar)) / 2);height: var(--bar);border-radius: 999px;background: var(--c, var(--lk-leg-1));box-shadow: inset 0 2px 0 rgba(255,255,255,.55), inset 0 -2px 0 rgba(0,0,0,.20), var(--lk-bar-sh)}.lk-lane{--from: calc(-100% + var(--to));position: absolute;left: 0;right: 0;top: var(--top);height: var(--dot);pointer-events: none;opacity: 0;transform: translateX(var(--to))}.lk-leg:first-child > .lk-lane{--from: min(calc(-100% + var(--sl) + var(--dot) + var(--dock)), var(--to))}.lk-leg:last-child > .lk-lane{opacity: 1}.lk-lane::before{content: '';position: absolute;right: calc(var(--sw) - 8px);top: calc((var(--dot) - 6px) / 2);width: 64px;height: 6px;border-radius: 999px;opacity: 0;background: linear-gradient(90deg, rgba(255,255,255,0), #FFF);box-shadow: 0 0 8px rgba(255,255,255,.7)}.lk-ship{position: absolute;right: 0;top: calc((var(--dot) - var(--bar)) / 2 + var(--sink) - var(--sh) * .925);width: var(--sw);height: var(--sh);overflow: visible;filter: drop-shadow(0 0 1px var(--lk-sea)) drop-shadow(0 3px 3px rgba(7,58,71,.35))}.lk-stop{position: absolute;top: 0;display: flex;flex-direction: column;justify-content: flex-end;height: calc(var(--top) - var(--sh) * .925 - 1px);white-space: nowrap;z-index: 1}.lk-stop.lk-start{left: calc(var(--dot) / -2);text-align: left;align-items: flex-start}.lk-stop.lk-end{right: 0;translate: 50% 0;text-align: center;align-items: center}.lk-leg:last-child > .lk-stop.lk-end{right: calc(var(--dot) / -2);translate: 0 0;text-align: right;align-items: flex-end}.lk-stop b{font: 700 var(--lk-fs-2)/1.2 var(--lk-sans);color: var(--lk-ink)}.lk-stop span{font: 500 var(--lk-fs-0)/1.3 var(--lk-sans);color: var(--lk-dim)}.lk-stop i{position: absolute;top: var(--top);box-sizing: border-box;width: var(--dot);height: var(--dot);border-radius: 50%;background: #FFF;border: var(--ring) solid var(--lk-sea);box-shadow: 0 2px 5px rgba(7,58,71,.3)}.lk-stop.lk-start i{left: 0}.lk-stop.lk-end i{left: 50%;margin-left: calc(var(--dot) / -2)}.lk-leg:last-child > .lk-stop.lk-end i{left: auto;right: 0;margin: 0}.lk-stop.lk-turn i{background: var(--lk-gold)}.lk-stop.lk-away i{background: var(--lk-coral)}.lk-route.lk-rows2{--top: calc(94px + var(--lk-fs-2) * 1.2 + var(--lk-fs-0) * 1.3 + 8px)}.lk-stop.lk-end.lk-al{right: calc(var(--dot) / -2);translate: 0 0;text-align: right;align-items: flex-end}.lk-stop.lk-end.lk-ar{right: auto;left: calc(100% - var(--dot) / 2);translate: 0 0;text-align: left;align-items: flex-start}.lk-stop.lk-al i{left: auto;right: 0;margin: 0}.lk-stop.lk-ar i{left: 0;margin: 0}.lk-stop.lk-up{height: calc(var(--top) - var(--sh) * .925 - 1px - var(--lk-fs-2) * 1.2 - var(--lk-fs-0) * 1.3 - 8px)}.lk-legtext{flex: 1 1 auto;display: grid;grid-template-columns: 26px minmax(0, 1fr);gap: 10px;align-items: start;margin: 0 6px;padding: 10px 12px;text-align: left;background: var(--lk-panel);border: 1px solid var(--lk-line);border-radius: 14px;box-shadow: var(--lk-emboss), var(--lk-drop-1)}.lk-legno{display: grid;place-items: center;width: 26px;height: 26px;border-radius: 50%;background: var(--lk-leg-1);color: var(--lk-on-warm);font: 800 max(13px, var(--lk-fs-0))/1 var(--lk-display);font-style: normal;box-shadow: inset 0 1.5px 0 rgba(255,255,255,.5), inset 0 -1.5px 0 rgba(0,0,0,.18)}.lk-leg:nth-child(4n+2) .lk-legno{background: var(--lk-leg-2)}.lk-leg:nth-child(4n+3) .lk-legno{background: var(--lk-leg-3)}.lk-leg:nth-child(4n) .lk-legno{background: var(--lk-leg-4);color: var(--lk-on-leg-4)}.lk-legwords{display: flex;flex-direction: column;gap: 1px;min-width: 0}.lk-legcap{font: 700 var(--lk-fs-0)/1.3 var(--lk-sans);font-style: normal;letter-spacing: 1.4px;text-transform: uppercase;color: var(--lk-accent);overflow-wrap: anywhere}.lk-legwords > b{font: 800 var(--lk-fs-3)/1.2 var(--lk-display);color: var(--lk-ink);overflow-wrap: anywhere}.lk-legwords > span{font: 500 var(--lk-fs-1)/1.35 var(--lk-sans);color: var(--lk-dim);overflow-wrap: anywhere}.lk-legfare .lk-money{display: block}.lk-legfare{font-style: normal;display: flex;flex-direction: column;margin-top: 4px}.lk-legwords > .lk-legfare b{font: 800 var(--lk-fs-4)/1.15 var(--lk-display);color: var(--lk-gold-ink);font-variant-numeric: tabular-nums;overflow-wrap: anywhere}.lk-legwords > .lk-legfare small{font: 500 var(--lk-fs-0)/1.3 var(--lk-sans);color: var(--lk-dim)}.lk-route.lk-mini{--d: .55s;--gap: .62s;--ld: .1s;--lf: .45s;--top: 14px;--dot: 16px;--ring: 3px;--bar: 10px;--sw: 48px;--sh: 20px;--sink: 3px;--lift: 8px;--lk-t-lift: .5s}.lk-mini .lk-leg{--lift: 6px;padding: calc(var(--top) + var(--dot) + 4px) 0 0}.lk-mini .lk-stop b, .lk-mini .lk-stop span, .lk-mini .lk-legtext{display: none}.lk-mini .lk-stop{height: 0}@container (max-width: 560px){.lk-route:not(.lk-mini){--cx: 32px;--pl: 68px;--stoph: 46px;--sw: 64px;--sh: 27px;--sl: var(--sh);--dock: 6px;flex-direction: column;padding: 0}.lk-route:not(.lk-mini)::before{left: calc(var(--cx) - var(--bar) / 2);right: auto;width: var(--bar);height: auto;top: calc(var(--dot) / 2);bottom: calc(var(--stoph) - var(--dot) / 2)}.lk-route:not(.lk-mini) .lk-leg{--bt: calc(var(--dot) / 2);--bb: calc(var(--stoph) - var(--dot) / 2);flex: none;display: flex;flex-direction: column;gap: 10px;text-align: left;padding: 0 0 0 var(--pl);min-height: calc(var(--n, 7) * 5px + 110px);justify-content: space-between}.lk-route:not(.lk-mini) .lk-leg + .lk-leg{--bt: calc(var(--dot) / 2 - var(--stoph))}.lk-route:not(.lk-mini) .lk-leg + .lk-leg .lk-legtext{margin-top: 12px}.lk-route:not(.lk-mini) .lk-legtext{margin: 0;flex: none}.lk-route:not(.lk-mini) .lk-lane::before{right: auto;left: calc(var(--dot) / 2 - 3px);top: auto;bottom: calc(var(--sh) / 2);width: 6px;height: 64px;background: linear-gradient(0deg, rgba(255,255,255,.9), rgba(255,255,255,0))}.lk-route:not(.lk-mini) .lk-bar{left: calc(var(--cx) - var(--bar) / 2);right: auto;top: var(--bt);bottom: var(--bb);width: var(--bar);height: auto}.lk-route:not(.lk-mini) .lk-lane{left: calc(var(--cx) - var(--dot) / 2);right: auto;top: var(--bt);bottom: var(--bb);width: var(--dot);height: auto;transform: translateY(var(--to))}.lk-route:not(.lk-mini) .lk-ship{right: auto;left: calc(var(--dot) / 2 - var(--sw) / 2);top: calc(100% - var(--sh) + 2px)}.lk-route:not(.lk-mini) .lk-stop{position: relative;height: var(--stoph);justify-content: flex-start;translate: 0 0 !important;text-align: left !important;align-items: flex-start !important;white-space: normal;left: 0;right: auto !important}.lk-route:not(.lk-mini) .lk-stop.lk-start{order: -1}.lk-route:not(.lk-mini) .lk-stop i{left: calc(var(--cx) - var(--pl) - var(--dot) / 2) !important;right: auto !important;top: 0;margin: 0 !important}}.lk-stage{position: relative;isolation: isolate;overflow: hidden;padding: clamp(18px, 2.4vw, 36px) clamp(18px, 2.4vw, 36px) calc(clamp(18px, 2.4vw, 36px) + 22px);border-radius: var(--lk-r-l);color: var(--lk-ink);--lk-spread: 0 26px 44px rgba(0,0,0,.55);--lk-bar-sh: 0 5px 8px rgba(0,0,0,.45);--lk-bar-sh2: 0 14px 18px rgba(0,0,0,.50);background: linear-gradient(160deg, #0D5568, #0A3D4E);box-shadow: var(--lk-emboss), 0 22px 50px rgba(2,26,34,.40)}.lk-stage > *{position: relative;z-index: 1}.lk-stage::before, .lk-stage::after{content: '';position: absolute;inset: 0;border-radius: inherit;pointer-events: none;z-index: 0}.lk-stage::before{background: radial-gradient(60% 75% at 32% 8%, rgba(190,245,250,.30), transparent 70%)}.lk-stage::after{background: radial-gradient(circle 70px at 86% 84%, rgba(190,245,250,.10) 0 62%, rgba(190,245,250,.03) 100%), radial-gradient(circle 38px at 94% 58%, rgba(190,245,250,.08) 0 62%, rgba(190,245,250,.02) 100%), radial-gradient(circle 26px at 70% 92%, rgba(190,245,250,.07) 0 62%, rgba(190,245,250,.02) 100%), linear-gradient(rgba(127,230,240,.09) 1px, transparent 1px) 0 0 / 48px 48px, linear-gradient(90deg, rgba(127,230,240,.09) 1px, transparent 1px) 0 0 / 48px 48px}.lk-stage .lk-route::before{background: rgba(255,255,255,.12);box-shadow: inset 0 1.5px 2px rgba(0,0,0,.35)}.lk-stage .lk-legtext:not(.lk-paper){--lk-emboss: inset 0 1px 0 rgba(255,255,255,.30);--lk-drop-1: 0 14px 28px rgba(0,0,0,.45);--lk-spread: 0 30px 46px rgba(0,0,0,.6);background: linear-gradient(180deg, #0E2A3A, #0A1E2B);border: 1px solid rgba(255,255,255,.08)}.lk-stage .lk-legtext:not(.lk-paper) .lk-legcap{color: #BDEFF5}.lk-stage .lk-legtext:not(.lk-paper) .lk-legwords > b{color: #FFF}.lk-stage .lk-legtext:not(.lk-paper) .lk-legwords > span{color: #F3E6C4}.lk-stage .lk-legtext:not(.lk-paper) .lk-legfare b{color: #F0D590}.lk-stage .lk-legtext:not(.lk-paper) .lk-legfare small{color: #F3E6C4}.lk-stage .lk-legtext.lk-paper{--lk-drop-1: 0 10px 24px rgba(0,0,0,.35);--lk-spread: 0 26px 44px rgba(0,0,0,.55)}.lk-stage{--lk-bar-sh: 0 0 0 2px rgba(4,30,40,.60), 0 6px 10px rgba(0,0,0,.35);--lk-bar-sh2: 0 0 0 2px rgba(4,30,40,.60), 0 14px 18px rgba(0,0,0,.50)}.lk-stage .lk-route:not(.lk-mini){--ring: 3px}.lk-stage .lk-stop i, .lk-stage .lk-stop.lk-turn i{background: #0E9BB5;border-color: #E9B85A;box-shadow: 0 3px 6px rgba(0,0,0,.45)}.lk-stage .lk-stop.lk-away i{background: var(--lk-coral)}.lk-stage .lk-stop b{font: 700 var(--lk-fs-1)/1.2 var(--lk-sans);letter-spacing: 1.2px;text-transform: uppercase;color: #FFF}.lk-stage .lk-stop span{color: #F3E6C4}.lk-stage .lk-ship{filter: drop-shadow(0 0 6px rgba(190,245,250,.55)) drop-shadow(0 6px 5px rgba(0,0,0,.45))}.lk-total{--d: 1.1s;--gap: calc(var(--d) * .68);--ld: .12s;--lf: .6s;--done: calc(.25s + (var(--legs, 1) - 1) * (var(--d) + var(--gap)) + var(--d) + var(--ld) + var(--lf) + .25s + var(--lk-t-lift) + .2s);position: relative;z-index: 1;display: flex;flex-direction: column;gap: 2px;width: fit-content;max-width: 100%;min-width: min(100%, 300px);margin-top: 36px;padding: 16px 24px 18px;border-radius: 14px;background: linear-gradient(180deg, #0E2A3A, #0A1E2B);border: 1px solid rgba(255,255,255,.08);box-shadow: inset 0 1px 0 rgba(255,255,255,.30), 0 14px 28px rgba(0,0,0,.45), 0 0 0 2px rgba(240,213,144,0), 0 0 26px rgba(240,213,144,0)}.lk-total > span{font: 700 var(--lk-fs-0)/1.3 var(--lk-sans);letter-spacing: 1.4px;text-transform: uppercase;color: #BDEFF5}.lk-total > b{font: 900 min(var(--lk-fs-6), calc((100cqi - 64px) / 7))/1.05 var(--lk-display);letter-spacing: -1px;font-variant-numeric: tabular-nums;color: #F0D590;white-space: nowrap}.lk-total > small{font: 500 var(--lk-fs-1)/1.4 var(--lk-sans);color: #F3E6C4}.lk-total > .lk-total-note{max-width: 46ch;margin-top: 6px}.lk-stage > .lk-stage-duck{position: absolute;z-index: 2;right: 16px;bottom: 8px}@keyframes lkFly{from{translate: 0 40px;scale: .94}to{translate: 0 0;scale: 1}}@keyframes lkFade{from{opacity: 0}to{opacity: 1}}@keyframes lkPop{from{scale: 0}to{scale: 1}}@keyframes lkDrawX{from{clip-path: inset(-40px calc(100% - var(--to)) -40px 0)}to{clip-path: inset(-40px 0 -40px 0)}}@keyframes lkDrawX1{from{clip-path: inset(-40px calc(100% - var(--sl) - var(--dot) - var(--dock)) -40px 0)}to{clip-path: inset(-40px 0 -40px 0)}}@keyframes lkDrawY{from{clip-path: inset(-40px -40px calc(100% - var(--to)) -40px)}to{clip-path: inset(-40px -40px 0 -40px)}}@keyframes lkDrawY1{from{clip-path: inset(-40px -40px calc(100% - var(--sl) - var(--dot) - var(--dock)) -40px)}to{clip-path: inset(-40px -40px 0 -40px)}}@keyframes lkSailX{from{transform: translateX(var(--from))}to{transform: translateX(var(--to))}}@keyframes lkSailY{from{transform: translateY(var(--from))}to{transform: translateY(var(--to))}}@keyframes lkOn{from{opacity: 0}to{opacity: 1}}@keyframes lkOff{from{opacity: 1}to{opacity: 0}}@keyframes lkLift{0%, 100%{translate: 0 0}10%{translate: 0 calc(var(--lift) * -.42)}20%{translate: 0 calc(var(--lift) * -.70)}30%{translate: 0 calc(var(--lift) * -.86)}40%{translate: 0 calc(var(--lift) * -.93)}50%{translate: 0 calc(var(--lift) * -.91)}60%{translate: 0 calc(var(--lift) * -.81)}70%{translate: 0 calc(var(--lift) * -.66)}80%{translate: 0 calc(var(--lift) * -.46)}90%{translate: 0 calc(var(--lift) * -.23)}}@keyframes lkSpread{25%, 60%{box-shadow: var(--lk-emboss), var(--lk-spread)}}@keyframes lkSpreadBar{25%, 60%{box-shadow: inset 0 2px 0 rgba(255,255,255,.55), inset 0 -2px 0 rgba(0,0,0,.20), var(--lk-bar-sh2)}}@keyframes lkAnswer{0%{scale: 1;animation-timing-function: var(--lk-spring)}35%{scale: 1.06;animation-timing-function: var(--lk-spring)}100%{scale: 1}}@keyframes lkGlow{to{box-shadow: inset 0 1px 0 rgba(255,255,255,.30), 0 14px 28px rgba(0,0,0,.45), 0 0 0 2px rgba(240,213,144,.55), 0 0 26px rgba(240,213,144,.35)}}@keyframes lkWake{0%{opacity: 0}18%{opacity: .9}80%{opacity: .9}100%{opacity: 0}}@keyframes lkZoom{from{scale: 1.07}to{scale: 1}}@keyframes lkBob{50%{transform: translateY(-3px) rotate(2.5deg)}}.lk-js .lk-fly{opacity: 0}.lk-js .lk-fly.lk-in{animation: lkFly var(--lk-t-fly) var(--lk-spring) calc(var(--i, 0) * var(--lk-step)) both, lkFade .25s ease-out calc(var(--i, 0) * var(--lk-step)) both}.lk-js .lk-zoom{animation: lkZoom 8s cubic-bezier(.2, .6, .2, 1) both;transform-origin: 50% 60%}.lk-js .lk-stage::before{opacity: 0}.lk-js .lk-stage.lk-in::before{animation: lkFade 1.2s ease-out both, lkZoom 8s cubic-bezier(.2, .6, .2, 1) both}.lk-js .lk-stage.lk-in::after{animation: lkZoom 8s cubic-bezier(.2, .6, .2, 1) both}.lk-js .lk-route .lk-bar{clip-path: inset(-40px 100% -40px 0)}.lk-js .lk-route .lk-stop.lk-end i{scale: 0}.lk-js .lk-route .lk-lane{opacity: 0}.lk-js .lk-route .lk-leg:first-child > .lk-lane{opacity: 1;transform: translateX(var(--from))}.lk-js .lk-route.lk-in .lk-bar{animation: lkDrawX var(--d) var(--lk-glide) var(--t) both, lkLift var(--lf) linear calc(var(--t) + var(--d) + var(--ld)) 1, lkSpreadBar var(--lf) linear calc(var(--t) + var(--d) + var(--ld)) 1, lkSpreadBar var(--lk-t-lift) linear var(--sd) 1}.lk-js .lk-route.lk-in .lk-leg:first-child > .lk-bar{animation-name: lkDrawX1, lkLift, lkSpreadBar, lkSpreadBar}.lk-js .lk-route.lk-in .lk-legtext{animation: lkLift var(--lf) linear calc(var(--t) + var(--d) + var(--ld)) 1, lkSpread var(--lf) linear calc(var(--t) + var(--d) + var(--ld)) 1, lkSpread var(--lk-t-lift) linear var(--sd) 1}.lk-js .lk-route.lk-in .lk-lane::before{animation: lkWake var(--d) linear var(--t) both}.lk-js .lk-route.lk-in .lk-ship{animation: lkLift var(--lf) linear calc(var(--t) + var(--d) + var(--ld)) 1}.lk-js .lk-route.lk-in .lk-stop.lk-end i{animation: lkPop var(--lk-t-fly) var(--lk-spring) calc(var(--t) + var(--d) - .1s) both}.lk-js .lk-route.lk-in .lk-lane{animation: lkSailX var(--d) var(--lk-glide) var(--t) both, lkOn .01s linear var(--t) both, lkOff .01s linear calc(var(--t) + var(--d) + var(--gap)) forwards}.lk-js .lk-route.lk-in .lk-leg:first-child > .lk-lane{animation: lkSailX var(--d) var(--lk-glide) var(--t) both, lkOff .01s linear calc(var(--t) + var(--d) + var(--gap)) forwards}.lk-js .lk-route.lk-in .lk-leg:last-child > .lk-lane{animation: lkSailX var(--d) var(--lk-glide) var(--t) both, lkOn .01s linear var(--t) both}.lk-js .lk-route.lk-in .lk-leg:first-child:last-child > .lk-lane{animation: lkSailX var(--d) var(--lk-glide) var(--t) both}.lk-js .lk-route.lk-in{animation: lkLift var(--lk-t-lift) linear var(--sd) 1}.lk-js .lk-route.lk-in ~ .lk-total, .lk-js .lk-stage.lk-in .lk-total{animation: lkAnswer 1s linear var(--done) 1 both, lkGlow .8s ease-out var(--done) both}@container (max-width: 560px){.lk-js .lk-route:not(.lk-mini) .lk-bar{clip-path: inset(-40px -40px 100% -40px)}.lk-js .lk-route.lk-in:not(.lk-mini) .lk-bar{animation-name: lkDrawY, lkLift, lkSpreadBar, lkSpreadBar}.lk-js .lk-route.lk-in:not(.lk-mini) .lk-leg:first-child > .lk-bar{animation-name: lkDrawY1, lkLift, lkSpreadBar, lkSpreadBar}.lk-js .lk-route:not(.lk-mini) .lk-leg:first-child > .lk-lane{transform: translateY(var(--from))}.lk-js .lk-route.lk-in:not(.lk-mini) .lk-lane{animation-name: lkSailY, lkOn, lkOff}.lk-js .lk-route.lk-in:not(.lk-mini) .lk-leg:first-child > .lk-lane{animation-name: lkSailY, lkOff}.lk-js .lk-route.lk-in:not(.lk-mini) .lk-leg:last-child > .lk-lane{animation-name: lkSailY, lkOn}.lk-js .lk-route.lk-in:not(.lk-mini) .lk-leg:first-child:last-child > .lk-lane{animation-name: lkSailY}}.lk-duck{width: 40px;height: 40px;fill: #E3CE9A;stroke: rgba(255,255,255,.88);stroke-width: 5;stroke-linejoin: round;paint-order: stroke;--de: #35C6D8;fill-rule: evenodd;filter: drop-shadow(0 0 5px rgba(127,230,240,.40))}@media (prefers-reduced-motion: reduce){.lk-fly, .lk-zoom, .lk-duck, .lk-route, .lk-route *, .lk-total, .lk-stage::before, .lk-stage::after, .lk-btn, .lk-card, .lk-lift, .lk-more::after{animation: none !important;transition: none !important}.lk-js .lk-fly, .lk-js .lk-stage::before{opacity: 1}.lk-js .lk-route .lk-bar{clip-path: none}.lk-js .lk-route .lk-stop.lk-end i{scale: 1}.lk-js .lk-route .lk-lane{opacity: 0}.lk-js .lk-route .lk-leg:last-child > .lk-lane{opacity: 1}}:root{--lk-gap: 16px}.lk-grid{display: grid;gap: var(--lk-gap);align-items: stretch;grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr))}.lk-grid > *{min-width: 0;margin: 0}@media (max-width: 999px){.lk-grid{grid-template-columns: repeat(var(--cols-m, 2), minmax(0, 1fr))}}@media (max-width: 640px){.lk-grid{grid-template-columns: minmax(0, 1fr)}}.lk-cardrow{display: grid;grid-template-columns: minmax(0, 1fr) auto;grid-template-areas: "sum sum" "main end";gap: 10px 20px;align-items: end}.lk-card-sum{grid-area: sum;min-width: 0}.lk-card-main{grid-area: main;min-width: 0}.lk-card-end{grid-area: end;display: flex;align-items: center;justify-content: flex-end;gap: 12px;text-align: right}.lk-stagerow{display: grid;grid-template-columns: minmax(0, 1fr) auto;gap: var(--lk-gap) clamp(16px, 2vw, 32px);align-items: end}.lk-stagerow > .lk-card-end{grid-area: auto;flex-direction: column;align-items: stretch}@media (max-width: 760px){.lk-cardrow{grid-template-columns: minmax(0, 1fr);grid-template-areas: "sum" "main" "end"}.lk-card-end{justify-content: space-between;text-align: left}.lk-stagerow{grid-template-columns: minmax(0, 1fr)}}.kit-date{position:relative;display:block;min-width:0}.kit-date input[type=date]{display:block;width:100%;min-height:48px;box-sizing:border-box;margin:0;padding:0 52px 0 12px;font:500 var(--lk-fs-2)/1.2 var(--lk-sans);color:var(--lk-ink);background:#F7FCFD;border:1.5px solid var(--lk-line);border-radius:10px;-webkit-appearance:none;appearance:none;cursor:pointer;color-scheme:light}.kit-date input[type=date]::-webkit-datetime-edit{padding:0;color:var(--lk-ink)}.kit-date input[type=date]::-webkit-datetime-edit-fields-wrapper{padding:0}.kit-date input[type=date]::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer}.kit-date::after{content:"";position:absolute;right:14px;top:50%;width:22px;height:22px;translate:0 -50%;pointer-events:none;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A7387' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E")}.kit-date input[type=date]:hover{border-color:var(--lk-accent)}.kit-date input[type=date]:focus-visible{outline:3px solid var(--lk-accent-2);outline-offset:2px;border-color:var(--lk-accent)}.kit-date-hint{display:block;margin-top:5px;font:500 var(--lk-fs-0)/1.3 var(--lk-sans);color:var(--lk-dim)}@media(max-width:599px){.kit-date input[type=date]{min-height:48px;font-size:16px}}@media(prefers-color-scheme:dark){:root[data-theme="dark"] .kit-date input[type=date]{color-scheme:dark;background:#12303B;border-color:#254552;color:#E8F6FA}:root[data-theme="dark"] .kit-date input[type=date]::-webkit-datetime-edit{color:#E8F6FA}:root[data-theme="dark"] .kit-date::after{filter:brightness(1.7)}}