/*
 * METASYS 2026 / AUTHKIT MIDNIGHT SYSTEM
 * Entire site: public portfolio, exhibitions, partnership, RSVP, ticket, scanner,
 * merchandise, student studio and committee dashboards.
 * Inspired by the user's four design references; no new dependencies.
 * Preserve all native controls, focus states, actual status colors and WebSockets.
 */

/* 01 / BASE & AMBIENT CATHEDRAL CANVAS */
html{background:var(--color-midnight-canvas);scroll-padding-top:86px}
body,#app{background:var(--color-midnight-canvas);color:var(--color-frost-glow);font-family:var(--font-untitled-sans)}
#app{isolation:isolate;position:relative;min-height:100vh}
#app :is(.dark-section,.light-section,.page-space,.meta-dashboard,.meta-signin,.event-page,.merch-page,.portfolio-public-detail,.portfolio-person-hero,.portfolio-person-work,.sponsor-section,.sponsor-feature,.site-footer){
 color:var(--color-frost-glow);
}
#app :is(.light-section,.meta-dashboard,.sponsor-facts,.sponsor-feature,.merch-page,.event-page,.site-footer,.portfolio-person-work){
 background-color:var(--color-midnight-canvas);
}
#app .container{width:min(var(--page-max-width),calc(100% - 64px))}
#app :is(.site-nav,.site-footer,.meta-dashboard,.event-page,.merch-page){position:relative}
#app .page-space{padding-top:clamp(68px,9vw,var(--section-gap));padding-bottom:clamp(68px,9vw,var(--section-gap))}
#app :is(.section-heading,.meta-sec-heading,.portfolio-panel-head){position:relative}
#app :is(h1,h2,h3,h4){text-wrap:balance}
#app :is(h1,h2,h3){font-family:var(--font-aeonikpro);font-weight:500}
#app :is(.section-heading h2,.meta-sec-heading h2,.portfolio-panel-head h3,.meta-admin-section-head h2,.merch-products h2,.merch-cart h2,.sponsor-split h2,.sponsor-feature h2,.sponsor-contact h2){
 color:var(--color-ice-highlight);font-weight:500;letter-spacing:-.042em;line-height:1.15;
}
#app :is(.eyebrow,.section-eyebrow,.meta-kicker,.section-index,.label,.portfolio-editor-index,.project-card-number){
 font-family:var(--font-dotdigital);font-weight:400;
 font-size:11px;letter-spacing:.12em;line-height:1.5;
 text-transform:uppercase;color:var(--color-moon-mist);
}
#app :is(.eyebrow.blue,.meta-kicker,.event-page .eyebrow){color:var(--color-blueprint-blue)}
#app :is(.muted,.copy,.hint,.portfolio-helper,.event-small,.merch-product p,.merch-cart-line small,.sponsor-opps p,.portfolio-panel-head p,.meta-dash-head p){
 color:var(--color-fog-veil);
}
#app :is(.sponsor-hero p,.sponsor-split p,.sponsor-feature p,.sponsor-contact p,.visit-grid p,.event-intro>p,.event-gate-head p,.merch-heading p,.meta-signin p){
 color:var(--color-moon-mist);
}
#app :is(a,button,input,textarea,select,summary):focus-visible{outline:2px solid #98c0ef;outline-offset:3px}
#app ::selection{background:rgba(152,192,239,.38);color:#fff}
#app a{transition:color .17s ease,background-color .17s ease,border-color .17s ease}
#app .skip-link{background:#d8ecf8;color:#05060f;border-radius:6px}
#app :is(.page-space,.meta-dashboard,.merch-page,.event-page,.meta-signin){overflow:clip}

/* 02 / GLASS NAVIGATION & GHOST PILL ACTIONS */
#app .site-nav{
 z-index:70;background:rgba(5,6,15,.88);border:0;
 box-shadow:inset 0 -1px rgba(186,215,247,.12);
 -webkit-backdrop-filter:blur(24px) saturate(120%);
 backdrop-filter:blur(24px) saturate(120%);
}
#app .nav-inner{height:68px}
#app .logo{font-family:var(--font-aeonikpro);font-weight:500;letter-spacing:-.045em;color:#d8ecf8}
#app .wordmark-glyph{background:linear-gradient(145deg,rgba(216,236,248,.24),rgba(103,145,203,.11));color:#f1f9ff;box-shadow:var(--shadow-subtle);border-radius:6px;transform:none;font-weight:600}
#app .logo small{color:var(--color-fog-veil)}
#app .nav-links{gap:clamp(10px,1.5vw,24px)}
#app .nav-link{color:#b4c2d8;font-size:12px;letter-spacing:.01em}
#app .nav-link:hover,#app .nav-link.active{color:#fff}
#app .nav-link.active{text-decoration:none;box-shadow:0 1px #bad7f7;padding-bottom:5px}
#app .studio-link{color:var(--color-moon-mist)}
#app :is(.button,.meta-logout,.filter-pill,.admin-category-nav button,.menu-toggle,.merch-qty button,.merch-remove){
 border-radius:var(--radius-buttons);
 transition:background-color .17s ease,border-color .17s ease,box-shadow .17s ease,color .17s ease,transform .17s ease;
}
#app .button{
 background:rgba(186,214,247,.075);
 color:#f3f8ff;border:1px solid rgba(186,215,247,.13);
 box-shadow:inset 0 1px 0 rgba(216,236,248,.13),inset 0 0 0 1px rgba(186,215,247,.045);
 font-weight:500;letter-spacing:0;min-height:43px;padding:11px 20px;
}
#app .button.primary,#app .button.dark{
 background:rgba(193,218,249,.14);color:#fff;
 border-color:rgba(199,221,250,.31);
 box-shadow:inset 0 1px 1px rgba(216,236,248,.23),inset 0 12px 23px rgba(168,216,245,.065);
}
#app .button.light,#app .button.ghost{
 background:rgba(186,214,247,.055);color:#d1e4fa;border-color:rgba(186,215,247,.15);
}
#app :is(.button,.meta-logout,.filter-pill,.menu-toggle):hover:not(:disabled){
 background:rgba(186,214,247,.14);border-color:rgba(216,236,248,.32);color:#fff;
}
#app .button.primary:hover:not(:disabled),#app .button.dark:hover:not(:disabled){
 background:rgba(199,224,255,.23);border-color:rgba(221,237,255,.47);
}
#app .button:active:not(:disabled){transform:translateY(1px)}
/* Source reserves vivid violet ONLY for auth / Continue actions. */
#app .meta-signin .button.primary,#app .meta-signin .button.dark,
#app a[href="/api/auth/start"].button.primary{
 color:#fff;background:var(--color-void-violet);border-color:rgba(185,162,255,.48);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 0 36px rgba(102,58,243,.19);
}
#app .meta-signin .button.primary:hover,#app a[href="/api/auth/start"].button.primary:hover{
 background:#7553f7;border-color:#9e87ff;box-shadow:0 0 36px rgba(102,58,243,.34);
}
#app :is(.badge,.portfolio-small-tag,.optional-tag,.merch-order-status){
 border-radius:var(--radius-badges);
 background:rgba(199,211,234,.12);
 color:var(--color-frost-glow);
 box-shadow:var(--shadow-subtle);
}
#app .meta-logout{border-color:rgba(186,215,247,.19);background:rgba(199,211,234,.06);color:var(--color-frost-glow)}

/* 03 / EDGE-TO-EDGE HERO: BRIGHT ICE TYPE, NOT AN IMAGE/LOGO TILE */
#app .wf-hero--immersive{
 background:var(--color-midnight-canvas);
 border-bottom:1px solid rgba(186,215,247,.12);
 min-height:calc(100svh - 68px);
}
#app .wf-hero-backdrop{
 background:
 radial-gradient(ellipse at 50% -34%,rgba(124,145,182,.36),rgba(124,145,182,.08) 32%,transparent 60%),
 radial-gradient(ellipse at 80% 47%,rgba(102,116,194,.20),rgba(44,62,119,.12) 34%,transparent 62%),
 linear-gradient(137deg,#05060f 0%,#0c1223 54%,#05060f 100%);
}
#app .wf-hero-backdrop::before{
 opacity:.5;
 background-image:
 repeating-linear-gradient(90deg,transparent 0,transparent 87px,rgba(186,215,247,.085) 88px,transparent 89px),
 repeating-linear-gradient(0deg,transparent 0,transparent 87px,rgba(186,215,247,.065) 88px,transparent 89px);
 -webkit-mask-image:radial-gradient(ellipse at 64% 44%,#000,transparent 77%);
 mask-image:radial-gradient(ellipse at 64% 44%,#000,transparent 77%);
}
#app .wf-hero-backdrop::after{
 background:linear-gradient(90deg,rgba(5,6,15,.90),rgba(5,6,15,.58) 46%,rgba(5,6,15,.17)),
 linear-gradient(0deg,rgba(5,6,15,.75) 0%,transparent 27%);
}
#app .wf-hero-glow{
 background:radial-gradient(ellipse at center,rgba(170,193,247,.29),rgba(100,119,186,.11) 39%,transparent 72%);
 opacity:.45;
}
#app .wf-hero-sculpture{opacity:.26;filter:none}
#app .wf-hero-orbit{border-color:rgba(186,215,247,.13)}
#app .wf-hero-orbit--inner{border-color:rgba(216,236,248,.19)}
#app .wf-hero-copy{max-width:810px}
#app .wf-hero h1{
 color:#d8ecf8;background:linear-gradient(0deg,#d8ecf8,#98c0ef);
 -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
 font-weight:500;letter-spacing:-.073em;text-shadow:none;
}
#app .wf-hero .eyebrow{color:#c7d3ea}
#app .wf-hero p{color:#d1e4fa;text-shadow:none}
#app .wf-hero .hero-under{border-color:rgba(186,215,247,.15);color:#9da7ba}
#app .wf-hero .hero-actions .button{border-radius:999px;min-height:46px;padding:12px 23px}
#app .wf-hero .hero-actions .button.light{background:rgba(186,214,247,.065);border-color:rgba(186,215,247,.19);color:#f3f7ff;backdrop-filter:blur(12px)}

/* 04 / FROSTED FEATURE SURFACES — ONE COMPONENT LANGUAGE */
#app :is(
 .project-card,.designer-card,.category-card,.sponsor-opps>div,.sponsor-form,
 .meta-dash-metrics>div,.meta-dash-sidebar,.portfolio-workspace,
 .meta-admin-section,.sponsor-admin,.portfolio-project-row,.portfolio-no-projects,
 .portfolio-checklist,.portfolio-preview,.catalogue-empty,.wf-empty,
 .event-panel,.event-stat-row>div,.event-camera,.event-party-summary,
 .merch-product,.merch-cart,.merch-admin-product,.merch-admin-order,.merch-empty,
 #merch-order-detail,.merch-no-image,.portfolio-avatar-preview,.portfolio-drop,
 .sponsor-feature-media,.toast,.admin-access-row,.portfolio-image-preview
){
 background-color:rgba(186,214,247,.035);
 border:1px solid rgba(186,215,247,.12);
 border-radius:var(--radius-cards);
 box-shadow:inset 0 1px 1px rgba(216,236,248,.12),inset 0 20px 46px rgba(168,216,245,.025),0 18px 40px rgba(2,4,12,.36);
 color:var(--color-frost-glow);
}
#app :is(.project-card,.designer-card,.category-card,.merch-product,.sponsor-opps>div){
 transition:transform .22s ease,border-color .2s ease,background-color .2s ease,box-shadow .2s ease;
}
#app :is(.project-card,.designer-card,.category-card,.merch-product,.sponsor-opps>div):hover{
 transform:translateY(-3px);border-color:rgba(186,215,247,.27);
 background-color:rgba(186,214,247,.058);
 box-shadow:inset 0 1px 1px rgba(216,236,248,.19),0 22px 43px rgba(2,4,12,.47);
}
#app :is(.project-media,.designer-photo,.portfolio-person-photo,.merch-image){
 border-radius:var(--radius-cards);overflow:hidden;background-color:#0e1422;
}
#app .merch-product{overflow:hidden}
#app .merch-product .merch-image{border-radius:16px 16px 0 0}
#app :is(.merch-cart,.event-panel,.portfolio-workspace,.meta-admin-section,.sponsor-form){padding:clamp(18px,2.4vw,32px)}
#app .meta-admin-section{padding:0}
#app :is(.meta-admin-section-head,.meta-admin-list,.sponsor-inquiries-list){border-color:rgba(186,215,247,.12)}
#app :is(.section-heading,.portfolio-person-work,.sponsor-section,.portfolio-public-hero){border-color:rgba(186,215,247,.12)}
#app :is(.sponsor-facts,.sponsor-feature){background-color:rgba(186,214,247,.017);border-color:rgba(186,215,247,.13)}
#app .facts-grid>div{border-color:rgba(186,215,247,.12)}
#app .facts-grid strong{color:#d8ecf8;font-family:var(--font-aeonikpro);font-weight:500}
#app .sponsor-feature-media{background:#0b1020;padding:10px}
#app .sponsor-feature-media img{border-radius:10px}

/* 05 / EDITORIAL HEADINGS & EYEBROW LINES */
#app :is(.sponsor-hero h1,.event-intro h1,.event-centered h1,.event-gate-head h1,.meta-signin h1,.merch-heading h1,.merch-receipt h1,.portfolio-public-hero h1,.portfolio-person-hero h1){
 font-family:var(--font-aeonikpro);font-weight:500;
 color:var(--color-ice-highlight);line-height:1.06;
}
#app :is(.sponsor-hero h1,.merch-heading h1,.meta-signin h1,.event-intro h1){
 background:var(--gradient-ice-highlight);
 -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
#app :is(.sponsor-hero,.meta-signin,.event-page,.merch-page){
 background-image:radial-gradient(ellipse 65% 360px at 50% 0,rgba(124,145,182,.13),transparent 73%);
 background-repeat:no-repeat;
}
#app .sponsor-hero{padding-top:clamp(92px,11vw,147px);padding-bottom:clamp(72px,9vw,120px)}
#app .sponsor-opps h3{color:var(--color-frost-glow)}
#app :is(.wf-last,.wf-partner,.section-heading,.meta-sec-heading){border-color:rgba(186,215,247,.12)}
#app .sponsor-contact-grid{gap:clamp(22px,5vw,76px)}
#app :is(.event-meta,.visit-facts>div,.merch-cart-line,.merch-receipt-items>div,.merch-receipt-total,.event-staff-row){
 border-color:rgba(186,215,247,.15);
}
#app .event-meta strong,#app .visit-facts strong{color:var(--color-frost-glow);font-weight:500}
#app .portfolio-person-divider{background:rgba(186,215,247,.12)}

/* 06 / FORMS — NATIVE SEMANTICS, CLEAR FOCUS & LEGIBLE HELP TEXT */
#app :is(
 .form-control input,.form-control textarea,.form-control select,
 .sponsor-form input,.sponsor-form textarea,.sponsor-form select,
 .event-panel input:not([type="checkbox"]):not([type="file"]),
 .event-admin-grid input:not([type="checkbox"]):not([type="file"]),
 .event-panel select,.event-admin-grid select,
 .merch-variant-label select,#merch-checkout-form input,
 .merch-admin label input:not([type="checkbox"]):not([type="file"]),
 .merch-admin label textarea,.merch-admin label select,
 .event-gate-tools select,.admin-access-panel input,
 .portfolio-review-actions textarea
){
 color:#f6f9ff;background:rgba(199,211,234,.075);
 border:1px solid rgba(186,215,247,.20);border-radius:var(--radius-inputs);
 box-shadow:inset 0 1px 1px rgba(216,236,248,.07);
 padding:11px 13px;
}
#app :is(input,textarea,select)::placeholder{color:#9da7ba;opacity:1}
#app :is(input,textarea,select):focus{
 outline:none;border-color:rgba(186,215,247,.58);
 box-shadow:inset 0 0 0 1px rgba(216,236,248,.16),0 0 0 3px rgba(152,192,239,.10);
}
#app :is(input[type="radio"],input[type="checkbox"]):focus-visible{outline:2px solid #98c0ef;outline-offset:3px}
#app input[type="file"]{cursor:pointer}
#app input:disabled,#app textarea:disabled,#app select:disabled{opacity:.55}
#app :is(.form-control label,.event-panel label,.event-admin-grid label,.merch-admin label){color:var(--color-frost-glow)}
#app :is(.form-control label,.event-panel label) small{color:var(--color-fog-veil)}
#app .portfolio-drop{border-style:dashed;border-color:rgba(186,215,247,.26);background:rgba(199,211,234,.035)}
#app .portfolio-drop:hover{border-color:rgba(216,236,248,.42);background:rgba(199,211,234,.095)}
/* Override old light theme native checkbox exceptions with the same midnight semantics. */
#app,#app .light-section,#app .meta-dashboard{
 --metasys-check-bg:rgba(199,211,234,.06);
 --metasys-check-border:rgba(186,215,247,.36);
 --metasys-check-ink:#f4f8ff;
 --metasys-check-panel:rgba(186,214,247,.045);
 --metasys-check-panel-active:rgba(186,214,247,.11);
}
#app input[type="checkbox"]{border-color:rgba(186,215,247,.38);border-radius:6px;background:rgba(199,211,234,.06)}
#app input[type="checkbox"]:checked,#app input[type="checkbox"]:indeterminate{
 background:#6f91d0;border-color:#b6d9fc;
}
#app .metasys-checkbox-label{
 background:rgba(186,214,247,.036);color:#f4f8ff;
 border:1px solid rgba(186,215,247,.17);border-radius:10px;
 box-shadow:inset 0 1px 0 rgba(216,236,248,.12);
}
#app .metasys-checkbox-label:has(> input:checked){
 background:rgba(168,192,236,.13);border-color:rgba(186,215,247,.42);
}
#app .light-section .metasys-checkbox-label small,#app .meta-dashboard .metasys-checkbox-label small{color:#b6c5dc}

/* 07 / AUTH & STUDENT WORKSPACE */
#app .meta-signin-visual{
 display:block;position:absolute;inset:0 0 auto;min-height:600px;pointer-events:none;opacity:.5;
 background:
  radial-gradient(ellipse at 50% 3%,rgba(124,145,182,.21),transparent 52%),
  repeating-linear-gradient(90deg,transparent 0,transparent 95px,rgba(186,215,247,.065) 96px,transparent 97px);
 -webkit-mask-image:linear-gradient(#000,transparent 94%);mask-image:linear-gradient(#000,transparent 94%);
}
#app .meta-signin-inner{position:relative}
#app .meta-signin-panel{position:relative;padding:clamp(24px,4vw,45px);max-width:670px;
 background:rgba(5,6,15,.88);border-radius:16px;
 box-shadow:var(--shadow-subtle-6);border:1px solid rgba(186,215,247,.13);
}
#app .meta-signin-panel h1{letter-spacing:-.052em}
#app .meta-dash-metrics{gap:16px}
#app .meta-dash-metrics>div{padding:24px}
#app .meta-dash-metrics strong{font-family:var(--font-aeonikpro);font-weight:500;color:#d8ecf8;font-size:clamp(23px,2.1vw,32px)}
#app .meta-dash-sidebar{padding:16px 12px;box-shadow:var(--shadow-subtle)}
#app .meta-dash-sidebar>button{border:1px solid transparent;border-radius:10px;color:#bccbe0;min-height:43px}
#app .meta-dash-sidebar>button:is(:hover,.active){
 color:#fff;background:rgba(199,211,234,.11);border-color:rgba(186,215,247,.16);
}
#app :is(.portfolio-checklist,.portfolio-project-row,.portfolio-no-projects,.portfolio-image-preview,.portfolio-avatar-preview,.portfolio-drop){
 background-color:rgba(186,214,247,.037);
}
#app .portfolio-project-row{padding:16px}
#app :is(.portfolio-project-meta,.portfolio-panel-head p,.meta-side-note p,.portfolio-editor-title p){color:var(--color-fog-veil)}
#app .portfolio-progress-track{background:rgba(199,211,234,.12)}
#app .portfolio-progress-track>div{background:linear-gradient(90deg,#779bd6,#d8ecf8)}
#app .portfolio-editor-section{border-color:rgba(186,215,247,.16)}

/* 08 / ADMIN / MULTI-ADMIN / RSVP CONTROL PANEL */
#app .admin-category-nav{gap:8px;border-bottom:1px solid rgba(186,215,247,.13);padding-bottom:15px}
#app .admin-category-nav button{
 background:rgba(199,211,234,.045);border:1px solid rgba(186,215,247,.12);
 border-bottom:1px solid rgba(186,215,247,.12);color:#aebed6;
 border-radius:var(--radius-buttons);font:500 12px/1.3 var(--font-untitled-sans);
 padding:11px 19px;
}
#app .admin-category-nav button:hover{color:#fff;background:rgba(186,214,247,.09)}
#app .admin-category-nav button.active{
 color:#fff;background:rgba(186,214,247,.17);border:1px solid rgba(199,221,250,.32);
 box-shadow:inset 0 1px 1px rgba(216,236,248,.20);
}
#app .meta-admin-section-head h2{font-size:clamp(24px,3vw,33px)}
#app .meta-admin-row{border-color:rgba(186,215,247,.12)}
#app .meta-admin-row strong{color:var(--color-frost-glow)}
#app .admin-access-row{background:transparent;border:0;border-bottom:1px solid rgba(186,215,247,.13);border-radius:0;box-shadow:none}
#app .admin-access-row small{color:var(--color-fog-veil)}
#app .event-stat-row>div{padding:20px}
#app .event-stat-row strong{font-family:var(--font-aeonikpro);font-weight:500;color:#d8ecf8}
#app :is(.event-stat-row span,.merch-cart-heading span,.merch-product-top span){color:var(--color-fog-veil)}
#app .event-camera{background:#05060f;border-color:rgba(186,215,247,.23)}
#app #event-camera-state{background:rgba(5,6,15,.9)}
#app .event-party-summary{background:rgba(168,192,236,.075);color:#d1e4fa;border:1px solid rgba(186,215,247,.20)}
#app .event-rate-intro{color:var(--color-moon-mist)}
#app .event-gate-tools select{background:rgba(199,211,234,.07)}
#app .event-production-status{background:rgba(186,214,247,.045);border-color:rgba(186,215,247,.17);color:#c7d3ea}
/* Keep bright scanner success/warning/error colors meaningful on dark surfaces. */
#app #event-scan-result.event-scan-success{background:#102b1e;color:#c5f9dc;border-color:#308755}
#app #event-scan-result.event-scan-duplicate{background:#2a2213;color:#f6e2ab;border-color:#a88435}
#app #event-scan-result.event-scan-error{background:#2b1616;color:#f6c7c7;border-color:#a34848}
#app #event-scan-result.event-scan-ready{background:rgba(186,214,247,.06);color:#d1e4fa;border-color:rgba(186,215,247,.18)}
#app .event-pass-qr{background:#fff;border-radius:16px;padding:18px}
/* QR must retain true white background for scan contrast. */
#app .event-sandbox-status{color:#ffe3ac}

/* 09 / MERCHANDISE & RECEIPTS */
#app .merch-page{background-color:var(--color-midnight-canvas)}
#app .merch-heading{border-color:rgba(186,215,247,.14)}
#app .merch-heading h1{font-weight:500}
#app .merch-mode,#app .merch-admin-note{
 background:rgba(186,214,247,.07);border:1px solid rgba(186,215,247,.18);
 border-radius:var(--radius-badges);color:var(--color-moon-mist);
}
#app .merch-image{background:radial-gradient(circle at 50% 30%,rgba(124,145,182,.18),#0b1020 80%)}
#app .merch-no-image{background:transparent;border:0;box-shadow:none}
#app .merch-no-image span{font-family:var(--font-aeonikpro);font-weight:500;color:#d8ecf8}
#app .merch-product-body{padding:24px}
#app .merch-cart{background:rgba(5,6,15,.84);backdrop-filter:blur(16px)}
#app .merch-product-top h3{font-weight:500;color:#d8ecf8}
#app .merch-cart-line{border-color:rgba(186,215,247,.12)}
#app .merch-qty button{border-color:rgba(186,215,247,.18);background:rgba(186,214,247,.07);color:#d1e4fa}
#app .merch-order-status:not(.paid):not(.failed):not(.review):not(.pending){color:#d1e4fa}
#app .merch-admin :is(h3,strong){color:#d1e4fa}
#app .merch-admin-product summary{color:#d1e4fa}
#app .merch-admin-product summary span{color:#9da7ba}
#app .merch-admin-product,.merch-admin-product form,.merch-admin-variants,.merch-admin-order,.merch-orders{
 border-color:rgba(186,215,247,.13);
}
#app .merch-admin-product{box-shadow:none;padding:16px;border-radius:12px;margin:10px 0;background:rgba(186,214,247,.045)}
#app .merch-add-variant{background:rgba(186,214,247,.05);border-radius:10px}
#app .merch-admin-order{border-radius:0;background:transparent;box-shadow:none;border:0;border-bottom:1px solid rgba(186,215,247,.15)}
#app .merch-admin-order p,#app .merch-admin-order small{color:#9da7ba}
#app .merch-receipt-total{color:#d8ecf8}
#app .merch-checkout-notice{color:#b4c5dc}

/* 10 / FOOTER, EMPTY STATES, SURFACE DETAIL */
#app .site-footer{
 background:linear-gradient(180deg,rgba(10,14,28,.35),#05060f);
 border-top:1px solid rgba(186,215,247,.12);
}
#app .footer-links a,#app .footer-note,#app .meta-footer-bottom{color:var(--color-fog-veil)}
#app .footer-links a:hover{color:#d8ecf8}
#app .footer-wordmark,#app .footer-brand .footer-wordmark{font-family:var(--font-aeonikpro);font-weight:500;color:#d8ecf8}
#app .footer-brand p,#app .footer-links strong{color:#d1e4fa}
#app .toast{background:rgba(9,12,26,.97);border-color:rgba(186,215,247,.27);backdrop-filter:blur(16px)}
#app :is(.empty,.showcase-empty,.catalogue-empty,.wf-empty){color:#c7d3ea}
#app .filter-pill{background:rgba(186,214,247,.05);border:1px solid rgba(186,215,247,.14);color:#c7d3ea}
#app .filter-pill:is(:hover,.selected){background:rgba(186,214,247,.16);color:#fff;border-color:rgba(186,215,247,.30)}

/* 11 / RESPONSIVE, ACCESSIBLE FALLBACK */
@media(max-width:980px){
 #app .nav-inner{gap:16px}
 #app .nav-links{gap:11px;margin-left:8px}
 #app .container{width:min(var(--page-max-width),calc(100% - 42px))}
}
@media(max-width:790px){
 #app .container{width:calc(100% - 36px)}
 #app .nav-inner{width:calc(100% - 36px)}
 #app .wf-hero--immersive{min-height:max(690px,calc(100svh - 68px))}
 #app .wf-hero-sculpture{opacity:.18}
 #app .meta-dashboard{padding-top:42px}
 #app :is(.meta-admin-section-head,.event-admin-content){padding-inline:20px}
 #app .merch-cart{position:static}
}
@media(max-width:500px){
 #app .container{width:calc(100% - 32px)}
 #app .nav-inner{width:calc(100% - 32px)}
 #app .wf-hero--immersive{min-height:max(680px,calc(100svh - 68px))}
 #app .wf-hero h1{font-size:clamp(52px,12.3vw,69px)}
 #app .wf-hero .hero-actions .button{border-radius:999px}
 #app .event-panel{padding:21px}
 #app .meta-signin-panel{padding:26px}
 #app .merch-product-body{padding:19px}
 #app .admin-category-nav button{padding:10px 13px;font-size:11px}
 #app .meta-dash-metrics>div{padding:17px}
}
@media(prefers-reduced-motion:reduce){
 #app :is(.button,.project-card,.designer-card,.category-card,.merch-product,.sponsor-opps>div,.nav-link){transition:none!important;transform:none!important}
}
@supports not (backdrop-filter:blur(8px)){
 #app .site-nav{background:#0b0e1a}
 #app .merch-cart{background:#0b0e1a}
}