
  :root {
    --color-text-primary:#231416; --color-text-secondary:#6b5e60; --color-text-tertiary:#5e5254; --color-text-inverse:#ffffff;
    --color-surface-base:#3a0007; --color-surface-muted:rgb(112 0 14 / .08); --color-border-default:#e2d8d8; --color-border-muted:#8a7a7c;
    --color-action-primary:#70000e; --color-feedback-error:#b00020; --color-focus:#70000e;
    --radius-xs:12px; --radius-card:18px; --radius-pill:9999px; --space-1:8px; --font-size-base:13px; --font-line-base:19px; --motion-instant:200ms; --motion-fast:300ms;
  }
  html { font-size:16px; }
  body { font-family:Futura,Jost,"IBM Plex Sans Thai",Verdana,sans-serif; font-size:var(--font-size-base); line-height:var(--font-line-base); font-weight:400; background:#fff; color:var(--color-text-primary); -webkit-font-smoothing:antialiased; }
  p { line-height:1.5; }
  .font-display { text-transform:uppercase; letter-spacing:.1em; font-weight:400; }
  h1.font-display, h2.font-display { letter-spacing:.12em; }
  html[lang="th"] .font-display, html[lang="th"] h1.font-display, html[lang="th"] h2.font-display { letter-spacing:.02em; }
  /* Buttons that carry the primary action read as Fraser-style uppercase labels */
  button.bg-maroon, a.bg-maroon { text-transform:uppercase; letter-spacing:.12em; font-size:11px; font-weight:500; }
  button, a, input, select, textarea { transition-duration:var(--motion-instant); }
  /* States */
  button:disabled, [aria-disabled="true"] { background:#e2d8d8 !important; color:#5e5254 !important; border-color:#e2d8d8 !important; cursor:not-allowed; }
  [aria-busy="true"] { cursor:progress; }
  .spinner { width:14px; height:14px; border:2px solid currentColor; border-right-color:transparent; border-radius:9999px; animation:spin .7s linear infinite; }
  @keyframes spin { to { transform:rotate(360deg);} }
  [aria-invalid="true"] { box-shadow: inset 0 0 0 2px var(--color-feedback-error) !important; }
  .field-error { color:var(--color-feedback-error); }
  /* Focus — never hidden */
  :focus { outline:none; }
  :focus-visible { outline:1.5px solid var(--color-focus) !important; outline-offset:2px; }
  .bg-maroon :focus-visible, .bg-maroon-900 :focus-visible, footer :focus-visible, #lightbox :focus-visible, .on-dark :focus-visible { outline-color:#fff !important; }
  .img-fallback { background:#3a0007; }
  .img-fallback img.err { opacity:0; }
  .wave-bottom { display:none; }
  .chip-active { background:#70000e !important; color:#fff !important; border-color:#70000e !important; box-shadow:none !important; }
  .tab-active { color:#70000e; }
  .tab-active::after { content:''; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:#70000e; }
  .no-scrollbar::-webkit-scrollbar { display:none; } .no-scrollbar { scrollbar-width:none; }
  .fade-up { animation: fadeUp var(--motion-fast) ease both; }
  @keyframes fadeUp { from { opacity:0; transform:translateY(6px);} to {opacity:1; transform:none;} }
  @keyframes marquee { from { transform:translateX(0);} to { transform:translateX(-50%);} }
  .marquee { animation: marquee 40s linear infinite; }
  .modal-enter { animation: modalIn var(--motion-fast) ease both; }
  @keyframes modalIn { from { opacity:0; transform:translateY(8px);} to { opacity:1; transform:none; } }
  @media (max-width:639px){ input, select, textarea { font-size:16px !important; } }
  input[type=date]::-webkit-calendar-picker-indicator { opacity:.7; cursor:pointer; }
  @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation:none !important; transition:none !important; } }
  /* Motion & smart UI */
  .reveal { opacity:0; transform:translateY(14px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
  .reveal.in { opacity:1; transform:none; }
  .hero-slide { opacity:0; transform:scale(1.04); transition:opacity 1.2s ease, transform 7s ease-out; }
  .hero-slide.is-on { opacity:1; transform:scale(1); }
  .hero-dot { width:0; } .hero-dot.is-on { animation:dot 6s linear forwards; } @keyframes dot { to { width:100%; } }
  #heroBox.paused .hero-dot.is-on { animation-play-state:paused; }
  #heroTitle { font-family:Jost,"IBM Plex Sans Thai",sans-serif; font-weight:300; text-transform:none; letter-spacing:-.01em; font-size:clamp(38px,6vw,76px); line-height:1.08; text-shadow:0 1px 18px rgb(0 0 0 / .2); }
  html[lang="th"] #heroTitle { letter-spacing:0; line-height:1.18; font-size:clamp(36px,5.6vw,72px); }
  #heroTitle .ht-kw { font-weight:400; text-transform:uppercase; letter-spacing:.32em; font-size:12px; line-height:1; display:block; margin-bottom:14px; opacity:.85; text-shadow:none; }
  .ht-line { display:block; overflow:hidden; padding:.06em .1em .1em; }
  .ht-line > span { display:inline-block; transform:translateY(110%); animation:htUp 1s cubic-bezier(.2,.75,.15,1) forwards; }
  @keyframes htUp { to { transform:none; } }
  .hero-hl { display:inline-block; position:relative; white-space:nowrap; }
  .hero-hl::before { content:none; }
  @keyframes hlDraw { to { clip-path:inset(0 0 0 0); } }
  #heroRot { display:inline-block; transition:transform .45s cubic-bezier(.2,.75,.15,1), opacity .35s; }
  #heroRot.out { transform:translateY(-30%); opacity:0; }
  #heroRot.pre { transition:none; transform:translateY(30%); opacity:0; }
  .hero-fade { opacity:0; transform:translateY(12px); animation:hFade .8s cubic-bezier(.2,.75,.15,1) forwards; }
  @keyframes hFade { to { opacity:1; transform:none; } }
  @media (prefers-reduced-motion: reduce) { .ht-line > span, .hero-fade { animation:none; transform:none; opacity:1; } .hero-hl::before { animation:none; clip-path:none; } #heroRot { transition:none; } }
  #heroBox { border-radius:0 !important; }
  .hero-hl-old { display:inline-block; position:relative; padding:0 .32em; margin:0 -.05em; border-radius:9999px; box-shadow:inset 0 0 0 2px rgb(255 255 255 / .75), 0 0 28px rgb(255 255 255 / .35), inset 0 0 22px rgb(255 255 255 / .18); }
  .hero-word { display:inline-block; opacity:0; transform:translateY(.4em); animation:word .8s cubic-bezier(.2,.7,.2,1) forwards; }
  @keyframes word { to { opacity:1; transform:none; } }
  #routeProg { transform-origin:left; transform:scaleX(0); opacity:0; }
  #routeProg.run { animation:rp .7s ease-out forwards; } @keyframes rp { 0%{transform:scaleX(0);opacity:1} 80%{transform:scaleX(1);opacity:1} 100%{transform:scaleX(1);opacity:0} }
  #scrollProg { transform-origin:left; transform:scaleX(0); }
  .smart-bar { width:0; animation:bar .9s .15s cubic-bezier(.2,.7,.2,1) forwards; } @keyframes bar { to { width:var(--w); } }
  .season-col { background:rgb(112 0 14 / .06) !important; }
  th.season-col { color:#70000e !important; box-shadow: inset 0 -2px 0 #70000e; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration:.3s; }
  @media (prefers-reduced-motion: reduce) { .reveal, .hero-word { opacity:1 !important; transform:none !important; } .hero-slide { transition:none; } }
  /* Rounded system: controls = pill · surfaces 12–18px · cards 18px (explicit rounded-* utilities override) */
  button, input, select, textarea, .img-fallback, [class*="ring-1"], [class*="bg-sand"], #lbImg { border-radius:var(--radius-xs); }
  kbd { border-radius:6px; }
  article, article[class], .rounded-card { border-radius:var(--radius-card) !important; }
  details, section[class*="bg-sand"], section[class*="from-sand"] { border-radius:0 !important; }
  article { overflow:hidden; }
  article > a.img-fallback, article > a.img-fallback img, .bcard .img-fallback, .bcard .img-fallback img { border-radius:0 !important; }
  .bcard { box-shadow:0 0 0 1px #ece3e2; transition:box-shadow .35s, transform .35s cubic-bezier(.2,.75,.15,1); }
  .bcard:hover { box-shadow:0 0 0 1px #dccfce, 0 22px 44px -28px rgba(58,0,7,.45); transform:translateY(-3px); }
  .bcard-ico { width:36px; height:36px; display:grid; place-items:center; border-radius:9999px !important; background:rgb(255 255 255 / .88); backdrop-filter:blur(8px); color:#231416; box-shadow:0 2px 8px rgb(0 0 0 / .12); transition:transform .2s, color .2s; }
  .bcard-ico:hover { transform:scale(1.08); color:#70000e; }
  .bcard-ico[aria-pressed="true"] { color:#70000e; }
  /* pill controls: buttons, chips, CTA links, steppers, small selects */
  button:is([class*="h-7"],[class*="h-8"],[class*="h-9"],[class*="h-10"],[class*="h-11"],[class*="h-12"],[class*="h-14"],[class*="py-2"],[class*="py-3"]):not([class*="min-h"]),
  a:is([class*="h-8"],[class*="h-9"],[class*="h-10"],[class*="h-11"],[class*="h-12"],[class*="h-14"]):is([class*="bg-"],[class*="ring"],[class*="border"]),
  button:is([class*="py-4"],[class*="py-1"],[class*="px-"]):not([class*="min-h"]):not([class*="text-left"]),
  a:is([class*="py-2"],[class*="py-3"],[class*="py-4"],[class*="px-"]):is([class*="ring-1"],[class*="ring-2"],[class*="bg-maroon"],[class*="bg-ink"],[class*="bg-white"],[class*="border"]):not([class*="block"]):not([class*="grid"]):not([class*="min-h"]):not(.img-fallback),
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, label.bg-sand,
  .chip, .chip-active, .slot, #toast > div, .fav-count, [data-fav] { border-radius:var(--radius-pill) !important; }
  input[type="checkbox"] { border-radius:6px; } input[type="radio"] { border-radius:9999px; }
  #cmdInput:focus, #cmdInput:focus-visible { outline:none !important; }
  .cmd-k { display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 4px; background:#fff; box-shadow:0 0 0 1px rgb(0 0 0 / .1), 0 1px 0 rgb(0 0 0 / .08); font-size:10px; color:#231416; }
  .cmd-mark { background:rgb(112 0 14 / .12); color:inherit; border-radius:2px; padding:0 1px; }
  /* Navbar */
  #navbar.is-compact #navRow { height:56px; }
  #navbar.is-compact #navPill { background:rgb(255 255 255 / .97); }
  #navPill { border-radius:0 !important; }
  .logo-tab { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; width:84px; height:84px; margin-bottom:-20px; background:#70000e; color:#fff; box-shadow:0 10px 24px -10px rgba(58,0,7,.55); border-radius:0 0 14px 14px !important; transition:height .3s cubic-bezier(.2,.75,.15,1), margin .3s, width .3s; }
  .logo-tab:hover { background:#5a000b; }
  .logo-tab-img { width:40px; height:40px; transition:transform .5s cubic-bezier(.2,.75,.15,1), width .3s, height .3s; }
  .logo-tab:hover .logo-tab-img { transform:scale(1.06) rotate(-4deg); }
  .logo-tab-t1 { font-size:9px; line-height:1; letter-spacing:.14em; font-weight:500; margin-top:6px; }
  .logo-tab-t2 { font-size:6.5px; line-height:1; letter-spacing:.32em; margin-top:3px; opacity:.85; }
  #navbar.is-compact .logo-tab { height:66px; width:72px; margin-bottom:-10px; }
  #navbar.is-compact .logo-tab-img { width:32px; height:32px; }
  #navbar.is-compact .logo-tab-t1 { margin-top:4px; }
  @media (max-width:639px) { .logo-tab { width:72px; height:74px; margin-bottom:-14px; } .logo-tab-img { width:34px; height:34px; } }
  .nav-logo img { transition:transform .5s cubic-bezier(.2,.75,.15,1), width .3s, height .3s; } a:hover > .nav-logo img { transform:scale(1.06); }
  #navbar.is-compact .nav-logo { width:38px; height:38px; }
  .nav-a.is-active { color:#70000e; }
  .nav-a.is-active::after { content:''; position:absolute; left:12px; right:12px; bottom:-2px; height:1.5px; border-radius:9999px; background:#70000e; opacity:.6; }
  #navbar .nv-ico, .lang-seg, .lang-seg .lang-btn, #navFind { border-radius:980px !important; }
  .lang-seg { height:36px; padding:3px; gap:2px; background:#ececec; box-shadow:inset 0 0 0 .5px rgb(0 0 0 / .04); font-size:13.5px; }
  .lang-seg .lang-btn { height:30px; min-width:46px; padding:0 14px; display:inline-flex; align-items:center; justify-content:center; line-height:1; font-weight:500; color:#231416; background:transparent; transition:background .25s, box-shadow .25s, color .25s; }
  .lang-seg .lang-btn:not(.chip-active) { color:#3a2c2e !important; }
  .lang-seg .lang-btn:not(.chip-active):hover { background:rgb(255 255 255 / .55); }
  .lang-seg .lang-btn.chip-active { background:#fff !important; color:#231416 !important; box-shadow:0 1px 2px rgb(0 0 0 / .08), 0 2px 8px rgb(0 0 0 / .08) !important; }
  .lang-seg .lang-btn:focus-visible { outline:2px solid #70000e; outline-offset:1px; }
  .legal h2 { font-family:inherit; font-weight:500; font-size:19px; line-height:1.35; color:#231416; margin:40px 0 12px; }
  .legal section:first-child h2 { margin-top:0; }
  .legal p { color:#6b5e60; line-height:1.75; margin:10px 0; }
  .legal ul { margin:10px 0; padding-left:0; list-style:none; }
  .legal li { position:relative; padding-left:20px; color:#6b5e60; line-height:1.7; margin:8px 0; }
  .legal li::before { content:''; position:absolute; left:4px; top:.72em; width:6px; height:6px; border-radius:9999px; background:#70000e; }
  .legal b { color:#231416; font-weight:500; }
  .legal a { color:#70000e; text-decoration:underline; text-underline-offset:3px; }
  .legal-table { overflow-x:auto; margin:14px 0; border:1px solid #e9dfdd; border-radius:14px; }
  .legal-table table { width:100%; border-collapse:collapse; font-size:13px; }
  .legal-table th { text-align:left; font-weight:500; background:#f8f4f3; padding:10px 14px; color:#231416; }
  .legal-table td { padding:10px 14px; border-top:1px solid #efe7e6; color:#6b5e60; }
  .legal-dl { display:grid; grid-template-columns:auto 1fr; gap:6px 20px; background:#f8f4f3; border-radius:14px; padding:14px 18px; margin:14px 0; font-size:13px; }
  .legal-dl dt { color:#6b5e60; } .legal-dl dd { color:#231416; font-weight:500; }
  .tgl { position:relative; display:inline-block; width:44px; height:26px; }
  .tgl input { position:absolute; inset:0; opacity:0; margin:0; cursor:pointer; z-index:1; }
  .tgl input:disabled { cursor:not-allowed; }
  .tgl span { position:absolute; inset:0; border-radius:9999px; background:#d9cfcf; transition:background .25s; }
  .tgl span::after { content:''; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:9999px; background:#fff; box-shadow:0 1px 3px rgb(0 0 0 / .2); transition:transform .25s cubic-bezier(.28,.11,.32,1); }
  .tgl input:checked + span { background:#70000e; }
  .tgl input:checked + span::after { transform:translateX(18px); }
  .tgl input:disabled + span { opacity:.55; }
  .tgl input:focus-visible + span { outline:2px solid #70000e; outline-offset:3px; }
  .crew2 { background:#fff; border-radius:20px; padding:22px; box-shadow:0 0 0 1px rgb(35 20 22 / .07); transition:box-shadow .3s, transform .3s cubic-bezier(.2,.75,.15,1); }
  .crew2:hover { box-shadow:0 0 0 1px rgb(35 20 22 / .12), 0 18px 40px -28px rgba(58,0,7,.4); transform:translateY(-2px); }
  .crew { position:relative; background:#fff; border-radius:24px; box-shadow:0 0 0 1px #ece3e2, 0 18px 40px -30px rgba(58,0,7,.45); transition:transform .45s cubic-bezier(.2,.75,.15,1), box-shadow .45s; overflow:hidden; }
  .crew:hover { transform:translateY(-6px); box-shadow:0 0 0 1px #e2d3d2, 0 30px 60px -30px rgba(58,0,7,.55); }
  .crew-top { position:relative; padding:22px 22px 18px; }
  .crew-wave { position:absolute; left:0; right:0; top:0; width:100%; height:56px; color:#70000e; opacity:.08; transition:transform 1.2s ease; }
  .crew:hover .crew-wave { transform:translateX(-6%); }
  .crew-ava { position:relative; width:88px; height:88px; }
  .crew-ring { position:absolute; inset:0; border-radius:9999px; background:conic-gradient(from 0deg, #70000e, rgba(112,0,14,.08) 40%, #70000e 75%, rgba(112,0,14,.08)); animation:crewSpin 6s linear infinite; }
  .crew:hover .crew-ring { animation-duration:1.6s; }
  .crew-ava img { position:absolute; inset:3px; width:calc(100% - 6px); height:calc(100% - 6px); border-radius:9999px; object-fit:cover; border:3px solid #fff; }
  @keyframes crewSpin { to { transform:rotate(360deg); } }
  .crew-dot { position:absolute; right:4px; bottom:6px; width:16px; height:16px; border-radius:9999px; background:#9a8c8e; border:3px solid #fff; }
  .crew-ava.is-on .crew-dot { background:#70000e; box-shadow:0 0 0 0 rgba(112,0,14,.5); animation:crewPing 2s infinite; }
  @keyframes crewPing { 70% { box-shadow:0 0 0 8px rgba(112,0,14,0); } 100% { box-shadow:0 0 0 0 rgba(112,0,14,0); } }
  .crew-cut { position:relative; height:24px; margin:0 -1px; }
  .crew-cut::before { content:''; position:absolute; left:22px; right:22px; top:50%; border-top:1.5px dashed #e2d6d5; }
  .crew-cut::after { content:''; position:absolute; inset:0; background:radial-gradient(circle at 0 50%, #f8f4f3 11px, transparent 12px), radial-gradient(circle at 100% 50%, #f8f4f3 11px, transparent 12px); }
  .crew-boat { position:absolute; top:50%; left:22px; transform:translate(0,-60%); color:#70000e; background:#fff; padding:0 4px; transition:left 1.4s cubic-bezier(.45,0,.2,1); }
  .crew:hover .crew-boat { left:calc(100% - 46px); }
  .crew-bottom { padding:16px 22px 22px; }
  @media (prefers-reduced-motion: reduce) { .crew-ring, .crew-dot { animation:none !important; } .crew-boat, .crew { transition:none; } }
  /* ===== Hairline borders (minimal) ===== */
  .ring-line-strong, .ring-sand-200, [class*="hover:ring-line-strong"]:not(:hover) { --tw-ring-color: rgb(35 20 22 / .11) !important; }
  .border-sand-200, .border-line, .border-sand-200\/60 { border-color: rgb(35 20 22 / .08) !important; }
  .hover\:ring-line-strong:hover { --tw-ring-color: rgb(35 20 22 / .22) !important; }
  .hover\:ring-maroon:hover, .focus-within\:ring-maroon:focus-within { --tw-ring-color: rgb(112 0 14 / .45) !important; }
  .focus\:ring-2:focus, .ring-2 { --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 1px var(--tw-ring-color) !important; }
  .focus\:ring-maroon:focus { --tw-ring-color: rgb(112 0 14 / .5) !important; }
  input:focus-visible, select:focus-visible, textarea:focus-visible { outline:none !important; }
  input:not([type=checkbox]):not([type=radio]):not([type=range]):focus, select:focus, textarea:focus { --tw-ring-color: rgb(112 0 14 / .5) !important; }
  label :is(select,input):focus { box-shadow:none !important; }
  .bcard, .crew { box-shadow:0 0 0 1px rgb(35 20 22 / .07); }
  .crew-cut::before { border-top-color: rgb(35 20 22 / .12); }
  .legal-table { border-color: rgb(35 20 22 / .08); }
  /* ===== Quick search (minimal) ===== */
  .qs-card { box-shadow:0 30px 60px -32px rgba(58,0,7,.4), 0 0 0 1px rgb(35 20 22 / .05); }
  .qs-seg .qs-tab { color:#6b5e60; transition:background .25s, color .25s, box-shadow .25s; }
  .qs-seg .qs-tab.tab-active { background:#fff; color:#231416; box-shadow:0 1px 3px rgb(0 0 0 / .1); }
  .qs-seg .qs-tab.tab-active::after { display:none; }
  .qs-f { position:relative; display:block; padding:6px 20px; border-radius:9999px !important; cursor:pointer; transition:background .2s; min-width:0; }
  .qs-f:hover, .qs-f:focus-within { background:#f8f4f3; }
  @media (max-width:1023px) { .qs-f { background:#f8f4f3; border-radius:18px !important; } .qs-f:hover, .qs-f:focus-within { background:#f3eded; } }
  @media (min-width:1024px) { .qs-bar > .qs-f + .qs-f::before { content:''; position:absolute; left:0; top:22%; bottom:22%; width:1px; background:rgb(35 20 22 / .1); transition:opacity .2s; } .qs-bar > .qs-f:hover::before, .qs-bar > .qs-f:hover + .qs-f::before, .qs-bar > .qs-f:focus-within::before, .qs-bar > .qs-f:focus-within + .qs-f::before { opacity:0; } }
  .qs-l { display:block; font-size:10px; line-height:13px; color:#8a7a7c; letter-spacing:.02em; }
  .qs-v { display:block; width:100%; margin-top:1px; background:transparent; font-size:14px; line-height:20px; font-weight:500; color:#231416; border:0; padding:0; border-radius:0 !important; box-shadow:none !important; -webkit-appearance:none; appearance:none; cursor:pointer; text-overflow:ellipsis; }
  select.qs-v { padding-right:18px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a7a7c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right center; }
  .qs-v:focus { outline:none; }
  .qs-step { width:22px; height:22px; display:grid; place-items:center; border-radius:9999px !important; color:#6b5e60; box-shadow:0 0 0 1px rgb(35 20 22 / .12); transition:color .2s, box-shadow .2s; }
  .qs-step:hover { color:#70000e; box-shadow:0 0 0 1px rgb(112 0 14 / .4); }
  /* ===== Booking card (minimal) ===== */
  .bk-card { box-shadow:0 0 0 1px rgb(35 20 22 / .08), 0 24px 48px -36px rgba(58,0,7,.35); }
  .bk-group { display:grid; grid-template-columns:1fr 1fr; border-radius:16px !important; box-shadow:0 0 0 1px rgb(35 20 22 / .12); overflow:hidden; }
  .bk-f { display:block; padding:10px 14px; position:relative; cursor:pointer; transition:background .2s; min-width:0; }
  .bk-f:hover { background:#faf7f6; } .bk-f:focus-within { background:#fff; box-shadow:inset 0 0 0 1px rgb(112 0 14 / .5); }
  .bk-full { grid-column:1 / -1; border-bottom:1px solid rgb(35 20 22 / .1); }
  .bk-f + .bk-f:not(.bk-full) { border-left:1px solid rgb(35 20 22 / .1); }
  .bk-full + .bk-f { border-left:0; }
  .bk-l { display:block; font-size:10px; line-height:14px; letter-spacing:.08em; text-transform:uppercase; color:#8a7a7c; }
  html[lang="th"] .bk-l { letter-spacing:0; text-transform:none; font-size:11px; }
  .bk-v { display:block; width:100%; margin-top:2px; background:transparent; border:0; padding:0; font-size:14px; line-height:22px; color:#231416; border-radius:0 !important; box-shadow:none !important; -webkit-appearance:none; appearance:none; text-overflow:ellipsis; }
  select.bk-v { padding-right:18px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a7a7c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right center; cursor:pointer; }
  .bk-v:focus { outline:none !important; }
  input.bk-v[type=number] { -moz-appearance:textfield; } input.bk-v[type=number]::-webkit-inner-spin-button, input.bk-v[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
  /* ===== Boat gallery (mosaic) ===== */
  .gal { display:grid; gap:6px; grid-template-columns:repeat(4,1fr); }
  .gal-main { position:relative; grid-column:1 / -1; aspect-ratio:4/3; overflow:hidden; border-radius:16px !important; }
  .gal-t { position:relative; aspect-ratio:4/3; overflow:hidden; border-radius:12px !important; }
  .gal-img { width:100%; height:100%; object-fit:cover; transform:scale(var(--z,1)); transition:transform .7s cubic-bezier(.2,.75,.15,1); border-radius:0 !important; }
  .group:hover .gal-img { transform:scale(calc(var(--z,1) * 1.04)); }
  @media (min-width:1024px) {
    .gal { grid-template-columns:3fr 1fr 1fr; grid-template-rows:repeat(2,1fr); height:500px; }
    .gal-main { grid-column:1; grid-row:1 / span 2; aspect-ratio:auto; }
    .gal-t { aspect-ratio:auto; }
  }
  /* ===== Lightbox ===== */
  .lb-btn { width:48px; height:48px; display:grid; place-items:center; border-radius:9999px !important; color:#fff; background:rgb(255 255 255 / .08); box-shadow:inset 0 0 0 1px rgb(255 255 255 / .14); backdrop-filter:blur(8px); transition:background .2s; }
  .lb-btn:hover { background:rgb(255 255 255 / .18); }
  .lb-img { border-radius:0 !important; filter:drop-shadow(0 30px 50px rgb(0 0 0 / .5)); opacity:0; transform:scale(.985); }
  .lb-img.is-in { opacity:1; transform:none; transition:opacity .35s ease, transform .45s cubic-bezier(.2,.75,.15,1); }
  .lb-th { flex:none; width:62px; height:62px; overflow:hidden; border-radius:4px !important; opacity:.45; box-shadow:0 0 0 0 #fff; transition:opacity .2s, box-shadow .2s; }
  .lb-th img { width:100%; height:100%; object-fit:cover; border-radius:0 !important; }
  .lb-th:hover { opacity:.8; } .lb-th.is-on { opacity:1; box-shadow:0 0 0 2px #fff; }
  .tb-ico { width:112px; height:52px; color:#fff; opacity:.92; transition:transform .5s cubic-bezier(.2,.75,.15,1); }
  .tb-ico svg { width:100%; height:100%; }
  .tb-item:hover .tb-ico { transform:translateY(-4px); }
  .tb-item:hover span.text-lg { text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1px; }
  /* ===== Explore categories (minimal) ===== */
  .cat-tab { position:relative; white-space:nowrap; padding:8px 0; font-size:14px; color:#8a7a7c; background:none !important; border-radius:0 !important; transition:color .2s; }
  .cat-tab:hover { color:#231416; }
  .cat-tab::after { content:''; position:absolute; left:0; right:0; bottom:0; height:1.5px; background:#70000e; transform:scaleX(0); transform-origin:left; transition:transform .35s cubic-bezier(.2,.75,.15,1); }
  .cat-tab.is-on { color:#231416; } .cat-tab.is-on::after { transform:scaleX(1); }
  .cbar { box-shadow:0 0 0 1px rgb(35 20 22 / .06), 0 14px 36px -24px rgba(58,0,7,.3); }
  .cbar-item { flex:none; display:inline-flex; align-items:center; gap:10px; height:44px; padding:0 22px; font-size:14px; color:#4a3c3e; white-space:nowrap; position:relative; border-radius:0 !important; background:none !important; transition:color .2s; }
  .cbar-item + .cbar-item::before { content:''; position:absolute; left:0; top:12px; bottom:12px; width:1px; background:rgb(35 20 22 / .1); }
  .cbar-item i, .cbar-item svg { color:#8a7a7c; transition:color .2s; }
  .cbar-item:hover { color:#70000e; } .cbar-item:hover svg { color:#70000e; }
  .cbar-item.is-on { color:#70000e; } .cbar-item.is-on svg { color:#70000e; }
  .cbar-arr { width:36px; height:36px; display:grid; place-items:center; border-radius:9999px !important; background:#f8f4f3; color:#231416; transition:opacity .2s, background .2s; }
  .cbar-arr:hover { background:#f1eaea; } .cbar-arr.is-off { opacity:.35; pointer-events:none; }
  .cat-item.is-on { background:#f9f1f2; box-shadow:inset 0 -2px 0 #70000e; }
  /* ===== Routes carousel ===== */
  .rt-card { width:calc((100% - 60px) / 4.25); min-width:220px; }
  @media (max-width:767px) { .rt-card { width:72%; min-width:0; } }
  .rt-nav { width:40px; height:40px; display:grid; place-items:center; border-radius:9999px !important; color:#231416; box-shadow:0 0 0 1px rgb(35 20 22 / .14); transition:box-shadow .2s, color .2s, opacity .2s; }
  .rt-nav:hover:not(:disabled) { color:#70000e; box-shadow:0 0 0 1px rgb(112 0 14 / .45); }
  .rt-nav:disabled { opacity:.35; cursor:default; }
  .rt-float { position:absolute; right:-14px; top:50%; transform:translateY(-50%); width:52px; height:52px; place-items:center; border-radius:9999px !important; background:#fff; color:#231416; box-shadow:0 10px 30px -10px rgb(0 0 0 / .35), 0 0 0 1px rgb(35 20 22 / .06); transition:opacity .3s, transform .2s; }
  .rt-float:hover { transform:translateY(-50%) scale(1.06); }
  .rt-float.is-hidden { opacity:0; pointer-events:none; }
  .act-card { border-radius:14px !important; }
  .act-ph { background:radial-gradient(120% 90% at 20% 10%, #8a1a26 0%, #4a0610 55%, #230306 100%); }
  /* ===== Fleet toolbar ===== */
  .fl-bar { box-shadow:0 0 0 1px rgb(35 20 22 / .08), 0 12px 30px -24px rgba(58,0,7,.35); }
  .fl-search { background:#f8f4f3; }
  .fl-chips button { flex:none; height:36px; padding:0 14px; font-size:13px; box-shadow:none !important; border:0 !important; background:transparent !important; color:#6b5e60 !important; }
  .fl-chips button:hover { color:#231416 !important; background:#f8f4f3 !important; }
  .fl-chips button.chip-active { background:#231416 !important; color:#fff !important; }
  .fl-sel { height:36px; padding:0 30px 0 14px; font-size:13px; color:#231416; background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a7a7c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center; -webkit-appearance:none; appearance:none; border:0; box-shadow:none !important; cursor:pointer; }
  .fl-sel:hover { background-color:#f8f4f3; }
  .sz-bar { padding:16px; border-radius:18px; box-shadow:inset 0 0 0 1px rgb(35 20 22 / .08); background:#fff; }
  .sz-chip { display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:9px 14px; border-radius:14px; box-shadow:inset 0 0 0 1px rgb(35 20 22 / .1); font-size:13px; color:#231416; text-align:left; transition:box-shadow .15s, background .15s; }
  .sz-chip:hover { box-shadow:inset 0 0 0 1px rgb(112 0 14 / .4); } .sz-chip.on { box-shadow:inset 0 0 0 1.5px #70000e; background:#f9f1f2; }
  .sz-chip i { display:inline-block; width:8px; height:8px; border-radius:99px; } .sz-chip small { font-size:11px; color:#6b5e60; }
  .sz-chip em { font-style:normal; font-size:10px; color:#fff; background:#70000e; padding:1px 7px; border-radius:99px; margin-left:4px; }
  .sz-note { display:flex; gap:8px; align-items:flex-start; margin-top:12px; padding:10px 12px; border-radius:12px; background:#fff6e5; color:#7a4a00; font-size:12.5px; }
  /* ---------- BLOG ---------- */
  .blog-chip { display:inline-flex; align-items:center; gap:.4rem; white-space:nowrap; height:36px; padding:0 14px; border-radius:9999px; font-size:13px; color:#5b4b4d; background:#fff; box-shadow:inset 0 0 0 1px rgb(35 20 22 / .1); transition:.2s; }
  .blog-chip:hover { color:#70000e; box-shadow:inset 0 0 0 1px rgb(112 0 14 / .35); }
  .blog-chip.is-on { background:#70000e; color:#fff; box-shadow:none; }
  .blog-chip small { font-size:11px; opacity:.6; }
  .post-body { font-size:17px; line-height:1.85; color:#2b1d1f; overflow-wrap:anywhere; }
  .post-body > * + * { margin-top:1.1em; }
  .post-body h2 { font-size:1.55rem; line-height:1.3; font-weight:600; color:#231416; margin-top:2em; scroll-margin-top:96px; }
  .post-body h3 { font-size:1.3rem; line-height:1.35; font-weight:600; color:#231416; margin-top:1.7em; scroll-margin-top:96px; }
  .post-body h4 { font-size:1.12rem; font-weight:600; color:#231416; margin-top:1.5em; scroll-margin-top:96px; }
  .post-body h5 { font-size:1rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:#70000e; margin-top:1.4em; scroll-margin-top:96px; }
  .post-body ul, .post-body ol { padding-left:1.4em; }
  .post-body ul { list-style:disc; } .post-body ol { list-style:decimal; }
  .post-body li + li { margin-top:.35em; } .post-body li::marker { color:#70000e; }
  .post-body a { color:#70000e; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; }
  .post-body a.post-btn, .post-body a.post-boat { text-decoration:none; }
  .post-body strong, .post-body b { font-weight:600; color:#231416; }
  .post-body blockquote { border-left:3px solid #70000e; padding:.4em 0 .4em 1.2em; font-size:1.1em; color:#4a3a3c; font-style:italic; }
  .post-body hr { border:0; height:1px; background:rgb(35 20 22 / .1); margin:2.2em 0; }
  .post-body figure img { width:100%; border-radius:18px; }
  .post-body figcaption { font-size:13px; color:#7a6a6c; text-align:center; margin-top:.6em; }
  .post-body img { max-width:100%; height:auto; border-radius:14px; }
  .post-body table { width:100%; border-collapse:collapse; font-size:15px; display:block; overflow-x:auto; }
  .post-body th, .post-body td { padding:.6em .8em; border-bottom:1px solid rgb(35 20 22 / .08); text-align:left; vertical-align:top; }
  .post-body th { background:#f7f2ee; font-weight:600; }
  .post-body iframe { max-width:100%; border-radius:14px; }
  .post-grid { display:grid; }
  .post-grid img { width:100%; height:100%; object-fit:cover; border-radius:12px; }
  @media (max-width:639px) { .post-body { font-size:16px; } .post-grid { grid-template-columns:repeat(2,1fr) !important; } .post-grid img { grid-column:auto !important; } .post-body figure { width:100% !important; } }
  .post-faq { border-radius:20px; background:#f7f2ee; padding:8px 20px; }
  .post-faq h2 { margin:.8em 0 .4em !important; }
  .post-faq details { border-bottom:1px solid rgb(35 20 22 / .08); } .post-faq details:last-child { border-bottom:0; }
  .post-faq summary { list-style:none; cursor:pointer; display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:16px 0; font-weight:600; color:#231416; }
  .post-faq summary::-webkit-details-marker { display:none; }
  .post-faq summary svg { margin-top:6px; color:#70000e; transition:transform .2s; }
  .post-faq details[open] summary svg { transform:rotate(45deg); }
  .post-faq details > div { padding:0 0 16px; color:#4a3a3c; }
  .post-toc a { display:block; padding:6px 0 6px 12px; border-left:2px solid rgb(35 20 22 / .08); font-size:13px; line-height:1.45; color:#7a6a6c; transition:.15s; }
  .post-toc a.lv3 { padding-left:24px; font-size:12.5px; }
  .post-toc a:hover { color:#231416; } .post-toc a.on { color:#70000e; border-left-color:#70000e; font-weight:500; }
  .post-boat { display:flex; align-items:center; gap:14px; padding:10px; border-radius:18px; background:#fff; box-shadow:inset 0 0 0 1px rgb(35 20 22 / .1); color:inherit; transition:.2s; }
  .post-boat:hover { box-shadow:inset 0 0 0 1px rgb(112 0 14 / .4); }
  .post-boat img { width:84px; height:64px; object-fit:cover; border-radius:12px; flex-shrink:0; }
  .post-boat b { display:block; font-weight:600; color:#231416; font-size:15px; line-height:1.3; }
  .post-boat small { display:block; font-size:12.5px; color:#7a6a6c; margin-top:2px; }
  .post-btn { display:inline-flex; align-items:center; height:46px; padding:0 22px; border-radius:9999px; background:#70000e; color:#fff !important; font-size:15px; font-weight:500; transition:.2s; }
  .post-btn:hover { background:#5a000b; }
  .post-share { width:38px; height:38px; display:grid; place-items:center; border-radius:9999px; box-shadow:inset 0 0 0 1px rgb(35 20 22 / .12); color:#4a3a3c; transition:.2s; }
  .post-share:hover { color:#70000e; box-shadow:inset 0 0 0 1px rgb(112 0 14 / .4); }
  .nav-cta::after { content:''; position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,rgb(255 255 255 / .28) 50%,transparent 70%); transform:translateX(-120%); }
  .nav-cta:hover::after { transform:translateX(120%); transition:transform .8s ease; }
  .mega { opacity:0; transform:translateY(-6px); pointer-events:none; transition:opacity .22s ease, transform .22s ease; }
  .mega.is-open { opacity:1; transform:none; pointer-events:auto; }
  .burger { position:relative; width:18px; height:10px; display:block; }
  .burger i { position:absolute; left:0; right:0; height:1.5px; background:currentColor; transition:transform .3s ease, top .3s ease; }
  .burger i:first-child { top:0; } .burger i:last-child { top:8.5px; }
  [aria-expanded="true"] .burger i:first-child { top:4.25px; transform:rotate(45deg); }
  [aria-expanded="true"] .burger i:last-child { top:4.25px; transform:rotate(-45deg); }
  #mobileMenu:not(.hidden) .m-item { animation:mIn .35s cubic-bezier(.2,.7,.2,1) both; }
  #mobileMenu .m-item:nth-child(2){animation-delay:.04s} #mobileMenu .m-item:nth-child(3){animation-delay:.08s} #mobileMenu .m-item:nth-child(4){animation-delay:.12s} #mobileMenu .m-item:nth-child(5){animation-delay:.16s}
  @keyframes mIn { from { opacity:0; transform:translateY(6px);} to { opacity:1; transform:none; } }
  .live-dot { position:relative; } .live-dot::after { content:''; position:absolute; inset:-3px; border-radius:9999px; background:currentColor; opacity:.35; animation:ping 1.8s cubic-bezier(0,0,.2,1) infinite; }
  @keyframes ping { 75%,100% { transform:scale(2.2); opacity:0; } }
  /* Design-system page helpers */
  .ds-h { font-size:20px; line-height:26px; text-transform:uppercase; letter-spacing:.12em; font-weight:400; }
  .ds-k { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; overflow-wrap:anywhere; }
