/* NS Viewport Studio — Base v1.8.0 */
*,*::before,*::after{box-sizing:border-box}
html{font-size:100%;scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;background:var(--color-canvas)}
body{margin:0;font-family:var(--font-sans);background:var(--color-canvas);color:var(--color-text-primary);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;line-height:var(--leading-body)}
main{min-width:0}
h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
button:disabled,[aria-disabled="true"]{cursor:not-allowed}
input,select,textarea{min-width:0}
img,svg,video,canvas{display:block;max-width:100%}
svg{flex-shrink:0}
fieldset{min-width:0;margin:0;padding:0;border:0}
table{border-collapse:collapse;border-spacing:0}

/* Native control hints */
:where(input,select,textarea){accent-color:var(--color-accent)}
:where(input,textarea)::placeholder{color:var(--color-text-faint);opacity:1}

/* Scrollbars */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--color-border-strong) 76%,transparent);border:2px solid transparent;background-clip:padding-box;border-radius:var(--radius-full)}
::-webkit-scrollbar-thumb:hover{background:var(--color-border-strong);border:2px solid transparent;background-clip:padding-box}
*{scrollbar-width:thin;scrollbar-color:var(--color-border-strong) transparent}

/* Selection and focus */
::selection{background:var(--color-selection);color:var(--color-text-primary)}
:focus{outline:none}
:focus-visible{outline:3px solid var(--color-border-focus);outline-offset:3px;border-radius:max(4px,var(--radius-xs))}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{position:relative;z-index:1}

/* Accessible skip navigation */
.skip-link{position:fixed;top:10px;left:12px;z-index:10000;transform:translateY(-180%);padding:.72rem 1rem;border:2px solid var(--color-border-focus);border-radius:var(--radius-sm);background:var(--color-surface-overlay);color:var(--color-text-primary);box-shadow:var(--shadow-md);font-weight:750;transition:transform var(--duration-fast) var(--ease-emphasized)}
.skip-link:focus{transform:translateY(0);outline:none}

/* Screen-reader only */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Animation primitives */
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}
@keyframes pulseDot{0%,100%{opacity:1}50%{opacity:.58}}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--color-accent) 48%,transparent)}100%{box-shadow:0 0 0 10px transparent}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes shimmer{0%{background-position:-200% center}100%{background-position:200% center}}
@keyframes slideRight{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideLeft{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:translateX(0)}}

/* Utilities */
.u-mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.u-g-text{background:var(--gradient-brand-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.u-g-purple{background:linear-gradient(135deg,#9b8cff,var(--color-accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.u-fade-up{opacity:0;transform:translateY(8px);transition:opacity var(--duration-slow) var(--ease-standard),transform var(--duration-slow) var(--ease-standard)}
.u-fade-up.is-visible{opacity:1;transform:none}
.u-d1{animation-delay:.06s}.u-d2{animation-delay:.12s}.u-d3{animation-delay:.18s}.u-d4{animation-delay:.24s}.u-d5{animation-delay:.30s}.u-d6{animation-delay:.36s}.u-d7{animation-delay:.42s}.u-d8{animation-delay:.48s}
.u-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.u-wrap-balance{text-wrap:balance}
.u-reading-width{max-width:var(--reading-max)}

/* Reduced motion and forced colors */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important;transition-delay:0ms!important}
}
@media (forced-colors:active){
  :focus-visible{outline:3px solid Highlight}
  button,a,input,select,textarea{forced-color-adjust:auto}
}