/*
 * METASYS / READABILITY PASS — 24 OCT 2026
 * Final contrast layer (last CSS). Repairs light editorial surfaces inheriting
 * light text from the previous Midnight theme. Preserve dark-alert semantics,
 * QR quiet zones, printed sheets and the intentionally inverted dark footer.
 *
 * Text on concrete (#f4f4f4) / ash (#eaeaea):
 *   primary #201d1d, supporting #4f4c4c, metadata #555151.
 * Dark surfaces (#151313): white/gray lettering. Controls use >=4.5:1
 * normal-text contrast; do not hide real status or focus indicators.
 */
:root{
 --contrast-ink:#201d1d;
 --contrast-subtle:#4f4c4c;
 --contrast-label:#555151;
 --contrast-light:#f4f4f4;
 --contrast-panel:#eaeaea;
 --contrast-dark:#151313;
 --metasys-check-ink:#201d1d;
 --metasys-check-panel:#efefef;
 --metasys-check-bg:#fff;
 --metasys-check-border:#747474;
 --metasys-check-panel-active:#e6f6dc;
}
#app :is(.page-space,.light-section,.dark-section,.catalogue-page,.portfolio-public-detail,.portfolio-person-hero,
 .portfolio-person-work,.portfolio-workspace,.meta-dashboard,.meta-signin,.event-page,.merch-page,
 .sponsor-page,.sponsor-section,.companion-page,.companion-admin,.companion-editor){
 color:var(--contrast-ink);
}
#app :is(.page-space,.light-section,.dark-section,.catalogue-page,.portfolio-public-detail,.portfolio-person-hero,
 .portfolio-person-work,.meta-dashboard,.meta-signin,.event-page,.merch-page,.sponsor-page,.sponsor-section){
 --metasys-check-ink:#201d1d;
 --metasys-check-panel:#efefef;
 --metasys-check-border:#747474;
 --metasys-check-panel-active:#e6f6dc;
}
/* Muted sitewide text on LIGHT surfaces: avoid historic #aaa / #c7d3ea
   which can approach 1:1 contrast on concrete. */
#app :is(
 .wf-hero p,.wf-hero .hero-under,
 .section-heading p,.section-label,.section-eyebrow,
 .card-sub,.designer-info span,.project-card-number,
 .catalogue-meta,.catalogue-empty p,.wf-empty p,
 .sponsor-split p,.sponsor-feature p,.sponsor-contact p,.sponsor-opps p,
 .sponsor-contact-grid p,.sponsor-split p:first-child,
 .sponsor-inquiry-head span,.sponsor-inquiry-body,.sponsor-inquiry-actions>span,
 .portfolio-public-hero .breadcrumbs,.portfolio-person-hero .breadcrumbs,
 .portfolio-public-intro,.portfolio-public-meta span,.portfolio-case-kicker,
 .portfolio-case-section p,.portfolio-person-discipline,.portfolio-person-hero p,
 .portfolio-case-section .copy,.portfolio-public-image-grid figcaption,
 .meta-signin p,.meta-signin .meta-fine,.meta-dash-head p,.meta-side-note p,
 .portfolio-panel-head p,.portfolio-editor-title p,.portfolio-editor-index,
 .portfolio-aside-note,.portfolio-project-meta,.portfolio-small-tag,
 .portfolio-no-projects p,.portfolio-check,.portfolio-drop small,
 .portfolio-review-summary p,.portfolio-completion-label,
 .portfolio-review-story p,.portfolio-review-actions p,
 .meta-admin-section-head p,.meta-admin-row small,.meta-list-empty,
 .admin-access-row small,.sponsor-admin p,.demo-admin-note,
 .event-intro>p,.event-gate-head p,.event-meta span,.event-small,
 .event-rate-intro,.event-code,.event-pass p,.event-stat-row span,
 .event-attendee-row small,.event-attendee-row time,
 .merch-heading p,.merch-variant-label,.merch-product p,.merch-cart-line small,
 .merch-cart-heading span,.merch-checkout-notice,.merch-product-top span,
 .merch-admin-order p,.merch-admin-order small,.merch-order-meta small,
 .merch-receipt small,.merch-receipt p
){color:var(--contrast-subtle)}
/* Brand/editorial headlines and verified text must never retain an old
   transparent dark-gradient fill on a white background. */
#app :is(.wf-hero h1,.sponsor-hero h1,.meta-signin h1,.event-intro h1,
 .event-centered h1,.event-gate-head h1,.merch-heading h1,
 .portfolio-public-hero h1,.portfolio-person-hero h1){
 color:var(--contrast-ink);
 -webkit-text-fill-color:var(--contrast-ink);
 background-image:none;
 text-shadow:none;
}
#app :is(.sponsor-opps h3,.portfolio-case-section h2,
 .portfolio-public-gallery h2,.portfolio-public-next h2,
 .portfolio-review-story h4,.portfolio-review-summary h3,
 .merch-products h2,.merch-cart h2,.companion-editor h3,
 .meta-admin-section h2,.event-panel h2){color:var(--contrast-ink)}
/* Breadcrumbs, links, read-more arrows — always recognizable on light. */
#app :is(.portfolio-public-hero .breadcrumbs a,.portfolio-person-hero .breadcrumbs a,
 .portfolio-public-meta a,.portfolio-next-project a,
 .sponsor-inquiry-head span a,.catalogue-empty>a,.wf-empty>a,
 .companion-zone a,.companion-favourite-grid a,.merch-admin-order a){
 color:var(--contrast-ink);
 text-decoration-color:#5b5555;
 text-underline-offset:4px;
}
#app :is(.portfolio-public-hero .breadcrumbs a,.portfolio-person-hero .breadcrumbs a,
 .portfolio-public-meta a,.sponsor-inquiry-head span a):hover{color:#4221a9}
/* Preserve low-chroma image surfaces, but make galleries readable. */
#app .portfolio-public-gallery{background:var(--contrast-panel);color:var(--contrast-ink)}
#app .portfolio-public-image-grid figure{background:#dedede}
#app .portfolio-public-image-grid figcaption{color:var(--contrast-subtle)}
#app :is(.portfolio-case-section,.portfolio-public-next){background:var(--color-concrete);color:var(--contrast-ink);border-color:#d2d2d2}
#app .portfolio-public-meta{border-color:#c9c9c9}
#app .portfolio-person-divider{background:#c7c7c7}
/* Studio, committee and status surfaces. */
#app :is(.portfolio-workspace,.portfolio-checklist,.portfolio-no-projects,
 .portfolio-project-row,.portfolio-review-card,.portfolio-review-expanded,
 .meta-admin-section,.sponsor-admin,.meta-dash-sidebar,.meta-dash-metrics>div,
 .portfolio-drop,.portfolio-preview-modal,.meta-crop-dialog,
 .event-panel,.merch-cart,.merch-product,.merch-receipt){
 color:var(--contrast-ink);
}
#app :is(.portfolio-review-card,.portfolio-no-projects,.portfolio-checklist,
 .portfolio-project-row,.portfolio-image-preview,.portfolio-avatar-preview,
 .portfolio-review-expanded,.portfolio-drop){background:#e6e6e6;border-color:#d0d0d0}
#app .portfolio-drop{color:var(--contrast-ink);border-color:#888;background:#e7e7e7}
#app .portfolio-drop:hover{background:#dadada;border-color:#545454;color:var(--contrast-ink)}
#app .portfolio-progress-line,#app .portfolio-check.is-done{color:var(--contrast-ink)}
#app .portfolio-check.is-done>span:first-child{color:#315eaa}
#app .status-chip{color:var(--contrast-ink)}
#app .portfolio-review-expanded>summary{color:var(--contrast-ink)}
#app .portfolio-review-expanded[open]>summary{background:#dadada}
#app :is(.portfolio-review-story h4,.portfolio-review-actions label,
 .portfolio-review-summary strong,.portfolio-project-info strong,
 .portfolio-checklist strong){color:var(--contrast-ink)}
#app :is(.portfolio-review-story section,.portfolio-review-actions,
 .portfolio-editor-section,.portfolio-editor-actions,.portfolio-review-expanded){border-color:#c7c7c7}
#app .portfolio-progress-track{background:#c0c0c0}
#app .portfolio-review-filters button{color:var(--contrast-ink);border-color:#bcbcbc}
#app .portfolio-review-filters button:is(.active,:hover){background:var(--contrast-dark);color:var(--contrast-light);border-color:var(--contrast-dark)}
#app .sponsor-inquiry-actions button{color:var(--contrast-ink);border-color:#9b9b9b;background:#f4f4f4}
#app .sponsor-inquiry-actions button:hover{background:var(--contrast-dark);color:var(--contrast-light);border-color:var(--contrast-dark)}
#app #admin-demo-status{color:var(--contrast-ink)}
#app .admin-demo-panel .demo-admin-note{color:var(--contrast-subtle)}
#app .meta-signin-panel{background:var(--contrast-panel);color:var(--contrast-ink)}
#app :is(.form-control label,.sponsor-form label,.merch-admin label,
 .event-panel label,.event-admin-grid label,.portfolio-review-actions label){
 color:var(--contrast-ink);
}
#app :is(.form-control input,.form-control textarea,.form-control select,.form-control select option,
 .sponsor-form input,.sponsor-form textarea,.sponsor-form select,
 .merch-variant-label select,.event-panel input:not([type="checkbox"]),
 .event-admin-grid input:not([type="checkbox"]),.event-panel select,
 .event-admin-grid select,.merch-admin label input:not([type="checkbox"]):not([type="file"]),
 .merch-admin label textarea,.merch-admin label select,
 .event-gate-tools select,.portfolio-review-actions textarea,
 #merch-checkout-form input,#merch-checkout-form textarea,
 .admin-access-panel input){
 color:var(--contrast-ink);background:#fff;border-color:#9b9b9b;
 -webkit-text-fill-color:var(--contrast-ink);
}
#app :is(input,textarea,select)::placeholder{color:#666;opacity:1}
#app :is(.form-control input,.form-control textarea,.form-control select,.event-panel input,
 .event-admin-grid input,.merch-variant-label select,.sponsor-form input,.sponsor-form textarea):focus{
 border-color:#5137ac;outline:2px solid #5137ac;outline-offset:1px;box-shadow:none
}
#app .metasys-checkbox-label{color:var(--contrast-ink);background:#ededed;border-color:#bdbdbd}
#app .metasys-checkbox-label:has(input:checked){color:var(--contrast-ink);background:#e6f6dc;border-color:#639536}
#app .metasys-checkbox-label small{color:var(--contrast-subtle)}
/* Ticket copy and date/price labels: old forced-white text became invisible. */
#app .event-ticket-party{color:var(--contrast-ink)!important}
#app :is(.event-meta strong,.visit-facts strong,.event-pass strong,
 .event-attendee-row strong,.event-stat-row strong){color:var(--contrast-ink)}
#app .event-category-grid small{color:#43318d}
#app :is(#event-rsvp-feedback,#event-admin-feedback,#event-walkin-result){color:#533923}
#app .event-party-summary{background:#e0e0e0;color:var(--contrast-ink)}
#app .event-party-summary.event-party-invalid{background:#f7dfd8;color:#772a25;border-color:#a65e4b}
#app .event-payment-row small{color:var(--contrast-subtle)}
/* Alert, QR camera and gate states stay genuinely dark for safety. */
#app .event-camera,#app .event-camera-state{color:#f5f5f5}
#app .event-camera-state[data-state="scanning"]{color:#d8fce8}
#app .event-camera-state[data-state="checking-ticket"],
#app .event-camera-state[data-state="starting-camera"]{color:#fff0ca}
#app :is(#event-scan-result.event-scan-success,#event-scan-result.event-scan-duplicate,
 #event-scan-result.event-scan-error){color:inherit}
#app #event-scan-result.event-scan-success{color:#c5f9dc;background:#102b1e}
#app #event-scan-result.event-scan-duplicate{color:#f6e2ab;background:#2a2213}
#app #event-scan-result.event-scan-error{color:#f6c7c7;background:#2b1616}
#app .event-sandbox-warning{background:#30240d;color:#f7da94}
#app .event-sandbox-warning :is(h2,h3,strong,p,small){color:#ffdf99}
#app .event-sandbox-status{background:#24211a;color:#ffdf97}
#app .event-pass-qr,#app .event-payqr{background:#fff!important;color:#151313}
/* Store, fulfilment, and paid/pending/failed status semantics on ash. */
#app :is(.merch-admin :is(h3,strong),.merch-admin-product summary,
 .merch-variant-edit strong,.merch-receipt-total,.merch-cart-line strong,
 .merch-product-top h3,.merch-variant-label){color:var(--contrast-ink)}
#app .merch-admin-product summary span{color:var(--contrast-subtle)}
#app .merch-no-image{color:var(--contrast-ink)}
#app .merch-order-status{background:#e5e5e5;color:var(--contrast-ink);border:1px solid #a9a9a9}
#app .merch-order-status.paid{background:#dcefe3;color:#174d31;border-color:#58906c}
#app .merch-order-status.pending{background:#fff0d0;color:#6c490e;border-color:#ae8b43}
#app .merch-order-status:is(.failed,.review){background:#f5dddd;color:#832929;border-color:#b86c6c}
#app .merch-remove{color:#8d2424}
#app :is(.merch-admin-note,.merch-mode){color:var(--contrast-ink);background:var(--contrast-panel)}
#app .merch-qty button{color:var(--contrast-ink)}
/* Special dark tiles and the footer must remain light on dark. */
#app :is(.category-card,.wf-partner-mark){background:var(--contrast-dark);color:var(--contrast-light)}
#app :is(.category-card,.wf-partner-mark) :is(h2,h3,h4,p,span,strong,small,a,.category-glyph){
 color:var(--contrast-light)
}
#app .category-card :is(.category-number,.category-glyph){color:#d9d9d9}
#app .site-footer{background:var(--contrast-dark);color:var(--contrast-light)}
#app .site-footer :is(h1,h2,h3,h4,strong,.footer-wordmark,.footer-brand p,.footer-links strong){
 color:var(--contrast-light)
}
#app .site-footer :is(.footer-links a,.footer-note,.footer-wordmark span,.meta-footer-bottom){
 color:#bdbdbd
}
#app .site-footer .footer-links a:is(:hover,:focus-visible){color:#fff}
#app .toast{background:var(--contrast-dark);color:var(--contrast-light);border-color:#515151}
/* Navbar and hover dropdown: explicit light-on-light protection. */
#app .site-nav,#app .nav-group.has-subnav>.nav-mobile-sub{background:#fff;color:#201d1d}
#app .nav-link,#app .studio-link{color:#383535}
#app .nav-link:is(.active,:hover,:focus-visible),#app .studio-link:hover{color:#111}
#app .nav-group.has-subnav>.nav-mobile-sub>.nav-mobile-link{color:#343232}
#app .nav-group.has-subnav>.nav-mobile-sub>.nav-mobile-link:is(:hover,.active,:focus-visible){
 background:#ededed;color:#111
}
#app .nav-rsvp,#app .nav-rsvp:is(:hover,.active,:focus-visible){
 color:#fff;-webkit-text-fill-color:#fff
}
@media(max-width:1100px){
 #app .nav-links.open{background:#fff;color:#201d1d}
 #app .nav-group>.nav-link{color:#302e2e}
 #app .nav-mobile-link{color:#414141}
 #app .nav-mobile-link:is(:hover,.active,:focus-visible){color:#111;background:#e8e8e8}
}
@media(prefers-reduced-motion:reduce){
 #app :is(.nav-link,.nav-mobile-link,.site-footer a){transition:none!important}
}


/* Crop / private preview modals retain dark image-cropping surfaces, but
   their light toolbars and descriptive copy need explicit foregrounds. */
#app :is(.portfolio-preview-excerpt,.portfolio-preview-byline,
 .portfolio-preview-content section p,.sponsor-inquiry-body>span,
 .sponsor-inquiry-head span a,.portfolio-review-story h4,
 .meta-crop-head span,.meta-crop-head p,.meta-crop-controls label,
 .meta-crop-footer small){color:var(--contrast-subtle)}
#app :is(.meta-crop-head button,.meta-crop-controls button,.meta-crop-footer button){
 background:#f4f4f4;border:1px solid #999;color:var(--contrast-ink);border-radius:var(--radius-ui)
}
#app :is(.meta-crop-head button,.meta-crop-controls button,.meta-crop-footer button):hover{
 background:#dcdcdc;border-color:#555;color:var(--contrast-ink)
}
#app .meta-crop-footer .meta-crop-primary{background:var(--contrast-dark);border-color:var(--contrast-dark);color:#fff}
#app .portfolio-preview-toolbar{background:#242424;color:#fff}
#app .portfolio-preview-toolbar button{background:#242424;color:#fff;border-color:#888}
#app .portfolio-public-next p,#app .portfolio-public-next small{color:var(--contrast-subtle)}
#app .event-sandbox-page h1::after{color:#684419}
#app .sponsor-opps span,#app .sponsor-contact-grid .eyebrow{color:var(--contrast-label)}
/* The blue DEMO chip remains white-on-dark; keep legacy colored statuses. */
#app .demo-site-banner{background:#102348;color:#eaf0ff}
#app .demo-site-banner span{color:#d3e1ff}
#app .demo-card-badge{background:#146ef5;color:#fff}