/* Final responsive pass: protected gutters, sensor depth, and chroma hover. */
:root{--tilt-content-x:0px;--tilt-content-y:0px}
.grit-shell .atmosphere{z-index:0}
.grit-shell .atmosphere:before{content:"";position:absolute;z-index:-1;inset:-140px;background-image:radial-gradient(circle,rgba(178,202,213,.2) 0 .7px,transparent 1px);background-size:24px 24px;opacity:.18;filter:blur(.35px);translate:var(--crt-x-far) var(--crt-y-far);will-change:translate}
.dust-canvas{z-index:1}
.site-shell>header,.site-shell>section,.site-shell>footer{position:relative;z-index:2}

@media(max-width:719px){
  .site-shell{padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
  .preview-grid>.specimen-card,.foundation-grid>.specimen-card,.component-board>.specimen-card,.article-card,.behavior-strip,.type-board>div{padding-left:0;padding-right:0}
  .section-heading,.intro,.topbar,footer{position:relative;translate:calc(var(--tilt-content-x)*.34) calc(var(--tilt-content-y)*.34)}
  .specimen-card,.article-card,.type-board,.editorial-aside,.behavior-strip{translate:calc(var(--tilt-content-x)*-.2) calc(var(--tilt-content-y)*-.2)}
  .static-far{translate:var(--crt-x-far) var(--crt-y-far)}
  .static-mid{translate:var(--crt-x-mid) var(--crt-y-mid)}
  .static-near{translate:var(--crt-x-near) var(--crt-y-near)}
  .static-layer{inset:-140px}
  .site-shell{perspective:900px}
  .tilt-control{position:fixed;z-index:30;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));min-height:40px;padding:0 13px;border:1px solid rgba(84,246,200,.42);color:var(--mint);background:rgba(8,14,19,.82);backdrop-filter:blur(9px);font:600 9px/1 var(--font-geist-mono),monospace;letter-spacing:.13em}
  .tilt-control.active{border-color:rgba(84,246,200,.18);color:rgba(84,246,200,.62)}
}

@media(min-width:720px){.tilt-control{display:none}}

@media(hover:hover){
  .signal-link:hover:not(.hit){animation:none;text-shadow:-.65px 0 rgba(255,95,183,.72),.65px 0 rgba(76,167,255,.72)}
  .signal-link:hover:not(.hit):before,.signal-link:hover:not(.hit):after{content:none}
}

.specimen-card,.article-card,.index-card,.editorial-aside details,.status-card,.behavior-strip,.type-board,.type-board>div{min-height:0;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;clip-path:none!important}
.specimen-card:after,.article-card:after{display:none!important}
.preview-grid>.specimen-card,.foundation-grid>.specimen-card,.component-board>.specimen-card,.article-card,.behavior-strip{padding-top:32px;padding-bottom:38px}
.kit-section{border-top:1px solid rgba(220,232,236,.11)}
.feature-card{display:block;min-height:0}
.feature-card .component-label{position:static;margin:0 0 30px}
.feature-card h2{margin-top:0}

.index-card{position:relative;padding:28px!important;border:1px solid transparent!important;border-image:var(--vapor) 1!important}

.component-label,.section-index,.article-meta span,.status-card strong,.behavior-strip>div>span,.field-label,.radio-group legend,.type-meta span{color:transparent;background:var(--vapor);background-size:180% 180%;background-clip:text;-webkit-background-clip:text;animation:gradient-drift 12s ease-in-out infinite alternate}
.demo-nav .active,.radio-group input:checked+span,.toggle.on+span,[aria-current="page"]{color:var(--mint)}
.article-rule,.gradient-bar{filter:saturate(1.15) brightness(1.1)}

/* The field stays continuously painted; only content in the outer 100px carries signal separation. */
.compose{opacity:.84!important;transform:none!important;filter:none!important;text-shadow:-2px 0 rgba(255,95,183,.52),2px 0 rgba(76,167,255,.48),.7px 0 rgba(84,246,200,.28)!important;transition:opacity .2s ease,text-shadow .22s ease!important}
.compose.edge-top{opacity:.94!important;filter:none!important;text-shadow:-.75px 0 rgba(255,95,183,.48),.75px 0 rgba(76,167,255,.45)!important;transition-duration:.12s!important}
.compose.edge-bottom{opacity:.84!important;filter:none!important;text-shadow:-2px 0 rgba(255,95,183,.52),2px 0 rgba(76,167,255,.48),.7px 0 rgba(84,246,200,.28)!important}
.compose.composed{opacity:1!important;filter:none!important;text-shadow:none!important;transition-delay:.04s!important}

/* Keep fixed viewport textures inside the viewport while the document scrolls. */
.atmosphere-canvas{transform:translate(var(--crt-x-far),var(--crt-y-far)) scale(1.18)!important;backface-visibility:hidden;will-change:transform;filter:none!important}
.smoke-one{translate:var(--crt-x-far) var(--crt-y-far)!important}
.smoke-two{translate:var(--crt-x-mid) var(--crt-y-mid)!important}
.scratch-field{transform:none!important}
.atmosphere,.crt-optics,.phosphor,.moire,.glass-glare{backface-visibility:hidden;transform:translateZ(0)}
.corner{backdrop-filter:none!important}
@media(max-width:719px){.moire{opacity:.008!important}.phosphor{opacity:.035!important}.smoke{animation:none!important;filter:blur(48px)!important}.glass-glare{filter:none!important;opacity:.1!important}}

/* Optical falloff without drawing a literal curved television outline. */
.screen-bow{inset:0;border:0;border-radius:0;box-shadow:inset 0 38px 52px -58px rgba(210,230,236,.2),inset 0 -44px 64px -72px rgba(0,3,7,.75)}
.screen-bow:before,.screen-bow:after{display:none}
.edge-aberration{border-radius:0}

.icon-grid{align-items:start}
.icon-grid .ui-icon{aspect-ratio:auto;min-height:72px;padding-bottom:22px}
.icon-grid .ui-icon small{left:0;right:0;bottom:9px;width:auto;height:auto;overflow:visible;clip:auto;color:var(--muted);font:500 8px/1 var(--font-geist-mono),monospace;letter-spacing:.1em;text-transform:uppercase}
.ui-icon.contact i{left:12px;top:13px;width:20px;height:15px;border:1px solid currentColor}
.ui-icon.contact b{left:13px;top:14px;width:18px;height:12px;border:0;background:linear-gradient(35deg,transparent 47%,currentColor 48% 52%,transparent 53%),linear-gradient(-35deg,transparent 47%,currentColor 48% 52%,transparent 53%);transform:none}
.ui-icon.share i{left:12px;top:20px;width:20px;height:14px;border:1px solid currentColor;border-top:0;box-shadow:none}
.ui-icon.share b{left:21px;top:11px;width:1px;height:15px;border:0;background:currentColor;transform:none}
.ui-icon.share b:before{content:"";position:absolute;left:-4px;top:0;width:7px;height:7px;border-left:1px solid currentColor;border-top:1px solid currentColor;transform:rotate(45deg)}

@media(prefers-reduced-motion:reduce){
  .section-heading,.intro,.topbar,footer,.specimen-card,.article-card,.type-board,.editorial-aside,.behavior-strip,.static-far,.static-mid,.static-near{translate:none}
  .tilt-control{display:none}
  .compose,.compose.composed{opacity:1!important;filter:none!important;text-shadow:none!important}
}