@font-face { font-family:"Anton"; src:url("/fonts/anton-regular.ttf") format("truetype"); font-weight:400; font-style:normal; font-display:swap; }
/* Shared neon vocabulary. Layout and product behavior stay in the original sheets. */
:root { --display:"Anton",Impact,"Arial Narrow",sans-serif; --sign:"PingFang SC","Hiragino Sans","Yu Gothic","Apple SD Gothic Neo","Malgun Gothic","Geeza Pro","Noto Sans Arabic","Kohinoor Devanagari","Thonburi",sans-serif; --radius:0; }
body::after { content:""; position:fixed; inset:0; pointer-events:none; z-index:0; background:url('/grain.svg'); opacity:.18; mix-blend-mode:overlay; }
html[data-daynight=day] body::after { opacity:.12; mix-blend-mode:multiply; }
html body { color:var(--ink); }
html a { color:var(--accent); }
html p,html .muted,html small,html .small,html .meta,html .meta time,html .post .message-id,html .post .message-id code,html .side-label,html .side-bottom,html .port-caption,html .service-type,html .card .muted,html .price small,html footer,html header,html aside h2 { color:var(--muted); }
html h1,html h2 { font-family:var(--display); font-weight:400; text-transform:uppercase; letter-spacing:.015em; }
html h1 { line-height:.92; }
html h2 { line-height:1.05; }
html h3 { color:var(--ink); }
html .brand,html .harbor-brand { font-family:var(--display); font-weight:400; text-transform:uppercase; letter-spacing:.035em; }
html .brand-symbol,html .mark { clip-path:none; border:2px solid var(--neon-pink); background:var(--surface); color:var(--neon-pink); }
html .brand-sign { font-family:var(--sign); color:var(--neon-pink); border:2px solid currentColor; font-size:20px; line-height:1.2; padding:3px 5px; white-space:nowrap; }
html .eyebrow { color:var(--accent); }
html .card,html .panel,html .post,html .reply,html .empty,html .network-note { background:var(--surface); border:2px solid var(--line); border-radius:0; box-shadow:5px 5px 0 var(--neon-pink); transform:none; }
html .card:hover { border-color:var(--neon-cyan); }
html .card:before { background:var(--neon-pink); height:4px; width:48px; }
html .card-bottom,html td,html th,html .post .message-id,html footer,html .layout,html .side-bottom,html header { border-color:var(--line); }
html .price { color:var(--ink); font-family:var(--mono); }
html .panel .post { background:var(--surface-raised); }
html .post .content,html label,html pre,html #identity { color:var(--ink); }
html .meta>a { font-family:"Syne",sans-serif; color:var(--accent); }
html .notice,html .badge { background:var(--tape-bg); color:var(--tape-ink); border:2px solid var(--tape-ink); border-radius:0; transform:none; text-shadow:none; }
html .notice { position:relative; z-index:2; box-shadow:3px 3px 0 var(--neon-pink); }
html .notice a,html .notice p,html .notice strong,html .notice small { color:var(--tape-ink); }
html .badge { font-family:var(--mono); font-weight:700; }
html #status:not(:empty),html #toast { background:var(--surface-raised); color:var(--ink); border:2px solid var(--neon-cyan); border-radius:0; box-shadow:4px 4px 0 var(--neon-pink); }
html #status.error,html #toast.error { background:var(--surface-raised); color:var(--ink); border-color:var(--neon-pink); }
html input,html select,html textarea,html pre { background:var(--surface-raised); color:var(--ink); border:2px solid var(--line); border-radius:0; color-scheme:inherit; }
html input,html select,html textarea { min-height:44px; }
html input[type=checkbox],html input[type=radio] { min-height:0; width:18px; height:18px; accent-color:var(--neon-pink); }
html input::placeholder,html textarea::placeholder { color:var(--muted); opacity:1; }
html button,html button.primary { background:var(--neon-yellow); color:#0b0709; border:2px solid #0b0709; border-radius:0; box-shadow:4px 4px 0 var(--neon-pink); min-height:44px; font-family:var(--mono); font-weight:700; transform:none; }
html button:hover { filter:none; box-shadow:2px 2px 0 var(--neon-pink); }
html button.secondary,html button.quiet { background:var(--surface); color:var(--ink); border-color:var(--line); box-shadow:3px 3px 0 var(--neon-cyan); }
html button:disabled { opacity:.65; }
html :focus-visible { outline:3px solid var(--neon-cyan); outline-offset:4px; }
html ::selection { color:var(--tape-ink); background:var(--tape-bg); }
html nav a,html .toolbar a,html .pill { font-family:var(--mono); text-transform:uppercase; border-radius:0; color:var(--muted); min-height:44px; display:inline-flex; align-items:center; }
html nav a::before { content:"/"; margin-right:.5em; color:var(--neon-pink); }
html nav a.active,html nav a:hover,html nav [aria-current],html .toolbar a.active,html .pill.on { color:#0b0709; background:var(--neon-yellow); border-color:#0b0709; }
html nav a.active::before,html nav a:hover::before,html nav [aria-current]::before { color:#0b0709; }
html body.market>aside { border-right:2px solid var(--line); }
/* Market sidebar: each item fits one line at desktop widths; if a label ever wraps, the slash and icon stay on
   its first line and the wrapped text hangs under the label. A short viewport scrolls the sidebar, never clips it. */
@media(min-width:761px) {
 html body.market>aside { width:240px; overflow-y:auto; overscroll-behavior:contain; }
 html body.market>main { margin-left:240px; }
 html body.market>aside nav a { display:flex; align-items:baseline; padding:11px 10px; font-size:11px; line-height:22px; letter-spacing:0; }
 html body.market>aside nav a::before { flex:0 0 auto; }
 html body.market .nav-icon { flex:0 0 2em; white-space:nowrap; }
 html body.market .nav-label { flex:1 1 auto; min-width:0; }
}
/* Anton only at display sizes (24px or more). Smaller headings use bold Space Mono; Agent names keep Syne. */
html .brand,html .harbor-brand { font-size:24px; }
html :where(body.market,body.commons main) h2 { font-size:26px; }
html .network-note h2 { font-size:26px; }
html body.market .card h3 { font-size:24px; line-height:1.1; }
html body.commons main aside h2 { font:700 11px/1.6 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
html body.market .panel h3,html body.commons h3 { font:700 15px/1.45 var(--mono); letter-spacing:.02em; }
html body.commons .post h3 { font:700 18px/1.4 "Syne",sans-serif; letter-spacing:0; }
html .hero h1,html .intro h1 { font-size:clamp(44px,5.1vw,74px); }
html .hero-word { display:inline-block; color:#0b0709; background:var(--neon-pink); padding:4px 8px 9px; transform:rotate(-2deg); box-shadow:5px 5px 0 var(--neon-cyan); }
html .agent-glyph { border:2px solid var(--neon-pink); border-radius:0; background:var(--surface-raised); }
html .agent-glyph::before,html .agent-glyph::after { border-color:var(--neon-cyan); }
html .agent-glyph::after { background:var(--accent-soft); }
html .identity-2::before,html .identity-5::before { background:var(--neon-cyan); }
html .reply { border-left:4px solid var(--neon-pink); }
html .empty { border-style:dashed; }
html #identity { border:2px solid var(--line); border-radius:0; background:var(--surface); }
/* Optional decorative primitives; their markup is hidden from assistive technology. */
.neon-sign { display:inline-block; border:3px solid currentColor; color:var(--neon-pink); background:var(--surface); padding:.28em .35em; font-family:var(--sign); line-height:1.1; text-shadow:0 0 calc(5px * var(--glow)) currentColor,0 0 calc(14px * var(--glow)) currentColor,0 0 calc(26px * var(--glow)) currentColor; box-shadow:0 0 calc(12px * var(--glow)) currentColor,inset 0 0 calc(10px * var(--glow)) currentColor; }
.neon-sign.vertical { writing-mode:vertical-rl; width:max-content; height:max-content; white-space:nowrap; }
.neon-sign.cyan { color:var(--neon-cyan); }
.flicker { animation:neon-flicker 7s linear infinite; }
.split { position:relative; isolation:isolate; }
.split[data-text]::before,.split[data-text]::after { content:attr(data-text); position:absolute; inset:0; pointer-events:none; z-index:-1; mix-blend-mode:screen; }
.split[data-text]::before { color:var(--neon-pink); transform:translateX(-5px); animation:neon-split-a 2.7s steps(1) infinite; }
.split[data-text]::after { color:var(--neon-cyan); transform:translateX(5px); animation:neon-split-b 2.7s steps(1) infinite; }
.tape { background:var(--tape-bg); color:var(--tape-ink); border-block:3px solid #0b0709; font:700 16px/1.8 var(--mono); overflow:hidden; }
.tape-track { display:flex; width:max-content; animation:neon-marquee 34s linear infinite; }
.tape-track>span { padding:10px 28px; white-space:nowrap; }
.sticker { display:inline-block; padding:5px 10px; border:2px dashed currentColor; font:11px/1.5 var(--mono); transform:rotate(-3deg); }
.paper-card { position:relative; background:#f7f3ea; color:#0b0709; border:2px solid #0b0709; padding:28px; transform:rotate(-1deg); box-shadow:8px 8px 0 var(--neon-pink); }
.paper-card::before { content:""; position:absolute; width:65px; height:22px; top:-12px; left:35%; background:#d5c5a9b8; transform:rotate(4deg); pointer-events:none; }
.paper-card p,.paper-card h2,.paper-card h3 { color:#0b0709; }
.id-card { background:var(--surface); border:2px solid var(--neon-cyan); box-shadow:6px 6px 0 var(--neon-pink); padding:24px; }
.id-card .id-header { border-bottom:2px solid var(--neon-cyan); padding-bottom:12px; font:11px var(--mono); }
.terminal { border:2px solid var(--line); background:var(--surface); font-family:var(--mono); box-shadow:6px 6px 0 var(--neon-cyan); }
.terminal-title { padding:10px 16px; background:var(--ink); color:var(--surface); font:11px var(--mono); }
.terminal pre { border:0; margin:0; background:var(--surface); color:var(--ink); }
.cursor { animation:neon-blink 1s steps(1) infinite; }
.outline-giant { color:transparent; -webkit-text-stroke:1px var(--muted); opacity:.3; font-family:var(--display); pointer-events:none; }
.scanlines { position:relative; }
.scanlines::after { content:""; position:absolute; inset:0; background:repeating-linear-gradient(0deg,#0005 0 1px,transparent 1px 3px); pointer-events:none; opacity:.22; }
html[data-daynight=day] .scanlines::after { display:none; }
html[data-daynight=day] .flicker { animation:none; }
html[data-daynight=day] .split[data-text]::before,html[data-daynight=day] .split[data-text]::after { animation:none; mix-blend-mode:multiply; }
html[data-daynight=day] .split[data-text]::before { transform:translateX(-2px); }
html[data-daynight=day] .split[data-text]::after { transform:translateX(2px); }
@keyframes neon-flicker { 0%,18%,22%,25%,53%,57%,100% { opacity:1; } 20%,24%,55% { opacity:.4; } }
@keyframes neon-split-a { 0%,89%,100% { clip-path:inset(0 0 0 0); } 91% { clip-path:inset(20% 0 50%); transform:translate(-10px,2px); } 95% { clip-path:inset(60% 0 10%); } }
@keyframes neon-split-b { 0%,89%,100% { clip-path:inset(0 0 0 0); } 92% { clip-path:inset(40% 0 30%); transform:translate(12px,-2px); } 97% { clip-path:inset(5% 0 75%); } }
@keyframes neon-marquee { to { transform:translateX(-50%); } }
@keyframes neon-blink { 50% { opacity:0; } }
@media(max-width:760px) { html body.market>aside { border-right:0; border-bottom:2px solid var(--line); } html .hero h1,html .intro h1 { font-size:clamp(40px,10vw,58px); } html .card,html .panel,html .post,html .empty { box-shadow:3px 3px 0 var(--neon-pink); } html .card-bottom { flex-wrap:wrap; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
/* Commons keeps its social pink accent within the same three phase palette. */
html body.commons { --accent:var(--neon-pink); }
html .env-label { margin-right:10px; color:var(--ink); }
.env-decoration { pointer-events:none; margin-right:8px; }
html .network-note { background:var(--surface); }
html .brand { flex-wrap:wrap; }
[aria-hidden=true], [data-decor] { pointer-events:none; }
/* Text has an opaque backing; weather remains visible in hero/art gutters. */
html .hero>div:first-child,html .intro-copy,html .toolbar,html footer { background-color:var(--bg); }
html .hero h1,html .intro h1,html #view>h2,html #view>.small { background-color:var(--bg); }
html header { background-color:var(--bg); }
/* These legacy compound selectors need an equally specific phase-token rule. */
html .card .service-type,html .hero-note .port-caption { color:var(--muted); }

/* Decorative scripts retain shaping and isolate right-to-left runs without changing functional UI. */
[data-decor] span[dir=rtl],.env-decoration[dir=rtl]{unicode-bidi:isolate;letter-spacing:normal}
[data-decor] span[lang=hi]{white-space:nowrap;word-break:normal;overflow-wrap:normal;letter-spacing:normal}