/* GENERATED by tools/build.mjs from brand/brand.json and src/hub.css */
:root{--primary:#0F766E;--accent:#2DD4BF;--deep:#115E59;--page:#FFFFFF;--panel:#F2F8F7;--panel2:#E4F0EE;--line:#D2E3E0;--ink:#0B2B29;--ink2:#33504D;--muted:#4A6663;--onPrimary:#FFFFFF;--tint:#DDF3EF;--warnInk:#7A3E00;--warnBg:#FFF4E0;--dangerInk:#A32116;--dangerBg:#FDECEA;--okInk:#14532D;--okBg:#DDF5E6}
/* Community hub: enterprise light. Tokens are generated from brand/brand.json into the top of the built file. */
@font-face { font-family: "Manrope"; src: url(/assets/fonts/manrope-latin.woff2) format("woff2"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "Inter"; src: url(/assets/fonts/inter-latin.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; overflow-x: clip; background: var(--page); color: var(--ink); font: 400 16px/1.6 Inter, system-ui, -apple-system, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4 { font-family: Manrope, Inter, system-ui, sans-serif; color: var(--ink); letter-spacing: -0.015em; line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: clamp(1.9rem, 1.4rem + 2vw, 2.9rem); font-weight: 800; }
h2 { font-size: 1.5rem; font-weight: 700; } h3 { font-size: 1.1rem; font-weight: 700; } h4 { font-size: .95rem; }
p { margin: 0 0 1em; } a { color: var(--primary); text-underline-offset: 3px; } a:hover { color: var(--deep); }
img { max-width: 100%; display: block; }
code { background: var(--panel2); padding: .1em .4em; border-radius: 6px; font-size: .9em; }
hr { border: 0; border-top: 1px solid var(--line); margin: 1.2rem 0; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: #fff; padding: 8px 14px; border-radius: 8px; z-index: 100; } .skip:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; border-radius: 6px; }
.muted { color: var(--muted); } .small { font-size: .875rem; } .mt { margin-top: 2rem; }
.ic { width: 20px; height: 20px; flex: none; vertical-align: -4px; } .ic.lg { width: 28px; height: 28px; color: var(--primary); }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 20px 56px; } .wrap.narrow { max-width: 780px; }

/* header */
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.92); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--line); }
.bar { max-width: 1400px; margin: 0 auto; padding: 10px 20px; display: flex; align-items: center; gap: 12px; }
.logo-mark { display: none; } .brand { flex: none; } .brand img { height: 32px; width: auto; max-width: none; }
nav.primary { display: flex; gap: 2px; flex: 1; justify-content: center; }
.primary a { white-space: nowrap; color: var(--ink2); text-decoration: none; padding: 8px 6px; border-radius: 10px; font-weight: 500; font-size: .88rem; }
.primary a:hover { background: var(--panel); color: var(--ink); } .primary a[aria-current=page] { background: var(--tint); color: var(--deep); font-weight: 600; }
.tools, .acct { display: flex; align-items: center; gap: 6px; } .primary { min-width: 0; }
.icon-btn { position: relative; display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; border: 1px solid transparent; background: none; color: var(--ink2); cursor: pointer; }
.icon-btn:hover { background: var(--panel); border-color: var(--line); } .menu-btn { display: none; }
.dot { position: absolute; top: 7px; right: 8px; width: 8px; height: 8px; border-radius: 99px; background: var(--primary); box-shadow: 0 0 0 2px #fff; }
.drawer { display: none; border-top: 1px solid var(--line); background: #fff; padding: 8px 16px 16px; } .drawer a { display: flex; gap: 12px; align-items: center; padding: 12px 8px; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--panel2); }
.demo-switch { display: flex; align-items: center; gap: 6px; } .demo-switch select { min-width: 96px; font: inherit; font-size: .85rem; padding: 6px 8px; border: 1px solid #6f8783; border-radius: 8px; background: #fff; color: var(--ink); }

/* buttons, chips */
.btn { white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 600 .95rem/1 Inter, sans-serif; padding: 12px 18px; border-radius: 11px; border: 1px solid var(--line); background: #fff; color: var(--ink); text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, box-shadow .15s, transform .1s; }
.btn:hover { background: var(--panel); border-color: #b9d3cf; color: var(--ink); } .btn:active { transform: translateY(1px); }
.btn.primary, .atlas-open { background: var(--primary); border-color: var(--primary); color: var(--onPrimary); box-shadow: 0 1px 2px rgba(11,43,41,.18), inset 0 1px 0 rgba(255,255,255,.14); }
.btn.primary:hover, .atlas-open:hover { background: var(--deep); border-color: var(--deep); color: #fff; }
.btn.ghost { background: transparent; } .btn.link { border: 0; background: none; color: var(--primary); padding: 8px 0; }
.btn.sm { padding: 8px 12px; font-size: .86rem; border-radius: 9px; } .btn.block { width: 100%; padding: 14px; }
.btn.danger-btn { background: var(--dangerBg); color: var(--dangerInk); border-color: #f0b8b2; }
.chip { display: inline-flex; align-items: center; font-size: .75rem; font-weight: 600; padding: 3px 9px; border-radius: 99px; background: var(--panel2); color: var(--ink2); border: 1px solid var(--line); }
.chip.ok { background: var(--okBg); color: var(--okInk); border-color: #b4e3c6; } .chip.warn { background: var(--warnBg); color: var(--warnInk); border-color: #f1d4a0; }
.chip.brand { background: var(--tint); color: var(--deep); border-color: #b5e4dc; } .chip.sample { background: #fff; color: var(--deep); border: 1px dashed var(--primary); }

/* hero */
.hero { max-width: 1240px; margin: 0 auto; padding: 56px 20px 40px; display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; position: relative; }
.hero-backdrop::before { content: ""; position: absolute; inset: 0; height: 100%; background: radial-gradient(60% 70% at 78% 30%, rgba(45,212,191,.16), transparent 70%), radial-gradient(40% 50% at 10% 0%, rgba(15,118,110,.08), transparent 70%); z-index: -1; }
.lede { font-size: 1.15rem; color: var(--ink2); max-width: 60ch; } .lede-sm { color: var(--ink2); }
.cta { display: flex; gap: 12px; flex-wrap: wrap; margin: 1.4rem 0 1rem; }
.fine { font-size: .875rem; color: var(--muted); display: flex; gap: 8px; align-items: flex-start; } .fine .ic { margin-top: 2px; color: var(--primary); flex: none; } .fine span { display: block; }
.hero-card { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 22px; box-shadow: 0 1px 2px rgba(11,43,41,.04), 0 24px 48px -24px rgba(15,118,110,.28); }
.hc-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 14px; }
.stages { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; } .stages li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; background: var(--panel); border: 1px solid transparent; font-weight: 500; }
.stages .n { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 99px; background: #fff; border: 1px solid var(--line); font-size: .8rem; font-weight: 700; color: var(--deep); }
.stages li.now { background: var(--tint); border-color: #a8e2d8; } .stages li.now .n { background: var(--primary); color: #fff; border-color: var(--primary); }
.hc-foot { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.band { background: var(--panel); border-block: 1px solid var(--line); padding: 36px 0 0; margin-bottom: 48px; } .band .wrap { padding-bottom: 36px; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; } .grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.feature { display: block; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px; text-decoration: none; color: var(--ink); transition: border-color .15s, box-shadow .15s, transform .15s; }
.feature:hover { border-color: var(--primary); box-shadow: 0 12px 28px -16px rgba(15,118,110,.4); transform: translateY(-2px); color: var(--ink); } .feature p { color: var(--ink2); margin: 0; }
.split { display: grid; grid-template-columns: .8fr 1.2fr; gap: 32px; align-items: start; margin-bottom: 40px; } .two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; } .two-col { display: grid; grid-template-columns: 1.2fr .8fr; gap: 32px; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px; margin-bottom: 16px; box-shadow: 0 1px 2px rgba(11,43,41,.03); } .panel.accent { background: linear-gradient(180deg, var(--tint), #fff 70%); border-color: #a8e2d8; } .panel.danger { border-color: #f0b8b2; }
.panel h3 { display: flex; align-items: center; gap: 8px; } .bullets { padding-left: 1.1rem; margin: 0 0 1rem; color: var(--ink2); } .bullets li { margin-bottom: .3rem; }
.sec-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; } .more { font-weight: 600; text-decoration: none; display: inline-flex; gap: 6px; align-items: center; }

/* lists */
.list { background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; margin-bottom: 16px; }
.row { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-bottom: 1px solid var(--panel2); text-decoration: none; color: var(--ink); transition: background .12s; } .row:last-child { border-bottom: 0; }
a.row:hover { background: var(--panel); color: var(--ink); } .row.unread { background: #f6fcfb; } .row.static { cursor: default; }
.row-ic { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 11px; background: var(--tint); color: var(--deep); font-weight: 700; } .row-ic.num { font-family: Manrope; }
.row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } .row-main strong { font-weight: 600; } .row-main .muted { font-size: .92rem; }
.row-side { display: flex; align-items: center; gap: 10px; flex: none; color: var(--muted); }
.stack { display: grid; gap: 12px; margin-bottom: 16px; }
.page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; padding: 40px 0 24px; flex-wrap: wrap; } .page-head h1 { font-size: clamp(1.7rem, 1.3rem + 1.5vw, 2.3rem); margin-bottom: .3em; } .page-head .lede { margin: 0; font-size: 1.05rem; }
.note { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; } .note h3 { margin-bottom: .3rem; } .note p { color: var(--ink2); margin-bottom: .5rem; } .note.pinned { border-color: #a8e2d8; background: linear-gradient(180deg, #f3fbf9, #fff); }
.meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px; }
.callout { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; background: var(--tint); border: 1px solid #b5e4dc; border-radius: 14px; color: var(--ink); margin: 0 0 16px; } .callout .ic { color: var(--deep); margin-top: 2px; } .callout-sm { display: flex; gap: 8px; color: var(--ink2); }
.empty { text-align: center; padding: 40px 20px; color: var(--ink2); } .empty h3 { margin-top: 10px; justify-content: center; } .empty p { max-width: 46ch; margin: 0 auto 1rem; }

/* article */
.article-wrap { max-width: 820px; padding-top: 40px; } .article header h1 { margin-bottom: .4em; } .review { display: flex; gap: 8px; align-items: center; color: var(--ink2); font-size: .92rem; padding: 10px 14px; background: var(--panel); border-radius: 10px; }
.prose { font-size: 1.05rem; color: var(--ink); margin-top: 1.5rem; } .prose h2 { margin-top: 2rem; font-size: 1.35rem; } .prose p, .prose li { color: var(--ink2); } .prose ul { padding-left: 1.2rem; }
.checklist { list-style: none; padding: 0 !important; display: grid; gap: 6px; } .checklist li { display: flex; gap: 12px; align-items: flex-start; padding: 10px 14px; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; } .checklist .box { width: 18px; height: 18px; flex: none; margin-top: 3px; border: 2px solid var(--primary); border-radius: 5px; background: #fff; }
.article-foot { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); } .actions { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 1rem; }
.versions { margin-top: 1rem; color: var(--ink2); } .versions summary { cursor: pointer; font-weight: 600; }

/* events */
.event { display: grid; grid-template-columns: 72px 1fr auto; gap: 18px; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 18px; align-items: center; }
.when { text-align: center; background: var(--tint); color: var(--deep); border-radius: 14px; padding: 10px 0; display: grid; } .when b { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; } .when span { font: 800 1.7rem/1 Manrope; }
.ev-main h3 { margin-bottom: .2rem; } .ev-main p { margin-bottom: .3rem; }

/* forms */
.form { display: grid; gap: 14px; } .field { display: grid; gap: 6px; } .field label, .field > label { font-weight: 600; font-size: .92rem; display: grid; gap: 6px; } .hint { font-size: .85rem; color: var(--muted); }
input, select, textarea { font: inherit; padding: 11px 13px; border: 1px solid #6f8783; border-radius: 10px; background: #fff; color: var(--ink); width: 100%; } textarea { resize: vertical; } .mono { font-family: ui-monospace, Menlo, monospace; font-size: .88rem; }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(45,212,191,.45); border-color: var(--primary); }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: .95rem; color: var(--ink2); } .check input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--primary); flex: none; }
fieldset.consents { border: 1px solid var(--line); border-radius: 12px; padding: 14px; display: grid; gap: 10px; background: var(--panel); } fieldset legend { padding: 0 8px; font-weight: 600; font-size: .9rem; color: var(--ink); }
.form-msg { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--dangerBg); color: var(--dangerInk); font-size: .92rem; } .form-msg.ok { background: var(--okBg); color: var(--okInk); }
.inline { display: inline-flex; gap: 8px; align-items: center; } .inline input { width: 260px; }
.searchbar { display: flex; gap: 10px; margin-bottom: 20px; }
.auth { min-height: 70vh; display: grid; place-items: center; padding: 32px 20px; background: radial-gradient(50% 60% at 50% 0%, rgba(45,212,191,.14), transparent 70%); } .auth-card { width: 100%; max-width: 420px; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 32px; box-shadow: 0 24px 48px -28px rgba(15,118,110,.35); } .auth-card.wide { max-width: 560px; } .auth-card h1 { font-size: 1.7rem; }
.sandbox { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); } .sandbox h3 { display: flex; gap: 8px; align-items: center; }
.switch { display: flex; gap: 14px; align-items: flex-start; padding: 14px 0; cursor: pointer; border-bottom: 1px solid var(--panel2); } .switch:last-child { border: 0; } .switch input { position: absolute; opacity: 0; }
.track { flex: none; width: 42px; height: 24px; border-radius: 99px; background: #6f8783; position: relative; transition: background .15s; margin-top: 2px; } .track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 99px; background: #fff; transition: transform .15s; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
.switch input:checked + .track { background: var(--primary); } .switch input:checked + .track::after { transform: translateX(18px); } .switch input:focus-visible + .track { outline: 3px solid var(--primary); outline-offset: 2px; }
.sw-text { display: grid; gap: 2px; font-size: .95rem; } .sw-text .muted { font-size: .9rem; }
.choices { display: grid; gap: 10px; } .choice { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; } .choice.on { border-color: var(--primary); background: var(--tint); } .choice input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--primary); } .choice span { display: grid; gap: 2px; }

/* app shell */
body.app .shell { max-width: 1240px; margin: 0 auto; padding: 0 20px 56px; display: grid; grid-template-columns: 232px 1fr; gap: 32px; }
.rail { position: sticky; top: 76px; align-self: start; padding: 28px 0; display: grid; gap: 2px; } .rail a { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 10px; color: var(--ink2); text-decoration: none; font-weight: 500; font-size: .94rem; } .rail a:hover { background: var(--panel); } .rail a[aria-current=page] { background: var(--tint); color: var(--deep); font-weight: 600; } .count { margin-left: auto; background: var(--primary); color: #fff; border-radius: 99px; font-size: .72rem; padding: 2px 8px; }
.shell-main { min-width: 0; } .stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; } .stats:has(.stat:nth-child(3):last-child) { grid-template-columns: repeat(3, 1fr); }
.stat { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; display: grid; gap: 4px; } .stat b { font: 800 1.9rem/1 Manrope; color: var(--ink); overflow-wrap: anywhere; } .stat span { color: var(--muted); font-size: .88rem; } .stats.sampled .stat { background: var(--panel); border-style: dashed; }
.progress { width: 180px; height: 8px; background: var(--panel2); border-radius: 99px; overflow: hidden; } .progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--primary), var(--accent)); border-radius: 99px; }
.todo { list-style: none; margin: 0; padding: 0; } .todo li { display: flex; gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--panel2); } .todo li:last-child { border: 0; } .todo a { display: grid; text-decoration: none; color: var(--ink); } .todo .muted { font-size: .9rem; } .todo li.done strong { text-decoration: line-through; text-decoration-color: var(--muted); color: var(--muted); }
.tick { width: 28px; height: 28px; flex: none; border-radius: 9px; border: 2px solid #8fb3ae; background: #fff; display: grid; place-items: center; cursor: pointer; color: transparent; } .tick:hover { border-color: var(--primary); } .done .tick { background: var(--primary); border-color: var(--primary); color: #fff; }
.plain { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }

/* charts */
.chart { margin: 0; } .chart svg { width: 100%; height: auto; display: block; } .chart .grid { stroke: var(--line); stroke-width: 1; } .chart .axis { fill: var(--muted); font-size: 11px; font-family: Inter, sans-serif; }
.chart .line { fill: none; stroke: var(--primary); stroke-width: 2.5; stroke-linejoin: round; } .chart .area { fill: rgba(45,212,191,.18); } .chart .dot { fill: #fff; stroke: var(--primary); stroke-width: 2; }
.chart-table { margin-top: 10px; } .chart-table summary { cursor: pointer; color: var(--primary); font-weight: 600; font-size: .9rem; } .chart-table table { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: .9rem; } .chart-table th, .chart-table td { text-align: left; padding: 6px 10px; border-bottom: 1px solid var(--panel2); }
.bars ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; } .bars a { display: grid; grid-template-columns: minmax(120px, 36%) 1fr 40px; gap: 12px; align-items: center; text-decoration: none; color: var(--ink); font-size: .92rem; } .bars .bl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .bars .bt { height: 10px; background: var(--panel2); border-radius: 99px; overflow: hidden; } .bars .bt i { display: block; height: 100%; background: var(--primary); border-radius: 99px; } .bars b { text-align: right; }

/* people (sample preview) */
.pills { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; } .pill { padding: 7px 13px; border-radius: 99px; border: 1px solid var(--line); background: #fff; color: var(--ink2); text-decoration: none; font-size: .88rem; font-weight: 500; } .pill.on { background: var(--ink); color: #fff; border-color: var(--ink); }
.people { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; } .person { display: flex; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px; } .person h3 { margin-bottom: 4px; font-size: 1rem; } .person p { margin: 6px 0 0; font-size: .92rem; color: var(--ink2); }
.avatar { width: 56px; height: 56px; flex: none; border-radius: 99px; overflow: hidden; background: var(--tint); display: grid; place-items: center; color: var(--deep); font: 700 1.1rem Manrope; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--line); } .avatar img { width: 100%; height: 100%; object-fit: cover; }
.pager { display: flex; gap: 12px; align-items: center; justify-content: center; margin: 20px 0; }
.post { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 20px; margin-bottom: 12px; } .post.reply { padding: 16px 18px; margin: 0; } .post-actions { display: flex; gap: 14px; margin-top: 8px; } .link { background: none; border: 0; color: var(--muted); font: inherit; font-size: .85rem; cursor: pointer; display: inline-flex; gap: 5px; align-items: center; padding: 4px 0; } .link:hover { color: var(--primary); }
.steps { padding-left: 1.2rem; color: var(--ink2); display: grid; gap: .6rem; }

/* footer */

/* ATLAS panel */
.atlas-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(420px, 100vw); background: #fff; border-left: 1px solid var(--line); box-shadow: -24px 0 48px -28px rgba(11,43,41,.35); z-index: 60; display: flex; flex-direction: column; padding: 16px; gap: 10px; } .atlas-panel[hidden] { display: none; }
.atlas-head { display: flex; justify-content: space-between; align-items: center; } .atlas-head div { display: flex; gap: 8px; align-items: center; color: var(--deep); }
.atlas-log { flex: 1; overflow-y: auto; display: grid; align-content: start; gap: 12px; padding: 4px 2px; min-height: 120px; } .panel.ask .atlas-log { min-height: 220px; max-height: 60vh; }
.msg { padding: 12px 14px; border-radius: 14px; font-size: .95rem; max-width: 92%; } .msg.me { justify-self: end; background: var(--primary); color: #fff; } .msg.bot { background: var(--panel); border: 1px solid var(--line); } .msg.refuse { background: var(--warnBg); border-color: #f1d4a0; color: var(--ink); }
.msg .cites { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; } .msg .cites a { font-size: .8rem; background: #fff; border: 1px solid var(--line); border-radius: 99px; padding: 3px 10px; text-decoration: none; } .msg .via { display: block; margin-top: 8px; font-size: .78rem; color: var(--muted); } .msg p { margin: 0 0 .6em; }
.atlas-chips { display: flex; gap: 6px; flex-wrap: wrap; } .atlas-chips button { border: 1px solid var(--line); background: #fff; border-radius: 99px; padding: 6px 12px; font: inherit; font-size: .85rem; cursor: pointer; color: var(--ink2); } .atlas-chips button:hover { border-color: var(--primary); color: var(--primary); }
.atlas-form { display: flex; gap: 8px; } .atlas-form input { flex: 1; }
.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); background: var(--ink); color: #fff; padding: 12px 18px; border-radius: 12px; z-index: 90; font-size: .92rem; box-shadow: 0 12px 28px rgba(0,0,0,.25); }
.tour { position: fixed; z-index: 80; width: min(340px, calc(100vw - 32px)); background: #fff; border: 1px solid var(--primary); border-radius: 16px; padding: 18px; box-shadow: 0 24px 48px -16px rgba(11,43,41,.45); right: 24px; bottom: 24px; } .tour h4 { font-size: 1rem; } .tour .t-actions { display: flex; gap: 8px; justify-content: space-between; margin-top: 12px; align-items: center; } .tour-hl { outline: 3px solid var(--primary) !important; outline-offset: 4px; border-radius: 12px; }

@media (max-width: 1380px) { nav.primary { display: none; } .menu-btn { display: inline-grid; } .drawer:not([hidden]) { display: block; } .bar { gap: 8px; } .tools { margin-left: auto; } }
@media (max-width: 900px) { .hero, .split, .two-col, .two, .grid3 { grid-template-columns: 1fr; } .hero { padding-top: 32px; gap: 28px; } .stats, .people { grid-template-columns: repeat(2, 1fr); } body.app .shell { grid-template-columns: 1fr; gap: 0; } .rail { position: static; display: flex; overflow-x: auto; padding: 12px 0; gap: 6px; border-bottom: 1px solid var(--line); margin: 0 -20px 8px; padding-inline: 20px; } .rail a { white-space: nowrap; flex: none; border: 1px solid var(--line); } .event { grid-template-columns: 60px 1fr; } .ev-act { grid-column: 1 / -1; } }
@media (max-width: 560px) { .logo-full { display: none; } .logo-mark { display: block; height: 36px; width: 36px; } .search-btn { display: none; } .acct a.btn.ghost[href="/login"] { display: none; } .demo-switch select { min-width: 0; max-width: 92px; } .hide-sm, .atlas-open > span:not([data-atlas-electrical]) { display: none; } .stats, .people, .grid2 { grid-template-columns: 1fr; } .stats:has(.stat:nth-child(3):last-child) { grid-template-columns: 1fr 1fr 1fr; } .stat b { font-size: 1.4rem; } .bar { padding: 8px 14px; } .wrap { padding: 0 16px 40px; } .page-head { padding: 24px 0 16px; } .bars a { grid-template-columns: 1fr 40px; } .bars .bt { grid-column: 1 / -1; order: 3; } .row { padding: 14px; } .acct .btn.primary { padding: 8px 10px; } .searchbar { flex-direction: column; } .hero-card { padding: 16px; } .progress { width: 100px; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
@media print { .site-header, .site-footer, .atlas-panel, .actions, .article-foot, .rail, .toast { display: none !important; } body { font-size: 12pt; } .wrap { max-width: none; padding: 0; } .checklist li { break-inside: avoid; } }

/* Final community finish; photos are illustrative and contain no claims. */
body { background:linear-gradient(180deg,#fff,#f7faf9); }
h1 { font-weight:650; letter-spacing:-.045em; line-height:1.08; }
h2,h3 { letter-spacing:-.025em; }
.hero { padding-top:64px; padding-bottom:56px; gap:64px; grid-template-columns:1fr 1fr; }
.hero-copy .lede { max-width:48ch; font-size:17px; line-height:1.65; }
.hero-visual { min-width:0; }
.hero-photo { width:100%; height:260px; object-fit:cover; border-radius:20px 20px 0 0; }
.hero-card { border-radius:0 0 20px 20px; padding:20px 24px; border-top:0; box-shadow:0 24px 56px -36px rgba(11,43,41,.32); }
.stages { display:grid; grid-template-columns:1fr 1fr; gap:12px 18px; }
.stages li { padding:0; border:0; font-size:12px; }
.stages .n { width:25px; height:25px; font-size:11px; }
.hc-foot { gap:5px; margin-top:16px; }
.hc-foot .chip { font-size:10px; }
.panel,.row,.event,.feature,.note { border-color:#dbe6e3; box-shadow:0 1px 2px rgba(11,43,41,.025),0 14px 32px -30px rgba(11,43,41,.3); }
.feature { padding:24px; border-radius:16px; background:#fff; }
.band { background:#f3f8f6; border-block:1px solid #e1ebe7; padding:28px 0; }
.band .wrap { padding-bottom:0; }
.resource-photo { width:100%; height:190px; object-fit:cover; border-radius:16px; margin:0 0 22px; }
.demo-photo { margin:0 0 32px; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; }
.demo-photo img { width:100%; height:280px; object-fit:cover; }
.demo-photo figcaption { font-size:13px; padding:12px 18px; color:var(--muted); }
.stat { border-radius:14px; background:linear-gradient(145deg,#fff,#f6faf8); }
.stat b { font-weight:600; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.chart { position:relative; padding:16px 0 0; }
.chart .grid { stroke-dasharray:2 5; stroke:#dce8e4; }
.chart .line { stroke-width:2.3; stroke-linecap:round; }
.chart .dot { fill:#fff; stroke:var(--primary); stroke-width:2; }
.chart .dot:focus { outline:none; stroke-width:4; }
.chart-meta { font-size:11px; color:var(--muted); margin:6px 0; }
.chart-tooltip { background:var(--ink); color:#f0fdfa; padding:8px 12px; border-radius:8px; font-size:12px; }
.bars .bt { height:8px; border-radius:4px; background:#e4eeeb; }
.bars .bt i { background:linear-gradient(90deg,var(--deep),var(--primary)); border-radius:4px; }
.btn { transition:background-color 160ms ease,box-shadow 160ms ease,transform 120ms ease; }
.btn:active { transform:scale(.98); }
@media(max-width:900px) { .hero { grid-template-columns:1fr; gap:32px; padding-top:36px; } }
@media(max-width:560px) { .hero { padding:32px 16px; } .hero-photo { height:200px; } .hero-card { padding:18px; } .stages { gap:12px; } .demo-photo img { height:180px; } .resource-photo { height:170px; } }
@media(prefers-reduced-motion:reduce) { .btn { transition:none; } }

@media(max-width:560px){.site-header .acct a[href="/join"]{display:none;}}

/* Polish 2: invariant single-row chrome; navigation floats without shifting content. */
.site-header { height:65px; }
.site-header .bar { height:64px; padding-block:0; flex-wrap:nowrap; }
.site-header .brand { width:180px; min-width:0; }
.site-header .brand .logo-full { width:180px; height:32px; object-fit:contain; object-position:left center; }
.site-header .tools,.site-header .acct,.demo-switch { flex:none; flex-wrap:nowrap; }
.site-header .icon-btn,.site-header .btn,.demo-switch select { height:38px; border-radius:10px; }
.site-header .btn { flex:none; }
.demo-switch select { width:108px; padding:0 24px 0 10px; font-size:12px; }
.site-header .drawer { position:absolute; top:64px; right:16px; width:min(360px,calc(100vw - 32px)); max-height:calc(100dvh - 80px); overflow-y:auto; border:1px solid var(--line); border-radius:14px; box-shadow:0 18px 48px -16px rgba(11,43,41,.28); }
.atlas-panel { padding:16px; max-height:100dvh; }
.atlas-head { height:48px; min-height:48px; flex:none; border-bottom:1px solid var(--line); padding-bottom:10px; }
.atlas-head div { min-width:0; }
.atlas-head strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.atlas-form input { min-width:0; }
.atlas-form .btn { flex:none; padding:12px; }
.empty { border:1px dashed var(--line); border-radius:16px; background:linear-gradient(180deg,var(--panel),#fff); }
.empty > .ic { width:48px; height:48px; background:var(--tint); border-radius:14px; padding:12px; }
.hc-head { align-items:flex-start; gap:12px; }
.hc-head .small { text-align:right; font-size:11px; max-width:110px; }
.hero-visual { border:1px solid var(--line); border-radius:21px; overflow:hidden; box-shadow:0 24px 56px -36px rgba(11,43,41,.32); }
.hero-visual .hero-card { border:0; box-shadow:none; }
.hero-visual .hero-photo { height:auto; aspect-ratio:3 / 2; object-fit:contain; }
.foot-logo { width:180px; height:32px; object-fit:contain; object-position:left center; }
.tour { max-height:calc(100dvh - 96px); overflow:auto; right:16px; bottom:16px; }
.toast { max-width:calc(100vw - 32px); overflow-wrap:anywhere; }
@media(max-width:1100px) { .site-header .brand { width:160px; } .site-header .brand .logo-full { width:160px; } }
@media(max-width:560px) {
 .site-header .bar { padding-inline:12px; gap:6px; }
 .site-header .brand { width:36px; }
 .site-header .brand .logo-mark { width:36px; height:36px; object-fit:contain; }
 .site-header .tools { gap:4px; }
 .site-header .acct { gap:4px; }
 .site-header .atlas-open { width:38px; padding:0; }
 .site-header .acct .btn { width:38px; padding:0; }
 .demo-switch select { width:100px; max-width:100px; }
 .site-header .drawer { right:12px; width:calc(100vw - 24px); }
 .sec-head { align-items:flex-start; }
 .hc-head { display:grid; }
 .hc-head .small { text-align:left; max-width:none; }
}
.wrap.narrow > article.post:first-child { margin-top: 40px; }

/* Real counts: tabular figures, width reserved by the markup so counting up never shifts the layout. */
.num { display:inline-block; font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1; }
.num-tail { font-variant-numeric:tabular-nums; }

/* Approved detailed core and its first-frame/context-loss artwork. */
.orb { position:relative;display:inline-block;flex:none;overflow:hidden;vertical-align:middle; }
.orb canvas { position:absolute;inset:0;width:100%;height:100%;display:block; }
.orb .atlas-approved-art { position:absolute;width:78%;height:78%;left:11%;top:11%;object-fit:contain;clip-path:circle(49%);filter:sepia(1) hue-rotate(110deg) saturate(2); }
.orb[data-rendered=electrical] .atlas-approved-art { visibility:hidden; }
.orb[data-state=processing],.orb[data-state=responding] { opacity:1; }
.orb[data-state=error] .atlas-approved-art { filter:sepia(1) saturate(5) hue-rotate(320deg); }
.orb[data-state=disconnected] .atlas-approved-art { filter:grayscale(1);opacity:.6; }
@keyframes msg-in { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
/* ATLAS surfaces that carry an orb */
.atlas-head { height:auto; min-height:64px; align-items:flex-start; }
.atlas-title { display:flex; gap:12px; align-items:center; min-width:0; color:var(--deep); }
.atlas-title > span { display:grid; gap:1px; min-width:0; }
.atlas-title strong { color:var(--ink); }
.atlas-status { display:block; font-size:12px; line-height:1.35; color:var(--muted); }
.ask-head { display:flex; gap:14px; align-items:center; padding:0 2px 14px; margin-bottom:12px; border-bottom:1px solid var(--line); min-height:68px; }
.ask-head > div { display:grid; gap:2px; min-width:0; }
.ask-head strong { font:700 1.05rem/1.2 Manrope, Inter, sans-serif; }
.feature-orb { display:inline-flex; margin-bottom:6px; }
.site-header .atlas-open { gap:8px; padding-left:12px; }
.msg.reveal { animation:msg-in .28s cubic-bezier(.2,.7,.2,1) both; }
@media (prefers-reduced-motion: reduce) { .msg.reveal { animation:none; } }

/* Seams: the hero glow is full-bleed so it never shows hard vertical edges at the content width, and it fades out
   before the band so the hero-to-band join is one clean border. */
.hero-backdrop { position:relative; isolation:isolate; }
.hero-backdrop::before { -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent); mask-image:linear-gradient(180deg,#000 55%,transparent); }
.feature-orb { height:28px; align-items:center; margin-bottom:0; }
.feature-orb .orb { width:28px; height:28px; }
.grid4 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:8px; }
.grid3 > .panel, .grid4 > .panel { margin:0; display:flex; flex-direction:column; }
.grid4 > .panel .btn { margin-top:auto; align-self:flex-start; }
.grid4 > .panel p.small { margin-bottom:1rem; }
@media (max-width:1100px) { .grid4 { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .grid4 { grid-template-columns:1fr; } }
@media (max-width:560px) { .site-header .atlas-open { width:38px; padding:0; gap:0; } .site-header .atlas-open .orb { width:24px; height:24px; } }
@media (max-width:440px) { .stages { grid-template-columns:1fr; gap:8px; } }
.stages li { min-width:0; } .stages li span:last-child { min-width:0; overflow-wrap:anywhere; }

/* Components: one state model for every control (rest, hover, focus-visible, active, disabled, loading, success, error).
   Depth stays restrained: one hairline, one soft shadow. Focus is always visible (deep turquoise ring on a soft halo). */
:focus-visible { outline:2px solid var(--deep); outline-offset:2px; }
.btn:focus-visible, .icon-btn:focus-visible, .pill:focus-visible, .rail a:focus-visible, .primary a:focus-visible, .tick:focus-visible, .atlas-chips button:focus-visible, .link:focus-visible { outline:2px solid var(--deep); outline-offset:2px; box-shadow:0 0 0 5px rgba(45,212,191,.32); }
.atlas-open:focus-visible { outline-color:var(--deep); }
.btn { box-shadow:0 1px 0 rgba(11,43,41,.04); }
.btn:hover { box-shadow:0 1px 2px rgba(11,43,41,.08), 0 6px 14px -8px rgba(15,118,110,.35); }
.btn.primary:hover, .atlas-open:hover { box-shadow:0 1px 2px rgba(11,43,41,.2), 0 8px 18px -8px rgba(15,118,110,.6); }
.btn:active { transform:translateY(0) scale(.98); box-shadow:none; }
.btn:disabled, .btn[aria-disabled=true] { opacity:.5; cursor:not-allowed; transform:none; box-shadow:none; pointer-events:none; }
.btn.is-loading { position:relative; color:transparent !important; pointer-events:none; }
.btn.is-loading > * { opacity:0; }
.btn.is-loading::after { content:""; position:absolute; inset:0; margin:auto; width:16px; height:16px; border-radius:50%; border:2px solid rgba(255,255,255,.4); border-top-color:#fff; animation:spin .7s linear infinite; }
.btn:not(.primary).is-loading::after { border-color:rgba(15,118,110,.25); border-top-color:var(--primary); }
.btn.is-success { background:var(--okBg); border-color:#b4e3c6; color:var(--okInk); }
.btn.is-error, .btn.danger-btn:hover { background:var(--dangerBg); border-color:#f0b8b2; color:var(--dangerInk); }
@keyframes spin { to { transform:rotate(360deg); } }
.icon-btn { transition:background-color .15s, border-color .15s, transform .1s, color .15s; }
.icon-btn:hover { color:var(--deep); }
.icon-btn:active { transform:scale(.94); background:var(--panel2); }
.icon-btn .ic { transition:transform .15s; }
.icon-btn:hover .ic { transform:translateY(-1px); }
input, select, textarea { transition:border-color .15s, box-shadow .15s, background-color .15s; }
input:hover:not(:disabled), select:hover:not(:disabled), textarea:hover:not(:disabled) { border-color:var(--primary); }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 4px rgba(45,212,191,.35); }
input::placeholder, textarea::placeholder { color:var(--muted); opacity:1; }
input:disabled, select:disabled, textarea:disabled { background:var(--panel); color:var(--muted); cursor:not-allowed; }
input[aria-invalid=true], select[aria-invalid=true], textarea[aria-invalid=true] { border-color:var(--dangerInk); box-shadow:0 0 0 3px rgba(163,33,22,.14); }
select, .demo-switch select { appearance:none; -webkit-appearance:none; padding-right:34px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%2333504D' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 12px center; }
.demo-switch select { padding-right:28px; background-position:right 10px center; }
.form-msg { border-left:3px solid var(--dangerInk); } .form-msg.ok { border-left-color:var(--okInk); }
.form-msg[hidden] { display:none; }
.pill { transition:background-color .15s, border-color .15s, color .15s; } .pill:hover { border-color:var(--primary); color:var(--deep); } .pill.on:hover { color:#fff; }
.rail a { transition:background-color .15s, color .15s; } .rail a:active { background:var(--panel2); }
.rail a[aria-current=page] { box-shadow:inset 3px 0 0 var(--primary); }
.primary a[aria-current=page] { box-shadow:inset 0 -2px 0 var(--primary); border-radius:10px 10px 4px 4px; }
.chip { line-height:1.3; } .chip.err { background:var(--dangerBg); color:var(--dangerInk); border-color:#f0b8b2; }
a.chip, button.chip { text-decoration:none; cursor:pointer; transition:border-color .15s, background-color .15s; } a.chip:hover, button.chip:hover { border-color:var(--primary); background:var(--tint); }
.atlas-chips button { transition:border-color .15s, color .15s, background-color .15s, transform .1s; } .atlas-chips button:hover { background:var(--tint); } .atlas-chips button:active { transform:scale(.97); }
.tick { transition:border-color .15s, background-color .15s, transform .1s; } .tick:active { transform:scale(.92); }
.tick .ic { width:16px; height:16px; }
.link:focus-visible { border-radius:6px; }
/* toasts */
.toast { display:flex; align-items:center; gap:10px; border-left:4px solid #2DD4BF; animation:toast-in .24s cubic-bezier(.2,.7,.2,1) both; }
.toast.ok { background:var(--deep); border-left-color:#5EEAD4; }
.toast.err { background:var(--dangerInk); border-left-color:#FECACA; }
.toast[hidden] { display:none; }
@keyframes toast-in { from { opacity:0; transform:translate(-50%, 10px); } to { opacity:1; transform:translate(-50%, 0); } }
/* rows and tables */
.row { transition:background-color .12s, box-shadow .12s; } a.row:hover { box-shadow:inset 3px 0 0 var(--primary); }
a.row:focus-visible { outline-offset:-3px; }
.chart-table table { font-variant-numeric:tabular-nums; } .chart-table th { color:var(--ink2); font-weight:600; border-bottom:1px solid var(--line); } .chart-table td:last-child, .chart-table th:last-child { text-align:right; }
.chart-table tbody tr:hover { background:var(--panel); } .chart-table caption { text-align:left; }
.chart-table summary { padding:6px 0; border-radius:6px; } .chart-table summary:hover { color:var(--deep); }
/* charts: legend, tooltip, units, freshness */
.legend { display:flex; gap:18px; flex-wrap:wrap; list-style:none; margin:10px 0 0; padding:0; font-size:12px; color:var(--ink2); }
.legend li { display:flex; gap:8px; align-items:center; }
.sw { display:inline-block; width:18px; height:0; border-top:2.5px solid var(--primary); border-radius:2px; }
.sw.dot-sw { width:10px; height:10px; border:2px solid var(--primary); border-radius:50%; background:#fff; }
.sw.bar-sw { width:18px; height:8px; border:0; background:linear-gradient(90deg,var(--deep),var(--primary)); border-radius:3px; }
.chart-meta { color:var(--ink2); }
.chart .chart-tooltip { position:absolute; z-index:5; pointer-events:none; transform:translate(-50%,-100%); white-space:nowrap; box-shadow:0 8px 20px -8px rgba(11,43,41,.5); font-variant-numeric:tabular-nums; }
.chart .chart-tooltip[hidden] { display:none; }
.chart .chart-tooltip::after { content:""; position:absolute; left:50%; bottom:-4px; width:8px; height:8px; background:var(--ink); transform:translateX(-50%) rotate(45deg); }
.chart .dot { transition:r .12s, stroke-width .12s; cursor:pointer; } .chart .dot:hover, .chart .dot:focus { r:4.5; stroke-width:3; }
.chart .dot:focus-visible { outline:2px solid var(--deep); outline-offset:3px; }
.bars a { padding:3px 0; border-radius:6px; } .bars a:hover .bt i, .bars a:focus-visible .bt i { filter:brightness(1.12); } .bars a:hover .bl { text-decoration:underline; text-underline-offset:3px; }
.bars b { font-variant-numeric:tabular-nums; }
.bars .bt i { transition:width .6s cubic-bezier(.2,.7,.2,1); }
.empty.is-error { border-color:#f0b8b2; background:linear-gradient(180deg,var(--dangerBg),#fff); } .empty.is-error > .ic { background:var(--dangerBg); color:var(--dangerInk); }
@media (prefers-reduced-motion: reduce) { .btn.is-loading::after { animation-duration:1.6s; } .toast { animation:none; } .bars .bt i { transition:none; } }
/* Inline notes mix text, a link and an icon: block flow, never flex items. */
.callout-sm { display:block; } .callout-sm .ic { margin-right:8px; color:var(--primary); }
.post + h2, .post + h3, article.post + h2 { margin-top:28px; }
/* Stat numbers keep the stat font: the count markup nests spans, and .stat span is the caption style. */
.stat b .num, .stat b .num span, .stat b .num-tail { font:inherit; color:inherit; letter-spacing:inherit; }
.stat b .sr { font-size:1px; }
/* AI provider controls: a real form rhythm instead of loose inline controls. */
.prov-controls { display:flex; flex-wrap:wrap; align-items:center; gap:12px 16px; margin-top:14px; padding-top:14px; border-top:1px solid var(--panel2); }
.prov-controls .inline { flex:1 1 100%; } .prov-controls .inline input { flex:1; max-width:380px; width:auto; }
.prov-controls .check { flex:1 1 100%; align-items:center; } .prov-controls .check input { margin-top:0; }
.prov-controls .btn { flex:none; }

/* Polish 3: community footer, menu icons, contact blocks. Icons: one sprite, 20px, 1.5px stroke (see worker/views/icons.js). */
.site-footer { background:#fff; border-top:0; padding:0 20px; margin-top:56px; position:relative; }
.site-footer::before { content:""; display:block; height:3px; margin:0 -20px; background:linear-gradient(90deg,var(--deep),var(--primary) 45%,var(--accent)); }
.foot-inner { max-width:1240px; margin:0 auto; }
.foot-main { display:grid; grid-template-columns:minmax(190px,1.1fr) repeat(3,minmax(110px,.8fr)) minmax(320px,1.8fr); gap:32px; padding:56px 0 44px; align-items:start; }
.foot-brand p { margin:14px 0 0; max-width:30ch; color:var(--ink2); font-size:.95rem; line-height:1.6; }
.foot-col summary { list-style:none; display:flex; align-items:center; justify-content:space-between; cursor:default; }
.foot-col summary::-webkit-details-marker { display:none; }
.foot-col summary .ic { display:none; transition:transform .2s; color:var(--muted); }
.foot-col h4, .foot-contact h4 { margin:0 0 10px; font:600 .95rem/1.3 Manrope, Inter, sans-serif; letter-spacing:0; color:var(--ink); }
.foot-col nav { display:grid; }
.foot-col nav a { display:flex; align-items:center; padding:6px 0; color:var(--ink2); text-decoration:none; font-size:.94rem; line-height:1.4; transition:color .15s; }
.foot-col nav a:hover { color:var(--deep); text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:2px; text-underline-offset:4px; }
.foot-col nav a:focus-visible, .contact-row:focus-visible, .foot-privacy a:focus-visible { outline:3px solid var(--primary); outline-offset:2px; border-radius:8px; }
.contact-list { list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.contact-row { display:flex; gap:12px; align-items:flex-start; padding:8px 10px; margin:0 -10px; border-radius:12px; color:var(--ink); text-decoration:none; font-style:normal; transition:background-color .15s; }
a.contact-row:hover { background:var(--panel); }
.ci { width:36px; height:36px; flex:none; display:grid; place-items:center; border-radius:10px; background:var(--tint); color:var(--deep); transition:background-color .15s, color .15s; }
a.contact-row:hover .ci { background:var(--primary); color:#fff; }
.ct { min-width:0; padding-top:1px; }
.ct b { display:block; font:600 .95rem/1.4 Inter, sans-serif; color:var(--ink); overflow-wrap:break-word; }
.ct span { display:block; margin-top:1px; font-size:.82rem; line-height:1.4; color:var(--muted); }
.foot-bottom { border-top:1px solid var(--line); padding:22px 0 32px; display:grid; gap:10px; }
.foot-privacy { margin:0; display:flex; gap:10px; align-items:flex-start; font-size:.875rem; color:var(--ink2); line-height:1.5; }
.foot-privacy .ic { color:var(--primary); margin-top:1px; }
.foot-privacy a { color:var(--primary); font-weight:600; }
.fictional { max-width:none; margin:0; font-size:.85rem; color:var(--ink2); }
.copyright { max-width:none; margin:0; color:var(--ink2); }
.copyright.preview { font-size:11px; } .copyright.live { font-size:9px; opacity:.8; }
.tel, .mail { font-weight:600; white-space:nowrap; }
.contact-stack { display:grid; gap:8px; margin-bottom:6px; }
.panel .contact-row { margin:0; padding:10px 12px; border:1px solid var(--line); background:#fff; }
.panel a.contact-row:hover { border-color:var(--primary); background:var(--panel); }
.panel .contact-row.static { background:var(--panel); }
.panel h3:has(> .ic) { display:flex; align-items:center; gap:10px; } .panel h3 .ic { color:var(--primary); vertical-align:0; margin:0; }
/* menu icons: same set, same size, quiet by default, brand colour on hover and when current */
.primary a { display:inline-flex; align-items:center; gap:5px; padding:8px 6px; }
.primary a .ic { width:17px; height:17px; color:var(--muted); transition:color .15s, transform .15s; }
.primary a:hover .ic, .primary a[aria-current=page] .ic { color:var(--primary); }
.primary a:hover .ic { transform:translateY(-1px); }
.drawer a .ic { color:var(--primary); }
.drawer a { transition:background-color .15s, color .15s; border-radius:10px; border-bottom:0; margin:1px 0; padding:11px 10px; }
.drawer a:hover { background:var(--panel); }
.drawer a[aria-current=page] { background:var(--tint); color:var(--deep); font-weight:600; }
.drawer a:focus-visible { outline:3px solid var(--primary); outline-offset:-3px; }
.drawer-cta { display:flex; gap:8px; flex-wrap:wrap; padding:14px 8px 4px; } .drawer-cta .btn { flex:1 1 auto; }
.drawer-cta .btn .ic { color:inherit; }
.rail a .ic { color:var(--muted); transition:color .15s; }
.rail a:hover .ic, .rail a[aria-current=page] .ic { color:var(--primary); }
.rail a[aria-current=page] { color:var(--deep); }
.btn .ic { flex:none; }
@media (max-width:1460px) { .primary a { padding:8px 4px; gap:4px; } }
@media (max-width:1080px) {
 .foot-main { grid-template-columns:1fr 1fr; gap:36px 40px; padding:44px 0 36px; }
 .foot-brand { grid-column:1 / -1; }
 .foot-brand p { max-width:46ch; }
}
@media (max-width:700px) {
 .site-footer { padding:0 16px; margin-top:40px; } .site-footer::before { margin:0 -16px; }
 .foot-main { grid-template-columns:1fr; gap:0; padding:32px 0 20px; }
 .foot-brand { order:1; padding-bottom:20px; } .foot-contact { order:2; padding-bottom:20px; } .foot-col[data-foot-col] { order:3; border-top:1px solid var(--line); }
 .foot-col[data-foot-col]:last-of-type { border-bottom:1px solid var(--line); }
 .foot-col summary { cursor:pointer; padding:14px 0; min-height:48px; } .foot-col summary h4 { margin:0; }
 .foot-col summary .ic { display:block; } .foot-col[open] summary .ic { transform:rotate(180deg); }
 .foot-col summary:focus-visible { outline:3px solid var(--primary); outline-offset:2px; border-radius:8px; }
 .foot-col nav { padding-bottom:12px; } .foot-col nav a { min-height:44px; }
 .foot-bottom { padding:20px 0 28px; border-top:0; }
 .panel .cta .btn.primary { flex:1 1 100%; } .panel .cta .btn.ghost { flex:1 1 0; }
}
@media (prefers-reduced-motion:reduce) { .foot-col summary .ic, .ci, .primary a .ic { transition:none; } }


/* Accessibility: a lone h1 inside an empty state (the 404) takes the empty-state title look; control borders meet 3:1 (1.4.11). */
.empty h1.empty-title { font-size: 1.1rem; font-weight: 700; letter-spacing: -.025em; line-height: 1.2; margin-top: 10px; justify-content: center; }
.tour:focus { outline: none; }
#main:focus { outline: none; }