/* Exact HAKCD HUD 2026 colors, supplied fonts and wordmark. */
:root{color-scheme:dark;--ivory:#f6f1e6;--gold:#f5b95c;--friend:#4be39a;--alert:#ff6a4d;--text:#f8f4ea;--muted:#9d998b;--ink:#14150f;--surf:rgba(14,15,13,.42);--shade:rgba(246,241,230,.06);--rule:rgba(246,241,230,.14);--display:'Outfit',ui-sans-serif,system-ui,sans-serif;--mono:'Google Sans Code',ui-monospace,monospace;font-synthesis:none;background:#0b0c0a;color:var(--text)}
*{box-sizing:border-box}body{margin:0;min-height:100svh;font:300 16px/1.5 var(--display);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;touch-action:manipulation}a:focus-visible,button:focus-visible,video:focus-visible{outline:2px solid var(--gold);outline-offset:5px}[hidden]{display:none!important}
.masthead{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px clamp(22px,2.6vw,64px);padding-top:max(18px,env(safe-area-inset-top));background:var(--surf);backdrop-filter:blur(14px);position:relative;z-index:2}
.wordmark{display:flex;align-items:center;min-height:44px;text-decoration:none;flex:none}.wordmark img{display:block;width:154px;height:auto;opacity:.94}
.play-demo{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 23px;border:0;border-radius:999px;text-decoration:none;background:var(--ivory);color:var(--ink);font:300 16px/1.4 var(--display);transition:background .18s}.play-demo:hover{background:#fffaf0}.play-demo svg{width:16px;height:16px;fill:currentColor}
main{width:min(100%,1920px);margin:0 auto}.screen{position:relative;display:grid;place-items:center;background:#000;min-height:240px}video{display:block;width:100%;max-height:calc(100svh - 150px);aspect-ratio:16/9;object-fit:contain;background:#000}
.video-meta{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px clamp(22px,2.6vw,64px);color:var(--muted);font:400 12px/1.5 var(--mono);letter-spacing:.12em}.video-meta>span{text-transform:uppercase}.video-meta button,.watch{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:0;border-radius:999px;background:rgba(246,241,230,.06);color:var(--text);backdrop-filter:blur(14px);font:300 16px/1.4 var(--display);letter-spacing:0}.video-meta button:hover,.watch:hover{background:rgba(246,241,230,.14)}.video-meta button[aria-pressed=true]{color:var(--muted)}.watch{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:14px 24px;background:rgba(14,15,13,.72);font-size:18px}
#video-error{margin:20px;padding:14px;color:var(--alert);font:300 16px/1.5 var(--display)}#video-error a{color:var(--ivory)}
@media(max-width:600px){.masthead{min-height:80px;padding:15px 20px;gap:16px}.wordmark img{width:126px}.play-demo{font-size:15px;padding:12px 17px;gap:8px}.screen{min-height:0}.video-meta{padding:10px 20px;font-size:12px;letter-spacing:.06em;gap:12px}.video-meta button{font-size:15px;padding:10px 15px}video{max-height:none}main{padding-top:clamp(0px,8svh,70px)}}
@media(max-width:350px){.masthead{gap:10px;padding-inline:14px}.wordmark img{width:105px}.play-demo{padding-inline:14px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}