@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root { --bg:#06080f; --white:#e6eeff; --acid:#c6ff45; --pink:#ff2d9e; --purple:#b57bff; --cyan:#22e6ff; --orange:#ff9142; --red:#ff3b52; --panel:#0c1120; --line:#20305c; --muted:#8b97c9; --shell:min(1180px, calc(100% - 48px)); --radius:18px; --mono:'Space Mono', ui-monospace, monospace; --sans:'DM Sans', system-ui, sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--white); background:var(--bg); font-family:var(--sans); line-height:1.55; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; z-index:-1; background:radial-gradient(circle at 84% 9%, color-mix(in srgb, var(--purple) 12%, transparent), transparent 28rem), radial-gradient(circle at 8% 26%, color-mix(in srgb, var(--cyan) 8%, transparent), transparent 25rem); }
a { color:inherit; text-decoration:none; } button, select { font:inherit; }
.shell { width:var(--shell); margin-inline:auto; }
.skip-link { position:absolute; left:1rem; top:-5rem; padding:.7rem 1rem; color:var(--bg); background:var(--acid); z-index:20; }.skip-link:focus { top:1rem; }
.site-header { position:sticky; top:0; z-index:10; border-bottom:1px solid color-mix(in srgb, var(--line) 70%, transparent); background:color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter:blur(18px); }
.header-inner { min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.brand { display:flex; align-items:center; gap:.75rem; font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; }.brand-mark { width:126px; max-height:30px; object-fit:contain; object-position:left center; }.brand-divider { color:var(--pink); font-size:1.3rem; }.brand-sub { color:var(--cyan); }
.main-nav { display:flex; gap:2rem; margin-left:auto; font-family:var(--mono); font-size:.62rem; color:var(--muted); text-transform:uppercase; letter-spacing:.13em; }.main-nav a:hover { color:var(--cyan); }
.main-nav.mobile-open { display:flex; }
.header-actions { display:flex; align-items:center; gap:1rem; }.theme-control { display:flex; align-items:center; gap:.5rem; color:var(--muted); font: .58rem var(--mono); letter-spacing:.1em; text-transform:uppercase; }.theme-control select { max-width:145px; border:1px solid var(--line); border-radius:5px; padding:.45rem .55rem; color:var(--white); background:var(--panel); font-size:.62rem; }.header-github { padding:.5rem .85rem; border:1px solid var(--line); border-radius:6px; color:var(--cyan); font: .62rem var(--mono); }.header-github:hover { border-color:var(--cyan); }.menu-button { display:none; border:0; color:var(--cyan); background:none; font-size:1.4rem; }
.hero { display:grid; grid-template-columns:1.02fr .98fr; align-items:center; gap:clamp(3rem,8vw,8rem); min-height:calc(100vh - 74px); padding-block:6rem 5rem; }.eyebrow { display:flex; align-items:center; gap:.65rem; margin:0 0 1.5rem; color:var(--cyan); font:700 .62rem var(--mono); letter-spacing:.14em; }.eyebrow-mark { width:8px; height:8px; border-radius:50%; background:var(--acid); box-shadow:0 0 16px var(--acid); }.hero h1 { margin:0; font-size:clamp(4rem,8.7vw,8.3rem); line-height:.88; letter-spacing:-.085em; font-weight:600; }.hero h1 em, h2 em { color:var(--pink); font-style:normal; }.hero-lede { max-width:590px; margin:2rem 0 2.2rem; color:var(--muted); font-size:clamp(1rem,1.5vw,1.2rem); }.hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; }.button { display:inline-flex; align-items:center; gap:1rem; padding:.85rem 1.1rem; border:1px solid var(--line); border-radius:7px; font:700 .64rem var(--mono); letter-spacing:.04em; text-transform:uppercase; transition:transform .2s,border-color .2s,background .2s; }.button:hover { transform:translateY(-2px); border-color:var(--cyan); }.button-primary { border-color:var(--acid); color:var(--bg); background:var(--acid); }.button-primary:hover { border-color:var(--acid); background:color-mix(in srgb, var(--acid) 82%, white); }.button-quiet { color:var(--white); background:transparent; }.hero-signal { display:flex; align-items:center; gap:.6rem; margin-top:2.7rem; color:var(--muted); font: .57rem var(--mono); letter-spacing:.12em; }.hero-signal i { width:45px; height:1px; background:var(--line); }.signal-dot { width:6px; height:6px; border-radius:50%; background:var(--acid); box-shadow:0 0 10px var(--acid); }
.hero-console { border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:linear-gradient(145deg, color-mix(in srgb, var(--panel) 88%, var(--purple)), var(--panel)); box-shadow:0 30px 90px color-mix(in srgb, var(--purple) 16%, transparent); }.console-head { display:flex; align-items:center; gap:.45rem; padding:.85rem 1rem; border-bottom:1px solid var(--line); color:var(--muted); font: .55rem var(--mono); }.console-head b { display:inline-block; width:6px; height:6px; margin-right:3px; border-radius:50%; background:var(--pink); }.console-head b:nth-child(2) { background:var(--orange); }.console-head b:nth-child(3) { background:var(--acid); }.console-label { margin-left:.55rem; }.console-status { margin-left:auto; color:var(--acid); }.console-body { padding:2.4rem 2.5rem 1.4rem; }.console-kicker, .panel-label, .card-foot, .connect-note { color:var(--muted); font: .57rem var(--mono); letter-spacing:.12em; }.console-title { margin-top:.7rem; font-size:clamp(2.2rem,4vw,3.7rem); line-height:.96; letter-spacing:-.06em; }.console-title span { color:var(--cyan); }.console-graph { position:relative; height:235px; margin:2rem 0 1rem; }.graph-core { position:absolute; left:50%; top:50%; display:grid; place-items:center; gap:.3rem; width:102px; height:102px; transform:translate(-50%,-50%); border:1px solid var(--cyan); border-radius:50%; background:color-mix(in srgb, var(--cyan) 8%, var(--panel)); box-shadow:0 0 45px color-mix(in srgb, var(--cyan) 25%, transparent); color:var(--cyan); font: .48rem var(--mono); letter-spacing:.08em; }.graph-core img { width:37px; height:37px; }.graph-line { position:absolute; left:50%; top:50%; width:42%; height:1px; transform-origin:left; background:linear-gradient(90deg, var(--cyan), transparent); }.line-a { transform:rotate(-30deg); }.line-b { transform:rotate(150deg); }.line-c { transform:rotate(30deg); }.graph-node { position:absolute; display:grid; place-items:center; padding:.55rem .7rem; border:1px solid var(--line); border-radius:4px; background:var(--panel); color:var(--white); font: .5rem var(--mono); letter-spacing:.08em; }.node-a { right:0; top:8%; color:var(--acid); }.node-b { left:0; top:37%; color:var(--pink); }.node-c { right:8%; bottom:3%; color:var(--orange); }.console-foot { display:flex; justify-content:space-between; gap:.75rem; padding-top:1rem; border-top:1px solid var(--line); color:var(--muted); font:.52rem var(--mono); }.console-foot b { color:var(--white); }
.signal-strip { border-block:1px solid var(--line); background:color-mix(in srgb, var(--panel) 55%, transparent); }.signal-strip-inner { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 0; color:var(--muted); font: .56rem var(--mono); letter-spacing:.14em; }.signal-strip i { width:5px; height:5px; border-radius:50%; background:var(--pink); }
.section { padding-block:8rem; }.section-heading { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:5rem; margin-bottom:3rem; }.section-heading h2 { margin:0; font-size:clamp(2.6rem,5vw,5rem); line-height:.95; letter-spacing:-.07em; font-weight:600; }.section-heading > p { max-width:530px; margin:0 0 .25rem; color:var(--muted); font-size:1rem; }.section-heading.compact { margin-bottom:2rem; }
.foundation-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; border:1px solid var(--line); background:var(--line); }.foundation-card { min-height:290px; position:relative; padding:1.5rem; background:var(--panel); border-top:2px solid var(--cyan); }.foundation-card.card-pink { border-color:var(--pink); }.foundation-card.card-green { border-color:var(--acid); }.foundation-card.card-orange { border-color:var(--orange); }.card-index { position:absolute; right:1.35rem; top:1.45rem; color:var(--muted); font: .58rem var(--mono); }.card-icon { display:grid; place-items:center; width:42px; height:42px; margin-bottom:2.6rem; border:1px solid currentColor; border-radius:8px; color:var(--cyan); font-size:1.4rem; }.card-pink .card-icon { color:var(--pink); }.card-green .card-icon { color:var(--acid); }.card-orange .card-icon { color:var(--orange); }.foundation-card h3 { margin:0 0 .6rem; font-size:1.25rem; }.foundation-card p { min-height:72px; margin:0; color:var(--muted); font-size:.9rem; }.card-foot { display:block; margin-top:1.5rem; }
.schema-panel { display:flex; align-items:center; gap:2rem; margin-top:1.5rem; padding:1.1rem 1.4rem; border:1px solid var(--line); border-radius:9px; background:var(--panel); }.schema-panel strong { display:block; margin-top:.2rem; color:var(--acid); font: .85rem var(--mono); }.swatches { display:flex; gap:.35rem; margin-left:auto; }.swatches i { display:block; width:22px; height:22px; border-radius:50%; border:2px solid var(--panel); outline:1px solid var(--line); }.schema-panel code { color:var(--muted); font: .6rem var(--mono); }
.systems-section { padding-top:7rem; background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--panel) 28%, transparent) 18%, transparent); }.systems-toolbar { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1.25rem; }.systems-count { color:var(--muted); font: .62rem var(--mono); letter-spacing:.09em; text-transform:uppercase; }.systems-count span:first-child { color:var(--acid); }.filters { display:flex; gap:.4rem; }.filter { cursor:pointer; padding:.48rem .7rem; border:1px solid var(--line); border-radius:5px; color:var(--muted); background:transparent; font: .58rem var(--mono); }.filter:hover,.filter.active { border-color:var(--cyan); color:var(--cyan); background:color-mix(in srgb, var(--cyan) 7%, transparent); }.project-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; }.project-card { position:relative; min-height:230px; display:flex; flex-direction:column; padding:1.15rem; border:1px solid var(--line); border-radius:9px; background:var(--panel); transition:transform .2s,border-color .2s,box-shadow .2s; }.project-card:hover { transform:translateY(-4px); border-color:var(--cyan); box-shadow:0 16px 45px color-mix(in srgb, var(--cyan) 11%, transparent); }.project-card.top-card { min-height:250px; }.project-card.is-hidden { display:none; }.project-card:nth-child(5n+2) { border-top-color:var(--pink); }.project-card:nth-child(5n+3) { border-top-color:var(--acid); }.project-card:nth-child(5n+4) { border-top-color:var(--purple); }.project-card:nth-child(5n+5) { border-top-color:var(--orange); }.project-art { width:100%; aspect-ratio:216/118; margin-bottom:1rem; border-radius:5px; overflow:hidden; background:var(--bg); }.project-art img { width:100%; height:100%; object-fit:cover; }.fallback-art { height:100%; display:flex; flex-direction:column; justify-content:space-between; padding:.8rem; background:linear-gradient(135deg, var(--panel), color-mix(in srgb, var(--purple) 22%, var(--bg))); color:var(--cyan); font: .55rem var(--mono); }.fallback-art strong { font-size:.7rem; letter-spacing:.08em; }.project-meta { display:flex; align-items:center; gap:.4rem; margin-bottom:.5rem; color:var(--muted); font: .5rem var(--mono); text-transform:uppercase; letter-spacing:.1em; }.project-dot { width:5px; height:5px; border-radius:50%; background:var(--acid); }.project-card h3 { margin:0 0 .4rem; font-size:1rem; }.project-card p { flex:1; margin:0; color:var(--muted); font-size:.78rem; line-height:1.45; }.project-link { display:inline-flex; justify-content:space-between; margin-top:1rem; padding-top:.75rem; border-top:1px solid var(--line); color:var(--cyan); font: .56rem var(--mono); }.systems-more { padding-top:2rem; text-align:center; }
.ecosystem-headers { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2rem; }.ecosystem-headers img { width:100%; height:58px; object-fit:contain; object-position:left center; padding:.55rem .75rem; border:1px solid var(--line); border-radius:7px; background:var(--panel); }
.architecture-section { padding-top:5rem; }.architecture-map { position:relative; min-height:300px; display:grid; place-items:center; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--panel); }.architecture-map::before { content:""; position:absolute; inset:0; opacity:.25; background:linear-gradient(var(--line) 1px, transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:48px 48px; }.map-core { position:relative; z-index:1; display:grid; place-items:center; gap:.35rem; width:150px; height:150px; border:1px solid var(--cyan); border-radius:50%; color:var(--cyan); background:var(--bg); box-shadow:0 0 65px color-mix(in srgb, var(--cyan) 24%, transparent); text-align:center; }.map-core img { width:45px; }.map-core strong { font: .67rem var(--mono); letter-spacing:.1em; }.map-core small { color:var(--muted); font: .43rem var(--mono); }.map-rail { position:absolute; z-index:1; display:flex; gap:1rem; }.map-rail span { padding:.6rem .75rem; border:1px solid var(--line); border-radius:4px; color:var(--muted); background:var(--bg); font: .52rem var(--mono); }.rail-top { top:1.8rem; }.rail-bottom { bottom:1.8rem; }.map-line { position:absolute; width:30%; height:1px; background:linear-gradient(90deg,transparent,var(--cyan),transparent); }.map-left { transform:rotate(90deg); }.map-right { transform:rotate(-90deg); }
.resource-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:1.5rem; }.resource-grid img { width:100%; border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.connect-section { padding-top:3rem; }.connect-panel { display:flex; justify-content:space-between; align-items:center; gap:4rem; padding:3.5rem; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(115deg, var(--panel), color-mix(in srgb, var(--purple) 10%, var(--panel))); }.connect-panel h2 { margin:0 0 1rem; font-size:clamp(2.6rem,5vw,4.5rem); line-height:.95; letter-spacing:-.07em; }.connect-panel p:not(.eyebrow) { max-width:550px; margin:0; color:var(--muted); }.connect-actions { display:flex; flex-direction:column; align-items:flex-start; gap:.7rem; min-width:250px; }.connect-note { margin-top:.8rem; }
.site-footer { margin-top:4rem; border-top:1px solid var(--line); }.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:80px; color:var(--muted); font: .55rem var(--mono); letter-spacing:.09em; }.footer-brand { display:flex; align-items:center; gap:.55rem; color:var(--white); }.footer-brand img { width:22px; height:22px; }.footer-inner > a:last-child { color:var(--cyan); }
@media (max-width: 1000px) { .hero { gap:3rem; }.project-grid { grid-template-columns:repeat(3,1fr); }.foundation-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width: 720px) { :root { --shell:calc(100% - 32px); }.header-inner { min-height:64px; }.main-nav,.header-github { display:none; }.menu-button { display:block; }.theme-control span { display:none; }.theme-control select { max-width:120px; }.hero { display:block; padding-block:5rem 4rem; min-height:auto; }.hero-console { margin-top:4rem; }.console-body { padding:1.7rem 1.4rem 1rem; }.section { padding-block:5.5rem; }.section-heading { display:block; }.section-heading > p { margin-top:1.4rem; }.foundation-grid { grid-template-columns:1fr; }.foundation-card { min-height:240px; }.schema-panel { flex-wrap:wrap; gap:1rem; }.swatches { order:3; width:100%; margin-left:0; }.schema-panel code { margin-left:auto; }.systems-toolbar { align-items:flex-start; flex-direction:column; }.filters { flex-wrap:wrap; }.ecosystem-headers { grid-template-columns:1fr; }.project-grid { grid-template-columns:repeat(2,1fr); }.project-card { min-height:220px; }.project-card.top-card { min-height:230px; }.architecture-map { min-height:360px; }.map-rail { flex-direction:column; }.rail-top { top:1.4rem; }.rail-bottom { bottom:1.4rem; }.resource-grid { grid-template-columns:repeat(2,1fr); }.connect-panel { display:block; padding:2rem 1.4rem; }.connect-actions { margin-top:2rem; }.footer-inner { flex-wrap:wrap; padding-block:1.4rem; }.footer-inner > span { order:3; width:100%; } }
@media (max-width: 440px) { .hero h1 { font-size:4rem; }.project-grid { grid-template-columns:1fr; }.project-art { aspect-ratio:2.2/1; }.console-foot { flex-wrap:wrap; }.brand-mark { width:108px; } }

/* Cybercore polish: denser plasma, opaque surfaces, and motion language. */
body { background: #02040a; }
body::before { opacity:.72; background:radial-gradient(ellipse at 18% 18%, color-mix(in srgb, var(--cyan) 13%, transparent), transparent 34rem), radial-gradient(ellipse at 86% 14%, color-mix(in srgb, var(--purple) 17%, transparent), transparent 31rem), radial-gradient(ellipse at 58% 80%, color-mix(in srgb, var(--pink) 8%, transparent), transparent 36rem); animation: plasma-drift 18s ease-in-out infinite alternate; }
body::after { content:""; position:fixed; inset:0; pointer-events:none; z-index:-1; opacity:.16; background:linear-gradient(116deg, transparent 0 28%, color-mix(in srgb, var(--cyan) 30%, transparent) 28.1%, transparent 28.3% 68%, color-mix(in srgb, var(--pink) 28%, transparent) 68.2%, transparent 68.4%), linear-gradient(0deg, transparent 0 92%, color-mix(in srgb, var(--cyan) 22%, transparent) 92.2%, transparent 92.4%); background-size:100% 100%, 100% 8rem; mix-blend-mode:screen; }
@keyframes plasma-drift { from { transform:scale(1) translate3d(-1%,0,0); } to { transform:scale(1.08) translate3d(1%,1%,0); } }
.signal-strip-inner > span { cursor:default; transition:color .2s, text-shadow .2s, transform .2s; }.signal-strip-inner > span:hover { transform:translateY(-1px); }.signal-strip-inner > span:nth-of-type(1):hover { color:var(--cyan); text-shadow:0 0 14px var(--cyan); }.signal-strip-inner > span:nth-of-type(2):hover { color:var(--pink); text-shadow:0 0 14px var(--pink); }.signal-strip-inner > span:nth-of-type(3):hover { color:var(--acid); text-shadow:0 0 14px var(--acid); }.signal-strip-inner > span:nth-of-type(4):hover { color:var(--orange); text-shadow:0 0 14px var(--orange); }.signal-strip-inner > span:nth-of-type(5):hover { color:var(--purple); text-shadow:0 0 14px var(--purple); }
.foundation-card, .project-card, .resource-card { background:color-mix(in srgb, var(--panel) 94%, #000); backdrop-filter:blur(10px); }
.foundation-card { box-shadow:inset 0 1px 0 color-mix(in srgb, var(--white) 5%, transparent); transition:background .25s, box-shadow .25s, transform .25s; }.foundation-card:hover { background:color-mix(in srgb, var(--panel) 87%, var(--purple)); transform:translateY(-3px); box-shadow:0 18px 42px color-mix(in srgb, var(--purple) 16%, transparent), inset 0 0 28px color-mix(in srgb, var(--pink) 5%, transparent); }
.project-card { border-top:2px solid var(--cyan); --wobble-neon:var(--cyan); }.project-card:nth-child(5n+2) { --wobble-neon:var(--pink); border-top-color:var(--pink); }.project-card:nth-child(5n+3) { --wobble-neon:var(--acid); border-top-color:var(--acid); }.project-card:nth-child(5n+4) { --wobble-neon:var(--purple); border-top-color:var(--purple); }.project-card:nth-child(5n+5) { --wobble-neon:var(--orange); border-top-color:var(--orange); }.project-card:hover { border-color:color-mix(in srgb, var(--wobble-neon) 72%, var(--line)); box-shadow:0 18px 55px color-mix(in srgb, var(--wobble-neon) 20%, transparent), inset 0 0 35px color-mix(in srgb, var(--wobble-neon) 6%, transparent); animation:card-wobble .58s cubic-bezier(.36,.07,.19,.97) both; }.project-art { background:color-mix(in srgb, var(--bg) 88%, var(--wobble-neon)); }.project-link { color:var(--wobble-neon); }.project-actions { display:flex; align-items:center; gap:.7rem; margin-top:1rem; padding-top:.75rem; border-top:1px solid var(--line); }.project-actions .project-link { flex:1; margin:0; padding:0; border:0; }.project-open { cursor:pointer; padding:0; border:0; color:var(--muted); background:transparent; font: .52rem var(--mono); }.project-open:hover { color:var(--white); }
@keyframes card-wobble { 0% { transform:translateY(-2px) rotate(0); } 18% { transform:translateY(-4px) rotate(-1.2deg); } 38% { transform:translateY(-4px) rotate(1.4deg); } 58% { transform:translateY(-4px) rotate(-.8deg); } 78% { transform:translateY(-4px) rotate(.55deg); } 100% { transform:translateY(-4px) rotate(0); } }
.category-rails { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2rem; }.category-rail { min-height:70px; display:grid; grid-template-columns:auto 1fr; align-content:center; column-gap:.75rem; padding:.8rem 1rem; border:1px solid var(--line); border-left:3px solid var(--rail-color); border-radius:7px; background:color-mix(in srgb, var(--panel) 94%, #000); box-shadow:inset 0 0 25px color-mix(in srgb, var(--rail-color) 7%, transparent); }.category-rail > span { grid-row:span 2; color:var(--rail-color); font: .56rem var(--mono); }.category-rail strong { color:var(--white); font:700 .59rem var(--mono); letter-spacing:.08em; }.category-rail small { margin-top:.25rem; color:var(--muted); font: .45rem var(--mono); letter-spacing:.06em; }.rail-cyan { --rail-color:var(--cyan); }.rail-pink { --rail-color:var(--pink); }.rail-acid { --rail-color:var(--acid); }
.resource-grid { align-items:stretch; }.resource-card { --resource-neon:var(--orange); display:flex; flex-direction:column; min-width:0; overflow:hidden; border:1px solid color-mix(in srgb, var(--resource-neon) 40%, var(--line)); border-radius:9px; box-shadow:inset 0 0 24px color-mix(in srgb, var(--resource-neon) 5%, transparent); transition:box-shadow .2s, border-color .2s; }.resource-card:hover { border-color:var(--resource-neon); box-shadow:0 18px 45px color-mix(in srgb, var(--resource-neon) 17%, transparent); animation:card-wobble .58s cubic-bezier(.36,.07,.19,.97) both; }.resource-orange { --resource-neon:var(--orange); }.resource-acid { --resource-neon:var(--acid); }.resource-cyan { --resource-neon:var(--cyan); }.resource-purple { --resource-neon:var(--purple); }.resource-image { display:block; aspect-ratio:1.9 / 1; overflow:hidden; background:var(--bg); }.resource-image img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .35s, filter .35s; }.resource-card:hover .resource-image img { transform:scale(1.04); filter:saturate(1.12) contrast(1.04); }.resource-bar { display:flex; align-items:center; justify-content:space-between; gap:.6rem; min-height:46px; padding:.7rem .8rem; border-top:1px solid color-mix(in srgb, var(--resource-neon) 35%, var(--line)); }.resource-bar strong { color:var(--resource-neon); font: .57rem var(--mono); letter-spacing:.08em; }.resource-bar button { cursor:pointer; border:0; color:var(--muted); background:transparent; font: .5rem var(--mono); }.resource-bar button:hover { color:var(--white); }
.theme-picker-wrap { position:relative; display:inline-block; }.theme-picker-button, .header-theme-add { cursor:pointer; min-height:34px; padding:.46rem .72rem; border:1px solid var(--line); border-radius:4px; color:var(--cyan); background:color-mix(in srgb, var(--panel) 88%, transparent); font: .58rem var(--mono); letter-spacing:.08em; text-transform:uppercase; }.theme-picker-button { display:flex; align-items:center; gap:.6rem; }.theme-picker-button:hover, .header-theme-add:hover { border-color:var(--cyan); box-shadow:0 0 16px color-mix(in srgb, var(--cyan) 19%, transparent); }.header-theme-add { color:var(--purple); border-color:color-mix(in srgb, var(--purple) 48%, var(--line)); }.header-theme-add:hover { border-color:var(--purple); color:var(--white); }.caret-down { color:var(--muted); }.theme-dropdown { position:fixed; z-index:100; width:240px; max-height:66vh; overflow-y:auto; padding:.35rem 0; border:1px solid var(--line); border-radius:5px; background:color-mix(in srgb, var(--panel) 98%, #000); box-shadow:0 20px 55px rgba(0,0,0,.55); }.theme-group-label { padding:.62rem .8rem .25rem; color:var(--cyan); font:700 .55rem var(--mono); letter-spacing:.13em; text-transform:uppercase; }.theme-item { cursor:pointer; padding:.34rem .8rem; color:var(--white); font: .57rem var(--mono); letter-spacing:.06em; text-transform:uppercase; }.theme-item:hover { color:var(--cyan); background:color-mix(in srgb, var(--cyan) 14%, transparent); }.theme-item.selected { color:var(--acid); background:color-mix(in srgb, var(--acid) 13%, transparent); }
.modal-overlay { position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:1rem; background:rgba(0,0,0,.72); backdrop-filter:blur(10px); }.modal-overlay[hidden] { display:none; }.modal-window { width:min(700px,100%); max-height:min(760px,calc(100vh - 2rem)); overflow:auto; border:1px solid var(--cyan); border-radius:10px; background:color-mix(in srgb, var(--panel) 97%, #000); box-shadow:0 0 60px color-mix(in srgb, var(--cyan) 18%, transparent); }.modal-titlebar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem 1.1rem; border-bottom:1px solid var(--line); }.modal-kicker { color:var(--muted); font: .55rem var(--mono); letter-spacing:.1em; }.modal-close { cursor:pointer; border:0; color:var(--muted); background:transparent; font-size:1.5rem; line-height:1; }.modal-close:hover { color:var(--pink); }.modal-body { padding:1.7rem; }.modal-body h2 { margin:0 0 .8rem; font-size:clamp(2rem,5vw,3.2rem); line-height:.95; letter-spacing:-.07em; }.modal-body > p:not(.eyebrow), .creator-note { color:var(--muted); }.modal-meta { display:flex; flex-wrap:wrap; gap:.45rem; margin:1rem 0; }.modal-meta span { padding:.35rem .5rem; border:1px solid var(--line); color:var(--cyan); font: .52rem var(--mono); }.modal-body pre { max-height:240px; overflow:auto; margin:1.2rem 0; padding:1rem; border:1px solid var(--line); border-radius:6px; color:var(--acid); background:#020308; font: .62rem/1.6 var(--mono); white-space:pre-wrap; }.modal-actions { display:flex; flex-wrap:wrap; gap:.6rem; }.theme-creator-window { max-width:940px; }.creator-layout { display:grid; grid-template-columns:1fr .8fr; gap:2rem; }.creator-layout h2 { margin-bottom:.8rem; }.field-label, .install-label { display:block; margin:1rem 0 .45rem; color:var(--muted); font: .55rem var(--mono); letter-spacing:.1em; }.theme-name-input { width:100%; padding:.7rem; border:1px solid var(--line); border-radius:5px; color:var(--white); background:var(--bg); font: .65rem var(--mono); }.swatch-editor { display:grid; grid-template-columns:repeat(2,1fr); gap:.45rem; margin-top:1rem; }.swatch-field { display:flex; align-items:center; gap:.5rem; color:var(--muted); font: .5rem var(--mono); }.swatch-field input[type=color] { width:28px; height:25px; padding:0; border:1px solid var(--line); background:transparent; }.creator-tools { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }.creator-tools .button { padding:.65rem .75rem; }.preview-surface { min-height:330px; padding:1rem; border:1px solid var(--line); border-radius:9px; background:color-mix(in srgb, var(--panel) 90%, var(--purple)); box-shadow:inset 0 0 30px color-mix(in srgb, var(--cyan) 6%, transparent); }.preview-top { display:flex; justify-content:space-between; color:var(--muted); font: .5rem var(--mono); }.preview-top b { color:var(--acid); }.preview-surface h3 { margin-top:4rem; color:var(--cyan); font-size:1.6rem; }.preview-surface p { color:var(--muted); }.preview-bars { display:flex; gap:.4rem; margin-top:2rem; }.preview-bars i { width:33%; height:5px; background:var(--cyan); }.preview-bars i:nth-child(2) { background:var(--pink); }.preview-bars i:nth-child(3) { background:var(--acid); }.preview-chip { display:inline-block; margin-top:2rem; padding:.45rem .6rem; border:1px solid var(--acid); color:var(--acid); font: .5rem var(--mono); }
.install-card { position:relative; padding:1rem; border:1px solid var(--line); border-radius:7px; background:color-mix(in srgb, var(--bg) 88%, var(--purple)); }.install-card code { display:block; padding-right:3rem; color:var(--acid); font: .56rem/1.5 var(--mono); overflow-wrap:anywhere; }.install-card button { position:absolute; right:.65rem; bottom:.65rem; cursor:pointer; border:0; color:var(--cyan); background:transparent; font: .5rem var(--mono); }.connect-buttons { display:flex; flex-direction:column; align-items:flex-start; gap:.7rem; margin-top:1rem; }
.about-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:5rem; align-items:start; }.about-copy { padding:1.7rem; border:1px solid var(--line); border-left:3px solid var(--pink); border-radius:8px; background:color-mix(in srgb, var(--panel) 94%, #000); box-shadow:inset 0 0 30px color-mix(in srgb, var(--pink) 5%, transparent); }.draft-label { color:var(--pink); font: .56rem var(--mono); letter-spacing:.12em; }.mission-draft { margin:1rem 0 0; color:var(--white); font-size:clamp(1.15rem,2vw,1.55rem); line-height:1.45; }.mission-draft.secondary { margin-top:1.5rem; color:var(--muted); font-size:.82rem; }
.mission-quote { margin:1.7rem 0 0; padding-top:1rem; border-top:1px solid var(--line); color:var(--acid); font:700 .62rem/1.5 var(--mono); letter-spacing:.1em; }
.services-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }.service-card { position:relative; min-height:310px; padding:1.35rem; border:1px solid var(--line); border-top:2px solid var(--service-neon); border-radius:8px; background:color-mix(in srgb, var(--panel) 94%, #000); box-shadow:inset 0 0 30px color-mix(in srgb, var(--service-neon) 5%, transparent); transition:transform .25s, box-shadow .25s, border-color .25s; }.service-card:hover { transform:translateY(-5px); border-color:var(--service-neon); box-shadow:0 20px 48px color-mix(in srgb, var(--service-neon) 16%, transparent); animation:card-wobble .58s cubic-bezier(.36,.07,.19,.97) both; }.service-cyan { --service-neon:var(--cyan); }.service-pink { --service-neon:var(--pink); }.service-acid { --service-neon:var(--acid); }.service-orange { --service-neon:var(--orange); }.service-index { position:absolute; top:1.3rem; right:1.2rem; color:var(--muted); font: .55rem var(--mono); }.service-icon { display:grid; place-items:center; width:42px; height:42px; margin-bottom:2.1rem; border:1px solid var(--service-neon); border-radius:8px; color:var(--service-neon); font-size:1.25rem; }.service-card h3 { margin:0 0 .7rem; font-size:1.1rem; }.service-card p { min-height:105px; margin:0; color:var(--muted); font-size:.82rem; line-height:1.5; }.service-card a { display:block; margin-top:1.3rem; padding-top:.75rem; border-top:1px solid var(--line); color:var(--service-neon); font: .52rem var(--mono); letter-spacing:.06em; }
.proof-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }.proof-card { min-height:260px; position:relative; padding:1.4rem; border:1px solid var(--line); border-top:2px solid var(--proof-neon); border-radius:8px; background:color-mix(in srgb, var(--panel) 94%, #000); }.proof-ai { --proof-neon:var(--cyan); }.proof-human { --proof-neon:var(--pink); }.proof-evidence { --proof-neon:var(--acid); }.proof-number { position:absolute; right:1.2rem; top:1.2rem; color:var(--muted); font: .55rem var(--mono); }.proof-icon { display:grid; place-items:center; width:42px; height:42px; margin-bottom:2.2rem; border:1px solid var(--proof-neon); border-radius:50%; color:var(--proof-neon); font-size:1.25rem; }.proof-card h3 { margin:0 0 .6rem; font-size:1.15rem; }.proof-card p { min-height:84px; margin:0; color:var(--muted); font-size:.82rem; }.proof-card strong { display:block; margin-top:1.2rem; color:var(--proof-neon); font: .52rem var(--mono); letter-spacing:.1em; }.proof-line { display:flex; align-items:center; gap:1rem; margin-top:1.4rem; color:var(--muted); font: .55rem var(--mono); letter-spacing:.1em; }.proof-line i { flex:1; height:1px; background:var(--line); }
@media (max-width:720px) { .category-rails { grid-template-columns:1fr; }.resource-grid { grid-template-columns:repeat(2,1fr); }.creator-layout { grid-template-columns:1fr; }.theme-dropdown { max-width:calc(100vw - 2rem); }.header-actions { gap:.45rem; }.header-theme-add { font-size:.5rem; padding-inline:.5rem; } }
@media (max-width:720px) { .main-nav.mobile-open { position:absolute; top:74px; left:0; right:0; display:flex; flex-direction:column; gap:0; margin:0; padding:.7rem 1.5rem 1rem; border-bottom:1px solid var(--line); background:color-mix(in srgb, var(--bg) 97%, #000); box-shadow:0 16px 30px rgba(0,0,0,.35); }.main-nav.mobile-open a { padding:.7rem 0; border-bottom:1px solid color-mix(in srgb, var(--line) 55%, transparent); }.main-nav.mobile-open a:last-child { border-bottom:0; } }
@media (max-width:900px) { .services-grid { grid-template-columns:repeat(2,1fr); }.about-layout { grid-template-columns:1fr; gap:2rem; } }
@media (max-width:720px) { .proof-grid { grid-template-columns:1fr; }.proof-line { flex-wrap:wrap; }.proof-line i { flex-basis:20px; }.services-grid { grid-template-columns:1fr; }.service-card { min-height:250px; }.service-card p { min-height:auto; margin-bottom:1.1rem; } }
@media (max-width:440px) { .resource-grid { grid-template-columns:1fr; }.resource-image { aspect-ratio:2.1 / 1; }.theme-picker-button { max-width:135px; }.theme-picker-button span:first-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } }

/* Header/footer identity and fluid system links. */
.site-header::after { content:""; display:block; height:18px; background:radial-gradient(circle at center, var(--white) 0 2px, transparent 3px) center/10px 10px no-repeat, linear-gradient(90deg, transparent, color-mix(in srgb, var(--cyan) 72%, transparent) 20%, color-mix(in srgb, var(--purple) 78%, transparent) 50%, color-mix(in srgb, var(--pink) 72%, transparent) 80%, transparent) center/100% 1px no-repeat; opacity:.82; }
.brand { gap:.65rem; }.brand-logo-shell { display:flex; align-items:center; padding:.28rem .48rem; border:1px solid color-mix(in srgb, var(--cyan) 46%, var(--line)); border-radius:8px 16px 8px 16px; background:linear-gradient(135deg, color-mix(in srgb, var(--cyan) 14%, var(--panel)), color-mix(in srgb, var(--purple) 18%, var(--panel)) 52%, color-mix(in srgb, var(--pink) 12%, var(--panel))); box-shadow:inset 0 0 18px color-mix(in srgb, var(--cyan) 10%, transparent), 0 0 22px color-mix(in srgb, var(--purple) 10%, transparent); }.brand-mark { width:126px; max-height:27px; }.brand-divider { color:var(--pink); }.brand-sub { color:var(--acid); font-weight:700; text-shadow:0 0 12px color-mix(in srgb, var(--acid) 55%, transparent); }
.map-core { border-radius:42% 58% 48% 52% / 52% 44% 56% 48%; background:linear-gradient(145deg, color-mix(in srgb, var(--cyan) 18%, var(--panel)), color-mix(in srgb, var(--purple) 28%, var(--bg))); box-shadow:0 0 65px color-mix(in srgb, var(--cyan) 24%, transparent), inset 0 0 34px color-mix(in srgb, var(--pink) 10%, transparent); }.map-rail { gap:.75rem; }.map-rail a { position:relative; display:inline-flex; align-items:center; gap:.45rem; padding:.65rem .9rem; border:1px solid var(--node-color); border-radius:999px 10px 999px 10px; color:var(--node-color); background:linear-gradient(135deg, color-mix(in srgb, var(--node-color) 25%, var(--panel)), color-mix(in srgb, var(--node-color) 8%, var(--bg))); box-shadow:inset 0 0 22px color-mix(in srgb, var(--node-color) 15%, transparent), 0 0 18px color-mix(in srgb, var(--node-color) 9%, transparent); font:700 .52rem var(--mono); letter-spacing:.08em; transition:transform .25s, filter .25s, box-shadow .25s; }.map-rail a::after { content:"↗"; opacity:.7; }.map-rail a:hover { transform:translateY(-4px) rotate(-1.5deg); filter:saturate(1.35); box-shadow:inset 0 0 26px color-mix(in srgb, var(--node-color) 22%, transparent), 0 10px 28px color-mix(in srgb, var(--node-color) 20%, transparent); }.rail-top a:nth-child(1) { --node-color:var(--cyan); }.rail-top a:nth-child(2) { --node-color:var(--pink); }.rail-top a:nth-child(3) { --node-color:var(--acid); }.rail-bottom a:nth-child(1) { --node-color:var(--orange); }.rail-bottom a:nth-child(2) { --node-color:var(--purple); }.rail-bottom a:nth-child(3) { --node-color:var(--cyan); }
.site-footer { margin-top:4rem; border-top:0; background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--panel) 42%, transparent) 22%, color-mix(in srgb, var(--bg) 88%, transparent)); }.footer-divider { width:100%; overflow:hidden; border-block:1px solid color-mix(in srgb, var(--line) 76%, transparent); background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--purple) 16%, transparent) 50%, transparent); }.footer-divider img { display:block; width:100%; height:84px; object-fit:cover; object-position:center; opacity:.78; mix-blend-mode:screen; }.footer-grid { display:grid; grid-template-columns:1.35fr 1fr 1fr; gap:3rem; padding-block:2.7rem 2.2rem; }.footer-logo { display:inline-flex; align-items:center; gap:.7rem; }.footer-logo img { display:block; width:min(250px, 100%); height:auto; }.footer-logo span { color:var(--acid); font:700 .7rem var(--mono); letter-spacing:.15em; text-shadow:0 0 14px color-mix(in srgb, var(--acid) 48%, transparent); }.footer-identity p { max-width:320px; margin:1rem 0 0; color:var(--muted); font:.56rem/1.6 var(--mono); letter-spacing:.1em; }.footer-contact, .footer-social { display:flex; flex-direction:column; align-items:flex-start; gap:.65rem; padding-left:1.3rem; border-left:1px solid color-mix(in srgb, var(--cyan) 42%, var(--line)); }.footer-social { border-left-color:color-mix(in srgb, var(--pink) 44%, var(--line)); }.footer-label { margin-bottom:.25rem; color:var(--cyan); font:700 .55rem var(--mono); letter-spacing:.14em; }.footer-social .footer-label { color:var(--pink); }.footer-contact a, .footer-social a { color:var(--white); font:.66rem var(--mono); transition:color .2s, text-shadow .2s; }.footer-contact a:hover, .footer-social a:hover { color:var(--acid); text-shadow:0 0 14px color-mix(in srgb, var(--acid) 48%, transparent); }.footer-contact small, .social-pending { color:var(--muted); font:.5rem/1.5 var(--mono); letter-spacing:.08em; }.footer-bottom { display:flex; justify-content:space-between; gap:1rem; padding-block:1rem 1.4rem; border-top:1px solid var(--line); color:var(--muted); font:.52rem var(--mono); letter-spacing:.09em; }.footer-bottom a { color:var(--cyan); }
@media (max-width:720px) { .brand-logo-shell { padding:.25rem .35rem; }.brand-mark { width:108px; }.footer-grid { grid-template-columns:1fr; gap:1.8rem; padding-block:2rem; }.footer-contact, .footer-social { padding-left:1rem; }.footer-bottom { flex-wrap:wrap; }.footer-divider img { height:64px; } }

/* Every repository visual uses the same dark, outlined tile language. */
.project-art { position:relative; border:1px solid color-mix(in srgb, var(--wobble-neon) 55%, var(--line)); background:color-mix(in srgb, var(--bg) 94%, var(--wobble-neon)); box-shadow:inset 0 0 24px color-mix(in srgb, var(--wobble-neon) 8%, transparent), 0 0 16px color-mix(in srgb, var(--wobble-neon) 6%, transparent); }.project-art img { display:block; }.fallback-art { position:relative; z-index:0; height:100%; display:flex; flex-direction:column; justify-content:space-between; padding:.75rem .85rem; overflow:visible; border:0; border-radius:0; background:transparent; color:var(--wobble-neon); font:.55rem var(--mono); }.fallback-art::before { content:""; position:absolute; z-index:-1; inset:18px 12px 11px; border:1px solid var(--wobble-neon); border-radius:15px; background:color-mix(in srgb, var(--wobble-neon) 5%, var(--bg)); box-shadow:0 0 19px color-mix(in srgb, var(--wobble-neon) 24%, transparent), inset 0 0 20px color-mix(in srgb, var(--wobble-neon) 7%, transparent); }.fallback-art::after { content:""; position:absolute; z-index:-1; top:0; left:50%; width:1px; height:14px; background:var(--wobble-neon); box-shadow:0 15px 0 1px var(--wobble-neon); }.fallback-art span, .fallback-art strong, .fallback-art small { position:relative; z-index:1; }.fallback-art span { margin-left:2px; color:var(--wobble-neon); }.fallback-copy { display:flex; flex-direction:column; gap:.28rem; margin:0 0 .45rem 1.05rem; }.fallback-art strong { color:var(--wobble-neon); font-size:.7rem; letter-spacing:.08em; }.fallback-art small { max-width:92%; color:color-mix(in srgb, var(--wobble-neon) 62%, var(--muted)); font:.42rem/1.35 var(--mono); letter-spacing:.045em; }
.about-copy { display:flex; flex-direction:column; justify-content:flex-start; gap:0; overflow:hidden; }.about-copy .mission-draft { max-width:68ch; }.about-copy .mission-draft.secondary { max-width:76ch; }.about-copy .mission-draft:last-child { margin-top:1rem; padding-top:.85rem; border-top:1px solid color-mix(in srgb, var(--pink) 30%, var(--line)); color:color-mix(in srgb, var(--muted) 78%, var(--pink)); font-size:.68rem; line-height:1.45; }

/* Open-source acknowledgements and external contact surfaces. */
.footer-license { color:var(--acid) !important; margin-top:.2rem; }
.ecosystem-footer { display:grid; grid-template-columns:minmax(190px,.72fr) 2fr; gap:2rem; padding-block:1.6rem 2rem; border-top:1px solid color-mix(in srgb, var(--purple) 42%, var(--line)); border-bottom:1px solid color-mix(in srgb, var(--cyan) 30%, var(--line)); }
.ecosystem-intro { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:.6rem; padding-right:1.5rem; border-right:1px solid color-mix(in srgb, var(--pink) 35%, var(--line)); }
.ecosystem-intro .footer-label { color:var(--acid); }.ecosystem-intro p { margin:0; color:var(--muted); font:.6rem/1.5 var(--mono); }.ecosystem-intro small { color:color-mix(in srgb, var(--muted) 76%, var(--purple)); font:.46rem/1.5 var(--mono); letter-spacing:.08em; }
.ecosystem-links { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; }
.ecosystem-link { --eco-color:var(--cyan); display:flex; align-items:center; gap:.65rem; min-height:62px; padding:.7rem .75rem; border:1px solid color-mix(in srgb, var(--eco-color) 58%, var(--line)); border-radius:5px 15px 5px 15px; background:linear-gradient(135deg, color-mix(in srgb, var(--eco-color) 13%, var(--panel)), color-mix(in srgb, var(--bg) 94%, var(--eco-color))); box-shadow:inset 0 0 20px color-mix(in srgb, var(--eco-color) 7%, transparent); transition:transform .22s ease, box-shadow .22s ease, filter .22s ease; }.ecosystem-link:hover { transform:translateY(-3px) rotate(-.7deg); filter:saturate(1.3); box-shadow:0 8px 20px color-mix(in srgb, var(--eco-color) 17%, transparent), inset 0 0 24px color-mix(in srgb, var(--eco-color) 13%, transparent); }.ecosystem-link > span:last-child { min-width:0; display:flex; flex-direction:column; gap:.18rem; }.ecosystem-link strong { overflow:hidden; color:var(--white); font:700 .57rem var(--mono); letter-spacing:.07em; text-overflow:ellipsis; white-space:nowrap; }.ecosystem-link strong b { margin-left:.22rem; color:var(--eco-color); font-weight:800; text-shadow:0 0 10px color-mix(in srgb, var(--eco-color) 65%, transparent); }.ecosystem-link small { overflow:hidden; color:color-mix(in srgb, var(--eco-color) 66%, var(--muted)); font:.4rem var(--mono); letter-spacing:.04em; text-overflow:ellipsis; white-space:nowrap; }.ecosystem-mark { display:grid; flex:0 0 30px; place-items:center; width:30px; height:30px; color:var(--eco-color); border:1px solid color-mix(in srgb, var(--eco-color) 55%, transparent); border-radius:50% 35% 50% 35%; background:color-mix(in srgb, var(--eco-color) 9%, transparent); box-shadow:0 0 13px color-mix(in srgb, var(--eco-color) 16%, transparent); }.ecosystem-mark img { width:20px; height:20px; object-fit:contain; filter:saturate(1.2) drop-shadow(0 0 5px color-mix(in srgb, var(--eco-color) 40%, transparent)); }.text-mark { font:700 .52rem var(--mono); }.ecosystem-omarchy { --eco-color:#9ece6a; }.ecosystem-rust { --eco-color:#f46623; }.ecosystem-crates { --eco-color:#e8b44f; }.ecosystem-kernel { --eco-color:var(--cyan); }.ecosystem-arch { --eco-color:#1793d1; }.ecosystem-quickshell { --eco-color:var(--purple); }.ecosystem-lua { --eco-color:#7fdbff; }
@media (max-width:900px) { .ecosystem-footer { grid-template-columns:1fr; }.ecosystem-intro { padding:0 0 1rem; border-right:0; border-bottom:1px solid color-mix(in srgb, var(--pink) 35%, var(--line)); }.ecosystem-links { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:560px) { .ecosystem-links { grid-template-columns:repeat(2,minmax(0,1fr)); }.ecosystem-link { min-height:56px; padding:.58rem; }.ecosystem-mark { flex-basis:26px; width:26px; height:26px; }.ecosystem-mark img { width:17px; height:17px; } }

/* Client-facing proof surfaces: runtime signal, selected builds, and inquiry intake. */
.status-section { padding-top:4.5rem; }.status-panel { display:grid; grid-template-columns:.75fr 1.25fr; gap:1rem; padding:1rem; border:1px solid color-mix(in srgb, var(--acid) 42%, var(--line)); border-radius:var(--radius); background:linear-gradient(120deg, color-mix(in srgb, var(--acid) 7%, var(--panel)), color-mix(in srgb, var(--cyan) 6%, var(--bg))); box-shadow:inset 0 0 36px color-mix(in srgb, var(--acid) 5%, transparent), 0 15px 45px color-mix(in srgb, var(--acid) 7%, transparent); }.status-overview { display:flex; align-items:center; gap:.85rem; min-height:112px; padding:1.2rem; border:1px solid color-mix(in srgb, var(--acid) 34%, var(--line)); border-radius:8px; background:color-mix(in srgb, var(--bg) 84%, var(--acid)); }.status-orb { flex:0 0 17px; width:17px; height:17px; border-radius:50%; background:var(--acid); box-shadow:0 0 10px var(--acid), 0 0 28px color-mix(in srgb, var(--acid) 72%, transparent); animation:status-breathe 1.8s ease-in-out infinite; }.status-overview div { display:flex; flex-direction:column; gap:.35rem; }.status-overview strong { color:var(--acid); font:700 .72rem var(--mono); letter-spacing:.1em; }.status-overview small, .status-pulse { color:var(--muted); font:.48rem var(--mono); letter-spacing:.08em; }.status-pulse { margin-left:auto; align-self:flex-start; color:var(--acid); }.status-metrics { display:grid; grid-template-columns:repeat(2,1fr); gap:.65rem; }.status-metric { display:flex; flex-direction:column; justify-content:center; min-height:80px; padding:.9rem; border:1px solid var(--line); border-radius:6px; background:color-mix(in srgb, var(--panel) 90%, #000); }.status-metric span { color:var(--muted); font: .47rem var(--mono); letter-spacing:.08em; }.status-metric strong { margin:.35rem 0 .2rem; color:var(--cyan); font:700 .68rem var(--mono); letter-spacing:.06em; }.status-metric small { color:color-mix(in srgb, var(--muted) 80%, var(--purple)); font:.42rem var(--mono); letter-spacing:.06em; }
@keyframes status-breathe { 0%,100% { transform:scale(.92); opacity:.78; } 50% { transform:scale(1.08); opacity:1; } }
.work-section { padding-top:5.5rem; }.case-study-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }.case-study { --case-neon:var(--cyan); display:flex; flex-direction:column; min-height:330px; padding:1.35rem; border:1px solid color-mix(in srgb, var(--case-neon) 55%, var(--line)); border-top:2px solid var(--case-neon); border-radius:8px 8px 18px 8px; background:linear-gradient(145deg, color-mix(in srgb, var(--case-neon) 9%, var(--panel)), color-mix(in srgb, var(--bg) 92%, var(--case-neon))); box-shadow:inset 0 0 28px color-mix(in srgb, var(--case-neon) 5%, transparent); transition:transform .25s, box-shadow .25s, border-color .25s; }.case-study:hover { transform:translateY(-5px) rotate(-.45deg); border-color:var(--case-neon); box-shadow:0 20px 48px color-mix(in srgb, var(--case-neon) 15%, transparent), inset 0 0 30px color-mix(in srgb, var(--case-neon) 9%, transparent); }.case-acid { --case-neon:var(--acid); }.case-pink { --case-neon:var(--pink); }.case-top { display:flex; justify-content:space-between; gap:1rem; color:var(--case-neon); font: .48rem var(--mono); letter-spacing:.08em; }.case-top b { color:var(--muted); font-weight:400; text-align:right; }.case-study h3 { margin:2.8rem 0 .7rem; font-size:1.25rem; }.case-study p { margin:0; color:var(--muted); font-size:.82rem; line-height:1.55; }.case-result { display:flex; flex-direction:column; gap:.35rem; margin-top:auto; padding-top:1rem; border-top:1px solid color-mix(in srgb, var(--case-neon) 28%, var(--line)); }.case-result span { color:var(--muted); font: .45rem var(--mono); letter-spacing:.09em; }.case-result strong { color:var(--case-neon); font:700 .56rem var(--mono); letter-spacing:.06em; }.case-study > a { margin-top:1rem; color:var(--case-neon); font: .52rem var(--mono); letter-spacing:.06em; }
.connect-panel { display:grid !important; grid-template-columns:1fr .76fr 1fr; align-items:start; gap:2rem; }.intake-form { display:flex; flex-direction:column; gap:.42rem; padding:1.15rem; border:1px solid color-mix(in srgb, var(--pink) 50%, var(--line)); border-radius:8px 8px 18px 8px; background:linear-gradient(145deg, color-mix(in srgb, var(--pink) 8%, var(--panel)), color-mix(in srgb, var(--bg) 92%, var(--purple))); box-shadow:inset 0 0 28px color-mix(in srgb, var(--pink) 5%, transparent); }.intake-heading { display:flex; flex-direction:column; gap:.45rem; margin-bottom:.45rem; }.intake-heading .footer-label { margin:0; color:var(--pink); }.intake-heading strong { color:var(--white); font-size:1.1rem; }.intake-heading small { color:var(--muted); font:.5rem/1.4 var(--mono); }.intake-form label { margin-top:.3rem; color:var(--muted); font: .47rem var(--mono); letter-spacing:.1em; }.intake-form input, .intake-form select, .intake-form textarea { width:100%; padding:.62rem .68rem; border:1px solid var(--line); border-radius:4px; outline:0; color:var(--white); background:color-mix(in srgb, var(--bg) 90%, var(--purple)); font:.58rem var(--mono); }.intake-form textarea { resize:vertical; min-height:70px; }.intake-form input:focus, .intake-form select:focus, .intake-form textarea:focus { border-color:var(--pink); box-shadow:0 0 0 2px color-mix(in srgb, var(--pink) 15%, transparent); }.intake-form .button { align-self:flex-start; margin-top:.45rem; padding:.7rem .8rem; font-size:.54rem; }
@media (max-width:1000px) { .connect-panel { grid-template-columns:1fr 1fr; }.intake-form { grid-column:1 / -1; }.case-study-grid { grid-template-columns:1fr; }.case-study { min-height:250px; } }
@media (max-width:720px) { .status-panel { grid-template-columns:1fr; }.status-overview { min-height:90px; }.status-metrics { grid-template-columns:repeat(2,1fr); }.connect-panel { display:block !important; }.intake-form { margin-top:2rem; }.case-study-grid { grid-template-columns:1fr; } }