/* ─── PROOF Data Browser — Custom Styles ─── */

/* ── 전역 ── */
:root {
    --color-partner: #3b82f6;
    --color-store: #10b981;
    --color-cu: #8b5cf6;
    --color-emart24: #f5c400;
    --color-delivery: #6b7280;
    --color-dutyfree: #f59e0b;
    --color-overseas: #ec4899;
    --color-etc: #9ca3af;
    --color-instock: #10b981;
    --color-soldout: #ef4444;
}

body > footer {
    text-align: center;
    padding: 2rem 0 1rem;
    opacity: 0.6;
}

.site-header {
    position: sticky;
    z-index: 40;
    top: 0;
    border-bottom: 1px solid var(--pico-muted-border-color);
    background: color-mix(in srgb, var(--pico-background-color) 94%, transparent);
    backdrop-filter: blur(16px);
}

.site-brand-row {
    display: flex;
    min-height: 3.4rem;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
}

.site-brand {
    display: inline-flex;
    gap: 0.42rem;
    align-items: baseline;
    color: var(--pico-color);
    text-decoration: none;
    white-space: nowrap;
}

.site-brand strong {
    letter-spacing: 0.08em;
}

.site-brand span {
    color: var(--pico-muted-color);
    font-size: 0.8rem;
}

.primary-nav {
    border-top: 1px solid color-mix(
        in srgb,
        var(--pico-muted-border-color) 72%,
        transparent
    );
}

.primary-nav .container-fluid {
    display: flex;
    gap: 0.25rem;
    overflow-x: auto;
    padding-top: 0.28rem;
    padding-bottom: 0.28rem;
    scrollbar-width: none;
}

.primary-nav .container-fluid::-webkit-scrollbar {
    display: none;
}

.primary-nav a {
    display: inline-flex;
    min-height: 44px;
    flex: 0 0 auto;
    align-items: center;
    padding: 0.48rem 0.78rem;
    border-radius: 12px;
    color: var(--pico-muted-color);
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.primary-nav a:is(:hover, :focus, .is-active) {
    background: var(--pico-primary-background);
    color: var(--pico-primary-inverse);
}

.account-menu {
    position: relative;
    margin: 0;
}

.account-menu summary {
    display: inline-flex;
    min-height: 44px;
    gap: 0.5rem;
    align-items: center;
    padding: 0.35rem 0.55rem;
    border-radius: 12px;
    color: var(--pico-color);
    cursor: pointer;
    font-size: 0.86rem;
    font-weight: 700;
    list-style: none;
}

.account-menu summary::-webkit-details-marker {
    display: none;
}

.account-menu summary:is(:hover, :focus) {
    background: var(--pico-muted-border-color);
}

.account-menu-avatar {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 50%;
    background: var(--pico-primary-background);
    color: var(--pico-primary-inverse);
    text-transform: uppercase;
}

.account-menu-panel {
    position: absolute;
    z-index: 50;
    top: calc(100% + 0.4rem);
    right: 0;
    display: grid;
    width: min(18rem, calc(100vw - 2rem));
    max-height: calc(100vh - 5rem);
    max-height: calc(100dvh - 5rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0.45rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 16px;
    background: var(--pico-card-background-color);
    box-shadow: 0 18px 48px rgba(23, 32, 29, 0.16);
}

.account-menu-panel a,
.account-menu-panel button {
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 0.65rem 0.75rem;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--pico-color);
    font: inherit;
    text-align: left;
    text-decoration: none;
}

.account-menu-panel :is(a, button):is(:hover, :focus) {
    background: var(--pico-muted-border-color);
}

.account-menu-panel form {
    margin: 0.2rem 0 0;
    padding-top: 0.2rem;
    border-top: 1px solid var(--pico-muted-border-color);
}

.account-menu-logout button {
    color: var(--pico-del-color);
    font-weight: 700;
}

.account-menu-workspaces {
    display: none;
}

.account-processing-consents {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.85rem;
}

.account-processing-consents article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0;
    padding: 0.85rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 14px;
    box-shadow: none;
}

.account-processing-consents :is(p, form, button) {
    margin-bottom: 0;
}

.taste-compass-page {
    max-width: 46rem;
    margin: 1.25rem auto 0;
}

.taste-compass-empty {
    padding: clamp(1.25rem, 5vw, 2.25rem);
    text-align: center;
}

.consumer-bottom-nav {
    display: none;
}

.account-page {
    max-width: 58rem;
    margin: 1.25rem auto 0;
}

.account-page-header {
    margin-bottom: 1rem;
}

.account-page-header :is(h1, p) {
    margin-bottom: 0.35rem;
}

.account-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.account-card {
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 18px;
    box-shadow: none;
}

.account-card-wide {
    grid-column: 1 / -1;
}

.account-card h2 {
    margin-bottom: 0.8rem;
    font-size: 1.05rem;
}

.account-facts {
    display: grid;
    gap: 0.55rem;
    margin: 0;
}

.account-facts > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid var(--pico-muted-border-color);
}

.account-facts > div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.account-facts :is(dt, dd) {
    margin: 0;
}

.account-facts dt {
    color: var(--pico-muted-color);
}

.account-facts dd {
    overflow-wrap: anywhere;
    text-align: right;
}

.account-product-list,
.account-lab-list {
    margin: 0;
}

.account-lab-list {
    display: grid;
    gap: 0.55rem;
    padding: 0;
    list-style: none;
}

.account-lab-list li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 0.7rem;
    border-radius: 12px;
    background: var(--pico-muted-border-color);
}

.account-lab-list li > span:first-child {
    display: grid;
}

.account-page-logout {
    display: flex;
    justify-content: flex-end;
    margin: 1rem 0 0;
}

.account-page-logout button {
    width: auto;
    margin: 0;
}

.account-settings-form {
    max-width: 38rem;
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 18px;
    background: var(--pico-card-background-color);
}

.account-settings-form fieldset {
    margin-bottom: 1rem;
}

.account-locale-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.account-locale-options label {
    display: flex;
    min-height: 44px;
    gap: 0.45rem;
    align-items: center;
    margin: 0;
    padding: 0.6rem 0.7rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 12px;
}

.site-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem 1.25rem;
    align-items: center;
}

.auth-panel {
    max-width: 34rem;
    margin: 7vh auto 0;
}

.auth-panel .eyebrow {
    margin-bottom: 0.25rem;
    color: var(--pico-muted-color);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.auth-form {
    padding: 1.25rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 1rem;
    background: var(--pico-card-background-color);
}

.auth-callout {
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 1rem;
}

/* ── 가격 ── */
.price {
    color: var(--pico-primary);
    font-weight: 700;
    font-size: 1.05em;
}

.muted {
    opacity: 0.65;
}

.status-dot {
    display: inline-block;
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 50%;
    margin-right: 0.35rem;
    vertical-align: middle;
}
.status-dot-ok { background: #16a34a; }
.status-dot-warning { background: #d97706; }
.status-dot-stale { background: #dc2626; }
.status-dot-critical { background: #b91c1c; }
.status-dot-unknown { background: #6b7280; }

/* ── 배지 ── */
.badge {
    display: inline-block;
    padding: 0.15em 0.55em;
    border-radius: 4px;
    font-size: 0.78em;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
}
.badge-partner  { background: var(--color-partner); }
.badge-store    { background: var(--color-store); }
.badge-cu       { background: var(--color-cu); }
.badge-emart24  { background: var(--color-emart24); color: #1e293b; }
.badge-delivery { background: var(--color-delivery); }
.badge-dutyfree { background: var(--color-dutyfree); }
.badge-overseas { background: var(--color-overseas); }
.badge-etc      { background: var(--color-etc); }

/* ── 태그 ── */
.tag {
    display: inline-block;
    padding: 0.1em 0.5em;
    border-radius: 3px;
    font-size: 0.78em;
    background: var(--pico-muted-border-color);
    color: var(--pico-color);
    margin: 0.1em 0.15em;
}
/* ── 상품 그리드 ── */
.product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}
.product-card {
    padding: 0.8rem;
    border-radius: 8px;
    transition: box-shadow 0.2s;
}
.product-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.product-card a {
    text-decoration: none;
    color: inherit;
}
.product-thumb {
    width: 100%;
    height: 180px;
    object-fit: contain;
    border-radius: 6px;
    background: #f8fafc;
}
.placeholder-img {
    background: linear-gradient(135deg, #e2e8f0, #cbd5e1);
}
.product-info {
    padding-top: 0.5rem;
}
.product-info strong {
    display: block;
    font-size: 0.92em;
    line-height: 1.35;
    margin-bottom: 0.2em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.product-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin: 0.4rem 0;
}

.product-hero-img {
    max-width: 320px;
    max-height: 400px;
    width: 100%;
    object-fit: contain;
    border-radius: 12px;
    background: #f8fafc;
}

/* ── 테이블 작은 썸네일 ── */
.thumb-sm {
    width: 48px;
    height: 48px;
    object-fit: contain;
    border-radius: 4px;
}

/* ── 필터 폼 ── */
.filter-form .grid {
    grid-template-columns: 2fr 1fr 1fr 1fr;
}
.filter-form button {
    margin-top: 0;
}

/* ── 상태 표현 ── */
.status-pill {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
}
.status-pill-ok {
    background: #dcfce7;
    color: #166534;
}
.status-pill-warning {
    background: #fef3c7;
    color: #92400e;
}
.status-pill-stale {
    background: #fee2e2;
    color: #991b1b;
}
.status-pill-critical {
    background: #fecaca;
    color: #7f1d1d;
}
.status-pill-unknown {
    background: #e5e7eb;
    color: #374151;
}

/* ── 수집 운영 ── */
.admin-subnav {
    display: flex;
    gap: 0.5rem;
    margin: 0 0 1.25rem;
    padding: 0.4rem;
    overflow-x: auto;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 999px;
    background: var(--pico-card-background-color);
    white-space: nowrap;
    scrollbar-width: thin;
}

.admin-subnav a {
    flex: 0 0 auto;
    padding: 0.5rem 0.85rem;
    border-radius: 999px;
    color: var(--pico-muted-color);
    font-size: 0.84rem;
    font-weight: 700;
    text-decoration: none;
}

.admin-subnav a:is(:hover, :focus, .is-active) {
    background: var(--pico-primary-background);
    color: var(--pico-primary-inverse);
}

/* ── 접근 관리 ── */
.access-admin-header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: clamp(1.1rem, 3vw, 1.8rem);
    border: 1px solid color-mix(in srgb, var(--pico-primary) 24%, var(--pico-muted-border-color));
    border-radius: 1.15rem;
    background:
        linear-gradient(135deg, rgba(15, 118, 110, 0.12), transparent 55%),
        var(--pico-card-background-color);
}

.access-admin-header :is(h1, p),
.access-result-heading :is(h2, span),
.access-person-card :is(header, footer, p),
.access-membership-list article,
.access-command-status {
    margin-bottom: 0;
}

.access-admin-kicker {
    color: var(--pico-primary);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.access-backend-badge,
.access-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--pico-primary) 10%, var(--pico-card-background-color));
    color: var(--pico-primary);
    font-size: 0.75rem;
    font-weight: 750;
}

.access-filter-bar {
    display: grid;
    grid-template-columns: minmax(14rem, 2fr) repeat(3, minmax(8rem, 1fr)) auto;
    gap: 0.75rem;
    align-items: end;
    margin-bottom: 1.5rem;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 1rem;
}

.access-filter-bar label,
.access-filter-bar :is(input, select, button) {
    margin-bottom: 0;
}

.access-filter-bar label > span {
    display: block;
    margin-bottom: 0.3rem;
    color: var(--pico-muted-color);
    font-size: 0.76rem;
    font-weight: 700;
}

.access-result-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.access-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 1rem;
}

.access-people-table {
    margin-bottom: 0;
}

.access-people-table th,
.access-people-table td {
    padding: 0.75rem 0.9rem;
    vertical-align: middle;
}

.access-people-table td:first-child small,
.access-person-card header small {
    display: block;
    margin-top: 0.15rem;
    color: var(--pico-muted-color);
}

.access-badge-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.access-mobile-only {
    display: none;
}

.access-people-grid,
.access-membership-list {
    gap: 0.75rem;
}

.access-person-card,
.access-membership-list article,
.access-command-card,
.access-empty-state,
.access-readonly-notice {
    margin: 0;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 1rem;
    background: var(--pico-card-background-color);
}

.access-person-card {
    padding: 1rem;
}

.access-person-card header,
.access-person-card footer,
.access-membership-list article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.access-person-card .access-badge-row {
    margin: 0.9rem 0;
}

.access-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.access-command-card {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
}

.access-command-card :is(label, select, fieldset, button) {
    margin-bottom: 0;
}

.access-membership-list {
    display: grid;
    margin-bottom: 1rem;
}

.access-membership-list article {
    padding: 0.75rem 0.9rem;
}

.access-readonly-notice {
    margin-bottom: 1rem;
    padding: 0.8rem 1rem;
    border-left: 4px solid #b45309;
}

.access-command-status:not(:empty) {
    color: var(--pico-del-color);
}

.access-admin-header > button {
    width: auto;
    margin-bottom: 0;
    white-space: nowrap;
}

.access-invitation-secret {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.85rem 1rem;
    align-items: end;
    margin-bottom: 1rem;
    border-left: 4px solid var(--pico-primary);
}

.access-invitation-secret > div,
.access-invitation-secret label {
    grid-column: 1 / -1;
    margin-bottom: 0;
}

.access-invitation-secret :is(p, input, button) {
    margin-bottom: 0;
}

.access-invitation-filter {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1rem;
}

.access-invitation-filter label {
    width: min(100%, 14rem);
    margin-bottom: 0;
}

.access-invitation-filter label > span {
    display: block;
    margin-bottom: 0.3rem;
    color: var(--pico-muted-color);
    font-size: 0.76rem;
    font-weight: 700;
}

.access-invitation-filter select {
    margin-bottom: 0;
}

.access-invitation-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.access-invitation-card {
    display: grid;
    gap: 0.85rem;
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 1rem;
}

.access-invitation-card > header,
.access-invitation-actions {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.access-invitation-card header small {
    display: block;
    margin-top: 0.2rem;
    color: var(--pico-muted-color);
}

.access-invitation-card dl {
    display: grid;
    gap: 0.35rem;
    margin: 0;
}

.access-invitation-card dl div {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
}

.access-invitation-card :is(dt, dd, form, button, p) {
    margin-bottom: 0;
}

.access-invitation-card dt {
    color: var(--pico-muted-color);
}

.access-invitation-actions {
    justify-content: flex-end;
}

.access-invitation-actions form {
    display: flex;
    gap: 0.5rem;
}

.access-invitation-dialog {
    width: min(42rem, calc(100% - 2rem));
}

.access-invitation-dialog > article {
    margin-bottom: 0;
}

.access-invitation-form {
    display: grid;
    gap: 0.8rem;
}

.access-invitation-form :is(label, input, select, button, article) {
    margin-bottom: 0;
}

.access-effective-preview {
    padding: 0.85rem 1rem;
    border: 1px solid color-mix(in srgb, var(--pico-primary) 28%, var(--pico-muted-border-color));
    border-radius: 0.8rem;
    background: color-mix(in srgb, var(--pico-primary) 7%, var(--pico-card-background-color));
}

.access-effective-preview p {
    margin: 0.2rem 0 0;
}

.access-confirmation {
    padding-top: 0.2rem;
}

.access-lab-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.access-lab-card {
    display: grid;
    gap: 1rem;
    padding: 1.1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 1rem;
    color: inherit;
    text-decoration: none;
    background: var(--pico-card-background-color);
}

.access-lab-card:is(:hover, :focus) {
    border-color: var(--pico-primary);
    box-shadow: 0 0.6rem 1.8rem rgba(15, 23, 42, 0.08);
}

.access-lab-card header,
.access-lab-card dl div,
.access-lab-section > header,
.access-danger-zone,
.access-inline-command,
.access-member-actions,
.access-member-actions form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.access-lab-card :is(header, dl, dt, dd, small),
.access-lab-section :is(h2, h3, p),
.access-danger-zone :is(p, form, button),
.access-member-actions :is(form, select, button) {
    margin-bottom: 0;
}

.access-lab-card header small,
.access-inline-command small,
.access-membership-list small {
    display: block;
    color: var(--pico-muted-color);
}

.access-lab-card dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0;
}

.access-lab-card dl div {
    display: grid;
    gap: 0.1rem;
}

.access-lab-card dt {
    color: var(--pico-muted-color);
    font-size: 0.75rem;
}

.access-lab-card dd {
    font-weight: 750;
}

.access-lab-open,
.access-back-link {
    color: var(--pico-primary);
    font-size: 0.82rem;
    font-weight: 750;
}

.access-lab-header {
    align-items: center;
}

.access-section-nav {
    position: sticky;
    top: 0;
    z-index: 4;
    display: flex;
    gap: 0.35rem;
    margin-bottom: 1.5rem;
    padding: 0.45rem;
    overflow-x: auto;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 0.9rem;
    background: color-mix(in srgb, var(--pico-background-color) 92%, transparent);
    backdrop-filter: blur(0.7rem);
    white-space: nowrap;
}

.access-section-nav a {
    flex: 1 0 auto;
    padding: 0.45rem 0.75rem;
    border-radius: 0.65rem;
    text-align: center;
    text-decoration: none;
}

.access-section-nav a:is(:hover, :focus, .is-active) {
    background: color-mix(in srgb, var(--pico-primary) 10%, transparent);
}

.access-lab-filters {
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
    margin-bottom: 0.5rem;
}

.access-lab-filters label {
    width: min(100%, 12rem);
    margin-bottom: 0;
}

.access-lab-filters label > span {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--pico-muted-color);
    font-size: 0.75rem;
    font-weight: 700;
}

.access-lab-filters select {
    margin-bottom: 0;
}

.access-lab-section {
    display: grid;
    gap: 1rem;
    padding: 1.25rem 0;
    scroll-margin-top: 5rem;
    border-bottom: 1px solid var(--pico-muted-border-color);
}

.access-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.access-metric-grid article {
    display: grid;
    gap: 0.2rem;
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 0.9rem;
}

.access-metric-grid strong {
    font-size: 1.6rem;
}

.access-metric-grid span,
.access-member-group h3 span {
    color: var(--pico-muted-color);
    font-size: 0.78rem;
}

.access-member-group {
    display: grid;
    gap: 0.65rem;
}

.access-member-actions form:first-child {
    display: grid;
    grid-template-columns: minmax(8rem, 1fr) auto;
}

.access-inline-command {
    align-items: end;
}

.access-inline-command form,
.access-inline-form {
    display: grid;
    grid-template-columns: minmax(10rem, 2fr) minmax(8rem, 1fr) auto;
    gap: 0.6rem;
    align-items: end;
    margin-bottom: 0;
}

.access-inline-form {
    grid-template-columns: minmax(10rem, 2fr) repeat(2, minmax(7rem, 1fr)) auto;
}

.access-inline-command form :is(select, button),
.access-inline-form :is(input, select, button) {
    margin-bottom: 0;
}

.access-inline-command .access-command-status,
.access-inline-form .access-command-status {
    grid-column: 1 / -1;
}

.access-empty-row {
    padding: 0.75rem;
    color: var(--pico-muted-color);
}

.access-danger-zone {
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--pico-del-color) 35%, var(--pico-muted-border-color));
    border-radius: 1rem;
}

.access-review-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.access-review-metric {
    display: grid;
    gap: 0.2rem;
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 0.9rem;
}

.access-review-metric strong {
    font-size: 1.7rem;
}

.access-review-metric span {
    color: var(--pico-muted-color);
}

.access-review-metric.is-critical {
    border-color: color-mix(in srgb, var(--pico-del-color) 42%, var(--pico-muted-border-color));
}

.access-review-metric.is-warning {
    border-color: color-mix(in srgb, #b45309 42%, var(--pico-muted-border-color));
}

.access-review-filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(10rem, 1fr)) auto;
    gap: 0.65rem;
    align-items: end;
    margin-bottom: 1rem;
}

.access-review-filters :is(label, select, button) {
    margin-bottom: 0;
}

.access-review-filters label > span {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--pico-muted-color);
    font-size: 0.75rem;
    font-weight: 700;
}

.access-review-list {
    display: grid;
    gap: 0.75rem;
}

.access-review-issue {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-left-width: 4px;
    border-radius: 0.9rem;
}

.access-review-issue.is-critical {
    border-left-color: var(--pico-del-color);
}

.access-review-issue.is-warning {
    border-left-color: #b45309;
}

.access-review-issue :is(h2, p) {
    margin-bottom: 0;
}

.access-review-issue h2 {
    margin-top: 0.45rem;
    font-size: 1rem;
}

.access-review-issue p {
    margin-top: 0.25rem;
    color: var(--pico-muted-color);
}

@media (max-width: 767px) {
    .access-admin-header,
    .access-detail-grid,
    .access-filter-bar {
        grid-template-columns: 1fr;
    }

    .access-admin-header {
        display: grid;
        align-items: start;
    }

    .access-admin-header > button,
    .access-invitation-filter label {
        width: 100%;
    }

    .access-invitation-secret,
    .access-invitation-list,
    .access-lab-grid,
    .access-metric-grid,
    .access-review-summary,
    .access-review-filters,
    .access-review-issue {
        grid-template-columns: 1fr;
    }

    .access-review-issue > a {
        width: 100%;
    }

    .access-invitation-card > header {
        align-items: flex-start;
    }

    .access-invitation-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .access-invitation-actions form,
    .access-invitation-actions button {
        width: 100%;
    }

    .access-lab-card dl {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .access-inline-command,
    .access-danger-zone,
    .access-membership-list article,
    .access-member-actions,
    .access-lab-filters {
        display: grid;
        align-items: stretch;
    }

    .access-lab-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .access-lab-filters label {
        width: 100%;
    }

    .access-inline-command form,
    .access-inline-form,
    .access-member-actions form:first-child {
        grid-template-columns: 1fr;
    }

    .access-member-actions :is(form, button, select) {
        width: 100%;
    }

    .access-desktop-only {
        display: none;
    }

    .access-mobile-only {
        display: grid;
    }
}

.crawler-admin-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: end;
    margin-bottom: 1.5rem;
    padding: clamp(1rem, 3vw, 1.75rem);
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 1.25rem;
    background:
        radial-gradient(circle at 90% 10%, rgba(15, 118, 110, 0.14), transparent 32%),
        var(--pico-card-background-color);
}

.crawler-admin-header :is(h1, p),
.crawler-admin-card :is(h3, p),
.crawler-admin-card header,
.crawler-freshness-row :is(strong, time) {
    margin-bottom: 0;
}

.crawler-generated-at {
    display: grid;
    gap: 0.25rem;
    justify-items: end;
    text-align: right;
}

.crawler-admin-section {
    margin-top: 1.75rem;
}

.crawler-admin-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.crawler-admin-card {
    min-width: 0;
    height: 100%;
    margin: 0;
}

.crawler-overall-card {
    border-left: 4px solid var(--pico-primary);
}

.crawler-metric-list,
.crawler-band-list,
.crawler-run-progress dl,
.crawler-admin-issue-card dl {
    display: grid;
    gap: 0.65rem;
    margin: 0;
}

.crawler-metric-list > div,
.crawler-band-list > div,
.crawler-run-progress dl > div,
.crawler-admin-issue-card dl > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(6rem, 1fr);
    gap: 0.75rem;
    align-items: start;
}

.crawler-metric-list :is(dt, dd),
.crawler-band-list :is(dt, dd),
.crawler-run-progress :is(dt, dd),
.crawler-admin-issue-card :is(dt, dd) {
    margin: 0;
}

.crawler-metric-list dd,
.crawler-band-list dd,
.crawler-run-progress dd {
    text-align: right;
}

.crawler-metric-list progress,
.crawler-admin-card > progress,
.crawler-run-progress progress {
    display: block;
    width: 100%;
    margin-top: 0.35rem;
}

.crawler-run-progress,
.crawler-capability-list {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
    padding-top: 0.9rem;
    border-top: 1px solid var(--pico-muted-border-color);
}

.crawler-run-progress > div {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
}

.crawler-freshness-list,
.crawler-admin-issue-list {
    display: grid;
    gap: 0.75rem;
}

.crawler-freshness-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 0.8rem 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 0.85rem;
}

.crawler-freshness-row > div {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.crawler-admin-issue-card {
    display: grid;
    grid-template-columns: minmax(140px, 0.8fr) minmax(0, 2fr);
    gap: 0.5rem 1rem;
}

.crawler-empty-state {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    margin: 0;
}

@media (max-width: 760px) {
    .crawler-admin-header,
    .crawler-admin-grid,
    .crawler-admin-issue-card {
        grid-template-columns: 1fr;
    }

    .crawler-generated-at {
        justify-items: start;
        text-align: left;
    }

    .crawler-freshness-row {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ── 모바일 반응형 ── */
@media (max-width: 768px) {
    .filter-form .grid {
        grid-template-columns: 1fr;
    }
    .product-grid {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }
    .product-thumb {
        height: 140px;
    }
    .product-hero-img {
        max-width: 240px;
        max-height: 300px;
    }
    table {
        font-size: 0.85em;
    }
    .thumb-sm {
        width: 36px;
        height: 36px;
    }
}

@media (max-width: 480px) {
    .product-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }
    .product-thumb {
        height: 120px;
    }
}

/* ── Flash ── */
.flash-stack {
    margin-bottom: 1rem;
}
.flash-message {
    margin-bottom: 0.75rem;
    border-left: 4px solid var(--pico-primary);
}
.flash-success {
    border-left-color: var(--color-instock);
}
.flash-error {
    border-left-color: var(--color-soldout);
}

/* ── Inventory Ops ── */
.ops-header,
.ops-page-header {
    margin-bottom: 1.25rem;
}
.ops-shell-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin: 0 0 1.5rem;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.98));
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.05);
}
.ops-shell-nav-label {
    flex: 0 0 auto;
    padding-left: 0.25rem;
    color: #475569;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.ops-shell-nav .ops-subnav {
    margin: 0;
}
.ops-subnav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 0.55rem;
    margin: 0 0 1rem;
}
.ops-subnav a {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.95rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 999px;
    text-decoration: none;
    color: inherit;
    background: var(--pico-background-color);
    font-weight: 700;
    line-height: 1.2;
}
.ops-subnav a.is-active {
    background: var(--pico-primary-background);
    border-color: var(--pico-primary-border);
    color: var(--pico-primary-inverse);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
}
.ops-page-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
}
.ops-page-header > * {
    margin-bottom: 0;
}
.ops-stats article h3 {
    margin-bottom: 0.2rem;
}
.ops-panel {
    height: 100%;
}
.ops-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}
.ops-bottle-stack {
    display: grid;
    gap: 0.8rem;
}
.ops-session-stack {
    display: grid;
    gap: 0.8rem;
}
.ops-bottle-card {
    display: grid;
    gap: 0.45rem;
    padding: 0.9rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
}
.ops-bottle-card:hover {
    background: rgba(15, 23, 42, 0.02);
}
.ops-session-card {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 10px;
}
.ops-bottle-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}
.ops-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.75rem;
}
.ops-kpi-list {
    display: grid;
    gap: 0.45rem;
    margin: 0.75rem 0 1rem;
}
.ops-kpi-list-compact {
    margin-bottom: 0;
}
.ops-kpi-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid var(--pico-muted-border-color);
}
.ops-kpi-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}
.ops-coverage-stack {
    display: grid;
    gap: 0.8rem;
}
.ops-coverage-row {
    display: grid;
    gap: 0.35rem;
}
.ops-coverage-row > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: baseline;
}
.ops-analytics-stack {
    display: grid;
    gap: 1rem;
}
.ops-analytics-split {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(240px, 0.9fr);
    gap: 1.25rem;
    align-items: start;
}
.ops-analytics-pressure {
    grid-template-columns: minmax(240px, 0.95fr) minmax(0, 1.45fr);
}
.ops-analytics-main,
.ops-analytics-side {
    min-width: 0;
}
.ops-analytics-side {
    display: grid;
    gap: 0.9rem;
    align-content: start;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.03);
}
.ops-analytics-side-block {
    display: grid;
    gap: 0.6rem;
}
.ops-analytics-side-title {
    font-size: 0.88rem;
}
.ops-analytics-value-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1rem;
}
.ops-analytics-value-grid > article {
    margin-bottom: 0;
}
.ops-chip-list-tight {
    margin-top: 0;
}
.half-star-rating-list {
    display: grid;
    gap: 0.8rem;
}
.half-star-rating-row {
    display: grid;
    grid-template-columns: minmax(3.5rem, 0.35fr) minmax(10rem, 1fr) minmax(4.5rem, auto);
    gap: 0.8rem;
    align-items: center;
    padding: 0.45rem 0;
}
.half-star-rating-title {
    font-weight: 700;
    color: var(--pico-color);
}
.half-star-rating-stars {
    display: inline-flex;
    gap: 0.15rem;
    align-items: center;
}
.half-star-rating-value {
    min-width: 4.5rem;
    color: var(--pico-muted-color);
    font-variant-numeric: tabular-nums;
    text-align: right;
}
.half-star {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 1.55rem;
    height: 1.55rem;
    line-height: 1;
    color: rgba(148, 163, 184, 0.75);
    font-size: 1.35rem;
}
.half-star::before,
.half-star::after {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    pointer-events: none;
}
.half-star::before {
    content: "☆";
}
.half-star::after {
    content: "★";
    width: 0;
    overflow: hidden;
    color: #d97706;
    place-items: center start;
}
.half-star.is-full::after {
    width: 100%;
}
.half-star.is-half::after {
    width: 50%;
}
.half-star-target {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 2;
    min-width: 0;
    width: 50%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    cursor: pointer;
}
.half-star-target:hover,
.half-star-target:focus {
    background: transparent;
    box-shadow: none;
}
.half-star-target:focus-visible {
    outline: 2px solid var(--pico-primary);
    outline-offset: 3px;
    border-radius: 999px;
}
.half-star-left {
    left: 0;
}
.half-star-right {
    right: 0;
}
.ops-table-wrap {
    overflow-x: auto;
}
.ops-table-wrap table {
    margin-bottom: 0;
}
.ops-table-wrap-category table {
    min-width: 420px;
}
.ops-table-wrap-risk table {
    min-width: 680px;
}
.ops-analytics-panel .ops-table th,
.ops-analytics-panel .ops-table td {
    word-break: keep-all;
}
.ops-analytics-risk-table th:nth-child(2),
.ops-analytics-risk-table td:nth-child(2),
.ops-analytics-risk-table th:nth-child(3),
.ops-analytics-risk-table td:nth-child(3),
.ops-analytics-risk-table th:nth-child(4),
.ops-analytics-risk-table td:nth-child(4) {
    white-space: nowrap;
}
.ops-analytics-callout {
    margin: 0;
    line-height: 1.6;
}
.ops-analytics-coverage .ops-coverage-row > div {
    flex-wrap: wrap;
}
.ops-table td,
.ops-table th {
    vertical-align: middle;
}
.ops-empty-state {
    text-align: center;
    padding: 2rem 1rem;
}
.ops-search-form .grid,
.ops-filter-form .grid {
    grid-template-columns: 2fr 1fr;
}
.ops-selected-product {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 1rem;
    align-items: center;
    margin-top: 1rem;
}
.ops-selection-note {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.9rem;
}
.ops-selected-product .product-hero-img {
    max-width: 120px;
    max-height: 150px;
}
.ops-inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    margin-top: 1rem;
}
.ops-inline-actions form {
    display: flex;
    align-items: center;
    margin: 0;
}
.ops-inline-actions :is(a[role="button"], button) {
    margin: 0;
}
.ops-quick-actions {
    margin: 0 0 1rem;
}
.ops-inline-actions > * {
    width: auto;
    margin-bottom: 0;
}
.capture-form textarea {
    min-height: 11rem;
}
.capture-inbox {
    display: grid;
    gap: 1rem;
}
.capture-card details {
    margin: 0.75rem 0;
}
.capture-section {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.9rem;
}
.tag-row,
.capture-action-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}
.capture-action {
    display: grid;
    gap: 0.25rem;
    min-width: min(100%, 240px);
    padding: 0.7rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 12px;
    background: #f8fafc;
}
.capture-status-draft { background: #d97706; }
.capture-status-reviewed { background: #16a34a; }
.capture-status-archived { background: #6b7280; }
.ops-compact-form {
    margin: 0.5rem 0;
}
.ops-compact-form button {
    width: auto;
    margin: 0;
}
.ops-search-results .product-card {
    display: flex;
    flex-direction: column;
}
.ops-form .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ops-form-actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}
.ops-detail-hero {
    display: grid;
    grid-template-columns: minmax(160px, 220px) 1fr;
    gap: 1rem;
    align-items: start;
}
.ops-detail-table th,
.ops-detail-table td {
    padding: 0.45rem 0.35rem;
    border-bottom: 1px solid var(--pico-muted-border-color);
}
.ops-detail-table th {
    width: 110px;
    text-align: left;
}
.ops-volume-control {
    height: auto;
    scroll-margin-top: 1rem;
}
.ops-volume-control .ops-panel-header > div {
    display: grid;
    gap: 0.2rem;
}
.ops-volume-readout {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
    margin: 1rem 0 0.45rem;
}
.ops-volume-readout strong {
    font-size: clamp(1.65rem, 5vw, 2.3rem);
    line-height: 1;
}
.ops-volume-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1rem;
}
.ops-volume-actions form,
.ops-volume-footer form {
    margin: 0;
}
.ops-volume-button {
    display: grid;
    width: 100%;
    min-height: 44px;
    margin: 0;
    place-content: center;
    gap: 0.1rem;
}
.ops-volume-button small {
    opacity: 0.75;
}
.ops-volume-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-top: 1rem;
}
.ops-volume-footer button {
    width: auto;
    min-width: 110px;
    margin: 0;
}
.ops-advanced-panel {
    height: auto;
}
.ops-advanced-panel > summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
}
.ops-advanced-content {
    margin-top: 1.25rem;
}
.ops-advanced-content > h3 {
    margin-bottom: 1rem;
}
.ops-secondary-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    padding-top: 1.25rem;
    margin-top: 1.25rem;
    border-top: 1px solid var(--pico-muted-border-color);
}
.ops-flat-list {
    padding-left: 1.2rem;
    margin-bottom: 0;
}
.ops-feedback-list {
    display: grid;
    gap: 0.55rem;
    margin-bottom: 1rem;
}
.ops-feedback-row {
    display: grid;
    gap: 0.15rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid var(--pico-muted-border-color);
}
.ops-feedback-row:last-child {
    border-bottom: none;
}
.tasting-note-stack {
    display: grid;
    gap: 0.9rem;
}
.tasting-note-card {
    overflow: hidden;
}
.tasting-note-preview {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 0.25rem;
    line-height: 1.6;
}
.tasting-note-raw {
    white-space: pre-line;
    line-height: 1.75;
}
.tasting-timeline-summary {
    display: grid;
    gap: 0.35rem;
    margin-bottom: 1rem;
}
.tasting-timeline {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 0.6rem;
}
.tasting-timeline-item {
    display: grid;
    gap: 0.2rem;
    padding: 0.75rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
    background: #fff;
}
.tasting-timeline-item:hover {
    background: #f8fafc;
}
.tasting-timeline-item.is-current {
    border-color: var(--pico-primary-border);
    box-shadow: 0 0 0 2px rgba(2, 132, 199, 0.12);
}
.tasting-timeline-item small {
    color: #64748b;
    line-height: 1.35;
}
.tasting-candidate-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.75rem;
    margin-top: 0.75rem;
}
.tasting-note-search-panel {
    background: linear-gradient(135deg, #f8fafc, #ffffff);
}
.tasting-source-layout,
.tasting-lab-list,
.tasting-external-entry {
    display: grid;
    gap: 0.65rem;
}
.tasting-external-entry {
    margin-top: 0.35rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--pico-muted-border-color);
}
.tasting-source-choice {
    display: grid;
    gap: 0.2rem;
    padding: 0.85rem 0.95rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 12px;
    color: inherit;
    text-decoration: none;
    background: #fff;
}
.tasting-source-choice:hover,
.tasting-source-choice.is-active {
    border-color: rgba(15, 118, 110, 0.35);
    background: #f0fdfa;
}
.tasting-selected-bottle {
    display: grid;
    gap: 0.25rem;
    padding: 0.9rem;
    border: 1px solid rgba(15, 118, 110, 0.25);
    border-radius: 12px;
    background: #f0fdfa;
}
.taste-coordinate-bars {
    display: grid;
    gap: 0.5rem;
}
.taste-coordinate-bars > div {
    display: grid;
    grid-template-columns: 92px 1fr;
    gap: 0.75rem;
    align-items: center;
}
.taste-coordinate-bars span {
    font-size: 0.82rem;
    color: #475569;
}
.taste-coordinate-bars progress {
    margin-bottom: 0;
}
.decoder-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 0.85rem;
}
.decoder-card {
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 12px;
    padding: 0.9rem;
    background: #fff;
}
.decoder-card header {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: flex-start;
}
.decoder-card p:last-child {
    margin-bottom: 0;
}
.compass-panel {
    border-color: rgba(15, 118, 110, 0.35);
    background: linear-gradient(135deg, rgba(240, 253, 250, 0.95), rgba(255, 255, 255, 0.96));
}
.compass-next {
    margin-top: 0.75rem;
    margin-bottom: 0;
}
.inventory-status-sealed {
    background: #0f766e;
}
.inventory-status-opened {
    background: #2563eb;
}
.inventory-status-low {
    background: #d97706;
}
.inventory-status-empty {
    background: #6b7280;
}
.inventory-status-retired {
    background: #7c3aed;
}
.experience-status {
    color: #fff;
}
.experience-status-draft {
    background: #475569;
}
.experience-status-planned {
    background: #0f766e;
}
.experience-status-completed {
    background: #2563eb;
}
.experience-status-cancelled {
    background: #b91c1c;
}
.risk-badge {
    color: #fff;
}
.risk-low {
    background: #15803d;
}
.risk-medium {
    background: #b45309;
}
.risk-high {
    background: #b91c1c;
}
.risk-done {
    background: #4b5563;
}

@media (max-width: 1180px) {
    .ops-analytics-pressure {
        grid-template-columns: 1fr;
    }
    .ops-analytics-value-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1024px) {
    .ops-analytics-split,
    .ops-analytics-pressure {
        grid-template-columns: 1fr;
    }
    .ops-panel-header {
        flex-wrap: wrap;
        align-items: flex-start;
    }
}
.ops-note p:last-child {
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .ops-shell-nav {
        align-items: flex-start;
        border-radius: 18px;
        flex-direction: column;
    }
    .ops-shell-nav .ops-subnav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }
    .ops-shell-nav .ops-subnav a {
        justify-content: center;
        width: 100%;
    }
    .ops-page-header,
    .ops-panel-header,
    .ops-selected-product,
    .ops-detail-hero {
        display: grid;
        grid-template-columns: 1fr;
    }
    .ops-search-form .grid,
    .ops-filter-form .grid,
    .ops-form .grid {
        grid-template-columns: 1fr;
    }
    .ops-form-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .taste-coordinate-bars > div {
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }
    .half-star-rating-row {
        grid-template-columns: 1fr;
        gap: 0.35rem;
    }
    .half-star-rating-value {
        text-align: left;
    }
    .ops-inline-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .ops-inline-actions > * {
        width: 100%;
    }
    .ops-volume-footer {
        align-items: stretch;
        flex-direction: column;
    }
    .ops-volume-footer button,
    .ops-volume-footer form,
    .ops-secondary-actions {
        width: 100%;
    }
    .ops-secondary-actions {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .site-footer {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .ops-shell-nav .ops-subnav {
        grid-template-columns: 1fr;
    }
}

.experience-cockpit {
    display: grid;
    gap: 1rem;
}

.experience-cockpit-header,
.experience-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
}

.experience-cockpit-grid {
    display: grid;
    grid-template-columns: 0.95fr 1.2fr 0.95fr;
    gap: 1rem;
    align-items: start;
}

.experience-panel {
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 12px;
    padding: 1rem;
    background: #fff;
    display: grid;
    gap: 0.85rem;
}

.experience-inline-form {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.5rem;
    align-items: center;
}

.experience-inline-form-compact {
    grid-template-columns: 1fr 1fr auto;
}

.experience-selection-summary {
    padding: 0.65rem 0.8rem;
    border-radius: 10px;
    background: #f5f7fb;
    font-size: 0.92rem;
}

.experience-list,
.experience-search-results,
.experience-feedback-stream {
    display: grid;
    gap: 0.65rem;
}

.experience-card {
    width: 100%;
    text-align: left;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 12px;
    background: #fff;
    padding: 0.85rem;
    display: grid;
    gap: 0.45rem;
}

.experience-card.is-selected {
    border-color: #0f766e;
    box-shadow: 0 0 0 2px rgba(15, 118, 110, 0.12);
}

.experience-card strong {
    display: block;
}

.experience-card span {
    font-size: 0.9rem;
    color: #475569;
}

.experience-card-toggle {
    all: unset;
    cursor: pointer;
    display: grid;
    gap: 0.45rem;
}

.experience-card-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.experience-search-result {
    width: 100%;
    text-align: left;
    border-radius: 10px;
    border: 1px solid var(--pico-muted-border-color);
    background: #f8fafc;
    padding: 0.7rem 0.8rem;
}

.experience-feedback-form {
    display: grid;
    gap: 0.75rem;
}

.experience-sentiment-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.experience-feedback-row {
    padding: 0.75rem 0.85rem;
    border-radius: 10px;
    border: 1px solid var(--pico-muted-border-color);
    background: #fff;
}

.experience-feedback-row strong {
    display: block;
}

.experience-feedback-row span {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.92rem;
    color: #475569;
}

@media (max-width: 1180px) {
    .experience-cockpit-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .experience-inline-form,
    .experience-inline-form-compact {
        grid-template-columns: 1fr;
    }
}

/* ── My Proof personal app shell ── */
.my-proof-hero {
    padding: 1.4rem;
    border: 1px solid rgba(15, 118, 110, 0.18);
    border-radius: 24px;
    background:
        radial-gradient(circle at 10% 15%, rgba(20, 184, 166, 0.18), transparent 32%),
        linear-gradient(135deg, #f8fafc 0%, #ffffff 46%, #f0fdfa 100%);
}

.my-proof-hero .eyebrow {
    margin-bottom: 0.25rem;
    color: #0f766e;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.14em;
}

.my-proof-stats,
.my-bottle-grid {
    display: grid;
    gap: 0.85rem;
}

.my-proof-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 1rem 0;
}

.my-proof-stats article,
.my-proof-panel,
.my-bottle-card {
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 18px;
    background: #fff;
}

.my-proof-stats article {
    padding: 1rem;
}

.my-proof-stats small {
    display: block;
    color: #64748b;
}

.my-proof-stats strong {
    display: block;
    margin-top: 0.35rem;
    font-size: 1.3rem;
}

.my-proof-subnav {
    position: relative;
    z-index: 4;
    display: flex;
    gap: 0.35rem;
    margin: 0.9rem 0 1rem;
    padding: 0.35rem;
    overflow-x: auto;
    border: 1px solid rgba(15, 118, 110, 0.18);
    border-radius: 999px;
    background: rgba(248, 250, 252, 0.9);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
    scrollbar-width: none;
}

.my-proof-subnav::-webkit-scrollbar {
    display: none;
}

.my-proof-subnav a {
    flex: 1 0 auto;
    min-width: max-content;
    padding: 0.48rem 0.9rem;
    border-radius: 999px;
    color: #334155;
    text-align: center;
    text-decoration: none;
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1.2;
}

.my-proof-subnav a:hover,
.my-proof-subnav a:focus,
.my-proof-subnav a.is-active {
    background: #0f766e;
    color: #ffffff;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(15, 118, 110, 0.2);
}

.my-bottle-row small {
    color: #64748b;
    font-size: 0.9rem;
}

.my-proof-quick-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin: 1rem 0;
    padding: 0.9rem;
    border: 1px solid rgba(15, 118, 110, 0.18);
    border-radius: 20px;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 58%, #ecfeff 100%);
}

.my-proof-quick-actions > div {
    min-width: 0;
    margin-right: auto;
}

.my-proof-quick-actions strong,
.my-proof-quick-actions small {
    display: block;
}

.my-proof-panel {
    padding: 1rem;
}

.my-proof-panel header,
.my-bottle-card header,
.my-bottle-row {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: flex-start;
}

.my-bottle-list {
    display: grid;
    gap: 0.55rem;
}

.my-bottle-row {
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--pico-muted-border-color);
    color: inherit;
    text-decoration: none;
}

.my-bottle-row:last-child {
    border-bottom: 0;
}

.my-bottle-row em {
    color: #0f766e;
    font-style: normal;
    font-weight: 700;
    white-space: nowrap;
}

.my-bottle-grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.my-bottle-card {
    padding: 1rem;
}

.my-bottle-card header small {
    color: #0f766e;
    font-weight: 700;
}

.my-collection-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 1.8fr) repeat(2, minmax(140px, 0.7fr)) auto;
    gap: 0.65rem;
    align-items: end;
    margin: 1rem 0;
    padding: 0.75rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 18px;
    background: var(--pico-card-background-color);
}

.my-note-toolbar {
    grid-template-columns: minmax(220px, 1.8fr) minmax(150px, 0.7fr) auto;
}

.my-collection-toolbar :is(label, input, select, button) {
    min-width: 0;
    margin-bottom: 0;
}

.my-collection-count {
    margin: 0.25rem 0 0.55rem;
    color: var(--pico-muted-color);
    font-size: 0.82rem;
}

.my-bottle-collection,
.my-note-collection {
    display: grid;
    overflow: hidden;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 18px;
    background: var(--pico-card-background-color);
}

.my-collection-row {
    display: flex;
    min-width: 0;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 0.85rem 1rem;
    border: 0;
    border-bottom: 1px solid var(--pico-muted-border-color);
    border-radius: 0;
    color: inherit;
    text-decoration: none;
}

.my-collection-row:last-child {
    border-bottom: 0;
}

.my-collection-row:is(a):is(:hover, :focus) {
    background: color-mix(in srgb, var(--pico-primary-background) 6%, transparent);
    text-decoration: none;
}

.my-collection-row-copy {
    min-width: 0;
}

.my-collection-row-copy > :is(strong, small) {
    display: block;
}

.my-collection-row-copy small {
    margin-top: 0.15rem;
    color: var(--pico-muted-color);
    overflow-wrap: anywhere;
}

.my-collection-row-side {
    display: flex;
    flex: 0 0 auto;
    gap: 0.5rem;
    align-items: center;
}

.my-note-collection-row {
    align-items: flex-start;
}

.my-note-collection-row header {
    display: flex;
    gap: 0.65rem;
    align-items: flex-start;
    justify-content: space-between;
}

.my-note-collection-row .tasting-note-preview {
    display: -webkit-box;
    margin: 0.4rem 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.my-note-detail-header {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    margin: 1rem 0;
}

.my-note-detail-header :is(h1, p) {
    margin-bottom: 0.3rem;
}

.my-note-raw-card p {
    white-space: pre-wrap;
}

.my-note-provenance {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.my-note-section-grid,
.my-note-guidance {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.8rem;
    margin: 1rem 0;
}

.my-note-section-grid article,
.my-note-guidance article {
    margin: 0;
}

.my-note-section-grid small {
    color: #0f766e;
    font-weight: 800;
}

.my-note-change-row {
    display: grid;
    grid-template-columns: minmax(8rem, 0.35fr) minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    padding: 0.65rem 0;
    border-top: 1px solid var(--pico-muted-border-color);
}

.my-note-change-row > span {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.my-note-disclosure {
    margin-top: 0.85rem;
}

.my-note-disclosure summary {
    cursor: pointer;
    font-weight: 750;
}

.my-note-technical {
    padding-top: 0.7rem;
}

.my-bottle-detail-header {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    margin: 1rem 0;
}

.my-bottle-detail-header :is(h1, p) {
    margin-bottom: 0.3rem;
}

.my-bottle-condition-facts {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.55rem;
    margin: 0.8rem 0;
}

.my-bottle-condition-facts > div {
    min-width: 0;
    padding: 0.65rem;
    border-radius: 12px;
    background: color-mix(in srgb, var(--pico-muted-border-color) 40%, transparent);
}

.my-bottle-condition-facts :is(dt, dd) {
    margin: 0;
    overflow-wrap: anywhere;
}

.my-bottle-condition-facts dt {
    color: var(--pico-muted-color);
    font-size: 0.75rem;
}

.my-bottle-condition-facts dd {
    margin-top: 0.2rem;
    font-weight: 750;
}

.my-bottle-secondary-events {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.my-bottle-secondary-events form {
    margin: 0;
}

.my-bottle-event-timeline {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.my-bottle-event-timeline li {
    position: relative;
    display: grid;
    grid-template-columns: 1rem minmax(0, 1fr);
    gap: 0.65rem;
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--pico-muted-border-color);
}

.my-bottle-event-timeline li:last-child {
    border-bottom: 0;
}

.my-bottle-event-marker {
    width: 0.65rem;
    height: 0.65rem;
    margin-top: 0.35rem;
    border: 2px solid var(--pico-primary);
    border-radius: 50%;
}

.my-bottle-event-timeline :is(strong, small) {
    display: block;
}

.my-bottle-event-timeline small {
    color: var(--pico-muted-color);
}

.my-bottle-event-timeline p {
    margin: 0.25rem 0 0;
}

.my-note-source-choice {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 0.85rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 14px;
    background: #f8fafc;
}

.my-note-source-choice legend {
    font-weight: 800;
}

.my-note-bottle-picker {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.85rem;
}

.my-note-bottle-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: end;
}

.my-note-bottle-search :is(label, input, button) {
    min-width: 0;
    margin-bottom: 0;
}

.my-note-bottle-results {
    display: grid;
    gap: 0.45rem;
}

.my-note-bottle-option {
    display: grid;
    gap: 0.15rem;
    width: 100%;
    margin: 0;
    padding: 0.7rem 0.8rem;
    text-align: left;
    white-space: normal;
}

.my-note-bottle-option small {
    color: inherit;
    font-size: 0.76rem;
    opacity: 0.78;
}

.my-note-optional-details {
    margin-top: 0.8rem;
    padding: 0.75rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 14px;
}

.my-note-optional-details summary {
    cursor: pointer;
    font-weight: 750;
}

.my-note-optional-details[open] summary {
    margin-bottom: 0.75rem;
}

.my-note-save-actions {
    z-index: 10;
}

.tasting-result-summary-card {
    border-left: 4px solid var(--pico-primary);
}

.tasting-result-core-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.tasting-result-card {
    min-height: 100%;
}

.tasting-result-disclosure summary {
    cursor: pointer;
    font-weight: 700;
}

.tasting-result-disclosure[open] summary {
    margin-bottom: 0.75rem;
}

.tasting-result-details {
    margin-top: 1rem;
}

@media (max-width: 900px) {
    .my-proof-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .my-proof-hero {
        padding: 1rem;
        border-radius: 18px;
    }
    .my-proof-subnav {
        position: sticky;
        top: 0.4rem;
        margin-right: -0.2rem;
        margin-left: -0.2rem;
    }
    .my-proof-stats,
    .my-bottle-grid {
        grid-template-columns: 1fr;
    }
    .my-proof-quick-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .my-proof-quick-actions > div {
        grid-column: 1 / -1;
    }
    .my-proof-subnav,
    .my-proof-breadcrumb {
        display: none;
    }
    .my-proof-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .my-bottle-grid {
        grid-template-columns: 1fr;
    }
    .my-collection-toolbar,
    .my-note-toolbar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .my-collection-query,
    .my-collection-toolbar button {
        grid-column: 1 / -1;
    }
    .my-collection-toolbar button {
        width: 100%;
    }
    .my-collection-row {
        padding: 0.8rem;
    }
    .my-note-detail-header {
        align-items: stretch;
        flex-direction: column;
    }
    .my-note-detail-header .ops-inline-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .my-note-detail-header .ops-inline-actions > * {
        width: 100%;
    }
    .my-note-section-grid,
    .my-note-guidance {
        grid-template-columns: 1fr;
    }
    .my-note-change-row {
        grid-template-columns: 1fr;
    }
    .my-bottle-detail-header {
        align-items: stretch;
        flex-direction: column;
    }
    .my-bottle-detail-header > a[role="button"] {
        width: 100%;
    }
    .my-bottle-condition-facts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .my-bottle-secondary-events {
        grid-template-columns: 1fr;
    }
    .my-note-bottle-search {
        grid-template-columns: 1fr;
    }
    .my-note-bottle-search button {
        width: 100%;
    }
    .my-note-save-actions {
        position: sticky;
        bottom: calc(4rem + env(safe-area-inset-bottom, 0px));
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin: 0.75rem -0.25rem 0;
        padding: 0.6rem;
        border: 1px solid var(--pico-muted-border-color);
        border-radius: 16px;
        background: color-mix(in srgb, var(--pico-background-color) 96%, transparent);
        box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
        backdrop-filter: blur(16px);
    }
    .my-note-save-actions > * {
        width: 100%;
    }
}

@media (max-width: 767px) {
    body {
        padding-bottom: calc(4.35rem + env(safe-area-inset-bottom, 0px));
    }

    .primary-nav {
        display: none;
    }

    .account-menu-workspaces {
        display: grid;
        margin-top: 0.25rem;
        padding-top: 0.4rem;
        border-top: 1px solid var(--pico-muted-border-color);
    }

    .account-menu-workspaces small {
        padding: 0.35rem 0.75rem 0.2rem;
        color: var(--pico-muted-color);
        font-size: 0.7rem;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .consumer-bottom-nav {
        position: fixed;
        z-index: 45;
        right: 0;
        bottom: 0;
        left: 0;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        padding: 0.32rem max(0.35rem, env(safe-area-inset-right, 0px))
            max(0.5rem, env(safe-area-inset-bottom, 0px))
            max(0.35rem, env(safe-area-inset-left, 0px));
        border-top: 1px solid var(--pico-muted-border-color);
        background: color-mix(in srgb, var(--pico-background-color) 96%, transparent);
        box-shadow: 0 -10px 30px rgba(15, 23, 42, 0.08);
        backdrop-filter: blur(18px);
    }

    .consumer-bottom-nav-item,
    .consumer-nav-record {
        display: grid;
        min-width: 44px;
        min-height: 52px;
        place-items: center;
        align-content: center;
        gap: 0.12rem;
        border-radius: 12px;
        color: var(--pico-muted-color);
        font-size: 0.67rem;
        font-weight: 750;
        line-height: 1.1;
        text-decoration: none;
    }

    .consumer-bottom-nav-item svg,
    .consumer-nav-record svg {
        width: 1.25rem;
        height: 1.25rem;
        fill: none;
        stroke: currentColor;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-width: 1.8;
    }

    .consumer-bottom-nav-item:is(:hover, :focus, .is-active),
    .consumer-nav-record:is(:hover, :focus),
    .consumer-nav-record[aria-current="page"] {
        background: color-mix(in srgb, var(--pico-primary-background) 12%, transparent);
        color: var(--pico-primary);
        text-decoration: none;
    }

    .consumer-nav-record {
        transform: translateY(-0.45rem);
        border: 1px solid color-mix(in srgb, var(--pico-primary) 45%, transparent);
        background: var(--pico-primary-background);
        color: var(--pico-primary-inverse);
        box-shadow: 0 8px 20px rgba(15, 118, 110, 0.2);
    }
}

@media (max-width: 430px) {
    main {
        padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
    }

    .account-processing-consents article {
        align-items: stretch;
        flex-direction: column;
    }

    .account-processing-consents button {
        width: 100%;
    }
}

/* ── Consumer home ── */
.proof-home-hero {
    position: relative;
    padding: clamp(1.2rem, 4vw, 2rem);
    overflow: hidden;
    border: 1px solid rgba(15, 118, 110, 0.2);
    border-radius: 24px;
    background:
        radial-gradient(
            circle at 88% 12%,
            rgba(217, 119, 6, 0.2),
            transparent 34%
        ),
        linear-gradient(135deg, #f4fbf8 0%, #fffdf7 66%, #fff6e6 100%);
}

.proof-home-hero::after {
    position: absolute;
    width: 9rem;
    height: 9rem;
    border: 1px solid rgba(15, 118, 110, 0.12);
    border-radius: 50%;
    content: "";
    inset: auto -2rem -5rem auto;
}

.proof-home-hero .eyebrow {
    margin-bottom: 0.25rem;
    color: #0f766e;
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.16em;
}

.proof-home-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    margin: 1rem 0;
    padding: 0.7rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 18px;
    background: var(--pico-card-background-color);
    box-shadow: 0 12px 32px rgba(23, 32, 29, 0.07);
}

.proof-home-search :is(input, button) {
    min-width: 0;
    margin: 0;
}

.proof-home-actions,
.proof-home-summary,
.proof-home-grid {
    display: grid;
    gap: 0.75rem;
}

.proof-home-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.proof-home-action {
    display: grid;
    min-width: 0;
    min-height: 5.5rem;
    align-content: end;
    padding: 1rem;
    border: 1px solid rgba(15, 118, 110, 0.2);
    border-radius: 18px;
    background: linear-gradient(145deg, #ffffff, #eefaf7);
    color: var(--pico-color);
    text-decoration: none;
}

.proof-home-action:nth-child(2) {
    border-color: rgba(217, 119, 6, 0.22);
    background: linear-gradient(145deg, #ffffff, #fff7e8);
}

.proof-home-action small {
    color: var(--pico-muted-color);
}

.proof-home-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.proof-home-summary article {
    min-width: 0;
    margin: 0;
    padding: 0.85rem 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 16px;
}

.proof-home-summary small,
.proof-home-summary strong {
    display: block;
}

.proof-home-summary strong {
    margin-top: 0.25rem;
    color: #0f766e;
    font-size: 1.35rem;
}

.proof-home-unavailable {
    color: var(--pico-muted-color);
    font-size: 0.9rem;
}

.proof-home-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.proof-home-revisit {
    grid-column: 1 / -1;
}

.proof-home-panel {
    min-width: 0;
    margin: 0;
    padding: 1rem;
    border: 1px solid var(--pico-muted-border-color);
    border-radius: 18px;
}

.proof-home-panel > header,
.proof-home-row {
    display: flex;
    min-width: 0;
    gap: 0.75rem;
    align-items: flex-start;
    justify-content: space-between;
}

.proof-home-panel > header {
    margin-bottom: 0.55rem;
}

.proof-home-panel > header span,
.proof-home-row > span:first-child {
    min-width: 0;
}

.proof-home-panel > header :is(small, strong),
.proof-home-row :is(small, strong) {
    display: block;
}

.proof-home-list {
    display: grid;
}

.proof-home-row {
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--pico-muted-border-color);
    color: inherit;
    text-decoration: none;
}

.proof-home-row:last-child {
    border-bottom: 0;
}

.proof-home-row small {
    color: var(--pico-muted-color);
    overflow-wrap: anywhere;
}

.proof-home-row em {
    flex: 0 0 auto;
    color: #0f766e;
    font-size: 0.82rem;
    font-style: normal;
    white-space: nowrap;
}

/* ── Purchase Atlas ── */
:root {
    --purchase-ink: #17201d;
    --purchase-muted: #66736e;
    --purchase-teal: #0f766e;
    --purchase-teal-soft: #e8f5f2;
    --purchase-amber: #d97706;
    --purchase-amber-soft: #fff4df;
    --purchase-line: rgba(23, 32, 29, 0.13);
    --purchase-shadow: 0 16px 40px rgba(23, 32, 29, 0.08);
}

.nav-purchase-link {
    padding: 0.38rem 0.72rem;
    border-radius: 999px;
    background: var(--purchase-teal-soft);
    color: var(--purchase-teal);
    font-weight: 800;
}

.purchase-hero,
.purchase-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(230px, 0.36fr);
    gap: 1.25rem;
    align-items: end;
    margin: 1rem 0 1.2rem;
    padding: clamp(1.15rem, 3vw, 2.25rem);
    overflow: hidden;
    border: 1px solid rgba(15, 118, 110, 0.2);
    border-radius: 28px;
    background:
        radial-gradient(circle at 92% 12%, rgba(217, 119, 6, 0.18), transparent 28%),
        linear-gradient(135deg, #f6faf8 0%, #ffffff 48%, #edf8f5 100%);
    box-shadow: var(--purchase-shadow);
}

.purchase-hero h1 {
    max-width: 22ch;
    margin-bottom: 0.55rem;
    color: var(--purchase-ink);
    font-size: clamp(1.5rem, 3.2vw, 2.4rem);
    line-height: 1.12;
    letter-spacing: -0.035em;
}

.purchase-detail-hero h1 {
    max-width: 22ch;
    margin-bottom: 0.55rem;
    color: var(--purchase-ink);
    font-size: clamp(1.6rem, 4vw, 2.75rem);
    line-height: 1.08;
    letter-spacing: -0.04em;
}

.purchase-hero p,
.purchase-detail-hero p {
    margin-bottom: 0;
    color: var(--purchase-muted);
}

.purchase-hero aside {
    display: grid;
    gap: 0.22rem;
    padding: 1rem;
    border: 1px solid rgba(217, 119, 6, 0.24);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
}

.purchase-hero aside strong,
.purchase-hero aside span,
.purchase-hero aside small {
    display: block;
}

.purchase-hero aside strong,
.purchase-eyebrow {
    color: var(--purchase-teal);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.purchase-hero aside small {
    color: var(--purchase-muted);
}

.purchase-mode-shell {
    display: flex;
    gap: 0.65rem;
    align-items: center;
    justify-content: space-between;
    margin: 1rem 0;
}

.purchase-mode-segmented {
    display: inline-grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: min(100%, 25rem);
    padding: 0.25rem;
    border: 1px solid var(--purchase-line);
    border-radius: 999px;
    background: #fff;
}

.purchase-mode-tab,
.purchase-favorites-link {
    display: grid;
    min-height: 44px;
    place-items: center;
    border-radius: 999px;
    color: var(--purchase-muted);
    font-weight: 800;
    text-decoration: none;
}

.purchase-mode-tab {
    min-width: 0;
    padding: 0.55rem 0.85rem;
}

.purchase-favorites-link {
    padding: 0.55rem 1rem;
    border: 1px solid var(--purchase-line);
    background: #fff;
    white-space: nowrap;
}

.purchase-mode-tab:is(:hover, :focus, .is-active),
.purchase-favorites-link:is(:hover, :focus, .is-active) {
    background: var(--purchase-teal);
    color: #fff;
    text-decoration: none;
}

.purchase-favorite-live {
    min-height: 1.1rem;
    margin: -0.55rem 0 0.7rem;
    color: var(--purchase-muted);
    font-size: 0.78rem;
}

.purchase-favorites-hero {
    margin: 1.2rem 0 0.8rem;
}

.purchase-favorites-hero :is(h1, p) {
    margin-bottom: 0.3rem;
}

.purchase-favorite-kind-tabs {
    display: inline-flex;
    gap: 0.35rem;
    margin-bottom: 1rem;
    padding: 0.25rem;
    border: 1px solid var(--purchase-line);
    border-radius: 999px;
    background: #fff;
}

.purchase-favorite-kind-tabs a {
    min-height: 44px;
    padding: 0.62rem 1rem;
    border-radius: 999px;
    color: var(--purchase-muted);
    text-decoration: none;
}

.purchase-favorite-kind-tabs a.is-active {
    background: var(--purchase-teal);
    color: #fff;
    font-weight: 800;
}

.purchase-favorite-button {
    min-height: 44px;
    width: auto;
    margin: 0 0 0.55rem;
    padding-inline: 0.8rem;
    white-space: nowrap;
}

.purchase-favorite-button.is-saved {
    border-color: var(--purchase-teal);
    background: var(--purchase-teal-soft);
    color: var(--purchase-teal);
}

.purchase-favorite-button[aria-busy="true"] {
    opacity: 0.7;
}

.purchase-hero-actions {
    margin-top: 0.8rem;
}

.purchase-hero-actions .purchase-favorite-button {
    margin-bottom: 0;
}

.purchase-search-panel {
    margin-bottom: 2rem;
    padding: 1rem;
    border: 1px solid var(--purchase-line);
    border-radius: 20px;
    background: #fff;
}

.purchase-search-form {
    display: grid;
    gap: 0.75rem;
    margin: 0;
}

.purchase-search-form label,
.purchase-search-form :is(input, select, button) {
    margin-bottom: 0;
}

.purchase-search-primary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: end;
}

.purchase-search-primary button {
    width: auto;
    min-width: 7.5rem;
}

.purchase-filter-disclosure {
    margin: 0;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--purchase-line);
    border-radius: 14px;
    background: #fafbf9;
}

.purchase-filter-disclosure summary {
    cursor: pointer;
    color: var(--purchase-muted);
    font-size: 0.86rem;
    font-weight: 800;
}

.purchase-filter-disclosure[open] summary {
    margin-bottom: 0.7rem;
}

.purchase-filter-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    align-items: end;
}

.purchase-search-actions {
    display: flex;
    gap: 0.45rem;
}

.purchase-search-actions button {
    width: auto;
    white-space: nowrap;
}

.purchase-location-note {
    grid-column: 1 / -1;
    margin: 0;
    color: var(--purchase-muted);
    font-size: 0.82rem;
}

.purchase-section-heading,
.purchase-value-card-header,
.purchase-seller-card > header,
.purchase-basket-summary > header {
    display: flex;
    justify-content: space-between;
    gap: 0.85rem;
    align-items: flex-start;
}

.purchase-section-heading {
    align-items: end;
    margin-bottom: 0.9rem;
}

.purchase-section-heading :is(h2, p),
.purchase-value-card-header :is(h3, p),
.purchase-seller-card :is(h3, p) {
    margin-bottom: 0;
}

.purchase-result-grid,
.purchase-value-list {
    display: grid;
    gap: 0.85rem;
}

.purchase-result-grid {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.purchase-product-card,
.purchase-seller-card,
.purchase-value-card,
.purchase-empty-state {
    margin: 0;
    border: 1px solid var(--purchase-line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(23, 32, 29, 0.05);
}

.purchase-product-card {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
}

.purchase-product-visual {
    display: grid;
    min-height: 120px;
    place-items: center;
    overflow: hidden;
    border-radius: 15px;
    background:
        linear-gradient(145deg, rgba(15, 118, 110, 0.12), rgba(217, 119, 6, 0.13));
    color: var(--purchase-teal);
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.16em;
}

.purchase-product-visual img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.purchase-product-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
}

.purchase-product-copy small {
    color: var(--purchase-muted);
}

.purchase-product-copy h3 {
    margin: 0.2rem 0 0.5rem;
    overflow-wrap: anywhere;
}

.purchase-product-copy a[role="button"] {
    width: 100%;
    margin: auto 0 0;
}

.purchase-list-price {
    margin-bottom: 0.8rem;
    color: var(--purchase-teal);
    font-size: 1.16rem;
}

.purchase-list-price.is-muted {
    color: var(--purchase-muted);
}

.purchase-seller-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 1rem;
}

.purchase-seller-card > a[role="button"] {
    margin: auto 0 0;
}

.purchase-count-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.4rem;
    margin: 0.9rem 0;
}

.purchase-count-strip span {
    display: grid;
    min-width: 0;
    padding: 0.6rem 0.35rem;
    border-radius: 12px;
    background: var(--purchase-teal-soft);
    color: var(--purchase-muted);
    text-align: center;
    font-size: 0.72rem;
}

.purchase-count-strip strong {
    color: var(--purchase-teal);
    font-size: 1.15rem;
}

.purchase-scope-facts,
.purchase-value-facts,
.purchase-basket-summary dl {
    display: grid;
    gap: 0.45rem;
    margin: 0 0 0.9rem;
}

.purchase-scope-facts > div,
.purchase-value-facts > div,
.purchase-basket-summary dl > div {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
}

.purchase-scope-facts :is(dt, dd),
.purchase-value-facts :is(dt, dd),
.purchase-basket-summary :is(dt, dd) {
    margin: 0;
    font-size: 0.84rem;
}

.purchase-scope-facts dt,
.purchase-value-facts dt,
.purchase-basket-summary dt {
    color: var(--purchase-muted);
}

.purchase-visit-signal,
.purchase-anchor-callout {
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(217, 119, 6, 0.25);
    border-radius: 13px;
    background: var(--purchase-amber-soft);
    color: #7c4405;
    font-size: 0.83rem;
}

.purchase-breadcrumb {
    display: flex;
    gap: 0.45rem;
    align-items: center;
    margin-top: 1rem;
    color: var(--purchase-muted);
    font-size: 0.84rem;
}

.purchase-detail-hero {
    grid-template-columns: minmax(130px, 0.25fr) minmax(0, 1fr);
    align-items: center;
}

.purchase-product-visual-large {
    min-height: 220px;
}

.purchase-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.purchase-filter-chips :is(span, a) {
    padding: 0.32rem 0.65rem;
    border: 1px solid var(--purchase-line);
    border-radius: 999px;
    background: #fff;
    color: var(--purchase-muted);
    font-size: 0.78rem;
    text-decoration: none;
}

.purchase-filter-chips a.is-active {
    border-color: var(--purchase-teal);
    color: var(--purchase-teal);
    font-weight: 800;
}

.purchase-value-card {
    padding: 1rem;
    border-left: 5px solid var(--purchase-line);
}

.purchase-value-card.purchase-tier-best,
.purchase-value-card.purchase-tier-near_best,
.purchase-value-card.purchase-tier-competitive {
    border-left-color: var(--purchase-teal);
}

.purchase-price-block {
    flex: 0 0 auto;
    text-align: right;
}

.purchase-price-block strong,
.purchase-price-block small {
    display: block;
}

.purchase-price-block strong {
    color: var(--purchase-ink);
    font-size: 1.2rem;
}

.purchase-price-block small,
.purchase-rank {
    color: var(--purchase-muted);
}

.purchase-value-status {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0.8rem 0;
}

.purchase-tier-badge,
.purchase-confidence-label {
    padding: 0.28rem 0.62rem;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 800;
}

.purchase-tier-badge {
    background: var(--purchase-teal-soft);
    color: var(--purchase-teal);
}

.purchase-confidence-label {
    background: #eef1ef;
    color: #4b5954;
}

.purchase-value-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.purchase-value-facts > div {
    padding: 0.45rem 0;
    border-bottom: 1px solid var(--purchase-line);
}

.purchase-card-actions {
    display: flex;
    gap: 0.5rem;
    padding: 0;
    background: transparent;
}

.purchase-card-actions :is(a[role="button"], button) {
    width: auto;
    margin: 0;
}

.purchase-basket-toggle.is-selected {
    border-color: var(--purchase-teal);
    background: var(--purchase-teal-soft);
    color: var(--purchase-teal);
}

.purchase-seller-page {
    padding-bottom: 1rem;
}

.purchase-seller-hero {
    grid-template-columns: minmax(0, 1fr) minmax(240px, 0.4fr);
}

.purchase-count-strip-large {
    margin: 0;
}

.purchase-anchor-callout {
    display: grid;
    gap: 0.12rem;
    margin-bottom: 1rem;
}

.purchase-seller-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(270px, 340px);
    gap: 1rem;
    align-items: start;
}

.purchase-basket-summary {
    position: sticky;
    top: 1rem;
    margin: 0;
    padding: 1rem;
    border: 1px solid rgba(15, 118, 110, 0.26);
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--purchase-shadow);
}

.purchase-basket-summary[hidden] {
    display: none;
}

.purchase-basket-summary > header button {
    width: auto;
    margin: 0;
    padding: 0.2rem 0.55rem;
}

.purchase-basket-items {
    display: grid;
    gap: 0.45rem;
    margin-bottom: 0.75rem;
}

.purchase-basket-items > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.45rem;
    align-items: center;
    padding-top: 0.45rem;
    border-top: 1px solid var(--purchase-line);
    font-size: 0.78rem;
}

.purchase-basket-items button {
    width: auto;
    margin: 0;
    padding: 0.2rem 0.45rem;
    font-size: 0.72rem;
}

.purchase-basket-status,
.purchase-live-region {
    min-height: 1.25rem;
    margin: 0.55rem 0 0;
    color: var(--purchase-muted);
    font-size: 0.78rem;
}

.purchase-refresh-disclosure {
    margin-top: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--purchase-line);
    border-radius: 16px;
    background: #fafbf9;
}

.purchase-refresh-disclosure summary {
    color: var(--purchase-muted);
    font-weight: 800;
}

.purchase-refresh-list {
    display: grid;
    gap: 0.45rem;
}

.purchase-refresh-list > div {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
    padding-top: 0.45rem;
    border-top: 1px solid var(--purchase-line);
}

.purchase-refresh-list span {
    color: var(--purchase-muted);
    font-size: 0.78rem;
}

@media (max-width: 900px) {
    .purchase-search-actions button {
        flex: 1;
    }
    .purchase-seller-layout {
        grid-template-columns: 1fr;
    }
    .purchase-basket-summary {
        position: fixed;
        z-index: 20;
        right: 0.65rem;
        bottom: 0.65rem;
        left: 0.65rem;
        top: auto;
        max-height: min(70vh, 520px);
        overflow-y: auto;
    }
    .purchase-seller-page:has(.purchase-basket-summary:not([hidden])) {
        padding-bottom: 15rem;
    }
}

@media (max-width: 767px) {
    .purchase-basket-summary {
        bottom: calc(4.35rem + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 640px) {
    .proof-home-search,
    .proof-home-grid {
        grid-template-columns: 1fr;
    }
    .proof-home-search button {
        width: 100%;
    }
    .proof-home-revisit {
        grid-column: auto;
    }
    .site-brand-row {
        min-height: 3.1rem;
        padding-right: 0.65rem;
        padding-left: 0.65rem;
    }
    .site-brand span,
    .account-menu summary > span:not(.account-menu-avatar) {
        display: none;
    }
    .primary-nav .container-fluid {
        padding-right: 0.65rem;
        padding-left: 0.65rem;
    }
    .account-card-grid,
    .account-locale-options {
        grid-template-columns: 1fr;
    }
    .account-card-wide {
        grid-column: auto;
    }
    .purchase-hero,
    .purchase-detail-hero,
    .purchase-seller-hero {
        grid-template-columns: 1fr;
        border-radius: 20px;
    }
    .purchase-hero h1 {
        font-size: 1.5rem;
    }
    .purchase-detail-hero h1 {
        font-size: 1.7rem;
    }
    .purchase-mode-shell {
        gap: 0.45rem;
    }
    .purchase-mode-segmented {
        min-width: 0;
        flex: 1;
    }
    .purchase-favorites-link {
        padding-inline: 0.75rem;
    }
    .purchase-search-primary,
    .purchase-filter-grid,
    .purchase-result-grid,
    .purchase-value-facts {
        grid-template-columns: 1fr;
    }
    .purchase-search-primary button {
        width: 100%;
    }
    .purchase-product-card {
        grid-template-columns: 72px minmax(0, 1fr);
        padding: 0.8rem;
    }
    .purchase-product-visual {
        min-height: 100px;
    }
    .purchase-product-visual-large {
        min-height: 180px;
    }
    .purchase-section-heading,
    .purchase-value-card-header {
        align-items: flex-start;
    }
    .purchase-value-card-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
    }
    .purchase-card-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
    }
    .purchase-card-actions :is(a[role="button"], button) {
        width: 100%;
    }
    .purchase-refresh-list > div {
        display: grid;
    }
}

@media (max-width: 360px) {
    .purchase-mode-tab,
    .purchase-favorites-link {
        font-size: 0.78rem;
    }
    .purchase-product-card {
        grid-template-columns: 1fr;
    }
    .purchase-product-visual {
        max-height: 150px;
    }
    .purchase-value-card-header,
    .purchase-card-actions,
    .purchase-search-actions {
        grid-template-columns: 1fr;
    }
    .purchase-price-block {
        text-align: left;
    }
}
/* Private-beta secret pages intentionally avoid the authenticated app shell. */
.auth-onboarding-body {
    min-height: 100vh;
    margin: 0;
    padding: clamp(1rem, 5vw, 4rem);
    overflow-x: hidden;
    background:
        radial-gradient(circle at 85% 12%, rgba(196, 116, 43, 0.18), transparent 32rem),
        linear-gradient(145deg, #f6f1e8 0%, #e9e0d2 100%);
    color: #29231d;
}

.auth-onboarding-shell {
    width: min(100%, 34rem);
    margin: 0 auto;
    padding: clamp(1.25rem, 4vw, 2.5rem);
    border: 1px solid rgba(67, 51, 37, 0.16);
    border-radius: 1.25rem;
    background: rgba(255, 252, 247, 0.94);
    box-shadow: 0 1.5rem 4rem rgba(55, 40, 28, 0.12);
}

.auth-onboarding-summary {
    display: grid;
    gap: 0.25rem;
    margin-block: 1.5rem 0.75rem;
    padding: 1rem;
    border-left: 0.25rem solid #a84f24;
    background: #f4e9db;
}

.auth-onboarding-status[data-kind="error"] {
    color: #a22626;
}

.auth-onboarding-form {
    display: grid;
    gap: 1rem;
    margin-top: 1.25rem;
}

.auth-onboarding-form label {
    display: grid;
    gap: 0.4rem;
    font-weight: 650;
}

.auth-onboarding-form input:not([type="checkbox"]) {
    width: 100%;
    min-height: 2.8rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid #b9aa98;
    border-radius: 0.55rem;
    background: #fff;
}

.auth-onboarding-form button {
    min-height: 3rem;
    border: 0;
    border-radius: 0.6rem;
    background: #29231d;
    color: #fff;
    font-weight: 750;
}

.auth-consent {
    grid-template-columns: auto 1fr;
    align-items: start;
}

.password-visibility-toggle,
.auth-onboarding-form .password-visibility-toggle {
    justify-self: start;
    width: auto;
    min-height: 2.25rem;
    margin-top: 0.35rem;
    padding: 0.35rem 0.65rem;
    border: 1px solid #b9aa98;
    background: transparent;
    color: inherit;
    font-size: 0.78rem;
}

.legal-notice {
    display: grid;
    gap: 1.25rem;
}

.legal-notice :is(section, h2, p) {
    margin-bottom: 0;
}

.legal-notice section {
    display: grid;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(67, 51, 37, 0.16);
}

.legal-notice-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.75rem;
    padding-top: 1rem;
}

.private-beta-onboarding {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: clamp(1rem, 3vw, 1.5rem);
    border: 1px solid color-mix(in srgb, var(--pico-primary) 28%, var(--pico-muted-border-color));
    border-radius: 1rem;
    background:
        linear-gradient(135deg, rgba(15, 118, 110, 0.1), transparent 60%),
        var(--pico-card-background-color);
}

.private-beta-onboarding :is(h2, p) {
    margin-bottom: 0;
}

.private-beta-onboarding-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.private-beta-onboarding-actions a {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
    padding: 0.9rem;
    border: 1px solid var(--proof-border, #d9d0c4);
    border-radius: 0.75rem;
    background: var(--proof-surface, #fff);
    color: inherit;
    text-decoration: none;
}

.private-beta-onboarding-actions a:is(:hover, :focus-visible) {
    border-color: var(--pico-primary);
    transform: translateY(-1px);
}

.private-beta-onboarding-actions span {
    color: var(--pico-muted-color);
    font-size: 0.82rem;
}

.account-settings-nav {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    margin-bottom: 1rem;
    padding-bottom: 0.25rem;
}

.account-settings-nav a {
    flex: 0 0 auto;
    padding: 0.45rem 0.75rem;
    border: 1px solid var(--proof-border, #d9d0c4);
    border-radius: 999px;
    text-decoration: none;
}

.account-settings-card {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: clamp(1rem, 3vw, 1.5rem);
    border: 1px solid var(--proof-border, #d9d0c4);
    border-radius: 1rem;
    background: var(--proof-surface, #fff);
}

.account-settings-card-heading,
.account-device-list article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.account-device-list {
    display: grid;
    gap: 0.75rem;
}

.account-device-list article {
    padding-block: 0.85rem;
    border-top: 1px solid var(--proof-border, #d9d0c4);
}

.account-device-list strong,
.account-device-list small {
    display: block;
}

.account-consent-list {
    display: grid;
    gap: 0.5rem;
}

.account-consent-list article {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.account-ai-disclosure {
    padding: 1rem;
    border-radius: 0.75rem;
    background: #f3eee7;
}

.account-danger-zone {
    border-color: #d8a5a5;
}

.account-closure-form,
.account-deletion-list,
.account-deletion-actions {
    display: grid;
    gap: 0.75rem;
}

.account-closure-confirmation {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
}

.account-deletion-filter {
    grid-template-columns: minmax(12rem, 1fr) auto;
}

.account-deletion-card {
    display: grid;
    gap: 1rem;
    padding: clamp(1rem, 3vw, 1.4rem);
    border: 1px solid var(--proof-border, #d9d0c4);
    border-radius: 1rem;
    background: var(--proof-surface, #fff);
}

.account-deletion-card > header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
}

.account-deletion-card > header p,
.account-deletion-facts :is(dt, dd) {
    margin: 0;
}

.account-deletion-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0;
}

.account-deletion-facts > div {
    min-width: 0;
    padding: 0.75rem;
    border-radius: 0.75rem;
    background: #f3eee7;
    overflow-wrap: anywhere;
}

.account-deletion-facts dt {
    color: var(--pico-muted-color);
    font-size: 0.75rem;
    font-weight: 700;
}

.account-deletion-actions {
    grid-template-columns: repeat(2, minmax(0, max-content));
    align-items: end;
}

.account-deletion-actions form {
    margin: 0;
}

@media (max-width: 640px) {
    .account-settings-card-heading,
    .account-device-list article {
        align-items: stretch;
        flex-direction: column;
    }

    .account-device-list form,
    .account-device-list button {
        width: 100%;
    }

    .account-deletion-filter,
    .account-deletion-facts,
    .account-deletion-actions {
        grid-template-columns: 1fr;
    }

    .account-deletion-card > header {
        align-items: stretch;
        flex-direction: column;
    }

    .account-deletion-actions button {
        width: 100%;
    }

    .private-beta-onboarding-actions {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 390px) {
    .auth-onboarding-body {
        padding: 0.65rem;
    }

    .auth-onboarding-shell,
    .account-page,
    .account-settings-card {
        width: 100%;
        min-width: 0;
    }

    .auth-onboarding-form,
    .account-settings-card,
    .private-beta-onboarding-actions {
        grid-template-columns: 1fr;
    }

    .proof-home-hero,
    .proof-home-search,
    .proof-home-actions,
    .proof-home-summary,
    .proof-home-grid,
    .proof-home-panel {
        min-width: 0;
    }

    .proof-home-actions,
    .proof-home-summary {
        grid-template-columns: 1fr;
    }

    .proof-home-row {
        align-items: stretch;
        flex-direction: column;
    }

    .legal-notice-footer {
        align-items: stretch;
        flex-direction: column;
    }
}