/* Okayd skin: loads after assets/okayd.css on every page except nyted.html.
   Same content and scripts; the new look: warm black, door-sign type, flat app ink, hairlines, no glows. */
@font-face{font-family:"Saira Condensed";src:url(../fonts/saira-condensed-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}

:root{
  --night:#0C0B0D;--night-2:#131115;--raise:#17151A;--raise-2:#1E1B21;
  --line:#2B272E;--line-2:#3A3540;
  --ink:#F2EDE4;--dim:#B3ACA6;--faint:#7C7672;
  --r-lg:10px;--r-md:8px;--r-sm:6px;
  --wrap:1280px;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
}
body{background:var(--night)}

/* type: condensed door-sign capitals for the big lines, plain sans for the rest */main:not(.skin) h1,main:not(.skin) h2{font-family:var(--sign);font-weight:800;text-transform:uppercase;letter-spacing:0;line-height:.9}main:not(.skin) h1{font-size:clamp(54px,8vw,128px)}main:not(.skin) .p-hero h1{font-size:clamp(52px,7.4vw,118px);max-width:11em}main:not(.skin) h2{font-size:clamp(40px,5.6vw,88px)}main:not(.skin) .band h2,main:not(.skin) .where h2{font-size:clamp(36px,4.4vw,64px)}main:not(.skin) .dock-sec h2{font-size:clamp(34px,4.2vw,60px)}main:not(.skin) h2 em,main:not(.skin) h1 em{font-style:normal;color:var(--acc)}main:not(.skin) h3,main:not(.skin) h4{font-family:"DM Sans",system-ui,sans-serif;font-weight:700;letter-spacing:-.01em}main:not(.skin) .small,main:not(.skin) .dim{color:var(--faint)}

/* buttons: square till keys, no glow */main:not(.skin) .btn{border-radius:6px!important;font-family:"DM Sans",system-ui,sans-serif;font-weight:700;letter-spacing:0}main:not(.skin) .btn-main:hover{box-shadow:none;transform:translateY(-1px)}main:not(.skin) .btn-line{box-shadow:inset 0 0 0 1.5px var(--line-2)}main:not(.skin) .link{border-bottom-width:1.5px}

/* status signs and chips: stencilled tags, not glowing pills */main:not(.skin) .sign{border-radius:4px}main:not(.skin) .sign::before{border-radius:0;box-shadow:none!important}main:not(.skin) .chip{border-radius:4px!important;font-family:var(--mono)!important;font-size:11px!important;font-weight:500!important;letter-spacing:.06em!important;text-transform:uppercase}main:not(.skin) .chip[aria-pressed=true]{box-shadow:none!important}

/* header + dropdowns */
.top{background:rgba(12,11,13,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.top .menu{background:#141216!important;border:1px solid var(--line-2)!important;border-radius:8px!important;box-shadow:0 24px 48px rgba(0,0,0,.6)!important}
.top .menu a{border-radius:6px!important}
.top .menu img{border-radius:6px}

/* page hero: a flat strip of the app's colour across the top, instead of a glow */main:not(.skin) .p-hero{position:relative;border-bottom:1px solid var(--line)}main:not(.skin) .p-hero::before{inset:0 0 auto 0!important;height:6px!important;background:var(--acc)!important;filter:none!important;opacity:1!important;transform:none!important}main:not(.skin) .p-hero::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:80px 80px;opacity:.35;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%)}

/* devices */main:not(.skin) .phone{background:#050405;border-radius:36px;box-shadow:0 0 0 1px var(--line-2),0 30px 60px -20px #000!important}main:not(.skin) .phone img{border-radius:27px}main:not(.skin) .shot-scr{background:var(--raise)!important;border-radius:20px}main:not(.skin) .shot-scr img,main:not(.skin) .shot-scr .mono-icon{box-shadow:none!important}main:not(.skin) .shot-soon .phone{box-shadow:0 0 0 1px var(--line-2),0 30px 60px -20px #000!important}

/* panels: flat, hairline, a bar of colour on the left */main:not(.skin) .band,main:not(.skin) .where{background:var(--raise)!important;border:1px solid var(--line)!important;border-left:6px solid var(--acc)!important;border-radius:10px!important}main:not(.skin) .where{border-left-color:var(--c,var(--acc))!important}main:not(.skin) .plan-card,main:not(.skin) .tile,main:not(.skin) .person,main:not(.skin) .note,main:not(.skin) .map-card,main:not(.skin) .nz-card,main:not(.skin) .rf-card,main:not(.skin) .sk-card,main:not(.skin) .sk-panel,main:not(.skin) .form,main:not(.skin) .hk-ideas,main:not(.skin) .rf-cal,main:not(.skin) .rf-demo{border-radius:10px!important}main:not(.skin) .plan-card,main:not(.skin) .tile{background:var(--night-2)!important;box-shadow:none!important}main:not(.skin) .plan-card:hover,main:not(.skin) .tile:hover{border-color:var(--line-2)}main:not(.skin) .photo{border-radius:10px}main:not(.skin) .photo figcaption{border-radius:4px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase}main:not(.skin) .note-box{border-left-width:4px}

/* feature lists: numbered like a run sheet */main:not(.skin) .feat{border-top:1px solid var(--line-2)}main:not(.skin) .feat h3::before{border-radius:0;width:10px;height:10px}main:not(.skin) .steps li{border-top-width:3px}main:not(.skin) .steps li::before{font-size:56px}main:not(.skin) .incl li::before{border-color:var(--checkd)}

/* forms */main:not(.skin) input,main:not(.skin) select,main:not(.skin) textarea{border-radius:6px!important}

/* footer */
.foot{background:var(--night)!important}
.foot h4{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase}
.foot .base{font-family:var(--mono);font-size:11px;letter-spacing:.03em}

/* preview label (remove before going live) */
.preview-flag{background:#FFC928;color:#111;text-align:center;padding:6px 12px;font:500 11px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}

@media (max-width:700px){
  main:not(.skin) h1,main:not(.skin) .p-hero h1{font-size:clamp(44px,13vw,64px)!important}
  main:not(.skin) h2{font-size:clamp(34px,10vw,48px)!important;line-height:.95!important}
}

/* leftover navy surfaces from the old palette */main:not(.skin) .refer,main:not(.skin) .rf{background:var(--raise)!important;border:1px solid var(--line)!important;border-left:6px solid #2BD67B!important;border-radius:10px!important}main:not(.skin) .rf-card{background:var(--night)!important;border-radius:10px!important;box-shadow:none!important}main:not(.skin) .rf-step{border-radius:6px!important}main:not(.skin) .dock-bar,main:not(.skin) .dock-tip{background:#141216!important;border-color:var(--line-2)!important;border-radius:10px!important;box-shadow:0 20px 40px -20px #000!important}main:not(.skin) .dock-bar img,main:not(.skin) .dock-bar button{border-radius:8px!important}main:not(.skin) .map-label{background:#141216!important;border-radius:4px!important}main:not(.skin) .nav.open{background:#0C0B0D!important}main:not(.skin) .pass-panel input{background:var(--night-2)!important}main:not(.skin) .tablet,main:not(.skin) .laptop{background:#050405!important;border-radius:22px!important;box-shadow:0 0 0 1px var(--line-2),0 30px 60px -20px #000!important}main:not(.skin) .chip{background:var(--night-2)}main:not(.skin) .chip.live{background:rgba(43,214,123,.10)}

/* =====================================================================
   v3 · tagline, ticket buttons, packages, day/night theme
   ===================================================================== */
.top .wrap{gap:18px}
.tagline{display:flex;flex-direction:column;gap:3px;margin:0;padding-left:16px;border-left:1px solid var(--line-2);max-width:280px;line-height:1.2;flex:none}
.tagline span{font:700 13px/1.2 "DM Sans",system-ui,sans-serif;color:var(--ink)}
.tagline b{font:500 10.5px/1.2 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--okayd)}
.theme-btn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 11px;margin-left:6px;background:none;border:1px solid var(--line-2);border-radius:2px;color:var(--dim);font:500 10.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;flex:none}
.theme-btn:hover{color:var(--ink);border-color:var(--ink)}
.theme-btn i{width:12px;height:12px;border-radius:50%;border:1.5px solid currentColor;background:linear-gradient(90deg,currentColor 50%,transparent 50%)}
.theme-btn[data-mode="day"] i{background:currentColor;border-style:dotted}
.theme-btn[data-mode="night"] i{background:transparent;box-shadow:inset 4px -2px 0 currentColor;border-color:transparent}
/* make room for the tagline: fold rarely used links, then fold to the menu button earlier */
@media (max-width:1440px){.nav>a[href="about.html"],.nav>a[href="support.html"]{display:none}}
@media (max-width:1240px){
  .nav{display:none}.burger{display:block}
  .nav.open{display:flex;position:fixed;inset:72px 0 auto;flex-direction:column;align-items:stretch;background:#0C0B0D;padding:16px var(--gut) 28px;gap:2px;border-bottom:1px solid var(--line);max-height:calc(100svh - 72px);overflow:auto}
  .nav.open>a,.nav.open>.dd>button{font-size:18px;padding:14px 4px;text-align:left;width:100%}
  .nav.open>a[href="about.html"],.nav.open>a[href="support.html"]{display:block}
  .nav.open .menu{position:static;transform:none;width:auto;grid-template-columns:1fr;box-shadow:none;margin:4px 0 10px;background:var(--night-2)}
  .nav.open>a.btn{margin:10px 0 0;min-height:52px;font-size:16px}
}
@media (max-width:760px){
  .top .wrap{flex-wrap:wrap;height:auto;padding-top:10px;padding-bottom:10px;row-gap:8px}
  .tagline{order:3;flex-basis:100%;max-width:none;border-left:0;padding:8px 0 0;border-top:1px solid var(--line);flex-direction:row;flex-wrap:wrap;gap:2px 10px}
  .tagline span{font-size:12.5px}
  .theme-btn span{display:none}
  .nav.open{inset:auto 0 auto;top:var(--hdr,120px)}
}

/* buttons: door tickets. Condensed caps, square corners, a perforated stub with the arrow */
main:not(.skin) .btn{border-radius:2px!important;font:800 17px/50px var(--sign)!important;text-transform:uppercase;letter-spacing:.045em;padding:0 0 0 18px!important;min-height:50px;gap:0!important;align-items:stretch!important;box-shadow:none}
main:not(.skin) .btn::after{content:"→";display:flex;align-items:center;padding:0 15px;margin-left:16px;border-left:1.5px dashed currentColor;font:600 16px "DM Sans",system-ui,sans-serif;opacity:.85;transition:transform .15s}
main:not(.skin) .btn:hover{transform:none!important;box-shadow:none!important}
main:not(.skin) .btn:hover::after{transform:translateX(3px)}
main:not(.skin) .btn:active{transform:translateY(1px)!important}
main:not(.skin) .btn-line{box-shadow:none!important;border:1.5px solid var(--line-2)!important}
main:not(.skin) .btn-line:hover{border-color:var(--ink)!important}
main:not(.skin) .btn.small,main:not(.skin) form .btn{line-height:42px!important;min-height:42px;font-size:15px!important}
.nav .btn,.nav>a.btn-main{border-radius:2px!important;font:800 15px/1 var(--sign)!important;text-transform:uppercase;letter-spacing:.05em}
#newsletter-form .btn{border-radius:2px!important;font:800 16px/1 var(--sign)!important;text-transform:uppercase;letter-spacing:.05em}
.burger{border-radius:2px!important;font-family:var(--mono)!important;font-size:11px!important;font-weight:500!important;letter-spacing:.08em;text-transform:uppercase}

/* packages strip on Plans */
.pk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:30px;border-top:1px solid var(--line-2);border-left:1px solid var(--line)}
.pk-card{position:relative;display:flex;flex-direction:column;gap:10px;padding:24px 22px 22px;text-decoration:none;color:var(--ink);border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .2s}
.pk-card::before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:var(--c);transform:scaleX(.18);transform-origin:left;transition:transform .3s}
.pk-card:hover{background:var(--night-2)}
.pk-card:hover::before{transform:none}
.pk-when{font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--c)}
.pk-card h3{font:800 30px/1 var(--sign)!important;text-transform:uppercase;letter-spacing:0!important;margin:0}
.pk-card p{color:var(--dim);margin:0;font-size:15px}
.pk-icons{display:flex;gap:6px;margin-top:auto;padding-top:8px}
.pk-icons img{width:26px;height:26px;border-radius:6px}
.pk-go{font:800 15px/1 var(--sign);text-transform:uppercase;letter-spacing:.05em;color:var(--ink)}
.pk-go::after{content:" →"}
@media (max-width:900px){.pk-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pk-grid{grid-template-columns:1fr}}

/* ===================== light theme ("day") ===================== */
html.is-light{--night:#F4EEE3;--night-2:#ECE5D8;--raise:#FFFDF8;--raise-2:#F3EDE2;--line:rgba(27,23,20,.12);--line-2:rgba(27,23,20,.24);--ink:#1B1714;--dim:#4E4640;--faint:#7A7068;color-scheme:light}
html.is-light body{background:var(--night);color:var(--ink)}
html.is-light .top{background:rgba(244,238,227,.95)!important}
html.is-light .top .menu{background:#FFFDF8!important;box-shadow:0 24px 48px rgba(27,23,20,.18)!important}
html.is-light .nav.open{background:#F4EEE3!important}
html.is-light .nav a,html.is-light .nav .dd>button{color:var(--dim)}
html.is-light .burger{color:var(--ink);border-color:var(--line-2)}
html.is-light .tagline b{color:#D93A17}
html.is-light .p-hero::after{opacity:.6}
/* app colours as text: deepen them so they read on paper */
html.is-light [style*="--c:#FFC928"]{--c:#A87800}html.is-light [style*="--c:#D4A531"]{--c:#8A6A12}html.is-light [style*="--c:#47A0FF"]{--c:#1F6FD1}
html.is-light [style*="--c:#2BD67B"]{--c:#14874A}html.is-light [style*="--c:#1FC7D4"]{--c:#0B7F88}html.is-light [style*="--c:#B8F04A"]{--c:#4F7A00}
html.is-light [style*="--c:#EFE9D8"]{--c:#6B5E45}html.is-light [style*="--c:#9DB06E"]{--c:#55663F}html.is-light [style*="--c:#A78BFA"]{--c:#6D4FD8}
html.is-light [style*="--c:#FF4FA3"]{--c:#C2186F}html.is-light [style*="--c:#4C8DFF"]{--c:#2563D9}html.is-light [style*="--c:#FF5A36"]{--c:#D93A17}
html.is-light [style*="color:#FFC928"]{color:#A87800!important}html.is-light [style*="color:#2BD67B"]{color:#14874A!important}html.is-light [style*="color:#1FC7D4"]{color:#0B7F88!important}
html.is-light [style*="color:#B8F04A"]{color:#4F7A00!important}html.is-light [style*="color:#EFE9D8"]{color:#6B5E45!important}html.is-light [style*="color:#9DB06E"]{color:#55663F!important}
html.is-light [style*="color:#D4A531"]{color:#8A6A12!important}html.is-light [style*="color:#47A0FF"]{color:#1F6FD1!important}
html.is-light main:not(.skin) :is(.link,h1 em,h2 em,.sign){color:color-mix(in srgb,var(--c,var(--acc)) 55%,#1B1714)}
html.is-light main:not(.skin) .steps li::before{color:color-mix(in srgb,var(--acc) 55%,#1B1714)}
html.is-light main:not(.skin) .btn-main{color:#1B1714}
html.is-light .chip{background:var(--night-2)}
html.is-light .chip.live{background:rgba(23,128,63,.10);color:#17803F}
html.is-light .chip.dev{color:#8A6A12}html.is-light .chip.soon{color:#C2186F}html.is-light .chip.later{color:#6B5E45}
html.is-light .incl li::before{border-color:#17803F}
html.is-light input,html.is-light select,html.is-light textarea{background:#FFFDF8!important;color:var(--ink)!important;border-color:var(--line-2)!important}
html.is-light .plan-card,html.is-light .tile{background:#FFFDF8!important}
html.is-light .preview-flag{background:#1B1714;color:#FFC928}
html.is-light .foot{background:var(--night)!important}
html.is-light .photo figcaption{color:#F2EDE4}
.nav>a,.nav .dd>button,.nav .btn{white-space:nowrap}

/* v4 · no "terminal" lettering on the inner pages either */
.chip{font-family:var(--sign)!important;font-size:13px!important;font-weight:800!important;letter-spacing:.06em!important}
.tagline b{font:600 13px/1.2 "DM Sans",system-ui,sans-serif;letter-spacing:0;text-transform:none}
.theme-btn,.burger{font:600 12.5px/1 "DM Sans",system-ui,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
.foot h4{font:600 13px/1 "DM Sans",system-ui,sans-serif;letter-spacing:0;text-transform:none}
.foot .base{font:12.5px "DM Sans",system-ui,sans-serif;letter-spacing:0}
.photo figcaption{font:500 12px "DM Sans",system-ui,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
.pk-when{font:800 13px/1 var(--sign);letter-spacing:.06em}
.preview-flag{font:600 12px/1.4 "DM Sans",system-ui,sans-serif;letter-spacing:.02em;text-transform:none}