@import "https://fonts.googleapis.com/css2?family=Geist+Mono:wght@300;400;500&display=swap";:root{--bg:#0e0c0c;--fg:#e9e6e2;--muted:#181616;--muted-fg:#938c85;--accent:#c1c8d7;--rule:#363230;--paper:#161413;--content-max:1100px;--gutter-min:clamp(16px, 4vw, 32px);--gutter:max(var(--gutter-min), calc((100% - var(--content-max)) / 2))}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{background:var(--bg);color:var(--fg);scroll-behavior:smooth;scroll-padding-top:56px}body{-webkit-font-smoothing:antialiased;font-family:Geist Sans,Inter,system-ui,sans-serif;font-size:15px;line-height:1.6}p{color:#e9e6e2bf;line-height:1.65}p strong{color:var(--fg);font-weight:500}.page-wrap{max-width:960px;margin:0 auto;padding:0 24px 120px}.nav{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--rule);padding:14px var(--gutter);background:#0e0c0cf0;align-items:center;gap:28px;display:flex;position:sticky;top:0}.nav-logo{letter-spacing:.1em;color:var(--fg);margin-right:auto;font-family:Geist Mono,monospace;font-size:11px;font-weight:500}.nav a{letter-spacing:.18em;text-transform:uppercase;color:var(--muted-fg);font-family:Geist Mono,monospace;font-size:10px;text-decoration:none;transition:color .2s}.nav a:hover{color:var(--fg)}.hero{padding:80px var(--gutter) 60px;border-bottom:1px solid var(--rule);position:relative;overflow:hidden}.hero:before{content:"";pointer-events:none;background:radial-gradient(circle at 20% 0,#c1c8d714,#0000 40%),radial-gradient(circle at 80% 30%,#338fcc0f,#0000 50%);position:absolute;inset:0}.hero-meta{letter-spacing:.18em;color:#363230;gap:32px;margin-bottom:40px;font-family:Geist Mono,monospace;font-size:9px;display:flex}.hero h1{letter-spacing:-.035em;margin-bottom:24px;font-size:clamp(40px,6vw,72px);font-weight:600;line-height:.95}.hero h1 span{color:var(--accent);font-weight:300}.section{padding:72px var(--gutter);border-top:1px solid var(--rule)}.eyebrow{letter-spacing:.2em;text-transform:uppercase;color:var(--accent);align-items:center;gap:10px;margin-bottom:20px;font-family:Geist Mono,monospace;font-size:10px;display:flex}.eyebrow:before{content:"";background:var(--accent);width:24px;height:1px;display:inline-block}h2{letter-spacing:-.03em;margin-bottom:32px;font-size:clamp(26px,3.5vw,40px);font-weight:600;line-height:1.05}.label{letter-spacing:.18em;text-transform:uppercase;color:var(--muted-fg);margin-bottom:6px;font-family:Geist Mono,monospace;font-size:10px}.mono{color:var(--fg);font-family:Geist Mono,monospace;font-size:13px}.logo-grid{grid-template-columns:1fr 1fr;gap:2px;margin-top:32px;display:grid}.logo-cell{flex-direction:column;gap:24px;min-height:160px;padding:48px 40px;display:flex;position:relative}.logo-cell-label{letter-spacing:.15em;text-transform:uppercase;opacity:.5;font-family:Geist Mono,monospace;font-size:9px;position:absolute;bottom:14px;left:40px}.logo-files{background:var(--paper);border:1px solid var(--rule);margin-top:32px;padding:24px}.logo-files-grid{grid-template-columns:1fr 1fr;gap:16px;margin-top:16px;display:grid}.logo-dont-grid{grid-template-columns:repeat(3,1fr);gap:2px;margin-top:24px;display:grid}.logo-dont-cell{background:var(--paper);border:1px solid var(--rule);text-align:center;flex-direction:column;align-items:center;gap:16px;padding:32px 24px;display:flex;position:relative}.dont-x{color:#c0392b;font-family:Geist Mono,monospace;font-size:11px;position:absolute;top:10px;right:14px}.dont-label{color:var(--muted-fg);letter-spacing:.1em;font-family:Geist Mono,monospace;font-size:10px}.color-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:2px;margin-top:32px;display:grid}.color-swatch{flex-direction:column;display:flex;overflow:hidden}.swatch-block{height:96px;position:relative}.swatch-info{background:var(--paper);border:1px solid var(--rule);padding:14px 16px}.swatch-hex{color:var(--fg);margin-bottom:2px;font-family:Geist Mono,monospace;font-size:12px}.swatch-hsl{color:var(--muted-fg);font-family:Geist Mono,monospace;font-size:10px}.copy-btn{color:#fff;letter-spacing:.1em;cursor:pointer;background:#0000008c;border:1px solid #ffffff1a;padding:4px 8px;font-family:Geist Mono,monospace;font-size:9px;transition:background .2s;position:absolute;bottom:8px;right:8px}.copy-btn:hover{background:#000000d9}.swatch-span2{grid-column:span 2}.gradient-row{grid-template-columns:1fr 1fr;gap:2px;margin-top:32px;display:grid}.gradient-cell{height:120px;position:relative}.gradient-cell-label{letter-spacing:.15em;text-transform:uppercase;color:#ffffff47;font-family:Geist Mono,monospace;font-size:9px;position:absolute;bottom:14px;left:18px}.surface-strip{flex-wrap:wrap;gap:2px;margin-top:32px;display:flex}.surface-cell{flex:1;align-items:flex-end;min-width:100px;height:72px;padding:10px;display:flex}.surface-cell span{letter-spacing:.12em;font-family:Geist Mono,monospace;font-size:9px}.font-specimen{grid-template-columns:1fr 1fr;gap:2px;margin-top:32px;display:grid}.font-spec-cell{background:var(--paper);border:1px solid var(--rule);padding:32px}.font-name{letter-spacing:.2em;text-transform:uppercase;color:var(--muted-fg);margin-bottom:20px;font-family:Geist Mono,monospace;font-size:10px}.font-big{letter-spacing:-.035em;margin-bottom:16px;font-size:48px;font-weight:500;line-height:1}.font-big-mono{letter-spacing:-.01em;margin-bottom:16px;font-family:Geist Mono,monospace;font-size:36px;font-weight:400;line-height:1}.font-chars{color:var(--muted-fg);font-size:13px;line-height:2}.font-chars-mono{color:var(--muted-fg);font-family:Geist Mono,monospace;font-size:12px;line-height:2}.type-table{border-collapse:collapse;width:100%;margin-top:32px}.type-table th{letter-spacing:.18em;text-transform:uppercase;color:var(--muted-fg);text-align:left;border-bottom:1px solid var(--rule);padding:0 0 12px;font-family:Geist Mono,monospace;font-size:9px}.type-table td{border-bottom:1px solid var(--rule);vertical-align:top;padding:20px 20px 20px 0}.type-table td:last-child{padding-right:0}.accent-phrase-demo{background:var(--paper);border:1px solid var(--rule);margin-top:40px;padding:28px 32px}.accent-phrase-demo .big{letter-spacing:-.035em;font-size:clamp(24px,4vw,44px);font-weight:600;line-height:.95}.accent-phrase-demo .big span{color:#c1c8d7;text-shadow:0 0 32px #c1c8d759;font-weight:300}.bg-grid{grid-template-columns:repeat(3,1fr);gap:2px;margin-top:32px;display:grid}.bg-cell{background-position:50%;background-size:cover;height:200px;position:relative;overflow:hidden}.bg-cell:after{content:"";background:linear-gradient(#0000 40%,#0e0c0cd9 100%);position:absolute;inset:0}.bg-cell-label{z-index:1;letter-spacing:.15em;text-transform:uppercase;color:#ffffff80;font-family:Geist Mono,monospace;font-size:9px;position:absolute;bottom:14px;left:14px}.usage-row{grid-template-columns:1fr 1fr;gap:16px;margin-top:24px;display:grid}.usage-card{background:var(--paper);border:1px solid var(--rule);padding:24px}.usage-card h4{margin-bottom:8px;font-size:13px;font-weight:500}.usage-card p{font-size:13px}.patterns-grid{grid-template-columns:1fr 1fr;gap:24px;margin-top:32px;display:grid}.pattern-card{background:var(--paper);border:1px solid var(--rule);padding:28px}.pattern-label{letter-spacing:.18em;text-transform:uppercase;color:var(--muted-fg);margin-bottom:16px;font-family:Geist Mono,monospace;font-size:10px}.pattern-desc{margin-top:16px;font-size:13px}.demo-btn{background:var(--fg);color:var(--bg);cursor:default;align-items:center;gap:10px;padding:14px 22px;font-size:14px;font-weight:500;display:inline-flex}.demo-btn .arrow{font-family:Geist Mono,monospace;font-size:11px}.demo-eyebrow{letter-spacing:.2em;text-transform:uppercase;color:var(--accent);align-items:center;gap:10px;margin-bottom:12px;font-family:Geist Mono,monospace;font-size:10px;display:flex}.demo-eyebrow:before{content:"";background:var(--accent);width:20px;height:1px}.demo-callout{background:var(--bg);border-left:2px solid var(--accent);padding:16px 20px;position:relative}.demo-callout-tag{letter-spacing:.15em;color:var(--muted-fg);padding:4px 8px;font-family:Geist Mono,monospace;font-size:8px;position:absolute;top:0;right:0}.demo-callout-label{letter-spacing:.2em;text-transform:uppercase;color:var(--muted-fg);margin-bottom:6px;font-family:Geist Mono,monospace;font-size:9px}.demo-stat-row{border-top:1px solid var(--rule);grid-template-columns:repeat(3,1fr);gap:24px;padding-top:20px;display:grid}.demo-stat-label{letter-spacing:.2em;text-transform:uppercase;color:var(--muted-fg);margin-bottom:6px;font-family:Geist Mono,monospace;font-size:9px}.demo-stat-val{letter-spacing:-.03em;font-size:22px;font-weight:500}.demo-corner-box{border:1px solid var(--rule);align-items:center;gap:10px;padding:20px 24px;font-size:14px;font-weight:500;display:inline-flex;position:relative}.corner{border-color:var(--accent);border-style:solid;width:8px;height:8px;position:absolute}.corner-tl{border-width:1px 0 0 1px;top:-1px;left:-1px}.corner-br{border-width:0 1px 1px 0;bottom:-1px;right:-1px}.corner-tr{border-width:1px 1px 0 0;top:-1px;right:-1px}.corner-bl{border-width:0 0 1px 1px;bottom:-1px;left:-1px}.coord-demo{background:#0d0c0c;height:90px;margin-bottom:12px;padding:16px;position:relative;overflow:hidden}.og-banner{aspect-ratio:1200/630;background:#0d0c0c;align-items:flex-end;width:100%;display:flex;position:relative;overflow:hidden}.og-mesh{background:radial-gradient(circle at 15% 10%,#c1c8d714,#0000 40%),radial-gradient(circle at 85% 20%,#338fcc0d,#0000 40%);position:absolute;inset:0}.og-content{width:100%;padding:6% 6% 7%;position:relative}.og-tag{letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:3%;font-family:Geist Mono,monospace;font-size:min(1.1vw,11px)}.og-title{letter-spacing:-.035em;max-width:70%;margin-bottom:4%;font-size:min(5vw,52px);font-weight:600;line-height:1}.og-bottom{border-top:1px solid var(--rule);justify-content:space-between;align-items:flex-end;padding-top:2.5%;display:flex}.og-wordmark{letter-spacing:-.02em;font-size:min(1.8vw,18px);font-weight:600}.og-coords{letter-spacing:.15em;color:#3b3735;font-family:Geist Mono,monospace;font-size:min(.8vw,8px)}.wide-banner{border:1px solid var(--rule);background:#0d0c0c;align-items:center;gap:40px;width:100%;height:140px;padding:0 40px;display:flex;position:relative;overflow:hidden}.wide-mesh{background:radial-gradient(circle at 5%,#c1c8d70f,#0000 30%);position:absolute;inset:0}.wide-divider{background:var(--rule);flex-shrink:0;width:1px;height:60px}.wide-wordmark{letter-spacing:-.03em;flex-shrink:0;font-size:20px;font-weight:600;position:relative}.wide-tagline{color:#e9e6e2a6;flex:1;font-size:15px;line-height:1.45;position:relative}.wide-cta{letter-spacing:.12em;text-transform:uppercase;color:var(--accent);flex-shrink:0;font-family:Geist Mono,monospace;font-size:11px;position:relative}.square-banner{aspect-ratio:1;background:#0d0c0c;flex-direction:column;justify-content:flex-end;width:50%;display:flex;position:relative;overflow:hidden}.square-mesh{background:radial-gradient(circle at 20% 0,#c1c8d71a,#0000 50%);position:absolute;inset:0}.square-content{padding:8%;position:relative}.square-tag{letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:5%;font-family:Geist Mono,monospace;font-size:min(1.8vw,10px)}.square-title{letter-spacing:-.03em;margin-bottom:6%;font-size:min(4vw,28px);font-weight:600;line-height:1.05}.square-logo{letter-spacing:-.02em;color:var(--muted-fg);border-top:1px solid var(--rule);padding-top:4%;font-size:min(2.5vw,14px);font-weight:600}.banner-spec{color:var(--muted-fg);margin-top:8px;font-size:12px}.steps{flex-direction:column;margin-top:28px;display:flex}.step{border-bottom:1px solid var(--rule);grid-template-columns:48px 1fr;align-items:start;gap:20px;padding:20px 0;display:grid}.step-num{letter-spacing:.1em;color:var(--accent);padding-top:2px;font-family:Geist Mono,monospace;font-size:10px}.step h4{margin-bottom:4px;font-size:14px;font-weight:500}.step p{font-size:13px}.rules-duo{grid-template-columns:1fr 1fr;gap:2px;margin-top:32px;display:grid}.rules-card{background:var(--paper);border:1px solid var(--rule);padding:28px}.rules-do-label{letter-spacing:.18em;text-transform:uppercase;color:#5eba8c;margin-bottom:20px;font-family:Geist Mono,monospace;font-size:10px}.rules-dont-label{letter-spacing:.18em;text-transform:uppercase;color:#cf5959;margin-bottom:20px;font-family:Geist Mono,monospace;font-size:10px}.rule-item{border-bottom:1px solid var(--rule);grid-template-columns:20px 1fr;align-items:start;gap:12px;padding:16px 0;display:grid}.rule-item:last-child{border-bottom:none}.rule-check{padding-top:2px;font-size:11px}.rule-item h4{margin-bottom:4px;font-size:14px;font-weight:500}.rule-item p{font-size:13px}.code-block{background:var(--paper);border:1px solid var(--rule);color:var(--fg);white-space:pre;margin-top:16px;padding:20px 24px;font-family:Geist Mono,monospace;font-size:12px;line-height:1.7;overflow-x:auto}.code-comment{color:var(--muted-fg)}.code-key{color:#9fb5df}.code-val{color:#70c299}.footer{border-top:1px solid var(--rule);flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-top:40px;padding:40px 0 0;display:flex}.footer-wordmark{letter-spacing:-.02em;margin-bottom:6px;font-weight:600}.footer-label{letter-spacing:.15em;color:var(--muted-fg);font-family:Geist Mono,monospace;font-size:10px}.footer-coords{letter-spacing:.15em;color:#3b3735;font-family:Geist Mono,monospace;font-size:9px}@media (width<=640px){.logo-grid,.font-specimen,.gradient-row,.bg-grid,.patterns-grid,.logo-dont-grid,.usage-row,.rules-duo{grid-template-columns:1fr}.color-grid{grid-template-columns:repeat(2,1fr)}.swatch-span2{grid-column:span 1}.demo-stat-row{grid-template-columns:1fr 1fr}.square-banner{width:100%}.nav{gap:14px}.nav a{font-size:9px}}.nav-links{gap:28px;margin-left:auto;display:flex}.hero-sub{color:var(--muted-fg);max-width:560px;margin-bottom:20px;font-size:15px;line-height:1.7}.hero-meta{gap:12px!important}.dot{color:#504b49}.site-footer{border-top:1px solid var(--rule);padding:40px var(--gutter);align-items:center;gap:20px;display:flex}.site-footer p{letter-spacing:.12em;color:#4b4644;font-family:Geist Mono,monospace;font-size:10px}