/* =====================================================================
   STUDIO THEME, "Kraft" design (matches the paperbagged.com homepage, css/home.css)
   Loaded by head24.php when resolve_site_skin() === 'studio' and
   studio_design() === 'kraft' (studio-midnight.css is the earlier dark look).
   Like luxury.css it layers on top of style.css. The directory templates were
   written for a dark neon skin, so this file:
     1. remaps the neon tokens to dark, readable ink colours on paper,
     2. switches off every glow, gradient, scanline, blur and animation,
     3. restyles the shared components as flat printed surfaces (2px ink
        rules, small radii, hard offset shadows, kraft-brown masthead),
     4. catches the inline light-on-dark colours the templates hard-code
        (section 15) so text stays readable on paper.
   Inline styles win over normal rules, so most rules here need !important.
   ===================================================================== */

/* ---- 1. Tokens (override head24's inline :root) ---- */
:root {
    --paper:    #f5f4f0;
    --white:    #ffffff;
    --ink:      #1a1714;
    --ink-2:    #3d3832;
    --ink-3:    #5a534a;
    --hair:     #d6d0c4;
    --kraft:    #c29a6b;
    --kraft-lt: #ecdfcc;
    --kraft-dk: #7a5530;
    --turq:     #0c6a65;
    --turq-dk:  #084b47;
    --turq-lt:  #dcefec;
    --copper:   #9c3f19;
    --green:    #2c6a33;
    --red:      #b3261e;
    --gold:     #7a5a00;
    --rule:     2px solid var(--ink);
    --font-slab: "Zilla Slab", "Rockwell", "Roboto Slab", Georgia, serif;
    --font-sans: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
    --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;

    /* the neon tokens every template and inline style uses */
    --bg-color:      var(--paper);
    --neon-blue:     var(--turq);
    --neon-pink:     var(--copper);
    --neon-green:    var(--green);
    --neon-red:      var(--red);
    --neon-yellow:   var(--gold);
    --neon-orange:   var(--kraft-dk);
    --terminal-green:var(--green);
    --bag-color:     var(--kraft-dk);
    --text-main:     var(--ink);
    --text-muted:    var(--ink-3);
    --heading-color: var(--ink);
    --link-color:    var(--turq);
    --link-hover:    var(--turq-dk);
    --card-bg:       var(--white);
    --card-border:   var(--ink);
    --glass-bg:      var(--white);
    --nav-bg:        var(--kraft);
    --nav-text:      var(--ink);
    --footer-bg:     var(--paper);
    --footer-text:   var(--ink-2);
    --input-bg:      var(--white);
    --input-text:    var(--ink);
    --input-border:  var(--ink);
    --font-heading:  var(--font-slab);
    --font-body:     var(--font-sans);
}

/* ---- 2. Page: plain paper, no atmosphere ---- */
html, body, body.matrix-theme { background: var(--paper) !important; color: var(--ink) !important; }
body::before, body::after, body.matrix-theme::before, body.matrix-theme::after { display: none !important; }
#three-bg, .scanlines, .noise-overlay, .hero-grid, #hero::before { display: none !important; }
::selection { background: var(--kraft-lt); color: var(--ink); }

/* ---- 3. Switch off the neon ---- */
*, *::before, *::after {
    text-shadow: none !important; box-shadow: none !important; -webkit-text-stroke: 0 !important; paint-order: normal !important;
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
/* :where() keeps this at zero specificity so the Kraft motion below can opt back in */
:where(*:not(.spinner-border):not(.shake)) { animation: none !important; }

/* ---- 4. Typography ---- */
body, body * { font-family: var(--font-sans) !important; letter-spacing: normal !important; text-transform: none !important; }
body { font-size: 16px !important; line-height: 1.6 !important; }
body h1, body h2, body h3, body h4, body h5, body h6, .biz-title, .psy-title, .mega-glitch, .footer-signal {
    font-family: var(--font-slab) !important; font-weight: 700 !important; line-height: 1.15 !important;
    color: var(--ink) !important; text-wrap: balance;
}
body p, body li { text-wrap: pretty; }
.psychedelic-flow, .psy-title.psychedelic-flow, .biz-title.psychedelic-flow, a.autocomplete-item .biz-name {
    background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important;
    -webkit-text-fill-color: currentColor !important; color: var(--ink) !important; filter: none !important;
}
p.tagline, .field-label, .field-label-pink, .field-label-green, .card-hours-summary, .ad-disclosure,
span.ad-badge, span.organic-sponsor-badge, .near-dist-badge, .fallback-badge, .sys-login {
    font-family: var(--font-mono) !important; font-size: .78rem !important; font-weight: 500 !important;
}
p.tagline { color: var(--ink-2) !important; }
small, .text-muted { color: var(--ink-3) !important; }

/* ---- 5. Links ---- */
a { color: var(--turq); text-underline-offset: 3px; }
a:hover { color: var(--turq-dk); }
body.matrix-theme a:not(.cta-btn):not(.nav-link):not(.footer-contact):not(.psy-btn):not(.psy-btn-small):not(.modal-submit-btn) { color: var(--turq); }

/* ---- 6. Masthead: the kraft band ---- */
nav.glass-nav, body.matrix-theme nav.glass-nav {
    background: var(--kraft) !important; border: 0 !important; border-bottom: var(--rule) !important;
    border-radius: 0 !important; margin: 0 !important; padding-top: 8px !important; padding-bottom: 8px !important;
}
nav.glass-nav::before, nav.glass-nav::after { display: none !important; }
img.brand-logo { height: 34px !important; width: auto !important; max-height: 34px !important; filter: none !important; transform: none !important; }
nav.glass-nav a.nav-link, .navbar-nav .nav-link {
    color: var(--ink) !important; font-weight: 500 !important; font-size: .95rem !important;
    padding: 6px 10px !important; border-bottom: 2px solid transparent; border-radius: 0;
}
nav.glass-nav a.nav-link:hover { color: var(--ink) !important; border-bottom-color: var(--ink); }
nav.glass-nav .nav-item:first-child a.nav-link { border-bottom: 0; }
nav.glass-nav .shrink-nav .nav-btn, nav.glass-nav .shrink-nav .nav-link { letter-spacing: normal !important; }
body .nav-btn, .shrink-nav .nav-btn, .shrink-nav .nav-btn-sm {
    font-size: .9rem !important; font-weight: 600 !important; padding: 7px 13px !important; margin: 0 4px !important;
    border-radius: 4px !important; color: var(--ink) !important; background: var(--white) !important;
    border: var(--rule) !important; box-shadow: 3px 3px 0 var(--ink) !important; transform: none !important;
}
body .nav-btn:hover, body .nav-btn:focus { transform: translate(-1px, -1px) !important; box-shadow: 4px 4px 0 var(--ink) !important; color: var(--ink) !important; }
body .nav-btn.nav-btn-fill, body .nav-btn.nav-btn-fill:hover, body .nav-btn.nav-btn-fill:focus { background: var(--turq) !important; color: var(--white) !important; filter: none !important; }
nav.glass-nav.nav-fit-2 .shrink-nav .nav-btn { font-size: .8rem !important; padding: 5px 9px !important; }
nav.glass-nav.nav-fit-2 .shrink-nav .nav-link { font-size: .84rem !important; padding: 6px 6px !important; }
.navbar-toggler { border: var(--rule) !important; border-radius: 4px !important; width: 46px; height: 46px; padding: 0 !important; background: var(--paper) !important; }
.navbar-toggler-icon { width: 1.3em !important; height: 1.3em !important; filter: invert(1) brightness(.1) !important; }
nav.glass-nav a[aria-label="Back to Directory"] { color: var(--ink) !important; }
div.glass-offcanvas { background: var(--paper) !important; border-left: var(--rule) !important; }
div.glass-offcanvas div.offcanvas-header { background: var(--kraft); border-bottom: var(--rule) !important; }
div.glass-offcanvas .offcanvas-title { font-weight: 600 !important; font-size: 1rem !important; color: var(--ink) !important; }
div.glass-offcanvas button.btn-close { filter: none !important; opacity: 1 !important; transform: none !important; }
div.glass-offcanvas div.offcanvas-body { text-align: left !important; padding: 10px 24px 40px !important; }
a.mobile-link {
    font-family: var(--font-slab) !important; font-size: 1.7rem !important; font-weight: 700 !important; line-height: 1.2 !important;
    color: var(--ink) !important; padding: 11px 0 !important; margin: 0 !important; background: none !important;
    border: 0 !important; border-bottom: 1px solid var(--hair) !important; text-align: left;
}
a.mobile-link:hover, a.mobile-link:active { color: var(--turq) !important; padding-left: 0 !important; background: none !important; }
.glass-offcanvas .nav-btn { align-self: flex-start !important; margin: 16px 0 0 !important; font-size: 1rem !important; padding: 11px 18px !important; }
div.offcanvas-backdrop { background: rgba(26, 23, 20, .5) !important; }
.global-nav-pull-tab { background: var(--kraft) !important; border: var(--rule) !important; border-top: 0 !important; }
.global-nav-pull-tab::after { background: var(--ink) !important; }

/* ---- 7. Buttons: printed labels ---- */
button.search-btn, form button.search-btn, .modal-submit-btn, button#submitBtn, a.footer-contact,
body.matrix-theme a.footer-contact, button.ad-rate-btn, button.psy-btn-small.ad-rate-btn, #acceptCookies {
    color: var(--white) !important; -webkit-text-fill-color: var(--white) !important;
    background: var(--turq) !important; background-image: none !important;
    border: var(--rule) !important; border-radius: 4px !important; font-weight: 600 !important;
    box-shadow: 4px 4px 0 var(--ink) !important; transform: none !important; filter: none !important;
    transition: transform .12s, box-shadow .12s, background .12s !important;
}
button.search-btn:hover, .modal-submit-btn:hover, button#submitBtn:hover, a.footer-contact:hover, button.ad-rate-btn:hover, #acceptCookies:hover {
    background: var(--turq-dk) !important; color: var(--white) !important; transform: translate(-1px, -1px) !important; box-shadow: 5px 5px 0 var(--ink) !important;
}
a.cta-btn, button.cta-btn, a.events-btn, a.events-hero-btn, a.map-hero-btn, a.map-pulse-override, button.map-pulse-override,
a.trippy-map-btn, button.psy-btn, a.psy-btn, button.psy-btn-large, a.hero-btn-shared, a.floating-back-btn,
a.scroll-top-btn, button.scroll-top-btn, #global-bookmark-btn, .footer-auth-btn, button.share-btn-trippy,
.card-actions button, .card-actions .share-btn-trippy, #landscape-dismiss-btn, .theme-switch-fab, .theme-switch-fab-mini, #rejectCookies {
    color: var(--ink) !important; -webkit-text-fill-color: var(--ink) !important;
    background: var(--white) !important; background-image: none !important;
    border: var(--rule) !important; border-radius: 4px !important; font-weight: 600 !important; font-size: .94rem !important;
    box-shadow: 3px 3px 0 var(--ink) !important; transform: none !important; filter: none !important;
    transition: transform .12s, box-shadow .12s !important;
}
a.cta-btn:hover, button.cta-btn:hover, a.events-btn:hover, a.events-hero-btn:hover, a.map-hero-btn:hover, a.map-pulse-override:hover,
button.map-pulse-override:hover, a.trippy-map-btn:hover, button.psy-btn:hover, a.psy-btn:hover, button.psy-btn-large:hover,
a.floating-back-btn:hover, a.scroll-top-btn:hover, button.scroll-top-btn:hover, #global-bookmark-btn:hover, .footer-auth-btn:hover,
.footer-auth-btn:focus, button.share-btn-trippy:hover, .card-actions button:hover, .theme-switch-fab:hover, #rejectCookies:hover {
    color: var(--ink) !important; -webkit-text-fill-color: var(--ink) !important; background: var(--kraft-lt) !important;
    transform: translate(-1px, -1px) !important; box-shadow: 4px 4px 0 var(--ink) !important;
}
a.cta-btn::after, button.cta-btn::after, a.events-btn::after, a.events-hero-btn::after, a.map-hero-btn::after,
a.map-pulse-override::after, button.map-pulse-override::after, a.trippy-map-btn::after, a.psy-btn::after,
button.psy-btn::after, .modal-submit-btn::after, a.footer-contact::after, a.footer-contact::before { display: none !important; }
button.psy-btn, a.psy-btn { padding: 9px 18px !important; line-height: 1.25 !important; }
form.d-flex > .form-psy { margin-bottom: 0 !important; }
form.d-flex > button.psy-btn { align-self: center; }
button.psy-btn-small, a.psy-btn-small { color: var(--turq) !important; -webkit-text-fill-color: var(--turq) !important; font-size: .9rem !important; font-weight: 600 !important; }
button.psy-btn-small:hover, a.psy-btn-small:hover { color: var(--turq-dk) !important; -webkit-text-fill-color: var(--turq-dk) !important; text-decoration: underline; }
button.psy-btn-red, .psy-btn-red { color: var(--red) !important; background: var(--white) !important; border: 2px solid var(--red) !important; border-radius: 4px !important; font-weight: 600 !important; }
.card-actions button.edit-trigger, .card-actions button.add-biz-trigger { font-size: .82rem !important; }

/* filter pills */
#filter-hud, div#filter-hud { background: transparent !important; border: 0 !important; padding: 0 !important; flex-wrap: wrap; gap: 8px !important; }
button.sys-toggle-btn {
    color: var(--ink) !important; background: var(--white) !important; border: var(--rule) !important;
    border-radius: 4px !important; font-weight: 600 !important; font-size: .9rem !important; padding: 7px 14px !important;
}
button.sys-toggle-btn:hover { background: var(--kraft-lt) !important; }
button.sys-toggle-btn.active-all, button.sys-toggle-btn.active-open { color: var(--white) !important; background: var(--ink) !important; border-color: var(--ink) !important; }
@media (max-width: 600px) { button.sys-toggle-btn { font-size: .86rem !important; padding: 6px 11px !important; } }

/* ---- 8. Banner + search ---- */
.dir-banner-frame, div.dir-banner-frame {
    border: var(--rule) !important; border-radius: 4px !important; overflow: hidden !important;
    background: var(--white) !important; box-shadow: 6px 6px 0 var(--ink) !important; transform: none !important;
}
.dir-banner-frame::after, .dir-banner-frame::before { display: none !important; }
.dir-banner-frame img { border-radius: 0 !important; }
/* The pill must stay OPAQUE: the autocomplete dropdown tucks up under it (see luxury.css). */
div.search-container form::after {
    background: var(--white) !important; border: var(--rule) !important; border-radius: 6px !important;
}
div.search-container form:focus-within::after { border-color: var(--turq) !important; }
form input.search-input { color: var(--ink) !important; font-size: 1rem !important; }
form input.search-input::placeholder { color: var(--ink-3) !important; }
form button.search-btn { transform: translateY(-50%) !important; height: 40px !important; padding: 0 20px !important; font-size: .95rem !important; box-shadow: none !important; border-width: 0 !important; }
form button.search-btn:hover { transform: translateY(-50%) !important; box-shadow: none !important; }
form span.clear-btn { color: var(--ink-3) !important; }
form span.clear-btn:hover { color: var(--ink) !important; }
input.search-input:focus, input.search-input:focus-visible { outline: none !important; }
.search-container .autocomplete-dropdown { background: var(--white) !important; border: var(--rule) !important; border-radius: 0 0 6px 6px !important; }
a.autocomplete-item { color: var(--ink) !important; border-color: var(--hair) !important; }
a.autocomplete-item:hover { background: var(--kraft-lt) !important; }
div.autocomplete-empty { color: var(--ink-3) !important; }
@media (max-width: 768px) {
    body .search-wrapper-flex.mobile-focus-active { background: var(--paper) !important; border-bottom: var(--rule) !important; }
}
.tag-scroll-container a, .tag-scroll-container button:not(.tag-arrow-btn), .tag-scroll-container span {
    color: var(--ink) !important; background: var(--white) !important; border: 1px solid var(--ink) !important;
    border-radius: 4px !important; font-size: .86rem !important; font-weight: 500 !important;
}
.tag-scroll-container a:hover, .tag-scroll-container button:not(.tag-arrow-btn):hover { background: var(--kraft-lt) !important; }
.tag-arrow-btn, .tag-arrow-left, .tag-arrow-right { color: var(--ink) !important; background: transparent !important; border: 0 !important; }
a.section-arrow { color: var(--ink-2) !important; }

/* ---- 9. Cards: white paper, ink rule, hard shadow ---- */
.psy-card, div.grid-layout div.card {
    background: var(--white) !important; border: var(--rule) !important; border-radius: 4px !important; overflow: hidden;
    box-shadow: 5px 5px 0 var(--ink) !important; transform: none !important; transition: transform .15s, box-shadow .15s !important;
}
.psy-card:hover, div.grid-layout div.card:hover { transform: translate(-2px, -2px) !important; box-shadow: 7px 7px 0 var(--ink) !important; }
.psy-card:active { transform: translate(2px, 2px) !important; box-shadow: 2px 2px 0 var(--ink) !important; }
.psy-card::before, .psy-card::after, .profile-container::before, .profile-container::after,
.profile-img-frame::before, .profile-img-frame::after, .legal-container::before,
#map-search-container::before, div.sponsored-card::before { display: none !important; }
.psy-card img.card-img-top { border-bottom: var(--rule) !important; background-color: var(--paper) !important; filter: none !important; }
.psy-card:hover img.card-img-top { transform: none !important; filter: none !important; }
.psy-card .card-body, .psy-card p, .psy-card .card-text, .psy-card .contact-info { color: var(--ink-2) !important; }
.biz-title { font-size: 1.4rem !important; }
.card-closed, .card-expired { border-color: var(--red) !important; box-shadow: 5px 5px 0 var(--red) !important; }
.card-closed img.card-img-top, .card-expired img.card-img-top { filter: grayscale(.7) !important; }
span.tech-badge {
    font-size: .78rem !important; font-weight: 500 !important; color: var(--ink) !important;
    background: var(--kraft-lt) !important; border: 1px solid var(--kraft-dk) !important; border-radius: 3px !important; padding: 3px 9px !important;
}
span.tech-badge::before, span.tech-badge::after { display: none !important; }
.biz-rating, .card-hours, div.info-panel, .card-map-link { background: var(--paper) !important; border: 1px solid var(--hair) !important; border-radius: 4px !important; }
.card-hours, .card-hours-today, .card-hours > summary { color: var(--ink-2) !important; }
.card-hours-today, .card-hours-now { color: var(--ink) !important; }
.card-status-dot { border: 2px solid var(--ink) !important; }
.card-status-dot.is-open { background: var(--green) !important; }
.card-status-dot.is-closed { background: var(--red) !important; }
.fav-btn { color: var(--ink-3) !important; }
.fav-btn.is-fav, .fav-btn:hover { color: var(--copper) !important; }
.biz-open, .is-open { color: var(--green) !important; }
.is-closed { color: var(--red) !important; }

/* ---- 10. Profile page ---- */
div.profile-container, #hero .hero-container, div.hero-container {
    background: var(--white) !important; border: var(--rule) !important; border-radius: 4px !important; box-shadow: 6px 6px 0 var(--ink) !important;
}
.profile-img-frame, .map-wrapper { border: var(--rule) !important; border-radius: 4px !important; overflow: hidden !important; background: var(--paper) !important; }
.profile-img-frame .profile-img, img.profile-img { border-radius: 0 !important; filter: none !important; }
div.profile-container .info-panel, div.info-panel { padding: 20px !important; }
div.info-panel:hover { transform: none !important; }
div.info-panel h3, div.info-panel h4, div.info-panel h5 { font-size: 1.15rem !important; border: 0 !important; }
.review-card, .leave-review-box { background: var(--paper) !important; border: 1px solid var(--hair) !important; border-top: var(--rule) !important; border-radius: 0 !important; }
.review-card:hover { transform: none !important; }
.profile-closed .profile-img { filter: grayscale(.7) !important; }

/* ---- 11. Sponsored / badges ---- */
div.sponsored-card { background: var(--white) !important; border: 2px solid var(--kraft-dk) !important; border-radius: 4px !important; box-shadow: 5px 5px 0 var(--kraft-dk) !important; }
div.sponsored-card.is-clickable:hover { transform: translate(-2px, -2px) !important; }
span.ad-badge, span.organic-sponsor-badge, span.ad-badge-event, span.ad-badge-special, span.ad-badge-realestate, span.ad-badge-service, span.ad-badge-notice {
    color: var(--ink) !important; background: var(--kraft-lt) !important; border: 1px solid var(--kraft-dk) !important; border-radius: 3px !important; padding: 3px 8px !important;
}
p.sponsored-body-text { color: var(--ink-2) !important; }
.sponsored-banner { background: var(--kraft-lt) !important; border: 1px solid var(--kraft-dk) !important; border-radius: 4px !important; }
.sponsored-banner::before { display: none !important; }
.sponsored-banner .sponsored-banner-text { color: var(--ink) !important; }

/* ---- 12. Modals + forms ---- */
div.modal-overlay, .modal-overlay { background: rgba(26, 23, 20, .55) !important; }
div.terminal-window, .terminal-window, div.modal-overlay .terminal-window {
    background: var(--white) !important; border: var(--rule) !important; border-radius: 4px !important; box-shadow: 8px 8px 0 var(--ink) !important; overflow: hidden;
}
div.terminal-header, .terminal-header {
    background: var(--kraft) !important; color: var(--ink) !important; border-bottom: var(--rule) !important;
    font-weight: 600 !important; font-size: .95rem !important; padding: 14px 20px !important;
}
span.close-modal { color: var(--ink) !important; font-weight: 700 !important; }
.terminal-body { color: var(--ink) !important; }
input.form-psy, textarea.form-psy, select.form-psy, .form-psy {
    background: var(--white) !important; color: var(--ink) !important; border: var(--rule) !important; border-radius: 3px !important;
    padding: 11px 13px !important; font-size: 1rem !important;
}
input.form-psy:focus, textarea.form-psy:focus, select.form-psy:focus { outline: 3px solid var(--turq) !important; outline-offset: 1px; }
.form-psy::placeholder { color: var(--ink-3) !important; }
select.form-psy option { background: var(--white) !important; color: var(--ink) !important; }
.field-label, .field-label-pink, .field-label-green { color: var(--ink) !important; font-family: var(--font-sans) !important; font-size: .92rem !important; font-weight: 600 !important; }
.biz-option { border-color: var(--hair) !important; border-radius: 4px !important; }
.biz-option:hover { background: var(--kraft-lt) !important; }
div.terminal-success, div.terminal-error { font-size: .95rem !important; font-weight: 500 !important; border: var(--rule) !important; border-radius: 3px !important; padding: 12px 14px !important; color: var(--ink) !important; }
div.terminal-success { background: #dcefe6 !important; }
div.terminal-error { background: #f6dcd3 !important; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--turq); }
input[type="file"]::file-selector-button {
    font: 600 .86rem var(--font-sans); color: var(--ink); background: var(--white); border: 2px solid var(--ink);
    border-radius: 3px; padding: 6px 12px; margin-right: 12px; cursor: pointer;
}

/* ---- 13. Footer + cookie notice ---- */
footer.footer-wrapper { background: var(--paper) !important; border-top: var(--rule) !important; color: var(--ink-2) !important; }
.footer-signal { color: var(--ink) !important; font-size: clamp(1.5rem, 3vw, 2rem) !important; text-align: center; }
a.footer-contact { padding: 13px 26px !important; font-size: 1rem !important; }
.footer-auth-btn { min-height: 44px; padding: 9px 18px !important; }
.footer-bottom { border-top: 1px solid var(--hair) !important; }
footer .footer-legal { color: var(--ink) !important; border-bottom: 0 !important; text-decoration: underline !important; font-size: .9rem !important; }
footer .footer-copy { color: var(--ink-3) !important; font-size: .85rem !important; white-space: normal !important; }
footer .footer-credit-text { color: var(--ink-3) !important; font-size: .8rem !important; }
.footer-credit:hover { filter: none !important; }
div#cookie-matrix {
    left: 18px !important; right: auto !important; bottom: 18px !important; width: min(460px, calc(100% - 36px)) !important;
    transform: translateY(160%) !important; transition: transform .3s !important;
    background: var(--white) !important; border: var(--rule) !important; border-radius: 4px !important;
    padding: 16px 18px !important; box-shadow: 6px 6px 0 var(--ink) !important;
}
div#cookie-matrix.show-matrix { transform: none !important; }
div#cookie-matrix .container { max-width: none !important; padding: 0 !important; flex-direction: column !important; align-items: flex-start !important; }
div#cookie-matrix h4 { font-size: 1.05rem !important; margin: 0 0 4px !important; }
div#cookie-matrix p { color: var(--ink-2) !important; font-size: .9rem !important; margin: 0 !important; }
div#cookie-matrix p a { color: var(--ink) !important; text-decoration: underline; }
div#cookie-matrix .cookie-actions { justify-content: flex-start !important; }
div#cookie-matrix .cookie-actions button { font-size: .92rem !important; padding: 8px 18px !important; cursor: pointer !important; }
body .universal-bookmark-container #global-bookmark-btn { border-color: var(--ink) !important; color: var(--ink) !important; }

/* ---- 14. Legal page (directory host) + map chrome ---- */
div.legal-container { background: var(--white) !important; border: var(--rule) !important; border-radius: 4px !important; box-shadow: 6px 6px 0 var(--ink) !important; }
div.legal-container::after { display: none !important; }
div.legal-container h1, div.legal-container h2, div.legal-container h3 { color: var(--ink) !important; border: 0 !important; }
div.legal-container h2 { border-top: var(--rule) !important; padding-top: 18px !important; }
div.legal-container h2::before, div.legal-container h3::before { content: none !important; }
div.legal-container p, div.legal-container li { color: var(--ink-2) !important; }
.map-hud-btn { border-radius: 4px !important; background: var(--white) !important; border: var(--rule) !important; color: var(--ink) !important; }
#map-search-input { border-radius: 4px !important; background: var(--white) !important; border: var(--rule) !important; color: var(--ink) !important; }
#map-search-input:focus { outline: 3px solid var(--turq) !important; }
.gm-style .cyber-label, .gm-style .cyber-label-gold { background: var(--white) !important; border: 2px solid var(--ink) !important; color: var(--ink) !important; border-radius: 3px !important; }
.gm-style .cyber-label-hover { background: var(--kraft-lt) !important; }

/* ---- 15. Inline colours written for the dark neon skin ---- */
/* light text -> ink */
[style*="color: #fff" i], [style*="color:#fff" i], [style*="color: #FFF" i], [style*="color: #ccc" i], [style*="color:#ccc" i],
[style*="color: #ddd" i], [style*="color:#ddd" i], [style*="color: #d6d6d6" i], [style*="color:#d6d6d6" i], [style*="color: #e0e0e0" i],
[style*="color:#e0e0e0" i], [style*="color: #e8d5a8" i], [style*="color:#e8d5a8" i], [style*="color: #bbb" i], [style*="color:#bbb" i],
[style*="color: white" i], [style*="color:white" i] { color: var(--ink) !important; -webkit-text-fill-color: var(--ink) !important; }
/* faint greys -> readable muted ink */
[style*="color: #888" i], [style*="color:#888" i], [style*="color: #999" i], [style*="color:#999" i], [style*="color: #aaa" i], [style*="color:#aaa" i],
[style*="color: #8a8a8a" i], [style*="color:#8a8a8a" i], [style*="color: #6f6f6f" i], [style*="color:#6f6f6f" i], [style*="color: #666" i], [style*="color:#666" i],
[style*="color: #777" i], [style*="color:#777" i], [style*="color: #7a7090" i] { color: var(--ink-3) !important; }
/* hard-coded neons -> the dark accents */
[style*="color: #ffaa00" i], [style*="color:#ffaa00" i], [style*="color: #c8a45c" i], [style*="color:#c8a45c" i] { color: var(--kraft-dk) !important; }
[style*="color: gold" i], [style*="color:gold" i], [style*="color: #ffd700" i], [style*="color:#ffd700" i], [style*="color: #ffcc00" i], [style*="color:#ffcc00" i], [style*="color: #ff0" i] { color: var(--gold) !important; }
[style*="color: #00ffff" i], [style*="color:#00ffff" i], [style*="color: #0ff" i] { color: var(--turq) !important; }
[style*="color: #39ff14" i], [style*="color:#39ff14" i] { color: var(--green) !important; }
[style*="color: #cc0000" i], [style*="color:#cc0000" i], [style*="color: #f33" i], [style*="color:#f33" i], [style*="color: #f55" i], [style*="color:#f55" i],
[style*="color: #ff3333" i], [style*="color:#ff3333" i] { color: var(--red) !important; }
[style*="color: #4285f4" i], [style*="color:#4285f4" i] { color: #1f56c4 !important; }   /* Google blue, darkened for paper */
/* Bootstrap's .text-white on phone links */
.text-white { color: var(--ink) !important; }
/* the CLOSED badge's red border */
[style*="border: 1px solid #cc0000" i] { border-color: var(--red) !important; }
/* dark panels -> paper/white */
[style*="background: #000" i], [style*="background:#000" i], [style*="background: #111" i], [style*="background:#111" i],
[style*="background: #0b001a" i], [style*="background:#0b001a" i], [style*="background: rgba(0,0,0" i], [style*="background:rgba(0,0,0" i],
[style*="background: rgba(0, 0, 0" i], [style*="background: rgba(11" i], [style*="background:rgba(11" i], [style*="background: rgba(20, 10" i],
[style*="background: rgba(20,16,10" i], [style*="background-color: rgba(0, 0, 0" i], [style*="background-color: #000" i] {
    background: var(--white) !important; border-color: var(--hair) !important;
}
/* faint neon tints -> kraft tint */
[style*="background: rgba(0,255,255" i], [style*="background: rgba(0, 255, 255" i], [style*="background: rgba(255,0,255" i],
[style*="background: rgba(255, 0, 255" i], [style*="background: rgba(57,255,20" i], [style*="background: rgba(57, 255, 20" i],
[style*="background: rgba(255,170,0" i], [style*="background: rgba(255, 170, 0" i], [style*="background: rgba(255,215,0" i] {
    background: var(--paper) !important;
}
/* dashed neon borders -> plain hairlines */
[style*="border: 1px dashed" i], [style*="border:1px dashed" i], [style*="border: 2px dashed" i], [style*="border:2px dashed" i] {
    border-style: solid !important; border-color: var(--hair) !important; border-radius: 4px !important;
}
[style*="border-top: 1px dashed" i], [style*="border-top:1px dashed" i] { border-top-style: solid !important; border-top-color: var(--hair) !important; }
[style*="border-bottom: 1px dashed" i], [style*="border-bottom:1px dashed" i] { border-bottom-style: solid !important; border-bottom-color: var(--hair) !important; }
.psy-card[style*="dashed" i] { border: var(--rule) !important; }
.card-hours-week { border-style: solid !important; border-color: var(--hair) !important; }
/* solid neon fills keep light text (checked last, so it wins over the ink rule above) */
[style*="background: var(--neon" i][style*="color" i], [style*="background:var(--neon" i][style*="color" i],
[style*="background: var(--btn-accent" i], #newsletterSubmitBtn {
    color: var(--white) !important; -webkit-text-fill-color: var(--white) !important; border-color: var(--ink) !important;
}
#newsletterSubmitBtn { background: var(--turq) !important; border: var(--rule) !important; border-radius: 4px !important; }
[style*="background: #ffaa00" i], [style*="background:#ffaa00" i], [style*="background: #ffcc00" i], [style*="background: #c8a45c" i] { background: var(--kraft) !important; color: var(--ink) !important; -webkit-text-fill-color: var(--ink) !important; }
.upload-size-note { color: var(--ink-3) !important; }
/* the generated "no image" placeholder is purple; make it neutral */
img[src^="data:image/svg+xml"], .psy-card img.card-img-top[src^="data:image/svg+xml"], .profile-img-frame .profile-img[src^="data:image/svg+xml"] { filter: saturate(0) invert(.9) !important; }

/* ---- 16. Motion: the same paper-and-print feel as the homepage ---- */
@keyframes kDropIn {
    0%   { opacity: 0; transform: translateY(-80px) rotate(4deg); box-shadow: 0 0 0 transparent; }
    70%  { opacity: 1; transform: translateY(4px) rotate(-.6deg); box-shadow: 2px 2px 0 var(--ink); }
    100% { opacity: 1; transform: none; box-shadow: 6px 6px 0 var(--ink); }
}
@keyframes kPress { 0% { opacity: 0; transform: scale(1.06); filter: blur(3px); } 60% { opacity: 1; transform: scale(.985); filter: none; } 100% { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
    .dir-banner-frame { animation: kDropIn .5s cubic-bezier(.3, .8, .3, 1) .05s backwards !important; }
    main h1 { animation: kPress .45s cubic-bezier(.2, .8, .2, 1) backwards !important; }
    .psy-card:hover, div.grid-layout div.card:hover { transform: translate(-2px, -3px) rotate(-.4deg) !important; }
    .psy-card:nth-child(even):hover { transform: translate(-2px, -3px) rotate(.4deg) !important; }
    button:active, a.cta-btn:active, a.events-btn:active, a.psy-btn:active, .nav-btn:active, .footer-auth-btn:active, a.footer-contact:active {
        transform: translate(3px, 3px) !important; box-shadow: 1px 1px 0 var(--ink) !important; transition-duration: .05s !important;
    }
    button.sys-toggle-btn { transition: background .15s, color .15s, transform .12s !important; }
    button.sys-toggle-btn:hover { transform: translateY(-2px) !important; }
}

/* ---- 17. Misc ---- */
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: var(--paper) !important; }
::-webkit-scrollbar-thumb { background: var(--kraft) !important; border: 2px solid var(--paper); border-radius: 0; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible,
summary:focus-visible, [tabindex]:focus-visible { outline: 3px solid var(--turq) !important; outline-offset: 2px; }
hr { border-color: var(--hair) !important; opacity: 1 !important; }
.ad-gallery-item, .biz-gallery-item { border: 1px solid var(--ink) !important; border-radius: 3px !important; background: var(--white) !important; }
@media (prefers-reduced-motion: reduce) {
    .psy-card, .psy-card:hover, div.sponsored-card.is-clickable:hover { transform: none !important; }
}