:root { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
html, body { max-width: 100%; overflow-x: hidden; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
.bg-ink { background-color: #17252b; }
.bg-paper { background-color: #f4f1ea; }
.bg-ember { background-color: #d97842; }
.bg-leaf\/15 { background-color: rgba(61,139,87,.15); }
.text-ink { color: #17252b; }
.text-ink\/70 { color: rgba(23,37,43,.7); }
.text-ink\/60 { color: rgba(23,37,43,.6); }
.text-ink\/55 { color: rgba(23,37,43,.55); }
.text-ink\/50 { color: rgba(23,37,43,.5); }
.text-ink\/45 { color: rgba(23,37,43,.45); }
.text-ink\/40 { color: rgba(23,37,43,.4); }
.text-ink\/10 { color: rgba(23,37,43,.1); }
.text-leaf { color: #3d8b57; }
.text-ember { color: #d97842; }
.text-lagoon { color: #087f8c; }
.dashboard-complaint-card { border: 1px solid rgba(23,37,43,.1); border-radius: .8rem; background: rgba(255,255,255,.62); padding: .9rem; }
.request-card, .queue-card, .inbox-card { display: block; border: 1px solid rgba(23,37,43,.1); border-radius: 1rem; background: rgba(255,255,255,.68); padding: 1.35rem; transition: transform .2s, box-shadow .2s, border-color .2s; }
.request-card:hover, .inbox-card:hover { transform: translateY(-2px); border-color: rgba(8,127,140,.35); box-shadow: 0 14px 30px rgba(23,37,43,.08); }
.queue-card { background: white; }
.detail-label { color: rgba(23,37,43,.42); font-size: .67rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.detail-value { margin-top: .35rem; font-size: .9rem; color: rgba(23,37,43,.75); }
.timeline { border-left: 1px solid rgba(23,37,43,.12); padding-left: 1.25rem; }
.timeline-item { position: relative; padding-bottom: 1.6rem; }
.timeline-item:last-child { padding-bottom: 0; }
.timeline-dot { position: absolute; left: -1.55rem; top: .2rem; height: .6rem; width: .6rem; border-radius: 999px; border: 2px solid #f4f1ea; background: #087f8c; box-shadow: 0 0 0 1px rgba(8,127,140,.35); }
.job-card-summary { display: block; border: 1px solid rgba(23,37,43,.1); border-radius: .8rem; background: rgba(244,241,234,.62); padding: .9rem 1rem; transition: border-color .2s, background .2s; }
.job-card-summary:hover { border-color: rgba(8,127,140,.35); background: rgba(8,127,140,.04); }
.alert-warning, .alert-error { border-radius: .75rem; padding: .85rem 1rem; font-size: .85rem; line-height: 1.5; }
.alert-warning { border: 1px solid rgba(217,120,66,.25); background: rgba(217,120,66,.1); color: rgba(23,37,43,.75); }
.alert-error { border: 1px solid rgba(177,63,54,.25); background: rgba(177,63,54,.08); color: #8f322b; }
.nav-link { display: block; color: rgba(255,255,255,.68); font-size: .875rem; transition: color .2s; }
.nav-link:hover { color: white; }
.hero-grid { background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(90deg, black, transparent); }
.public-header { background: #112a32; }
.public-header > div { min-height: 4.75rem; }
.public-hero { isolation: isolate; background: radial-gradient(circle at 50% 12%, rgba(8,127,140,.28), transparent 34rem), linear-gradient(145deg, #102831 0%, #172f36 52%, #10242b 100%); }
.public-hero::after { position: absolute; inset: auto 0 0; height: 10rem; background: linear-gradient(transparent, rgba(6,24,29,.22)); content: ""; pointer-events: none; }
.public-hero-pattern { opacity: .32; mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), transparent 82%); }
.public-hero-content { z-index: 1; padding-top: 3rem; padding-bottom: 4.5rem; }
.public-hero-seal { width: 5.5rem; height: 5.5rem; }
.public-kicker { margin-top: 1.25rem; color: rgba(255,255,255,.62); }
.public-hero-title { max-width: 54rem; margin-top: .85rem; font-size: clamp(3rem, 5vw, 4.5rem); line-height: 1.03; text-wrap: balance; }
.public-hero-summary { margin-top: 1.15rem; color: rgba(255,255,255,.74); text-wrap: balance; }
.access-card { width: min(100%, 31rem); margin-top: 2rem; border: 1px solid rgba(255,255,255,.36); border-top: 4px solid #3d8b57; border-radius: 1rem; background: #fff; padding: 1.75rem 2rem 2rem; box-shadow: 0 24px 65px rgba(2,18,23,.34); }
.access-card h2 { color: #17252b; }
.access-card input:not([type=hidden]) { min-height: 3rem; background: #fff; }
.button-access { display: inline-flex; min-height: 3rem; align-items: center; justify-content: center; border-radius: .7rem; background: #2f7047; padding: .85rem 1.2rem; color: #fff; font-size: .875rem; font-weight: 700; letter-spacing: .01em; box-shadow: 0 8px 20px rgba(47,112,71,.24); transition: background-color .2s, box-shadow .2s, transform .2s; }
.button-access:hover { background: #285f3d; box-shadow: 0 11px 24px rgba(47,112,71,.3); transform: translateY(-1px); }
.public-benefits { color: #17252b; }
.public-section-title { text-wrap: balance; }
.benefit-item { position: relative; border-top: 2px solid rgba(8,127,140,.22); padding-top: 1.5rem; }
.benefit-item::before { display: block; margin-bottom: 1.1rem; color: #d97842; font-size: .68rem; font-weight: 800; letter-spacing: .14em; }
.benefit-item:nth-child(1)::before { content: "01"; }
.benefit-item:nth-child(2)::before { content: "02"; }
.benefit-item:nth-child(3)::before { content: "03"; }
.how-section { background: #f4f1ea; }
.how-sequence { position: relative; }
.how-sequence::before { position: absolute; top: 1rem; right: 1.25rem; left: 1.25rem; height: 1px; background: rgba(8,127,140,.28); content: ""; }
.process-card.how-step { position: relative; border-top: 0; padding-top: 0; }
.how-step .step-number { position: relative; z-index: 1; display: inline-flex; width: 2.1rem; height: 2.1rem; align-items: center; justify-content: center; border: 1px solid rgba(8,127,140,.34); border-radius: 50%; background: #f4f1ea; color: #b45f30; }
.process-card.how-step h3 { margin-top: 1.35rem; font-size: 1.35rem; line-height: 1.15; }
.process-card.how-step p { margin-top: .65rem; }
.public-footer a { color: #315f67; font-weight: 650; text-underline-offset: .2em; }
.public-footer a:hover { color: #087f8c; text-decoration: underline; }
.facility-search { background: rgba(255,255,255,.82); }
.facility-search .button-secondary { min-height: 2.8rem; }
.facility-results h2, .facility-issue-row { overflow-wrap: anywhere; }
.facility-issue-row { background: rgba(255,255,255,.82); }
.facility-issue-row > div > div { min-width: 0; }
.facility-issue-row:hover { border-color: rgba(8,127,140,.28); }
.seal-card { position: relative; width: min(100%, 390px); border-radius: 2rem; background: #f4f1ea; padding: 2.5rem; text-align: center; box-shadow: 0 30px 80px rgba(0,0,0,.25); }
.button-primary, .button-secondary, .button-ghost, .button-text { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; border-radius: .75rem; padding: .85rem 1.15rem; font-size: .875rem; font-weight: 700; transition: transform .2s, box-shadow .2s, background .2s; }
.button-primary { background: #d97842; color: white; box-shadow: 0 8px 20px rgba(217,120,66,.25); }
.button-primary:hover, .button-secondary:hover { transform: translateY(-1px); box-shadow: 0 12px 25px rgba(23,37,43,.14); }
.button-secondary { border: 1px solid rgba(23,37,43,.15); background: white; color: #17252b; }
.button-ghost { border: 1px solid rgba(255,255,255,.25); color: white; }
.button-ghost:hover { background: rgba(255,255,255,.08); }
.button-text { padding-left: 0; padding-right: 0; color: rgba(23,37,43,.55); }
:where(a, button, input, textarea, select):focus-visible { outline: 3px solid #f0a46f; outline-offset: 3px; }
.access-card :where(button, input):focus-visible { outline-color: #087f8c; }
.eyebrow { color: #087f8c; font-size: .68rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.process-card { border-top: 2px solid rgba(23,37,43,.12); padding-top: 1.1rem; }
.process-card h3 { margin-top: 1.8rem; font-family: Georgia, serif; font-size: 1.5rem; }
.process-card p { margin-top: .55rem; color: rgba(23,37,43,.55); font-size: .875rem; line-height: 1.6; }
.step-number, .section-index { color: #d97842; font-size: .7rem; font-weight: 800; letter-spacing: .15em; }
.metric-card, .panel, .form-panel { border: 1px solid rgba(23,37,43,.1); border-radius: 1rem; background: rgba(255,255,255,.68); padding: 1.4rem; }
.metric-card { min-height: 150px; }
.metric-card-dark { border-color: #17252b; background: #17252b; color: white; }
.metric-label, .metric-foot { display: block; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.metric-label { color: rgba(23,37,43,.5); }
.metric-card-dark .metric-label, .metric-card-dark .metric-foot { color: rgba(255,255,255,.55); }
.metric-card strong { display: block; margin-top: 1.2rem; font-family: Georgia, serif; font-size: 3.4rem; line-height: 1; }
.metric-foot { margin-top: .8rem; color: rgba(23,37,43,.45); font-size: .68rem; letter-spacing: .04em; text-transform: none; }
.status-pill { display: inline-flex; align-items: center; border-radius: 999px; padding: .35rem .65rem; font-size: .68rem; font-weight: 700; }
.status-neutral { background: rgba(23,37,43,.07); color: rgba(23,37,43,.6); }
.status-amber { background: #fff0d8; color: #a45e19; }
.empty-state { border: 1px dashed rgba(23,37,43,.18); border-radius: .9rem; padding: 2.5rem 1rem; text-align: center; }
.empty-icon { margin: auto; display: flex; height: 2.5rem; width: 2.5rem; align-items: center; justify-content: center; border-radius: 999px; background: rgba(8,127,140,.1); color: #087f8c; font-size: 1.3rem; }
.empty-state h3 { margin-top: 1rem; font-weight: 700; }
.empty-state p { margin-top: .35rem; color: rgba(23,37,43,.5); font-size: .875rem; }
.section-heading { display: flex; gap: 1rem; }
.section-heading h2 { font-family: Georgia, serif; font-size: 1.65rem; }
.section-heading p { margin-top: .25rem; color: rgba(23,37,43,.5); font-size: .875rem; }
.field-label { display: block; margin-bottom: .5rem; font-size: .8rem; font-weight: 700; }
.field-help { margin-top: .4rem; color: rgba(23,37,43,.48); font-size: .72rem; line-height: 1.5; }
.field-error { margin-top: .4rem; color: #b34c35; font-size: .75rem; }
input:not([type=hidden]), textarea, select { width: 100%; border: 1px solid rgba(23,37,43,.15); border-radius: .65rem; background: rgba(255,255,255,.8); padding: .8rem .85rem; color: #17252b; font-size: .9rem; outline: none; transition: border .2s, box-shadow .2s; }
input:not([type=hidden]):focus, textarea:focus, select:focus { border-color: #087f8c; box-shadow: 0 0 0 3px rgba(8,127,140,.12); }
input:disabled { background: rgba(23,37,43,.05); color: rgba(23,37,43,.58); }
.alert-error { border-radius: .7rem; background: #fff0ed; padding: .8rem 1rem; color: #a14332; font-size: .8rem; }
.back-link { color: rgba(23,37,43,.55); font-size: .85rem; font-weight: 700; }
.back-link:hover { color: #087f8c; }
.reference-card { border-radius: 1rem; border: 1px solid rgba(23,37,43,.12); background: white; padding: 2rem; box-shadow: 0 20px 60px rgba(23,37,43,.08); }

@media (max-width: 767px) {
    .seal-card { padding: 1.5rem; }
    .public-header > div, .application-header > div { min-height: 4rem; padding-top: .65rem; padding-bottom: .65rem; }
    .public-header img, .application-header img { width: 2.35rem; height: 2.35rem; }
    .public-identity > span:first-child { max-width: 13.75rem; font-size: .46rem; letter-spacing: .11em; white-space: normal; }
    .public-identity > span:last-child { font-size: 1.05rem; }
    .application-identity { max-width: 14rem; }
    .application-identity > span { white-space: normal; }
    .application-identity > span:first-child, .application-identity > span:last-child { font-size: .43rem; letter-spacing: .09em; }
    .application-identity > span:nth-child(2) { font-size: .45rem; letter-spacing: .12em; }
    .application-identity > span:nth-child(3) { font-size: 1rem; }
    .public-hero-content { padding-top: 2rem; padding-bottom: 3rem; }
    .public-hero-seal { width: 4.5rem; height: 4.5rem; }
    .public-kicker { max-width: 18rem; margin-right: auto; margin-left: auto; font-size: .62rem; line-height: 1.5; }
    .public-hero-title { max-width: 22rem; font-size: clamp(2.25rem, 10.5vw, 2.75rem); line-height: 1.06; letter-spacing: -.035em; overflow-wrap: normal; }
    .public-hero-summary { max-width: 21rem; font-size: .95rem; line-height: 1.65; }
    .access-card { margin-top: 1.75rem; padding: 1.5rem 1.25rem 1.4rem; }
    .access-card h2 { font-size: 1.75rem; }
    .access-card form { margin-top: 1.25rem; }
    .access-card .min-h-\[3\.25rem\] { min-height: 2.75rem; }
    .access-card input:not([type=hidden]), .button-access { width: 100%; }
    .public-benefits, .how-section { padding-top: 3.5rem; padding-bottom: 3.5rem; }
    .public-section-title, .how-section h2 { font-size: 2rem; line-height: 1.12; }
    .benefits-grid { margin-top: 2.25rem; gap: 2rem; }
    .benefit-item { padding-top: 1.15rem; }
    .benefit-item::before { margin-bottom: .75rem; }
    .how-sequence { display: block; margin-top: 2.25rem; }
    .how-sequence::before { top: 1.05rem; bottom: 1.05rem; left: 1.02rem; width: 1px; height: auto; }
    .how-step { min-height: 7rem; padding: 0 0 2rem 3.15rem; }
    .how-step:last-child { min-height: 0; padding-bottom: 0; }
    .how-step .step-number { position: absolute; top: 0; left: 0; }
    .process-card.how-step h3 { margin-top: 0; font-size: 1.25rem; }
    .process-card.how-step p { margin-top: .45rem; }
    .public-footer { padding-top: 1.5rem; padding-bottom: 1.5rem; line-height: 1.5; }
    .public-footer nav { flex-wrap: wrap; row-gap: .5rem; }
    .facility-dashboard { padding-top: 2.25rem; padding-bottom: 3.5rem; }
    .facility-dashboard h1 { font-size: 2.5rem; line-height: 1.05; overflow-wrap: anywhere; }
    .facility-search { padding: 1rem; }
    .facility-search .button-secondary { width: 100%; }
    .facility-results > div:first-child, .facility-dashboard .panel > div:first-child { align-items: flex-start; }
    .facility-results h2 { font-size: 1.45rem; line-height: 1.25; }
    .facility-issue-row { padding: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}