@import url('/brand/hai-brand-colors.css');
@font-face{font-family:Manrope;src:url('/brand/fonts/Manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/brand/fonts/DMSans.ttf') format('truetype');font-weight:100 1000;font-display:swap}
:root{--cream:#F7F4EA;--paper:#FFFFFF;--forest:#164E63;--ink:#0B141B;--muted:#4B5053;--coral:#9CCDE7;--line:#C5C5BF;--brand-canvas:#9CCDE7;--brand-mark:#164E63;--brand-headline:#0B141B;--brand-button:#FFFFFF;--brand-button-text:#0B141B;--ui-bg:#FFFFFF;--ui-text:#0B141B;--ui-label:#4B5053;--ui-card:#FFFFFF;--ui-border:#C5C5BF;--ui-primary:#164E63;--ui-primary-text:#FFFFFF;--ui-secondary:#F7F4EA;--ui-secondary-text:#0B141B;--ui-secondary-border:#0B141B;--ui-hover:#F7F4EA;--ui-hover-text:#0B141B;--ui-focus:#9CCDE7;--ui-focus-text:#0B141B;--ui-focus-ring:#0B141B;--ui-disabled:#4B5053;--ui-disabled-text:#FFFFFF;--map-card:#F7F4EA;--map-border:#BCBCB6;color-scheme:light}
html[data-theme="dark"]{--cream:#F7F4EA;--paper:#212930;--ink:#FFFFFF;--muted:#C2C4C6;--line:#484F54;--brand-canvas:#164E63;--brand-mark:#F7F4EA;--brand-headline:#F7F4EA;--brand-button:#F7F4EA;--brand-button-text:#0B141B;--ui-bg:#0B141B;--ui-text:#FFFFFF;--ui-label:#C2C4C6;--ui-card:#212930;--ui-border:#484F54;--ui-secondary:#212930;--ui-secondary-text:#FFFFFF;--ui-secondary-border:#FFFFFF;--ui-hover:#A4D1E9;--ui-hover-text:#0B141B;--ui-focus:#0F2732;--ui-focus-text:#FFFFFF;--ui-focus-ring:#FFFFFF;--ui-disabled:#FFFFFF;--ui-disabled-text:#0B141B;--map-card:#0B141B;--map-border:#484F54;color-scheme:dark}
body{background:var(--ui-bg);color:var(--ui-text);font-family:'DM Sans',system-ui,sans-serif}
h1,h2,h3,h4,.headline{font-family:Manrope,system-ui,sans-serif;font-weight:600}
p,small,button,input,select,textarea{font-family:'DM Sans',system-ui,sans-serif}
.button,.btn,.hc-primary{min-height:48px;padding:12px 20px;border-radius:12px;background:var(--ui-primary);color:var(--ui-primary-text);border:1px solid var(--ui-primary);font-size:16px;font-weight:600;line-height:20px;box-shadow:none}
.button:hover,.btn:hover,.hc-primary:hover{background:var(--ui-hover);color:var(--ui-hover-text);transform:none;box-shadow:none}
.button:focus-visible,.btn:focus-visible,.hc-primary:focus-visible{background:var(--ui-focus);color:var(--ui-focus-text);outline:2px solid var(--ui-focus-ring);outline-offset:3px}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--ui-focus-ring);outline-offset:3px}
.button:active,.btn:active,.hc-primary:active{transform:translateY(2px)}
.button.secondary,.btn.secondary,.btn.ghost{background:var(--ui-secondary);color:var(--ui-secondary-text);border-color:var(--ui-secondary-border)}
.button:disabled,.btn:disabled,.hc-primary:disabled,button[aria-disabled=true]{background:var(--ui-disabled);color:var(--ui-disabled-text);opacity:1;cursor:not-allowed}
button[aria-pressed=true],.mode-buttons button.active,.workspace-mode button[aria-selected=true]{background:var(--ui-primary);color:var(--ui-primary-text)}
input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{min-height:48px;padding:12px;border:1px solid var(--ui-secondary-border);border-radius:12px;background:var(--ui-secondary);color:var(--ui-secondary-text);font-size:16px;line-height:24px}
input:focus-visible,textarea:focus-visible,select:focus-visible{background:var(--ui-focus);color:var(--ui-focus-text);outline:2px solid var(--ui-focus-ring);outline-offset:3px}
input:disabled,select:disabled,textarea:disabled{background:var(--ui-disabled);color:var(--ui-disabled-text);opacity:1}
label,.muted,.form-note,.field-note{color:var(--ui-label)}
.hero,.welcome-hero,.business-hero,.bs-hero{background:var(--brand-canvas);color:var(--brand-headline)}
.hero-copy>p,.hero h1 em,.bs-hero p,.business-hero-bottom p{color:var(--brand-headline)}
.hero .button,.welcome-hero .button,.bs-hero .btn{background:var(--brand-button);color:var(--brand-button-text);border-color:var(--brand-button)}
.logo img,.site-header .logo{height:auto;min-width:142px;width:142px}
.footer{background:var(--ui-bg);color:var(--ui-text)}
.product-demo,.demo-map,.map-journey,.demo-ribbon{background:var(--map-card);color:var(--ui-text);border-color:var(--map-border)}
.signup-panel,.workspace-card,.campaign-card,.panel,.sheet,dialog{background:var(--ui-card);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:16px}
.signup-panel input::placeholder{color:var(--ui-label);opacity:1}
.status.paused,.state-paused{background:var(--ui-disabled);color:var(--ui-disabled-text)}
.hai-place-pin{fill:none}
@media(max-width:600px){.hero-actions,.signup-actions{gap:12px}.hero-actions .button,.signup-actions .btn{width:100%}.site-header .logo{min-width:116px;width:116px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.button:active,.btn:active{transform:none}}

:root{--map-background:#F7F4EA;--map-street:#E2E0D7;--map-block:#F1EEE5;--map-park:#DEE2DB;--map-water:#D1D8D3;--map-route:#9CCDE7;--map-route-outline:#0B141B;--map-station:#9CCDE7;--map-station-center:#F7F4EA;--map-text:#0B141B;--map-subtext:#4D5355;--map-card:#F7F4EA;--map-card-border:#BCBCB6;--map-badge:#164E63;--map-badge-text:#FFFFFF;--map-badge-accent:#9CCDE7;--map-logo:#FFFFFF;--map-pin:#9CCDE7;--map-pin-text:#0B141B}
html[data-theme="dark"]{--map-background:#0B141B;--map-street:#212930;--map-block:#111A21;--map-park:#0F2732;--map-water:#0E212C;--map-route:#9CCDE7;--map-route-outline:#0B141B;--map-station:#9CCDE7;--map-station-center:#0B141B;--map-text:#FFFFFF;--map-subtext:#BBBDBF;--map-card:#0B141B;--map-card-border:#484F54;--map-badge:#164E63;--map-badge-text:#FFFFFF;--map-badge-accent:#9CCDE7;--map-logo:#FFFFFF;--map-pin:#9CCDE7;--map-pin-text:#0B141B}
.approved-brand-mark{width:64px;min-width:64px;height:64px;border-radius:12px}
.hero-note,.hero-actions .text-link{color:var(--brand-headline)}
html[data-theme="dark"] .site-header .logo img,html[data-theme="dark"] .simple-header img,html[data-theme="dark"] .footer-top>a img{content:url('/assets/logo-vector-light.svg')}html[data-theme="dark"] .approved-brand-mark{content:url('/brand/assets/hai-logo-night.png')}
/* Campaign canvases and product previews use their own approved role families. */
em{font-family:Manrope,system-ui,sans-serif;font-weight:600}
.welcome{background:var(--brand-canvas);color:var(--brand-headline)}
.welcome h1 em,.welcome-description,.welcome-availability,.welcome-availability span{color:var(--brand-headline)}
.welcome .button{background:var(--brand-button);color:var(--brand-button-text);border-color:var(--brand-button)}
.welcome-map-wash{background:linear-gradient(0deg,var(--brand-canvas),transparent 30%,transparent 75%,var(--brand-canvas))}
.welcome-journey,.welcome-place{background:var(--map-card);border-color:var(--map-border);color:var(--map-text)}
.welcome-journey-heading,.welcome-journey-bottom,.welcome-place small{color:var(--map-subtext)}
.welcome-journey-bottom{border-color:var(--map-card-border)}
.welcome-tram{background:var(--map-street)!important;color:var(--map-text)}
.welcome-origin,.welcome-caption{color:var(--brand-headline)}
.welcome-reminder{--reminder-accent:#164E63;background:var(--map-card);color:var(--map-text);border:1px solid var(--map-route);border-left:3px solid var(--reminder-accent);box-shadow:0 4px 0 #0B141B12,0 14px 28px -14px #0B141B80}
.welcome-reminder svg{color:var(--reminder-accent)}
.welcome-reminder span{color:var(--map-subtext);font-size:12px}
.welcome-reminder strong{color:var(--map-text);font-size:14px;font-weight:600}
html[data-theme="dark"] .welcome-reminder{--reminder-accent:#9CCDE7}
.welcome-benefits span{color:var(--ui-label)}
.welcome-benefits svg,.community-symbol{color:var(--brand-mark)}
.city-guide-card{background:var(--ui-card);color:var(--ui-text);border:1px solid var(--ui-border)}
.city-guide-card p{color:var(--ui-label)}
.business-teaser{background:var(--brand-canvas);color:var(--brand-headline)}
.business-copy h2 em,.business-copy>p,.shop-caption{color:var(--brand-headline)}
.business-copy .button{background:var(--brand-button);color:var(--brand-button-text);border-color:var(--brand-button)}
.download-section{background:var(--ui-bg);color:var(--ui-text);border-top:1px solid var(--ui-border)}
.download-section .eyebrow,.download-section p,.download-section .preview-link{color:var(--ui-label)}
.download-section h2 em{color:var(--ui-primary)}
html[data-theme="dark"] .download-section h2 em{color:var(--map-route)}
.download-section .store-button{background:var(--map-route);color:var(--map-pin-text);border-color:var(--map-route)}
.download-orbit{border-color:var(--ui-border);box-shadow:0 0 0 85px #9CCDE707,0 0 0 170px #9CCDE704}
.business-copy .button:hover,.download-section .store-button:hover{background:var(--ui-hover);color:var(--ui-hover-text)}
.business-copy .button:focus-visible,.download-section .store-button:focus-visible{background:var(--ui-focus);color:var(--ui-focus-text)}
.storefront,.shop-label{background:var(--map-card);color:var(--map-text);border-color:var(--map-card-border)}
.shop-sign{font-family:Manrope,sans-serif;font-style:normal;font-weight:600}
.shop-windows>div,.shop-windows .shop-door{background:var(--map-street);color:var(--map-text)}
/* Every scrolling-story layer follows the map palette, including its canvas. */
.journey-story{background:var(--map-background);color:var(--map-text);color:color-mix(in srgb,var(--map-text),#F7F4EA calc(var(--night,0)*100%))}
.story-night{background:#0B141B}
.story-ground{background:var(--map-background);box-shadow:0 15px 0 var(--map-street),0 40px 60px -25px #0B141B50}
.story-route-bed{stroke:var(--map-route-outline)}
.story-route-draw{stroke:var(--map-route)}
.story-location{background:var(--map-card);color:var(--map-text);border-color:var(--map-card-border)}
.story-underground{background:#0B141B;border-color:#484F54;box-shadow:0 15px 0 #212930,0 40px 60px -25px #0B141B80}
.story-stratum{background:#164E63;border-color:var(--map-card-border)}
.story-place{color:var(--map-text)}
.story-place>svg,.story-place>b,.story-landmark>span{background:var(--map-card);color:var(--map-text);border-color:var(--map-card-border)}
.story-landmark>span{font-family:Manrope,sans-serif;font-style:normal;font-weight:600}
.story-ribbon{background:var(--map-card);color:var(--map-text);border-color:var(--map-card-border);border-left-color:var(--map-route);box-shadow:0 5px 0 #0B141B18,0 18px 40px -20px #0B141B55}
.story-ribbon-icon{border-color:var(--map-card-border)}
.story-ribbon[data-story-ribbon="1"]{background:#0B141B;color:#FFFFFF;border-color:#484F54;border-left-color:#9CCDE7}
.hb-page{--hb-paper:var(--ui-bg);--hb-white:var(--ui-card);--hb-muted:var(--ui-label);--hb-line:var(--ui-border);--hb-sage:var(--map-park);--hb-road:var(--map-street);--hb-grid:var(--map-block);background:var(--ui-bg);color:var(--ui-text)}
.hb-page em{color:inherit}
.hb-hero{background:var(--brand-canvas);color:var(--brand-headline)}
.hb-hero em,.hb-hero-copy>p,.hb-hero-offer>span,.hb-scene-foot{color:var(--brand-headline)}
.hb-cta{min-height:48px;padding:12px 20px;border-radius:12px;font-size:16px;line-height:24px;background:var(--ui-primary);color:var(--ui-primary-text);border-color:var(--ui-primary)}
.hb-cta:hover{background:var(--ui-hover);color:var(--ui-hover-text);box-shadow:none}
.hb-cta:focus-visible{background:var(--ui-focus);color:var(--ui-focus-text);outline:2px solid var(--ui-focus-ring);outline-offset:3px}
.hb-hero .hb-cta{background:var(--brand-button);color:var(--brand-button-text);border-color:var(--brand-button)}
.hb-hello,.hb-phone,.hb-phone-screen,.hb-story-pin{background:var(--map-card);color:var(--map-text);border-color:var(--map-border)}
.hb-nav img{width:142px;height:auto}
.hb-nav .hb-signin{min-height:48px;border-radius:12px}
html[data-theme="dark"] .hb-nav>a>img{content:url('/assets/logo-vector-light.svg')}
.store-button{min-height:48px;border-radius:12px;background:var(--ui-primary);color:var(--ui-primary-text);border-color:var(--ui-primary);font-family:'DM Sans',sans-serif}
.store-button strong,.store-button small{color:inherit}
.button.secondary:hover,.btn.secondary:hover,.btn.ghost:hover,.store-button:hover,.welcome .button:hover,.hero .button:hover,.hb-hero .hb-cta:hover{background:var(--ui-hover);color:var(--ui-hover-text);border-color:var(--ui-secondary-border);box-shadow:none}
.button.secondary:focus-visible,.btn.secondary:focus-visible,.btn.ghost:focus-visible,.store-button:focus-visible,.welcome .button:focus-visible,.hero .button:focus-visible,.hb-hero .hb-cta:focus-visible{background:var(--ui-focus);color:var(--ui-focus-text);outline:2px solid var(--ui-focus-ring);outline-offset:3px}
.button.secondary:disabled,.btn.secondary:disabled,.btn.ghost:disabled,.store-button:disabled{background:var(--ui-disabled);color:var(--ui-disabled-text);opacity:1}

.menu-toggle{color:var(--ui-text);border-color:var(--ui-secondary-border)}
.menu-toggle span{background:currentColor}
@media(max-width:760px){
 .nav-links{background:var(--ui-card);color:var(--ui-text);border-color:var(--ui-border);padding:12px;gap:4px;box-shadow:0 12px 24px #0B141B18}
 .nav-links>a:not(.button){display:flex;align-items:center;min-height:48px;padding:12px;border-radius:8px}
 .nav-links>a:not(.button):hover{background:var(--ui-secondary);color:var(--ui-secondary-text)}
 .nav-links>.button{min-height:48px}
}
.welcome-actions .button{font-size:16px;line-height:24px;min-height:48px}
.text-link{font-size:14px;min-height:48px}
.welcome-actions .text-link{font-size:14px;color:var(--brand-headline)}

/* Navigation is unboxed. Launcher tiles remain exclusive to installation contexts. */
.logo img,.site-header .logo,.hb-nav img{width:132px;min-width:132px;height:auto}
.hb-nav{border-bottom:1px solid var(--ui-border)}
.hb-invitation{background:#164E63;color:#F7F4EA}
.hb-invite-copy h2,.hb-invite-copy .hb-eyebrow,.hb-invite-copy h2 em,.hb-invite-note,.hb-offer-details p{color:#F7F4EA}
.hb-invite-pass{background:#F7F4EA;color:#164E63}
.hb-invite-pass .hb-pass-small{color:#4B5053}
.hb-final{background:var(--brand-canvas);color:var(--brand-headline)}
.hb-final p{color:var(--brand-headline)}
.hb-final .hb-cta{background:var(--brand-button);color:var(--brand-button-text);border-color:var(--brand-button)}
.hb-final .hb-cta:hover{background:var(--ui-hover);color:var(--ui-hover-text)}
.hb-final .hb-cta:focus-visible{background:var(--ui-focus);color:var(--ui-focus-text)}
.hb-invite-pass img{content:url('/assets/logo-vector.svg')}
html[data-theme="dark"] .hb-footer>a>img,html[data-theme="dark"] .hb-phone-top img{content:url('/assets/logo-vector-light.svg')}
@media(max-width:600px){.logo img,.site-header .logo,.hb-nav img{width:112px;min-width:112px}}
@media(max-width:360px){.city-guide h2{font-size:clamp(48px,17.5vw,63px)}}

/* Account and campaign controls share the same surfaces; fixed light panels do not leak into night mode. */
.hai-account>.signup-panel{background:var(--ui-card);color:var(--ui-text);border-color:var(--ui-border);box-shadow:none}
.hai-account .social-signin .btn{background:var(--ui-secondary);color:var(--ui-secondary-text);border-color:var(--ui-secondary-border);font-size:16px}
.hai-account .btn:disabled{background:var(--ui-disabled);color:var(--ui-disabled-text);opacity:1}
.hai-account .signup-divider:before,.hai-account .signup-divider:after{background:var(--ui-border)}
.workspace-switch,.simple-header .workspace-switch{background:var(--ui-secondary);border-color:var(--ui-border)}
.workspace-switch button[aria-selected=true]{background:var(--ui-primary);color:var(--ui-primary-text);box-shadow:none}
.workspace-switch button:disabled{background:var(--ui-disabled);color:var(--ui-disabled-text);opacity:1}
.type-choice,.help-choose,.quiz-options button,.wizard-discard,.setup-note,.offer-explainer{background:var(--ui-card);color:var(--ui-text);border-color:var(--ui-border)}
.type-select,.type-learn,.wizard-review dt,.help-choose small{color:var(--ui-label)}
.campaign-wizard .form-footer{background:var(--ui-card);border-color:var(--ui-border)}
.demo-device,.demo-top,.demo-screen,.demo-bottom,.demo-place-card{background:var(--map-card);color:var(--map-text);border-color:var(--map-border)}
.demo-place-card p,.demo-place-card small,.demo-map-label{color:var(--map-subtext)}
.studio-exact-preview{background:var(--map-background);color:var(--map-subtext);--hc-paper:var(--map-background);--hc-card:var(--map-card);--hc-ink:var(--map-text);--hc-muted:var(--map-subtext);--hc-line:var(--map-border);--hc-soft:var(--map-block);--hc-accent:var(--map-route)}
html[data-theme="dark"] .hai-account>a>img,html[data-theme="dark"] .signup-page>a>img,html[data-theme="dark"] .loading-state img,html[data-theme="dark"] .demo-top img,html[data-theme="dark"] .landing-nav img,html[data-theme="dark"] .landing-footer>a>img{content:url('/assets/logo-vector-light.svg')}

/* One appearance control stays visible beside navigation on every screen. */
.appearance-toggle{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;line-height:1;appearance:none;-webkit-appearance:none;align-self:center;border:1px solid var(--ui-border);border-radius:50%;background:transparent;color:var(--ui-text);margin-left:auto}
.appearance-toggle svg{display:block;width:22px;height:22px;margin:0;pointer-events:none}
.appearance-toggle:hover{background:var(--ui-secondary)}
@media(max-width:760px){.menu-toggle{margin-left:0;padding:0;line-height:1;appearance:none;-webkit-appearance:none;align-self:center}.site-header{gap:12px}}
@media(min-width:761px){.site-header .nav-links{margin-left:0}}
.hb-nav{gap:24px}.hb-nav nav{margin-left:0}