:root {
    color-scheme: light;
    --background: #f4f6f8;
    --surface: #ffffff;
    --surface-soft: #eef3f5;
    --text: #17212b;
    --muted: #667382;
    --accent: #0f6671;
    --accent-strong: #084751;
    --accent-soft: #e4f3f4;
    --heading-background: var(--accent-strong);
    --gold: #c9922f;
    --gold-soft: #fff4d9;
    --border: #c5d1db;
    --shadow: 0 18px 42px rgba(20, 32, 44, 0.08);
    --shadow-soft: 0 10px 24px rgba(20, 32, 44, 0.06);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    background: var(--background);
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a {
    color: inherit;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    min-height: 64px;
    padding: 0 max(20px, calc((100vw - 1120px) / 2));
    background: rgba(255, 255, 255, 0.92);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(12px);
}

.brand {
    color: var(--text);
    font-size: 1.05rem;
    font-weight: 700;
    text-decoration: none;
}

.cart-pill {
    margin-left: auto;
    padding: 6px 10px;
    color: var(--accent-strong);
    background: #e3f1f5;
    border: 1px solid rgba(18, 103, 130, 0.18);
    border-radius: 999px;
    font-size: 0.88rem;
    font-weight: 700;
}

.public-topbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.public-topbar-actions .cart-pill {
    margin-left: 0;
}

.logout-form {
    margin-left: auto;
}

.logout-form .cart-pill {
    margin-left: 0;
    cursor: pointer;
    font-family: inherit;
}

.header-cart-link,
.header-account-link {
    display: inline-grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    padding: 0;
    place-items: center;
    text-decoration: none;
    transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.header-cart-link:hover,
.header-cart-link:focus-visible,
.header-account-link:hover,
.header-account-link:focus-visible,
.header-account-link.is-active {
    color: #ffffff;
    background: var(--accent);
    border-color: var(--accent);
    transform: translateY(-1px);
}

.header-cart-icon,
.header-account-icon {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.shell {
    width: min(100% - 40px, 1120px);
    margin: 0 auto;
    padding: 40px 0 64px;
}

.page-heading {
    max-width: 780px;
    margin-bottom: 28px;
}

.page-heading.compact {
    margin-bottom: 22px;
}

.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 22px;
    color: var(--muted);
    font-size: 0.95rem;
}

.breadcrumb a {
    color: var(--accent);
    font-weight: 700;
    text-decoration: none;
}

.breadcrumb > * + *::before {
    content: "/";
    margin-right: 8px;
    color: var(--muted);
}

.eyebrow {
    margin: 0 0 8px;
    color: var(--accent);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
}

h1,
h2,
p,
dl,
dd {
    margin-top: 0;
}

h1 {
    margin-bottom: 14px;
    font-size: clamp(2rem, 5vw, 3.6rem);
    line-height: 1.05;
}

h2 {
    margin-bottom: 10px;
    font-size: 1.2rem;
    line-height: 1.2;
}

p {
    color: var(--muted);
}

.topic-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 18px;
}

.topic-card,
.event-card,
.notice,
.empty-state {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.topic-card {
    display: grid;
    grid-template-rows: 150px 1fr;
    overflow: hidden;
}

.topic-media {
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #d9ebf2, #f1f5f9 58%, #e6edf3);
}

.topic-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.topic-media span,
.event-avatar span {
    display: grid;
    place-items: center;
    color: var(--accent-strong);
    background: rgba(255, 255, 255, 0.74);
    border: 1px solid rgba(18, 103, 130, 0.25);
    border-radius: 50%;
    font-weight: 700;
}

.topic-media span {
    width: 72px;
    height: 72px;
    font-size: 2rem;
}

.topic-body {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
}

.format-list {
    display: grid;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.format-list li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    color: var(--muted);
    border-bottom: 1px solid var(--surface-soft);
}

.format-list strong {
    color: var(--text);
    white-space: nowrap;
}

.event-list {
    display: grid;
    gap: 14px;
}

.event-card {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 18px;
}

.event-avatar {
    display: grid;
    place-items: center;
    width: 86px;
    height: 86px;
    background: var(--surface-soft);
    border-radius: 8px;
}

.event-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.event-avatar span {
    width: 54px;
    height: 54px;
    font-size: 1.5rem;
}

.event-main h2 {
    margin-bottom: 12px;
}

.event-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 24px;
    margin-bottom: 12px;
}

.event-meta div {
    min-width: 110px;
}

.event-meta dt {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.event-meta dd {
    margin-bottom: 0;
    color: var(--text);
}

.badge-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.badge {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 10px;
    color: var(--accent-strong);
    background: #e3f1f5;
    border: 1px solid rgba(18, 103, 130, 0.18);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
}

.event-actions {
    justify-self: end;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    gap: 8px;
    padding: 0 18px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--accent), var(--accent-strong));
    border: 1px solid color-mix(in srgb, var(--accent-strong) 58%, var(--accent));
    border-radius: 6px;
    box-shadow: 0 10px 22px rgba(8, 71, 81, 0.16);
    font-weight: 820;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.button:hover {
    background: linear-gradient(135deg, var(--accent-strong), #062f36);
    box-shadow: 0 14px 28px rgba(8, 71, 81, 0.22);
    transform: translateY(-1px);
}

.button.secondary {
    color: var(--accent-strong);
    background: color-mix(in srgb, var(--accent) 9%, var(--surface));
    border-color: color-mix(in srgb, var(--accent) 24%, var(--border));
    box-shadow: none;
}

.button.secondary:hover {
    background: color-mix(in srgb, var(--accent) 15%, var(--surface));
    box-shadow: 0 8px 18px rgba(8, 71, 81, 0.1);
}

.button-prominent {
    min-height: 48px;
    padding: 0 22px;
    border-radius: 8px;
    font-size: 0.98rem;
}

.notice,
.empty-state {
    max-width: 720px;
    padding: 24px;
}

.notice {
    border-color: #e4c76d;
    background: #fff8df;
}

.notice p,
.empty-state p,
.muted {
    color: var(--muted);
}

.public-body {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--background) 82%, #ffffff), var(--background) 420px),
        var(--background);
}

.public-topbar {
    min-height: 72px;
    background: color-mix(in srgb, var(--surface) 88%, transparent);
    border-bottom-color: color-mix(in srgb, var(--border) 70%, transparent);
}

.public-topbar .brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 1rem;
}

.public-topbar .brand::before {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    color: var(--accent-strong);
    background-color: color-mix(in srgb, var(--accent) 10%, var(--surface));
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23084751' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 10.5 9-7 9 7'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M9 20v-6h6v6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
    border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
    border-radius: 8px;
    content: "";
}

.public-hero {
    position: relative;
    display: grid;
    align-items: end;
    min-height: 270px;
    overflow: hidden;
    color: #ffffff;
    background:
        linear-gradient(120deg, color-mix(in srgb, var(--accent-strong) 82%, #111820), color-mix(in srgb, var(--accent) 62%, #111820));
}

.public-hero.has-image {
    background-image:
        linear-gradient(90deg, rgba(8, 18, 24, 0.78), rgba(8, 18, 24, 0.32) 56%, rgba(8, 18, 24, 0.62)),
        var(--hero-image);
    background-position: center;
    background-size: cover;
}

.public-hero.compact {
    min-height: 190px;
}

.public-home .public-hero.branded-header-image {
    min-height: clamp(180px, 20vw, 250px);
    background-image:
        linear-gradient(90deg, rgba(8, 18, 24, 0.1), rgba(8, 18, 24, 0.04) 58%, rgba(8, 18, 24, 0.18)),
        var(--hero-image);
    background-position: left center;
}

.public-hero.branded-header-image .public-hero-inner {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.public-hero-inner {
    width: min(100% - 40px, 1120px);
    margin: 0 auto;
    padding: 42px 0 38px;
}

.public-hero .eyebrow {
    color: color-mix(in srgb, #ffffff 84%, var(--accent));
}

.public-hero h1 {
    max-width: 760px;
    margin-bottom: 16px;
    color: #ffffff;
    font-size: 3.35rem;
    line-height: 1.02;
}

.public-hero.compact h1 {
    font-size: 2.75rem;
}

.public-hero p {
    max-width: 560px;
    margin-bottom: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.08rem;
}

.public-section {
    padding-top: 34px;
}

.category-showcase {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 18px;
}

.topic-link-card {
    position: relative;
    display: grid;
    min-height: 240px;
    overflow: hidden;
    color: #ffffff;
    text-decoration: none;
    border: 1px solid color-mix(in srgb, var(--border) 68%, transparent);
    border-radius: 8px;
    box-shadow: 0 18px 38px rgba(19, 29, 38, 0.11);
    isolation: isolate;
}

.topic-link-card::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(8, 18, 24, 0.05), rgba(8, 18, 24, 0.72));
    content: "";
}

.topic-link-card .topic-media {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 16%, #ffffff), color-mix(in srgb, var(--border) 42%, #ffffff));
}

.topic-link-card .topic-media img {
    transform: scale(1.01);
    transition: transform 0.28s ease;
}

.topic-link-card:hover .topic-media img,
.topic-link-card:focus-visible .topic-media img {
    transform: scale(1.06);
}

.topic-link-card .topic-media > span {
    width: 82px;
    height: 82px;
    color: var(--accent-strong);
    background: color-mix(in srgb, var(--surface) 86%, transparent);
    border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
}

.topic-card-title {
    position: relative;
    z-index: 2;
    align-self: end;
    padding: 18px;
    color: #ffffff;
    font-size: 1.14rem;
    font-weight: 850;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.32);
}

.public-events .event-list {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 18px;
}

.public-events .event-card {
    position: relative;
    display: grid;
    min-height: 270px;
    padding: 0;
    overflow: hidden;
    color: #ffffff;
    border-color: color-mix(in srgb, var(--border) 72%, transparent);
    box-shadow: 0 18px 38px rgba(19, 29, 38, 0.11);
    isolation: isolate;
    text-decoration: none;
}

.public-events .event-card::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(8, 18, 24, 0.04) 28%, rgba(8, 18, 24, 0.84));
    content: "";
}

.public-events .event-avatar {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 16%, #ffffff), color-mix(in srgb, var(--border) 42%, #ffffff));
    border-radius: 0;
}

.public-events .event-avatar img {
    border-radius: 0;
    transform: scale(1.01);
    transition: transform 0.28s ease;
}

.public-events .event-card:hover .event-avatar img,
.public-events .event-card:focus-visible .event-avatar img {
    transform: scale(1.06);
}

.public-events .event-avatar span {
    width: 100%;
    height: 100%;
    color: color-mix(in srgb, var(--accent-strong) 42%, transparent);
    background: transparent;
    border: 0;
    border-radius: 0;
    font-size: 7rem;
    opacity: 0.45;
    transform: translateY(-18px);
}

.public-events .event-card-badges {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.public-events .event-card-badges span {
    padding: 5px 8px;
    color: #ffffff;
    background: rgba(8, 18, 24, 0.66);
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 780;
    backdrop-filter: blur(8px);
}

.public-events .event-main {
    position: relative;
    z-index: 2;
    align-self: end;
    display: grid;
    gap: 5px;
    padding: 20px;
}

.public-events .event-main h2 {
    margin: 0;
    color: #ffffff;
    font-size: 1.28rem;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.32);
}

.public-events .event-card-date,
.public-events .event-card-author,
.public-events .event-card-expiry {
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.84rem;
}

.public-events .event-card-date {
    font-weight: 780;
}

.public-events .event-card-enter {
    display: inline-flex;
    margin-top: 7px;
    color: #ffffff;
    font-size: 0.84rem;
    font-weight: 820;
    white-space: nowrap;
}

.public-body .breadcrumb {
    margin-bottom: 22px;
}

.public-body .page-heading.compact {
    max-width: 760px;
}

.public-body .photo-card,
.public-body .event-card,
.public-body .access-panel,
.public-body .checkout-panel,
.public-body .cart-row,
.public-body .cart-summary {
    border-color: color-mix(in srgb, var(--border) 72%, transparent);
    box-shadow: 0 14px 32px rgba(19, 29, 38, 0.08);
}

.header-current-preview {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 10px;
    background: color-mix(in srgb, var(--surface) 78%, var(--background));
    border: 1px solid var(--border);
    border-radius: 8px;
}

.header-current-preview img {
    width: 112px;
    height: 62px;
    object-fit: cover;
    border-radius: 6px;
}

.header-current-preview span {
    color: var(--muted);
    font-size: 0.88rem;
    font-weight: 760;
}


.shell.narrow {
    width: min(100% - 40px, 820px);
}

.access-shell {
    width: min(100% - 40px, 980px);
}

.access-shell > .breadcrumb,
.access-shell > .access-panel:not(.access-panel-unlocked) {
    width: min(100%, 820px);
}

.access-panel {
    padding: 28px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.access-panel-unlocked {
    overflow: hidden;
    padding: 0;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 7%, var(--surface)), var(--surface) 46%),
        var(--surface);
    border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
    box-shadow: 0 22px 48px rgba(19, 29, 38, 0.12);
}

.public-event-access .public-topbar {
    min-height: 60px;
}

.public-event-access .access-shell {
    padding-top: 24px;
}

.public-event-access .breadcrumb {
    margin-bottom: 16px;
    font-size: 0.86rem;
}

.access-shell > .access-panel.event-access-card:not(.access-panel-unlocked) {
    width: min(100%, 980px);
    margin-right: auto;
    margin-left: auto;
}

.event-access-card {
    display: grid;
    grid-template-columns: minmax(200px, 0.72fr) minmax(360px, 1.28fr);
    overflow: hidden;
    padding: 0;
    background: var(--surface);
    border-color: color-mix(in srgb, var(--border) 86%, var(--accent) 14%);
    box-shadow: 0 22px 48px rgba(19, 29, 38, 0.11);
}

.event-access-visual {
    position: relative;
    display: grid;
    min-height: 390px;
    overflow: hidden;
    place-items: center;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--accent-strong) 84%, #111820), color-mix(in srgb, var(--accent) 50%, #182631)),
        color-mix(in srgb, var(--accent) 18%, var(--surface));
}

.event-access-visual::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(7, 17, 22, 0.04), rgba(7, 17, 22, 0.62));
    content: "";
}

.event-access-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.015);
}

.event-access-visual span {
    display: grid;
    width: 116px;
    height: 116px;
    place-items: center;
    color: rgba(255, 255, 255, 0.88);
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 8px;
    font-size: 3.7rem;
    font-weight: 880;
}

.event-access-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: clamp(26px, 4.5vw, 46px);
}

.event-access-content .eyebrow {
    margin-bottom: 8px;
}

.event-access-content h1 {
    margin: 0 0 12px;
    font-size: clamp(2rem, 4.8vw, 3.25rem);
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.event-access-content .access-lead {
    max-width: 480px;
    margin: 0;
    color: color-mix(in srgb, var(--muted) 88%, var(--text));
    font-size: 1.03rem;
}

.access-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 22px 0 0;
}

.access-meta div {
    min-width: 0;
    padding: 12px 13px;
    background: color-mix(in srgb, var(--surface) 82%, var(--background));
    border: 1px solid color-mix(in srgb, var(--border) 84%, transparent);
    border-radius: 8px;
}

.access-meta dt {
    font-size: 0.7rem;
}

.access-meta dd {
    font-weight: 820;
}

.event-access-card .access-form {
    margin-top: 22px;
}

.event-access-card .access-form input {
    min-height: 50px;
    border-radius: 8px;
}

.event-access-card .access-form .button {
    justify-self: start;
}

.event-access-card .access-form-actions {
    margin-top: 0;
}

.access-panel h1 {
    margin-bottom: 12px;
}

.unlock-hero {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    padding: 28px 30px 24px;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

.unlock-icon {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;
    color: #ffffff;
    background:
        radial-gradient(circle at 34% 30%, rgba(255, 255, 255, 0.36), transparent 34%),
        linear-gradient(135deg, var(--accent), var(--accent-strong));
    border: 1px solid color-mix(in srgb, var(--accent-strong) 64%, var(--surface));
    border-radius: 8px;
    box-shadow: 0 18px 34px rgba(8, 71, 81, 0.22);
}

.unlock-icon::before {
    width: 34px;
    height: 34px;
    background: currentColor;
    content: "";
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.35' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.35' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.unlock-copy {
    min-width: 0;
}

.unlock-status {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin: 0 0 8px;
    padding: 0 11px;
    color: var(--accent-strong);
    background: color-mix(in srgb, var(--accent) 10%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--border));
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 860;
}

.unlock-copy h1 {
    margin: 0 0 8px;
    font-size: clamp(2rem, 5vw, 3.15rem);
    line-height: 1.02;
}

.unlock-copy p:last-child {
    max-width: 560px;
    margin: 0;
    font-size: 1rem;
}

.master-access-note {
    display: grid;
    gap: 3px;
    margin: 0 30px 22px;
    padding: 14px 16px;
    color: #5b3a05;
    background: color-mix(in srgb, var(--gold-soft) 82%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--gold) 44%, var(--border));
    border-left: 5px solid var(--gold);
    border-radius: 8px;
}

.master-access-note strong {
    color: #3f2a04;
    font-size: 0.95rem;
}

.master-access-note span {
    font-size: 0.92rem;
}

.event-meta.stacked {
    display: grid;
    gap: 12px;
    margin: 20px 0;
}

.unlock-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 0 30px;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

.unlock-meta div {
    min-width: 0;
    padding: 18px 0;
}

.unlock-meta div + div {
    padding-left: 24px;
    border-left: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}

.unlock-meta dt {
    font-size: 0.72rem;
}

.unlock-meta dd {
    font-size: 1.02rem;
    font-weight: 820;
}

.unlock-actions {
    margin: 0;
    padding: 24px 30px 30px;
}

.unlock-showcase {
    display: grid;
    grid-template-columns: minmax(240px, 0.9fr) minmax(0, 1.25fr);
    min-height: 430px;
}

.unlock-visual {
    position: relative;
    display: grid;
    min-height: 430px;
    overflow: hidden;
    place-items: center;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--accent-strong) 86%, #0f1720), color-mix(in srgb, var(--accent) 54%, #162330)),
        color-mix(in srgb, var(--accent) 22%, var(--surface));
}

.unlock-visual::after {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(7, 17, 22, 0.02), rgba(7, 17, 22, 0.68)),
        linear-gradient(90deg, rgba(7, 17, 22, 0.16), rgba(7, 17, 22, 0));
    content: "";
}

.unlock-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.015);
}

.unlock-visual span {
    display: grid;
    width: 128px;
    height: 128px;
    place-items: center;
    color: rgba(255, 255, 255, 0.86);
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 8px;
    font-size: 4rem;
    font-weight: 880;
}

.unlock-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: clamp(28px, 5vw, 54px);
}

.unlock-status-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.unlock-status-row .unlock-icon {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 8px;
    box-shadow: 0 14px 28px rgba(8, 71, 81, 0.2);
}

.unlock-status-row .unlock-icon::before {
    width: 24px;
    height: 24px;
}

.unlock-status-row .unlock-status {
    margin: 0;
    color: #ffffff;
    background: linear-gradient(135deg, var(--accent), var(--accent-strong));
    border: 0;
    box-shadow: 0 10px 20px rgba(8, 71, 81, 0.14);
}

.unlock-content h1 {
    margin: 0 0 14px;
    max-width: 100%;
    font-size: clamp(1.7rem, 3.4vw, 2.6rem);
    line-height: 1.08;
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

.unlock-content > p {
    max-width: 520px;
    margin: 0;
    color: color-mix(in srgb, var(--muted) 88%, var(--text));
    font-size: 1.06rem;
}

.unlock-copy-compact {
    display: none;
}

.unlock-content .master-access-note {
    margin: 24px 0 0;
}

.unlock-content .unlock-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 26px 0 0;
    padding: 0;
    border: 0;
}

.unlock-content .unlock-meta div {
    padding: 13px 14px;
    background: color-mix(in srgb, var(--surface) 80%, var(--background));
    border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
    border-radius: 8px;
}

.unlock-content .unlock-meta div + div {
    padding-left: 14px;
    border-left: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
}

.unlock-content .unlock-actions {
    margin: 0;
    padding: 28px 0 0;
}

.access-form {
    display: grid;
    gap: 12px;
    margin-top: 24px;
}

.access-form label {
    color: var(--text);
    font-weight: 700;
}

.access-form input {
    min-height: 46px;
    width: 100%;
    padding: 0 12px;
    color: var(--text);
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 6px;
    font: inherit;
}

.access-form input:focus {
    border-color: var(--accent);
    outline: 3px solid rgba(18, 103, 130, 0.16);
}

.form-error {
    margin: 18px 0 0;
    padding: 12px 14px;
    color: #8a1f11;
    background: #fff0ec;
    border: 1px solid #f0b7a8;
    border-radius: 6px;
}

.action-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.public-gallery .public-topbar {
    min-height: 60px;
}

.public-gallery .shell {
    padding-top: 24px;
}

.public-body.public-gallery .gallery-heading {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr) minmax(230px, 0.78fr);
    gap: 18px;
    align-items: center;
    width: 100%;
    max-width: none;
    margin-bottom: 22px;
    padding: 16px 18px;
    color: #ffffff;
    background: var(--heading-background);
    border: 1px solid color-mix(in srgb, var(--heading-background) 72%, var(--border));
    border-bottom: 4px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 16px 34px rgba(19, 29, 38, 0.12);
}

.gallery-heading-visual {
    display: grid;
    width: 84px;
    height: 68px;
    overflow: hidden;
    place-items: center;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 8px;
}

.gallery-heading-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gallery-heading-visual span {
    color: #ffffff;
    font-size: 2.05rem;
    font-weight: 900;
}

.gallery-heading-main {
    min-width: 0;
}

.gallery-heading-main .eyebrow {
    margin-bottom: 3px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.76rem;
}

.gallery-heading-main h1 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.55rem, 3vw, 2.2rem);
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.gallery-heading-main p {
    max-width: 680px;
    margin: 3px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.9rem;
}

.gallery-heading-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.gallery-heading-meta div {
    min-width: 0;
    padding: 9px 10px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 8px;
}

.gallery-heading-meta dt {
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.68rem;
}

.gallery-heading-meta dd {
    overflow: hidden;
    margin: 0;
    color: #ffffff;
    font-size: 0.92rem;
    font-weight: 820;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .public-body.public-gallery .gallery-heading {
        grid-template-columns: 76px minmax(0, 1fr);
    }

    .public-body.public-gallery .gallery-heading-meta {
        grid-column: 2;
    }
}


.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 14px;
}

.photo-card {
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.photo-card.is-selected {
    border-color: var(--accent);
    outline: 3px solid rgba(18, 103, 130, 0.16);
}

.photo-link {
    display: block;
    aspect-ratio: 1 / 1;
    background: var(--surface-soft);
}

.photo-link img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.protected-photo {
    -webkit-user-drag: none;
    user-select: none;
}

.copyright-alert {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 50;
    width: min(380px, calc(100vw - 36px));
    padding: 14px 16px;
    border: 1px solid var(--accent);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: var(--shadow);
    color: var(--text);
    font-weight: 800;
    line-height: 1.4;
}

.copyright-alert[hidden] {
    display: none;
}

.photo-caption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 48px;
    padding: 10px 12px;
}

.photo-caption strong {
    min-width: 0;
    overflow: hidden;
    color: var(--text);
    font-size: 0.95rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.selection-form {
    display: grid;
    gap: 16px;
}

.gallery-page-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding: 14px 16px;
    background: color-mix(in srgb, var(--surface) 88%, var(--background));
    border: 1px solid color-mix(in srgb, var(--border) 76%, transparent);
    border-radius: 8px;
    box-shadow: var(--shadow-soft);
}

.gallery-page-summary {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: baseline;
    color: var(--muted);
    font-weight: 760;
}

.gallery-page-summary strong {
    color: var(--text);
    font-size: 1.02rem;
}

.gallery-page-size-form {
    display: flex;
    gap: 8px;
    align-items: center;
}

.gallery-page-size-form label {
    color: var(--text);
    font-size: 0.84rem;
    font-weight: 820;
}

.gallery-page-size-form select {
    min-height: 38px;
    min-width: 86px;
    padding: 0 34px 0 10px;
}

.selection-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.selection-toolbar p {
    margin: 0;
    font-weight: 700;
}

.selection-toolbar .action-row {
    margin-top: 0;
}

.selection-caption {
    justify-content: flex-start;
    cursor: pointer;
}

.selection-caption input {
    flex: 0 0 auto;
}

.selection-complete {
    margin-bottom: 20px;
    padding: 26px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--accent), var(--accent-strong));
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.selection-complete h2,
.selection-complete p {
    margin: 0;
}

.selection-complete h2 {
    margin-bottom: 10px;
    font-size: clamp(1.5rem, 4vw, 2.3rem);
}

.selection-complete p {
    color: rgba(255, 255, 255, 0.9);
}

.selection-complete .eyebrow {
    color: rgba(255, 255, 255, 0.82);
}

.selection-complete .button.secondary {
    color: var(--accent-strong);
    background: #ffffff;
}


.photo-shell {
    width: min(100% - 40px, 1280px);
}

.photo-viewer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 380px);
    gap: 18px;
    align-items: start;
}

.photo-stage,
.photo-side {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.photo-side-stack {
    position: sticky;
    top: 84px;
    display: grid;
    gap: 18px;
}

.photo-stage {
    display: grid;
    place-items: center;
    min-height: min(64vh, 700px);
    padding: 16px;
    background: #111820;
}

.photo-stage img {
    display: block;
    max-width: 100%;
    max-height: min(68vh, 760px);
    width: auto;
    height: auto;
    border-radius: 4px;
}

.photo-side {
    padding: 16px;
}

.photo-side h1 {
    margin-bottom: 4px;
    font-size: clamp(1.35rem, 2vw, 1.65rem);
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.photo-side > .eyebrow {
    margin-bottom: 5px;
    font-size: 0.72rem;
}

.photo-side > p:not(.eyebrow) {
    margin-bottom: 12px;
    font-size: 0.9rem;
}

.photo-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    width: min(100%, 620px);
    margin: 18px auto 0;
}

.photo-nav .button {
    min-width: 148px;
    justify-content: center;
}

.action-row.vertical {
    display: grid;
}


.purchase-form {
    display: grid;
    gap: 8px;
    margin: 14px 0;
    padding: 12px;
    background: var(--surface-soft);
    border: 1px solid var(--border);
    border-radius: 8px;
}

.purchase-form h2 {
    margin-bottom: 2px;
    font-size: 1.05rem;
}

.purchase-form label {
    color: var(--text);
    font-size: 0.82rem;
    font-weight: 700;
}

.purchase-form select,
.purchase-form input {
    min-height: 38px;
    width: 100%;
    padding: 0 9px;
    color: var(--text);
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 6px;
    font: inherit;
}

.purchase-form select:focus,
.purchase-form input:focus {
    border-color: var(--accent);
    outline: 3px solid rgba(18, 103, 130, 0.16);
}

.digital-download-note {
    margin: 0;
    padding: 12px 13px 12px 42px;
    color: var(--accent-strong);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(225, 244, 248, 0.72)),
        color-mix(in srgb, var(--accent) 10%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
    border-left: 5px solid var(--accent);
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 1.35;
    position: relative;
}

.digital-download-note::before {
    position: absolute;
    top: 12px;
    left: 12px;
    width: 20px;
    height: 20px;
    background-color: var(--accent-strong);
    content: "";
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3Cpath d='M5 21h14'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3Cpath d='M5 21h14'/%3E%3C/svg%3E") center / contain no-repeat;
}

.digital-download-option {
    display: grid;
    gap: 8px;
    padding: 10px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(225, 244, 248, 0.74)),
        color-mix(in srgb, var(--accent) 9%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
    border-left: 4px solid var(--accent);
    border-radius: 8px;
}

.digital-download-option label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    margin: 0;
}

.digital-download-option input[type="checkbox"] {
    width: 16px;
    min-height: 16px;
    margin-top: 2px;
    accent-color: var(--accent);
}

.digital-download-option strong,
.digital-download-option small {
    display: block;
}

.digital-download-option small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.28;
}

.digital-download-option strong {
    font-size: 0.86rem;
    line-height: 1.22;
}

.digital-download-option .button {
    width: 100%;
    min-height: 36px;
    justify-content: center;
}

.photo-side .form-success,
.photo-side .form-error {
    padding: 10px 11px;
    font-size: 0.86rem;
    line-height: 1.3;
}

.photo-side .form-success {
    grid-template-columns: 24px minmax(0, 1fr);
}

.photo-side .form-success::before {
    width: 24px;
    height: 24px;
    font-size: 0.88rem;
}

.photo-page-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    width: 100%;
    margin: 0;
    padding: 0;
}

.photo-page-actions .button,
.purchase-form > .button {
    min-height: 38px;
    justify-content: center;
}

.photo-page-actions .button {
    flex: 1 1 150px;
    min-width: 0;
}

.cart-digital-note {
    margin: 0;
    padding: 12px 13px;
    color: var(--accent-strong);
    background: color-mix(in srgb, var(--accent) 9%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--border));
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 800;
}

.cart-actions .cart-digital-note {
    grid-column: 1 / -1;
    padding: 8px 10px;
    font-size: 0.78rem;
    line-height: 1.25;
}

.cart-actions .cart-digital-note ~ .cart-subtotal {
    grid-column: 1 / -1;
    justify-self: end;
}

.digital-download-confirmation {
    border-left: 5px solid var(--accent);
}

.digital-download-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.digital-download-pending span {
    padding: 9px 11px;
    color: var(--text);
    background: color-mix(in srgb, var(--accent) 8%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--border));
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 800;
}

.form-success {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin: 0;
    padding: 13px 14px;
    color: #0f4f28;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.84), rgba(231, 248, 237, 0.78)),
        #e7f8ed;
    border: 1px solid #7ac994;
    border-left: 5px solid #17833f;
    border-radius: 8px;
    box-shadow: 0 10px 22px rgba(23, 131, 63, 0.1);
    font-size: 0.95rem;
    font-weight: 850;
    line-height: 1.35;
}

.form-success::before {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    color: #ffffff;
    background: #17833f;
    border-radius: 999px;
    content: "✓";
    font-size: 1rem;
    font-weight: 900;
}

.side-note {
    margin: 20px 0;
}


.inline-status {
    max-width: 720px;
    margin-bottom: 18px;
    padding: 15px 18px 15px 54px;
    color: #0f4f28;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(231, 248, 237, 0.8)),
        #e7f8ed;
    border: 1px solid #7ac994;
    border-left: 5px solid #17833f;
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(23, 131, 63, 0.1);
    font-size: 0.98rem;
    font-weight: 850;
    line-height: 1.4;
    position: relative;
}

.public-body .inline-status {
    margin-right: auto;
    margin-left: auto;
}

.inline-status::before {
    position: absolute;
    top: 50%;
    left: 16px;
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    color: #ffffff;
    background: #17833f;
    border-radius: 999px;
    content: "✓";
    font-size: 0.95rem;
    font-weight: 900;
    transform: translateY(-50%);
}

.cart-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 330px);
    gap: 22px;
    align-items: start;
}

.cart-items {
    display: grid;
    overflow: hidden;
    background: var(--surface);
    border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
    border-radius: 8px;
    box-shadow: 0 16px 36px rgba(19, 29, 38, 0.08);
}

.public-cart .cart-inline-status {
    max-width: none;
    margin: 0;
    border-width: 0 0 1px 5px;
    border-radius: 0;
    box-shadow: none;
}

.public-cart > .shell > .cart-inline-status {
    width: min(100%, 760px);
    margin-bottom: 18px;
    border-width: 1px 1px 1px 5px;
    border-radius: 8px;
    box-shadow: 0 12px 26px rgba(23, 131, 63, 0.1);
}

.cart-list-head {
    display: grid;
    grid-template-columns: minmax(220px, 0.85fr) minmax(240px, 1fr) minmax(210px, 250px);
    gap: 18px;
    align-items: center;
    padding: 13px 18px;
    color: var(--muted);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--surface) 82%, var(--background)), var(--surface));
    border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0;
    text-transform: uppercase;
}

.public-cart .cart-heading {
    max-width: 680px;
    margin-bottom: 18px;
}

.public-cart .cart-heading h1 {
    margin-bottom: 8px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.public-cart .cart-heading p {
    max-width: 620px;
    margin-bottom: 0;
}

.cart-summary {
    background: var(--surface);
    border: 1px solid color-mix(in srgb, var(--border) 76%, transparent);
    border-radius: 8px;
    box-shadow: 0 16px 36px rgba(19, 29, 38, 0.08);
}

.cart-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(210px, 250px);
    gap: 18px;
    align-items: center;
    padding: 18px;
    background: var(--surface);
    border-bottom: 1px solid color-mix(in srgb, var(--border) 54%, transparent);
}

.cart-row:nth-of-type(even) {
    background: color-mix(in srgb, var(--surface) 78%, var(--background));
}

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

.cart-row-main {
    display: grid;
    grid-template-columns: minmax(210px, 0.8fr) minmax(220px, 1fr);
    gap: 18px;
    align-items: center;
}

.cart-row h2 {
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 1.08rem;
    line-height: 1.15;
}

.cart-row-main > p,
.cart-item-title p {
    margin: 4px 0 0;
}

.cart-item-title {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.cart-item-mark {
    position: relative;
    overflow: hidden;
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    color: var(--accent-strong);
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.85), transparent 35%),
        color-mix(in srgb, var(--accent) 12%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--border));
    border-radius: 8px;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.cart-item-mark img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cart-item-mark span {
    position: relative;
    z-index: 1;
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    background: color-mix(in srgb, var(--surface) 74%, transparent);
}

.cart-item-mark:has(img) span {
    opacity: 0;
}

.cart-meta {
    display: grid;
    gap: 7px;
    margin: 0;
}

.cart-meta div {
    display: grid;
    grid-template-columns: minmax(70px, auto) minmax(0, 1fr);
    gap: 10px;
    align-items: baseline;
    min-width: 0;
}

.cart-meta dt,
.cart-summary dt {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 850;
    text-transform: uppercase;
}

.cart-meta dd,
.cart-summary dd {
    min-width: 0;
    margin: 0;
    color: var(--text);
    font-weight: 780;
}

.cart-meta dd {
    overflow-wrap: anywhere;
}

.cart-actions {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 8px 10px;
    align-content: start;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
}

.cart-actions label {
    display: grid;
    gap: 5px;
    color: var(--text);
    font-size: 0.82rem;
    font-weight: 700;
}

.cart-quantity {
    grid-column: 1;
}

.cart-actions input {
    min-height: 36px;
    width: 100%;
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    font: inherit;
}

.cart-subtotal {
    align-self: end;
    justify-self: end;
    color: var(--text);
    font-size: 1.16rem;
    line-height: 1.1;
    text-align: right;
    white-space: nowrap;
}

.cart-row-buttons {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    margin-top: 2px;
}

.cart-row-buttons .button {
    width: 100%;
}

.cart-row-buttons .link-button:only-child {
    justify-self: end;
    min-width: 92px;
}

.link-button {
    min-height: 36px;
    padding: 0 8px;
    color: #9a2a18;
    background: transparent;
    border: 0;
    font: inherit;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
}

.cart-summary {
    position: sticky;
    top: 84px;
    overflow: hidden;
    padding: 0;
}

.cart-summary h2 {
    margin: 0;
    padding: 18px 20px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--accent-strong), var(--accent));
    border-bottom: 4px solid var(--gold);
    font-size: 1.28rem;
}

.cart-summary dl {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 18px 20px 4px;
}

.cart-summary dl div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid var(--surface-soft);
}

.cart-summary dl div:last-child dd {
    color: var(--accent-strong);
    font-size: 1.25rem;
    font-weight: 900;
}

.cart-summary .action-row {
    margin: 0;
    padding: 18px 20px 20px;
}

.cart-summary .action-row .button {
    width: 100%;
}

.cart-summary .action-row form {
    display: contents;
}

.public-cart .empty-state {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.public-cart .empty-state .action-row {
    justify-content: center;
}

.account-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 18px;
    margin-bottom: 20px;
    padding: 24px;
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(11, 79, 99, 0.96), rgba(18, 103, 130, 0.9)),
        var(--heading-background, var(--accent));
    border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
    border-radius: 8px;
    box-shadow: 0 20px 42px rgba(19, 29, 38, 0.16);
}

.account-hero .eyebrow,
.account-hero h1,
.account-hero p {
    color: inherit;
}

.account-hero h1 {
    margin: 2px 0 6px;
    font-size: clamp(2rem, 4vw, 3.6rem);
    line-height: 0.96;
}

.account-hero p {
    max-width: 680px;
    margin: 0;
    opacity: 0.9;
}

.account-hero-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.account-hero-badges span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    color: var(--accent-strong);
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 850;
}

.account-auth-shell {
    display: grid;
    justify-items: center;
    margin: 10px auto 0;
}

.account-auth-card {
    width: min(100%, 520px);
    padding: 26px;
    border-color: color-mix(in srgb, var(--border) 76%, transparent);
    box-shadow: 0 18px 40px rgba(19, 29, 38, 0.1);
}

.account-auth-card h1 {
    margin-bottom: 8px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.account-auth-card > p:not(.eyebrow) {
    margin-bottom: 20px;
}

.account-auth-card .button {
    width: 100%;
}

.account-auth-card .account-register-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-auth-card:has(.account-register-form) {
    width: min(100%, 760px);
}

.account-link-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    justify-content: center;
    margin-top: 18px;
}

.account-link-row a {
    color: var(--accent);
    font-weight: 800;
    text-decoration: none;
}

.account-link-row a:hover {
    text-decoration: underline;
}

.account-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    gap: 22px;
    align-items: start;
}

.account-entry-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(340px, 0.88fr);
    gap: 20px;
    align-items: start;
}

.account-panel,
.account-help,
.account-entry-card {
    border-color: color-mix(in srgb, var(--border) 76%, transparent);
    box-shadow: 0 16px 36px rgba(19, 29, 38, 0.08);
}

.account-panel,
.account-help {
    padding: 22px;
}

.account-entry-card {
    position: relative;
    overflow: hidden;
}

.account-entry-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, var(--accent), var(--gold));
    opacity: 0.9;
}

.account-entry-card.is-current {
    border-color: var(--gold);
    box-shadow: 0 20px 44px rgba(19, 29, 38, 0.14);
}

.account-login-card {
    grid-column: 1;
    grid-row: 1;
    align-self: stretch;
}

.account-register-card {
    grid-row: 2;
    grid-column: 1 / -1;
}

.account-side-stack {
    display: grid;
    grid-column: 2;
    grid-row: 1;
    gap: 20px;
}

.account-card-heading {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.account-card-heading h2 {
    margin: 0;
    color: var(--text);
    font-size: 1.45rem;
}

.account-card-heading .eyebrow {
    margin: 0 0 3px;
}

.account-card-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    color: var(--accent-strong);
    background: color-mix(in srgb, var(--accent) 12%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent);
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 900;
}

.account-card-copy {
    margin: 0 0 16px;
    color: var(--muted);
}

.account-entry-card .button {
    width: 100%;
}

.account-register-form {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.account-register-form label {
    display: grid;
    gap: 6px;
}

.account-register-form label span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.account-password-group {
    display: grid;
    grid-column: 1 / -1;
    gap: 10px;
    margin: 2px 0 0;
    padding: 14px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 7%, #ffffff), #ffffff);
    border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
    border-left: 5px solid var(--border);
    border-radius: 8px;
}

.account-password-group legend {
    padding: 0 8px;
    color: var(--text);
    font-size: 0.98rem;
    font-weight: 900;
}

.account-password-group p {
    margin: 0;
    color: var(--muted);
    font-size: 0.84rem;
    font-weight: 750;
}

.account-password-group > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.account-register-form button {
    grid-column: 1 / -1;
}

.account-session-card {
    position: relative;
    overflow: hidden;
}

.account-session-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, var(--accent), var(--success));
}

.account-data-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin: 18px 0 0;
}

.account-data-list div {
    min-width: 0;
    padding: 12px;
    background: color-mix(in srgb, var(--surface) 78%, var(--background));
    border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
    border-radius: 8px;
}

.account-data-list dt {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
}

.account-data-list dd {
    overflow-wrap: anywhere;
    margin: 3px 0 0;
    color: var(--text);
    font-weight: 780;
}

.account-actions {
    align-items: stretch;
}

.account-actions form {
    display: contents;
}

.account-help {
    position: sticky;
    top: 84px;
}

.account-help h2 {
    margin-bottom: 10px;
    color: var(--text);
    font-size: 1.22rem;
}

.account-help .button {
    margin-top: 8px;
}

.account-shell {
    width: min(100% - 40px, 1120px);
}

.public-account .account-inline-status {
    width: 100%;
    max-width: none;
    margin: 0 0 18px;
}

.account-client-shell {
    display: grid;
    gap: 16px;
}

.account-client-heading {
    display: grid;
    gap: 4px;
    max-width: 760px;
}

.account-client-heading h1 {
    margin: 0;
    font-size: clamp(2.1rem, 4vw, 3.25rem);
    line-height: 0.98;
}

.account-client-heading p:last-child,
.account-section-title p:last-child {
    margin: 0;
    color: var(--muted);
}

.account-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.account-tabs a {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    color: var(--accent-strong);
    text-decoration: none;
    background: color-mix(in srgb, var(--surface) 82%, var(--background));
    border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    border-radius: 8px;
    font-weight: 850;
}

.account-tabs a.is-active {
    color: #ffffff;
    background: linear-gradient(135deg, var(--accent-strong), var(--accent));
    border-color: var(--accent-strong);
}

.account-dashboard {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
    gap: 22px;
    align-items: start;
}

.account-actions-panel {
    position: sticky;
    top: 84px;
    display: grid;
    gap: 10px;
    padding: 20px;
}

.account-actions-panel h2 {
    margin: 0 0 4px;
    font-size: 1.2rem;
}

.account-actions-panel .button,
.account-actions-panel form {
    width: 100%;
}

.account-actions-panel form {
    display: contents;
}

.account-pending-cart {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 5px 16px;
    margin: 0 0 18px;
    padding: 14px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--success) 10%, #ffffff), #ffffff);
    border: 1px solid color-mix(in srgb, var(--success) 44%, var(--border));
    border-left: 5px solid var(--success);
    border-radius: 8px;
}

.account-pending-cart strong {
    color: var(--text);
}

.account-pending-cart span {
    grid-column: 1;
    color: var(--muted);
    font-size: 0.9rem;
    font-weight: 750;
}

.account-pending-cart .button {
    grid-column: 2;
    grid-row: 1 / span 2;
    white-space: nowrap;
}

.account-section-title {
    margin-bottom: 18px;
}

.account-section-title h2 {
    margin: 2px 0 6px;
    font-size: clamp(1.65rem, 3vw, 2.3rem);
}

.account-edit-panel,
.account-orders-panel {
    padding: 24px;
}

.account-edit-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.account-edit-form label {
    display: grid;
    gap: 6px;
}

.account-form-actions {
    display: flex;
    flex-wrap: wrap;
    grid-column: 1 / -1;
    justify-content: flex-end;
    gap: 10px;
}

.account-form-actions .button {
    min-width: 150px;
}

.account-order-list {
    display: grid;
    gap: 10px;
}

.account-order-row {
    display: grid;
    grid-template-columns: 1.1fr 1fr 0.8fr auto;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: color-mix(in srgb, var(--surface) 84%, var(--background));
    border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
    border-radius: 8px;
}

.account-order-row > div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.account-order-row strong {
    color: var(--text);
    font-size: 1rem;
}

.account-order-row span:not(.eyebrow) {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.84rem;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-order-row .button {
    white-space: nowrap;
}

.account-empty-state {
    margin: 0;
    text-align: center;
}

.public-checkout .shell {
    width: min(100% - 40px, 1180px);
}

.checkout-heading {
    max-width: 760px;
    margin-bottom: 18px;
}

.checkout-heading h1 {
    margin-bottom: 8px;
    font-size: clamp(2.1rem, 4.4vw, 3.35rem);
    line-height: 1;
}

.checkout-heading p:last-child {
    max-width: 680px;
}

.checkout-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 22px;
    align-items: start;
}

.checkout-forms {
    display: grid;
    gap: 16px;
}

.public-checkout .checkout-inline-status {
    max-width: none;
    margin: 0;
}

.checkout-panel {
    padding: 20px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.public-checkout .checkout-panel {
    overflow: hidden;
    padding: 0;
}

.public-checkout .checkout-panel > h2 {
    margin: 0;
    padding: 18px 20px 6px;
    color: var(--text);
    font-size: 1.18rem;
}

.public-checkout .checkout-panel > .helper-text {
    margin: 0;
    padding: 0 20px 16px;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 42%, transparent);
}

.stack-form {
    display: grid;
    gap: 10px;
}

.public-checkout .checkout-panel .stack-form {
    padding: 18px 20px 20px;
}

.stack-form.two-cols {
    grid-template-columns: 1fr 1fr;
    column-gap: 14px;
}

.stack-form label {
    color: var(--text);
    font-weight: 700;
}

.public-checkout .stack-form label {
    display: grid;
    gap: 6px;
}

.public-checkout .stack-form label span {
    color: var(--text);
    font-size: 0.86rem;
    font-weight: 800;
}

.checkout-login-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
}

.checkout-login-form button {
    grid-column: 1 / -1;
}

.checkout-delivery-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 14px;
}

.checkout-delivery-form .field-wide,
.checkout-delivery-form button {
    grid-column: 1 / -1;
}

.checkout-delivery-form button {
    justify-self: end;
    min-width: 190px;
}

.stack-form input,
.stack-form textarea {
    min-height: 42px;
    width: 100%;
    padding: 0 10px;
    color: var(--text);
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 6px;
    font: inherit;
}

.stack-form textarea {
    min-height: 92px;
    padding-top: 10px;
    resize: vertical;
}

.stack-form input:focus,
.stack-form textarea:focus {
    border-color: var(--accent);
    outline: 3px solid rgba(18, 103, 130, 0.16);
}

.stack-form.two-cols button,
.stack-form.two-cols textarea,
.stack-form.two-cols label[for="notes"] {
    grid-column: 1 / -1;
}

.checkout-error {
    max-width: 720px;
    margin-bottom: 18px;
}

.checkout-summary .button[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}

.checkout-summary {
    position: sticky;
    top: 84px;
}

.checkout-summary .order-submit {
    padding: 0 20px 20px;
}

.checkout-summary .order-submit label {
    display: grid;
    gap: 6px;
}

.checkout-summary .order-submit .helper-text {
    margin: 0;
    padding: 10px 12px;
    color: var(--muted);
    background: color-mix(in srgb, var(--background) 70%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--border) 52%, transparent);
    border-radius: 8px;
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.35;
}

.mini-cart {
    display: grid;
    gap: 0;
    margin: 0 20px 16px;
    padding: 10px 0;
    border-top: 1px solid color-mix(in srgb, var(--border) 42%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--border) 42%, transparent);
}

.mini-cart p {
    display: grid;
    gap: 3px;
    margin: 0;
    padding: 9px 0;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
    font-size: 0.9rem;
}

.mini-cart p:last-child {
    border-bottom: 0;
}

.mini-cart span {
    color: var(--text);
    font-weight: 800;
}

.mini-cart small {
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 700;
}

@media (max-width: 760px) {
    .account-hero,
    .checkout-layout,
    .stack-form.two-cols,
    .account-entry-grid,
    .account-register-form,
    .account-dashboard,
    .account-edit-form,
    .account-order-row {
        grid-template-columns: 1fr;
    }

    .account-hero {
        align-items: start;
        padding: 18px;
    }

    .account-hero h1 {
        font-size: 2rem;
    }

    .account-hero-badges {
        justify-content: flex-start;
    }

    .account-auth-card {
        padding: 20px;
    }

    .account-auth-card .account-register-form {
        grid-template-columns: 1fr;
    }

    .account-password-group > div {
        grid-template-columns: 1fr;
    }

    .account-login-card,
    .account-register-card,
    .account-side-stack {
        grid-column: auto;
        grid-row: auto;
    }

    .cart-layout,
    .cart-row {
        grid-template-columns: 1fr;
    }

    .cart-list-head {
        display: none;
    }

    .cart-row {
        gap: 14px;
        padding: 14px;
    }

    .cart-row-main {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .cart-item-title {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 10px;
    }

    .cart-item-mark {
        width: 48px;
        height: 48px;
        font-size: 0.64rem;
    }

    .cart-meta {
        gap: 7px;
        margin: 0;
    }

    .cart-meta div {
        grid-template-columns: minmax(72px, auto) minmax(0, 1fr);
        padding: 0;
    }

    .cart-actions {
        grid-template-columns: 86px minmax(0, 1fr);
        padding: 0;
    }

    .cart-row-buttons {
        grid-template-columns: 1fr;
    }

    .cart-row-buttons .button,
    .cart-row-buttons .link-button {
        width: 100%;
        text-align: center;
    }

    .cart-row-buttons .link-button {
        min-height: 38px;
    }

    .cart-summary {
        position: static;
    }

    .checkout-login-form,
    .checkout-delivery-form {
        grid-template-columns: 1fr;
    }

    .checkout-delivery-form .field-wide,
    .checkout-delivery-form button {
        grid-column: auto;
    }

    .checkout-delivery-form button {
        width: 100%;
        min-width: 0;
        justify-self: stretch;
    }

    .account-layout,
    .account-data-list {
        grid-template-columns: 1fr;
    }

    .account-help {
        position: static;
    }

    .account-actions-panel {
        position: static;
    }

    .account-pending-cart {
        grid-template-columns: 1fr;
    }

    .account-pending-cart span,
    .account-pending-cart .button {
        grid-column: auto;
        grid-row: auto;
    }

    .account-pending-cart .button,
    .account-form-actions .button,
    .account-order-row .button {
        width: 100%;
    }

    .account-form-actions {
        justify-content: stretch;
    }

    .account-card-heading {
        grid-template-columns: 42px minmax(0, 1fr);
    }

    .account-card-icon {
        width: 42px;
        height: 42px;
    }

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

    .photo-viewer {
        grid-template-columns: 1fr;
    }

    .photo-side-stack {
        position: static;
    }

    .event-card {
        grid-template-columns: 64px minmax(0, 1fr);
        align-items: start;
    }

    .event-avatar {
        width: 64px;
        height: 64px;
    }

    .event-avatar span {
        width: 44px;
        height: 44px;
        font-size: 1.25rem;
    }

    .event-actions {
        grid-column: 1 / -1;
        justify-self: stretch;
    }

    .event-actions .button {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .topbar.public-topbar {
        min-height: 64px;
        padding-right: 18px;
        padding-left: 18px;
        gap: 18px;
    }

    .public-topbar .brand {
        min-width: 0;
    }

    .public-hero {
        display: none;
    }

    .public-section {
        padding-top: 24px;
    }

    .public-events .event-list {
        grid-template-columns: 1fr;
    }

    .public-events .event-card {
        min-height: 230px;
    }

    .access-shell {
        width: min(100% - 28px, 980px);
        padding-top: 18px;
    }

    .public-event-access .public-topbar {
        min-height: 56px;
    }

    .public-event-access .access-shell {
        padding-top: 16px;
    }

    .public-event-access .breadcrumb {
        margin-bottom: 12px;
        font-size: 0.82rem;
    }

    .event-access-card {
        grid-template-columns: 1fr;
    }

    .event-access-visual {
        min-height: 112px;
        max-height: 140px;
    }

    .event-access-visual span {
        width: 64px;
        height: 64px;
        font-size: 2rem;
    }

    .event-access-content {
        padding: 16px;
    }

    .event-access-content h1 {
        margin-bottom: 6px;
        font-size: clamp(1.45rem, 8vw, 2rem);
    }

    .event-access-content .access-lead {
        font-size: 0.88rem;
        line-height: 1.35;
    }

    .access-meta {
        grid-template-columns: 1fr;
        gap: 8px;
        margin-top: 14px;
    }

    .access-meta div {
        padding: 9px 10px;
    }

    .event-access-card .access-form {
        gap: 9px;
        margin-top: 14px;
    }

    .event-access-card .access-form input {
        min-height: 44px;
    }

    .event-access-card .access-form .button {
        width: 100%;
    }

    .public-gallery .public-topbar {
        min-height: 56px;
    }

    .public-gallery .shell {
        padding-top: 16px;
    }

    .public-body.public-gallery .gallery-heading {
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 12px;
        margin-bottom: 16px;
        padding: 16px;
    }

    .gallery-heading-visual {
        width: 72px;
        height: 64px;
    }

    .gallery-heading-visual span {
        font-size: 1.55rem;
    }

    .gallery-heading-main h1 {
        font-size: clamp(1.2rem, 6vw, 1.58rem);
    }

    .gallery-heading-main p {
        display: none;
    }

    .gallery-heading-meta {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .gallery-heading-meta div {
        padding: 8px 9px;
    }

    .unlock-showcase {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .unlock-visual {
        display: none;
    }

    .unlock-content {
        padding: 16px;
    }

    .unlock-status-row {
        align-items: center;
        flex-direction: row;
        gap: 8px;
        margin-bottom: 10px;
    }

    .unlock-status-row .unlock-icon {
        flex-basis: 34px;
        width: 34px;
        height: 34px;
        border-radius: 7px;
    }

    .unlock-status-row .unlock-icon::before {
        width: 18px;
        height: 18px;
    }

    .unlock-status-row .unlock-status {
        min-height: 25px;
        padding: 0 8px;
        font-size: 0.74rem;
    }

    .unlock-content h1 {
        margin-bottom: 6px;
        font-size: clamp(1.15rem, 5.4vw, 1.55rem);
        line-height: 1.08;
    }

    .unlock-content > p {
        font-size: 0.86rem;
        line-height: 1.35;
    }

    .unlock-copy-full {
        display: none;
    }

    .unlock-copy-compact {
        display: inline;
    }

    .unlock-content .master-access-note {
        gap: 1px;
        margin-top: 12px;
        padding: 9px 10px;
        border-left-width: 3px;
    }

    .unlock-content .master-access-note strong {
        font-size: 0.84rem;
    }

    .unlock-content .master-access-note span {
        font-size: 0.8rem;
    }

    .unlock-content .unlock-meta {
        display: none;
    }

    .unlock-content .unlock-meta div + div {
        padding-left: 14px;
    }

    .unlock-content .unlock-actions {
        gap: 8px;
        padding-top: 14px;
    }

    .unlock-content .button {
        min-height: 40px;
        padding-right: 14px;
        padding-left: 14px;
        font-size: 0.9rem;
    }

    .unlock-content .button-prominent {
        min-height: 42px;
    }

    .unlock-hero {
        grid-template-columns: 1fr;
        padding: 22px;
    }

    .unlock-icon {
        width: 58px;
        height: 58px;
    }

    .unlock-icon::before {
        width: 28px;
        height: 28px;
    }

    .unlock-meta {
        grid-template-columns: 1fr;
        padding: 0 22px;
    }

    .master-access-note {
        margin-right: 22px;
        margin-left: 22px;
    }

    .unlock-meta div + div {
        padding-left: 0;
        border-left: 0;
        border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    }

    .unlock-actions {
        padding: 20px 22px 24px;
    }

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

    .photo-stage {
        min-height: auto;
        padding: 10px;
    }

    .photo-page-actions,
    .photo-nav {
        width: 100%;
        margin-top: 14px;
    }

    .photo-page-actions .button,
    .photo-nav .button {
        flex: 1 1 140px;
    }

    .gallery-grid {
        grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
        gap: 10px;
    }

    .gallery-page-toolbar,
    .gallery-page-size-form {
        align-items: stretch;
        width: 100%;
    }

    .gallery-page-toolbar {
        flex-direction: column;
    }

    .gallery-page-size-form {
        display: grid;
        grid-template-columns: 1fr auto;
    }

    .gallery-pagination .photo-page-link,
    .gallery-pagination .photo-page-gap {
        min-width: 34px;
        min-height: 34px;
        padding: 0 8px;
        font-size: 0.8rem;
    }

    .topbar {
        min-height: 56px;
        padding: 0 16px;
    }

    .shell {
        width: min(100% - 24px, 1120px);
        padding: 28px 0 44px;
    }

    .topic-grid {
        grid-template-columns: 1fr;
    }

    .topic-card {
        grid-template-rows: 120px 1fr;
    }

    .topic-body,
    .notice,
    .empty-state,
    .access-panel {
        padding: 18px;
    }
}
.stack-form select {
    min-height: 42px;
    width: 100%;
    padding: 0 10px;
    color: var(--text);
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 6px;
    font: inherit;
}

.stack-form select:focus {
    border-color: var(--accent);
    outline: 3px solid rgba(18, 103, 130, 0.16);
}

.shell:has(> .admin-nav) .page-heading {
    max-width: none;
    margin-bottom: 22px;
}

.shell:has(> .admin-nav) .page-heading.compact {
    display: grid;
    gap: 5px;
    padding: 4px 0 2px;
}

.shell:has(> .admin-nav) .eyebrow {
    margin: 0;
    color: var(--gold);
    font-size: 0.76rem;
    letter-spacing: 0;
}

.shell:has(> .admin-nav) h1 {
    margin: 0;
    font-size: clamp(1.8rem, 3vw, 2.65rem);
    line-height: 1.08;
}

.shell:has(> .admin-nav) h2 {
    color: #111b24;
    font-size: 1.08rem;
    letter-spacing: 0;
}

.shell:has(> .admin-nav) p {
    margin-bottom: 0;
}

.shell:has(> .admin-nav) .checkout-panel,
.shell:has(> .admin-nav) .admin-table-wrap,
.shell:has(> .admin-nav) .notice,
.shell:has(> .admin-nav) .empty-state {
    border-color: rgba(113, 128, 146, 0.24);
    box-shadow: var(--shadow-soft);
}

.shell:has(> .admin-nav) .checkout-panel {
    padding: clamp(16px, 2vw, 24px);
}

.shell:has(> .admin-nav) .stack-form {
    gap: 14px;
}

.shell:has(> .admin-nav) .stack-form label,
.shell:has(> .admin-nav) .order-filter-form label,
.shell:has(> .admin-nav) .event-topic-filter label {
    color: #30404f;
    font-size: 0.83rem;
    font-weight: 780;
}

.shell:has(> .admin-nav) .stack-form input,
.shell:has(> .admin-nav) .stack-form textarea,
.shell:has(> .admin-nav) .stack-form select,
.shell:has(> .admin-nav) .order-filter-form input,
.shell:has(> .admin-nav) .order-filter-form select,
.shell:has(> .admin-nav) .inline-admin-form select {
    min-height: 44px;
    padding-inline: 12px;
    border-color: #d7e0e7;
    border-radius: 8px;
    box-shadow: inset 0 1px 0 rgba(20, 32, 44, 0.03);
}

.shell:has(> .admin-nav) .stack-form input:focus,
.shell:has(> .admin-nav) .stack-form textarea:focus,
.shell:has(> .admin-nav) .stack-form select:focus,
.shell:has(> .admin-nav) .order-filter-form input:focus,
.shell:has(> .admin-nav) .order-filter-form select:focus,
.shell:has(> .admin-nav) .inline-admin-form select:focus {
    border-color: var(--accent);
    outline: 3px solid rgba(15, 102, 113, 0.14);
}

.shell:has(> .admin-nav) .button {
    min-height: 42px;
    padding-inline: 16px;
    border: 1px solid rgba(15, 102, 113, 0.16);
    border-radius: 8px;
    background: linear-gradient(180deg, #11727d, var(--accent-strong));
    box-shadow: 0 8px 18px rgba(15, 102, 113, 0.16);
    font-weight: 780;
    transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.shell:has(> .admin-nav) .button:hover {
    background: linear-gradient(180deg, #0f6671, #063d45);
    box-shadow: 0 10px 22px rgba(15, 102, 113, 0.2);
    transform: translateY(-1px);
}

.shell:has(> .admin-nav) .button.secondary {
    color: var(--accent-strong);
    background: #ffffff;
    border-color: rgba(15, 102, 113, 0.2);
    box-shadow: 0 6px 14px rgba(20, 32, 44, 0.06);
}

.shell:has(> .admin-nav) .button.secondary:hover {
    background: var(--accent-soft);
}

.shell:has(> .admin-nav) .button.danger {
    border-color: rgba(154, 42, 24, 0.22);
    background: linear-gradient(180deg, #ad351f, #862213);
}

.shell:has(> .admin-nav) .admin-grid-two {
    gap: 18px;
}

.shell:has(> .admin-nav) .admin-stat-grid {
    gap: 18px;
}

.shell:has(> .admin-nav) .admin-stat-grid h2 {
    margin-bottom: 4px;
    color: var(--accent-strong);
    font-size: clamp(1.65rem, 2vw, 2.15rem);
}

.shell:has(> .admin-nav) .admin-table th,
.shell:has(> .admin-nav) .admin-table td {
    padding: 14px 16px;
}

.shell:has(> .admin-nav) .admin-table th {
    background: #f8fafb;
    color: #5d6a79;
    font-size: 0.75rem;
    letter-spacing: 0;
}

.shell:has(> .admin-nav) .admin-table tr:hover td {
    background: #fbfdfe;
}

.shell:has(> .admin-nav) .form-error,
.shell:has(> .admin-nav) .inline-status {
    border-radius: 8px;
}

.order-submit {
    padding-top: 14px;
    border-top: 1px solid var(--surface-soft);
}


.origin-summary-list {
    display: grid;
    gap: 6px;
    padding: 10px 12px;
    background: var(--surface-soft);
    border: 1px solid var(--border);
    border-radius: 6px;
}

.origin-summary-list p {
    margin: 0;
    color: var(--muted);
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}
.path-hint {
    display: block;
    padding: 10px 12px;
    overflow-x: auto;
    color: var(--text);
    background: var(--surface-soft);
    border: 1px solid var(--border);
    border-radius: 6px;
    font-size: 0.9rem;
}
.helper-text {
    margin: 0;
    color: var(--muted);
    font-size: 0.92rem;
}

.confirmation-hero {
    margin-bottom: 24px;
    padding: 28px;
    color: #ffffff;
    background: linear-gradient(135deg, #126782, #1b4d5f);
    border-radius: 8px;
}

.confirmation-hero h1,
.confirmation-hero p {
    margin: 0;
}

.confirmation-hero h1 {
    margin-top: 8px;
    font-size: clamp(2rem, 5vw, 3.5rem);
}

.confirmation-hero p:last-child {
    max-width: 720px;
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.88);
}

.order-layout {
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

.detail-list {
    display: grid;
    gap: 10px;
    margin: 0;
}

.detail-list div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--surface-soft);
}

.detail-list dt {
    color: var(--muted);
    font-weight: 700;
}

.detail-list dd {
    margin: 0;
    text-align: right;
}

.order-lines {
    display: grid;
    gap: 10px;
    margin-bottom: 18px;
}

.order-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    gap: 14px;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--surface-soft);
}

.order-line span:first-child {
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 760px) {
    .order-layout,
    .order-line {
        grid-template-columns: 1fr;
    }

    .order-line {
        gap: 6px;
    }

    .detail-list div {
        align-items: flex-start;
    }

}

.payment-note {
    margin: 0 0 20px;
    padding: 18px 20px;
    background: #fff7df;
    border: 1px solid #e8c872;
    border-radius: 8px;
}

.payment-note.compact {
    margin: 16px 0;
    padding: 14px;
}

.payment-note h2,
.payment-note h3,
.payment-note p {
    margin: 0;
}

.payment-note p {
    margin-top: 8px;
    color: var(--text);
}

.payment-note .payment-email-note {
    padding-top: 8px;
    border-top: 1px solid rgba(129, 96, 22, 0.2);
    font-weight: 850;
}

.public-order-status .shell {
    width: min(100% - 40px, 920px);
}

.order-status-stack {
    display: grid;
    gap: 20px;
}

.order-status-search {
    width: 100%;
}

.order-status-search h2 {
    margin-bottom: 14px;
    color: var(--text);
    font-size: 1.22rem;
}

.order-status-form {
    grid-template-columns: minmax(150px, 0.8fr) minmax(240px, 1.2fr) auto;
    align-items: end;
}

.order-status-form label {
    display: grid;
    gap: 6px;
}

.order-status-form label span {
    color: var(--text);
    font-size: 0.86rem;
    font-weight: 800;
}

.order-status-card {
    display: grid;
    gap: 18px;
}

.order-status-card-header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    padding-bottom: 16px;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 44%, transparent);
}

.order-status-card-header h2 {
    margin: 3px 0 0;
    color: var(--text);
    font-size: clamp(1.45rem, 3vw, 2rem);
}

.order-status-badge {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    padding: 0 12px;
    color: var(--accent-strong);
    background: color-mix(in srgb, var(--accent) 10%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--accent) 32%, transparent);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 900;
    white-space: nowrap;
}

.order-status-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.order-status-summary div {
    min-width: 0;
    padding: 12px;
    background: color-mix(in srgb, var(--surface) 76%, var(--background));
    border: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
    border-radius: 8px;
}

.order-status-summary dt {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.order-status-summary dd {
    overflow-wrap: anywhere;
    margin: 4px 0 0;
    color: var(--text);
    font-weight: 850;
}

.order-status-section {
    display: grid;
    gap: 10px;
}

.order-status-section h3 {
    margin: 0;
    color: var(--text);
    font-size: 1.05rem;
}

.order-status-lines {
    display: grid;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
    border-radius: 8px;
}

.order-status-lines p {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    margin: 0;
    padding: 11px 12px;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 38%, transparent);
}

.order-status-lines p:last-child {
    border-bottom: 0;
}

.order-status-lines span {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--text);
    font-weight: 800;
}

.order-status-lines small {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 750;
    text-align: right;
}

.order-status-card .payment-note {
    margin: 0;
}

.order-status-download-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
    gap: 12px;
}

.order-status-download-card {
    display: grid;
    overflow: hidden;
    color: var(--text);
    text-decoration: none;
    background: color-mix(in srgb, var(--surface) 80%, var(--background));
    border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(14, 31, 43, 0.08);
}

.order-status-download-card:hover,
.order-status-download-card:focus-visible {
    border-color: var(--accent);
    transform: translateY(-1px);
}

.order-status-download-card img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    background: color-mix(in srgb, var(--background) 72%, #ffffff);
}

.order-status-download-card span {
    overflow: hidden;
    padding: 8px 9px;
    color: var(--accent-strong);
    font-size: 0.78rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.order-status-return {
    display: flex;
    justify-content: center;
    margin-top: 22px;
}

.order-status-return .button {
    min-width: 180px;
}

@media (max-width: 760px) {
    .order-status-form,
    .order-status-summary,
    .order-status-lines p {
        grid-template-columns: 1fr;
    }

    .order-status-card-header {
        display: grid;
    }

    .order-status-lines small {
        text-align: left;
    }
}

.narrow-shell {
    max-width: 520px;
}

.admin-table-wrap {
    overflow-x: auto;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.admin-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
}

.admin-table th,
.admin-table td {
    padding: 13px 14px;
    text-align: left;
    border-bottom: 1px solid var(--surface-soft);
}

.admin-table th {
    color: var(--muted);
    font-size: 0.82rem;
    text-transform: uppercase;
}

.order-filter-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px 14px;
    margin-bottom: 16px;
}

.order-filter-form label {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
    text-transform: uppercase;
}

.order-filter-form input,
.order-filter-form select,
.inline-admin-form select {
    min-height: 38px;
    width: 100%;
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #ffffff;
    font: inherit;
}

.order-filter-actions {
    display: flex;
    gap: 10px;
    align-items: end;
}

.admin-list-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 12px;
    color: var(--muted);
    font-weight: 700;
}

.admin-list-meta p {
    margin: 0;
}

.order-admin-table {
    min-width: 1040px;
}

.customer-admin-table {
    min-width: 1080px;
}

.muted-line {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 0.9rem;
}

.inline-admin-form {
    display: flex;
    gap: 8px;
    align-items: center;
}

.inline-admin-form select {
    min-width: 126px;
}

.table-action-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.button.small {
    min-height: 34px;
    padding: 7px 12px;
    font-size: 0.9rem;
}

.button.danger {
    background: #9a2a18;
}

.button.danger:hover {
    background: #7f1f11;
}

.button.disabled {
    opacity: 0.5;
    pointer-events: none;
}

.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
}

.pagination span {
    color: var(--muted);
    font-weight: 800;
}

.admin-form-split {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--surface-soft);
}

.check-row {
    display: flex;
    gap: 10px;
    align-items: center;
}

.check-row input {
    width: auto;
    min-height: auto;
}

.admin-lines-panel {
    margin-top: 20px;
}

.admin-hero {
    margin-bottom: 20px;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-top: 18px;
}

body:has(.admin-nav) {
    background:
        linear-gradient(180deg, #f8fafb 0, #f4f6f8 320px),
        var(--background);
}

body:has(.admin-nav) .topbar {
    min-height: 70px;
    padding: 0 clamp(16px, 4vw, 34px);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 1px 0 rgba(20, 32, 44, 0.04);
}

body:has(.admin-nav) .brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 1.02rem;
}

body:has(.admin-nav) .brand::before {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    color: var(--gold);
    border: 1px solid rgba(201, 146, 47, 0.45);
    border-radius: 8px;
    background: #10252a;
    content: "FB";
    font-size: 0.72rem;
    font-weight: 900;
}

body:has(.admin-nav) .cart-pill {
    min-height: 36px;
    padding: 0 13px;
    color: var(--accent-strong);
    background: var(--accent-soft);
    border-color: rgba(15, 102, 113, 0.14);
    border-radius: 8px;
    text-decoration: none;
}

.shell:has(> .admin-nav) {
    display: grid;
    grid-template-columns: minmax(218px, 248px) minmax(0, 1fr);
    gap: 24px;
    width: min(100% - 32px, 1360px);
    padding-top: 28px;
}

.shell:has(> .admin-nav:not([open])) {
    grid-template-columns: 82px minmax(0, 1fr);
}

.shell:has(> .admin-nav) > :not(.admin-nav) {
    grid-column: 2;
}

.admin-nav {
    position: sticky;
    top: 86px;
    max-height: calc(100dvh - 102px);
    overflow-y: auto;
    z-index: 10;
    grid-row: 1 / span 40;
    align-self: start;
    min-width: 0;
    padding: 12px;
    color: #d8e7ea;
    background: linear-gradient(180deg, #0d2830 0, #061a20 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.admin-nav summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 24px;
    gap: 6px 10px;
    align-items: center;
    min-height: 46px;
    padding: 8px 10px;
    color: #ffffff;
    cursor: pointer;
    font-weight: 800;
    list-style: none;
}

.admin-nav summary::-webkit-details-marker {
    display: none;
}

.admin-nav summary::after {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    color: var(--gold);
    border: 1px solid rgba(201, 146, 47, 0.42);
    border-radius: 6px;
    content: "-";
}

.admin-nav:not([open]) summary {
    grid-template-columns: 1fr;
    justify-items: center;
    padding: 8px 0;
}

.admin-nav:not([open]) summary span,
.admin-nav:not([open]) summary small {
    display: none;
}

.admin-nav:not([open]) summary::after {
    content: "+";
}

.admin-nav summary small {
    grid-column: 1;
    color: rgba(216, 231, 234, 0.68);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.admin-nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    margin-top: 6px;
    padding: 0 10px;
    color: rgba(255, 255, 255, 0.86);
    border: 1px solid transparent;
    border-radius: 8px;
    font-weight: 760;
    text-decoration: none;
}

.admin-nav a:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.07);
}

.admin-nav a.active {
    color: #ffffff;
    background: rgba(15, 102, 113, 0.92);
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: inset 3px 0 0 var(--gold);
}

.admin-nav-icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 28px;
    height: 28px;
    color: var(--gold);
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    font-size: 0.68rem;
    font-weight: 900;
}

.admin-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.admin-stat-grid h2 {
    font-size: 2rem;
}

.admin-grid-two {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

.compact-list {
    display: grid;
    gap: 10px;
}

.compact-list a,
.compact-list span {
    display: grid;
    gap: 3px;
    padding: 12px 0;
    border-bottom: 1px solid var(--surface-soft);
    text-decoration: none;
}

.compact-list span,
.compact-list a span {
    color: var(--muted);
}

.compact-list.plain span {
    color: var(--text);
}

.image-cleanup-list {
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
    gap: 12px;
}

.image-cleanup-form {
    display: grid;
    gap: 12px;
}

.photo-page-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    background: #f7fafb;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.photo-page-summary p {
    margin: 0;
    color: #5f6f7e;
    font-size: 0.88rem;
    font-weight: 720;
}

.photo-page-size-form {
    display: flex;
    gap: 8px;
    align-items: center;
}

.photo-page-size-form label {
    color: #20313d;
    font-size: 0.82rem;
    font-weight: 830;
}

.photo-page-size-form select {
    min-height: 36px;
    min-width: 84px;
    padding: 0 34px 0 10px;
}

.photo-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: center;
    padding-top: 16px;
}

.gallery-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: center;
    margin-top: 22px;
}

.photo-page-link,
.photo-page-gap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    min-height: 36px;
    padding: 0 10px;
    color: var(--accent-strong);
    background: #ffffff;
    border: 1px solid #d7e2e8;
    border-radius: 8px;
    font-size: 0.86rem;
    font-weight: 820;
    text-decoration: none;
}

.photo-page-link.is-active {
    color: #ffffff;
    background: var(--accent-strong);
    border-color: var(--accent-strong);
}

.photo-page-link:not(.is-active):hover {
    border-color: var(--accent);
    box-shadow: 0 8px 18px rgba(18, 103, 130, 0.12);
}

.photo-page-gap {
    color: #70808e;
    background: transparent;
    border-color: transparent;
}

.bulk-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--surface-soft);
}

.image-cleanup-row {
    position: relative;
    display: block;
    aspect-ratio: 1;
    padding: 0;
    overflow: hidden;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface-soft);
    cursor: pointer;
}

.image-cleanup-row input {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 1;
}

.image-cleanup-row img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.color-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.color-grid label {
    display: grid;
    gap: 8px;
}

.settings-grid label {
    display: grid;
    gap: 8px;
}

.settings-checklist {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.settings-checklist legend {
    padding: 0 6px;
    color: var(--muted);
    font-weight: 800;
}


.settings-method-row {
    display: grid;
    grid-template-columns: minmax(110px, 0.6fr) minmax(180px, 1.4fr) minmax(120px, 0.8fr);
    gap: 12px;
    align-items: end;
    padding: 10px 0;
    border-top: 1px solid var(--border);
}

.settings-method-row:first-of-type {
    border-top: 0;
}


.settings-method-row.payment-row {
    grid-template-columns: minmax(110px, 0.5fr) minmax(180px, 1fr) minmax(120px, 0.6fr) minmax(220px, 1.4fr);
}

.settings-method-row label {
    display: grid;
    gap: 8px;
}
.color-grid input[type="color"] {
    min-height: 44px;
    padding: 4px;
}

.appearance-preview {
    background: var(--surface);
}

.watermark-current-preview {
    display: inline-grid;
    grid-template-columns: 44px auto;
    gap: 8px;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    padding: 6px 8px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background:
        linear-gradient(45deg, rgba(0, 0, 0, 0.04) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(0, 0, 0, 0.04) 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, rgba(0, 0, 0, 0.04) 75%),
        linear-gradient(-45deg, transparent 75%, rgba(0, 0, 0, 0.04) 75%),
        #ffffff;
    background-position: 0 0, 0 8px, 8px -8px, -8px 0;
    background-size: 16px 16px;
    color: var(--accent-strong);
    font-weight: 800;
    text-decoration: none;
}

.watermark-current-preview img {
    display: block;
    width: 44px;
    height: 32px;
    object-fit: contain;
}

.company-logo-settings,
.default-event-avatar-settings {
    display: grid;
    grid-template-columns: minmax(120px, 170px) minmax(0, 1fr);
    gap: 16px;
    align-items: stretch;
    padding: 16px;
    background: #fbfdfe;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.company-logo-preview,
.default-event-avatar-preview {
    display: grid;
    place-items: center;
    min-height: 112px;
    padding: 10px;
    overflow: hidden;
    color: #60707f;
    background: #eef4f6;
    border: 1px dashed #b8c8d2;
    border-radius: 8px;
    font-size: 0.84rem;
    font-weight: 820;
    text-align: center;
}

.company-logo-preview img {
    display: block;
    width: 100%;
    max-width: 150px;
    max-height: 96px;
    object-fit: contain;
}

.default-event-avatar-preview img {
    display: block;
    width: 100%;
    max-width: 150px;
    height: 96px;
    object-fit: cover;
    border-radius: 6px;
}

.company-logo-fields,
.default-event-avatar-fields {
    display: grid;
    gap: 12px;
    align-content: center;
}

.image-settings-list {
    margin: 18px 0;
}

.topic-avatar-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: center;
    padding: 12px;
    background: var(--surface-soft);
    border: 1px solid var(--border);
    border-radius: 8px;
}

.topic-avatar-preview img {
    width: 96px;
    height: 72px;
    object-fit: cover;
    border-radius: 6px;
}

.topics-admin-layout {
    display: grid;
    gap: 20px;
}

.topic-editor-panel,
.topic-list-panel {
    width: 100%;
}

.topic-editor-heading,
.topic-list-heading {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}

.topic-editor-heading h2,
.topic-list-heading h2 {
    margin: 0;
}

.topic-editor-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 14px;
}

.topic-editor-fields label {
    display: grid;
    gap: 8px;
}

.topic-readonly-id {
    display: grid;
    gap: 8px;
    align-content: center;
    min-height: 76px;
    padding: 12px 14px;
    background: #f7fafb;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.topic-readonly-id span {
    color: #20313d;
    font-size: 0.82rem;
    font-weight: 830;
}

.topic-readonly-id strong {
    color: var(--accent-strong);
    font-size: 1rem;
}

.topic-format-editor {
    display: grid;
    gap: 10px;
}

.topic-format-row {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr) 130px;
    gap: 10px 12px;
    align-items: end;
    padding: 12px;
    background: #f8fbfc;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.topic-format-index {
    align-self: center;
    color: var(--accent-strong);
    font-size: 0.82rem;
    font-weight: 850;
}

.topic-format-editor label {
    display: grid;
    gap: 6px;
}

.topic-admin-list {
    display: grid;
    gap: 12px;
}

.topic-admin-row {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--surface-soft);
}

.topic-admin-row:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.topic-admin-avatar {
    display: grid;
    place-items: center;
    width: 78px;
    height: 64px;
    overflow: hidden;
    background: var(--surface-soft);
    border-radius: 8px;
}

.topic-admin-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.topic-admin-avatar span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: var(--accent-strong);
    background: #ffffff;
    border: 1px solid rgba(18, 103, 130, 0.18);
    border-radius: 50%;
    font-weight: 700;
}

.topic-admin-main h3 {
    margin: 0 0 4px;
    font-size: 1.05rem;
}

.topic-admin-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.topic-admin-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 9px;
    color: #516171;
    background: #f6f9fb;
    border: 1px solid var(--border);
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 760;
}

.topic-admin-main .action-row {
    margin-top: 10px;
}

@media print {
    .frontend-protection .protected-photo,
    .frontend-protection .photo-stage,
    .frontend-protection .gallery-grid {
        display: none !important;
    }

    .frontend-protection::before {
        display: block;
        margin: 32px;
        color: #1d2733;
        content: "La impresion de fotografias esta desactivada para proteger la propiedad intelectual.";
        font: 700 18px Arial, sans-serif;
    }
}

@media (max-width: 760px) {
    .admin-table th,
    .admin-table td {
        padding: 11px 12px;
    }

    .admin-stat-grid,
    .admin-grid-two,
    .color-grid,
    .order-filter-form,
    .settings-grid,
    .topic-editor-fields,
    .topic-format-editor,
    .topic-format-row {
        grid-template-columns: 1fr;
    }

    .inline-admin-form {
        align-items: stretch;
        flex-direction: column;
    }
}
.field-with-help {
    position: relative;
}

.field-with-help > span {
    display: flex;
    align-items: center;
    gap: 8px;
}

.checkbox-with-help {
    display: flex;
    align-items: center;
    gap: 8px;
}

.field-help {
    position: relative;
    display: inline-flex;
    z-index: 5;
}

.field-help summary {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: #ffffff;
    color: var(--accent);
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
    list-style: none;
}

.field-help summary::-webkit-details-marker {
    display: none;
}

.field-help summary:hover,
.field-help[open] summary {
    border-color: var(--accent);
    background: var(--soft);
}

.field-help div {
    position: absolute;
    top: 28px;
    left: 0;
    width: min(320px, calc(100vw - 48px));
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 16px 35px rgba(20, 24, 32, 0.16);
    color: var(--text);
    font-size: 0.88rem;
    font-weight: 500;
    line-height: 1.45;
}

.settings-grid > label:nth-child(even) .field-help div {
    right: 0;
    left: auto;
}
.admin-recovery {
    margin-top: 18px;
    border-top: 1px solid var(--border);
    padding-top: 14px;
}

.admin-recovery summary {
    color: var(--accent-strong);
    cursor: pointer;
    font-weight: 800;
}

.admin-recovery .stack-form {
    margin-top: 12px;
}

.text-link {
    color: var(--accent-strong);
    font-weight: 800;
    text-decoration: none;
}

.text-link:hover {
    text-decoration: underline;
}
.smart-import-panel {
    display: grid;
    gap: 16px;
    margin-bottom: 20px;
    border-color: #b9d6e0;
    background: linear-gradient(135deg, #ffffff 0%, #edf8fb 100%);
}

.smart-import-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.smart-import-button {
    min-height: 46px;
    background: #0c7186;
    box-shadow: 0 10px 24px rgba(12, 113, 134, 0.18);
}

.smart-import-button:hover {
    background: #075f72;
}

.smart-progress {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.25rem;
    color: var(--muted);
    font-size: 0.92rem;
}

.smart-progress[hidden] {
    display: none;
}

.smart-progress-track {
    position: relative;
    height: 0.6rem;
    overflow: hidden;
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 12%, var(--surface));
}

.smart-progress-track span {
    position: absolute;
    inset: 0 auto 0 0;
    width: 42%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0c7186, var(--accent));
    animation: smart-progress-slide 1.05s ease-in-out infinite;
}

@keyframes smart-progress-slide {
    0% {
        transform: translateX(-105%);
    }

    100% {
        transform: translateX(245%);
    }
}

.smart-preview {
    display: grid;
    gap: 10px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}

.smart-preview h3 {
    margin: 0;
}

.smart-preview-list {
    display: grid;
    gap: 8px;
}

.smart-preview-list p {
    display: grid;
    gap: 3px;
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid var(--surface-soft);
}

.smart-preview-list span {
    color: var(--muted);
    font-size: 0.92rem;
}

.smart-confirm-form {
    margin-top: 8px;
}

.event-create-panel,
.event-list-panel {
    margin-bottom: 20px;
}

.event-create-form {
    gap: 18px;
}

.event-create-heading h2,
.event-list-panel h2 {
    margin: 0;
}

.event-create-heading .helper-text {
    margin-top: 4px;
}

.event-create-fields {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 12px;
}

.event-create-fields label {
    display: grid;
    gap: 8px;
}

.event-create-options {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.9fr);
    gap: 16px;
    align-items: stretch;
}

.event-create-options h3 {
    margin: 0 0 12px;
    color: var(--ink);
    font-size: 0.95rem;
}

.event-create-checks {
    display: grid;
    gap: 10px;
}

.event-create-options .button {
    margin-left: auto;
}

.event-create-origin,
.event-create-submit {
    padding: 16px;
    background: #f7fafb;
    border: 1px solid #e2eaf0;
    border-radius: 8px;
}

.event-create-origin-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.event-create-origin-grid > label:first-child {
    display: grid;
    gap: 8px;
}

.event-create-import-check {
    align-self: center;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid #d9e5ec;
    border-radius: 8px;
}

.event-create-origin-summary {
    margin-top: 12px;
}

.event-create-submit {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
}

.event-create-submit .helper-text {
    margin: 0;
}

.event-topic-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: end;
    margin-top: 12px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface-soft);
}

.event-topic-filter label {
    display: grid;
    flex: 1 1 260px;
    gap: 8px;
    color: var(--muted);
    font-weight: 800;
}

.event-topic-filter select {
    min-height: 42px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--text);
}

[data-event-list-content][aria-busy="true"] {
    opacity: 0.55;
    pointer-events: none;
}

[data-event-photo-list-content][aria-busy="true"] {
    opacity: 0.55;
    pointer-events: none;
}

.event-admin-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    margin-top: 10px;
}

.event-admin-card {
    position: relative;
    min-height: 86px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    transition: border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.event-admin-card:hover {
    border-color: var(--accent);
    box-shadow: 0 12px 28px rgba(18, 103, 130, 0.12);
    transform: translateY(-1px);
}

.event-admin-card-link {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-height: 84px;
    padding: 10px;
    color: var(--text);
    text-decoration: none;
}

.event-admin-check {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 4px 12px rgba(20, 24, 32, 0.14);
}

.event-admin-check input {
    margin: 0;
}

.event-delete-form {
    display: grid;
    gap: 12px;
}

.event-bulk-actions {
    margin-top: 12px;
}

.event-admin-avatar {
    display: grid;
    position: relative;
    place-items: center;
    width: 64px;
    height: 64px;
    overflow: hidden;
    border-radius: 8px;
    background: var(--surface-soft);
    color: var(--accent-strong);
    font-weight: 900;
}

.event-admin-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.event-admin-card-link {
    padding-right: 10px;
}

.event-full-original-badge {
    position: absolute;
    bottom: 8px;
    left: 8px;
    display: grid;
    width: 24px;
    height: 24px;
    box-sizing: border-box;
    place-items: center;
    color: #ffffff;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 82%, #ffffff), var(--accent-strong));
    border: 2px solid #ffffff;
    border-radius: 7px;
    box-shadow: 0 4px 10px rgba(15, 28, 38, 0.24);
}

.event-full-original-badge::before {
    width: 14px;
    height: 14px;
    background: currentColor;
    content: "";
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.2 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8.8z'/%3E%3Cpath d='M15 3v6H7V3'/%3E%3Cpath d='M7 21v-7h10v7'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.2 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8.8z'/%3E%3Cpath d='M15 3v6H7V3'/%3E%3Cpath d='M7 21v-7h10v7'/%3E%3C/svg%3E") center / contain no-repeat;
}

.event-admin-card-body {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.event-admin-card-body strong,
.event-admin-card-body span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.event-admin-card-body span {
    color: var(--muted);
    font-size: 0.9rem;
}

@media (max-width: 760px) {
    .smart-import-controls {
        grid-template-columns: 1fr;
    }

    .event-create-fields {
        grid-template-columns: 1fr;
    }

    .event-create-options {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .event-create-submit {
        display: grid;
    }

    .event-create-submit .button {
        width: 100%;
        margin-left: 0;
    }

    .event-topic-filter .button {
        width: 100%;
    }
}

@media (max-width: 980px) {
    .shell:has(> .admin-nav),
    .shell:has(> .admin-nav:not([open])) {
        grid-template-columns: 1fr;
        gap: 18px;
        width: min(100% - 24px, 1120px);
        padding-top: 22px;
    }

    .shell:has(> .admin-nav) > :not(.admin-nav) {
        grid-column: 1;
    }

    .admin-nav {
        position: static;
        max-height: none;
        overflow-y: visible;
        grid-column: 1;
        grid-row: auto;
    }

    .admin-nav[open] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
    }

    .admin-nav summary {
        grid-column: 1 / -1;
    }

    .admin-nav a {
        margin-top: 0;
    }
}

@media (max-width: 640px) {
    body:has(.admin-nav) .topbar {
        min-height: 62px;
    }

    body:has(.admin-nav) .brand {
        font-size: 0.95rem;
    }

    .admin-nav[open] {
        grid-template-columns: 1fr;
    }

    .shell:has(> .admin-nav) .checkout-panel {
        padding: 16px;
    }

    .shell:has(> .admin-nav) .page-heading.compact {
        gap: 7px;
    }

    .shell:has(> .admin-nav) h1 {
        font-size: 1.75rem;
    }

    .shell:has(> .admin-nav) .button {
        width: 100%;
        white-space: normal;
    }
}

.admin-body {
    background:
        linear-gradient(180deg, #f9fbfc 0, #f4f6f8 260px),
        var(--background);
    font-size: 15px;
}

.admin-body .topbar {
    min-height: 72px;
    padding: 0 clamp(16px, 4vw, 36px);
    background: rgba(255, 255, 255, 0.96);
    border-bottom-color: rgba(116, 131, 148, 0.22);
    box-shadow: 0 8px 22px rgba(20, 32, 44, 0.04);
}

.admin-body .brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: #101b24;
    font-size: 1.02rem;
    font-weight: 820;
}

.admin-body .brand::before {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    color: var(--gold);
    background: #0d2830;
    border: 1px solid rgba(201, 146, 47, 0.46);
    border-radius: 8px;
    content: "FB";
    font-size: 0.72rem;
    font-weight: 900;
}

.admin-body .cart-pill {
    min-height: 38px;
    padding: 0 14px;
    color: var(--accent-strong);
    background: var(--accent-soft);
    border-color: rgba(15, 102, 113, 0.16);
    border-radius: 8px;
    text-decoration: none;
}

.admin-body .shell {
    display: grid;
    grid-template-columns: minmax(218px, 250px) minmax(0, 1fr);
    gap: 24px;
    width: min(100% - 32px, 1380px);
    padding-top: 28px;
}

.admin-body .shell:has(> .admin-nav:not([open])) {
    grid-template-columns: 82px minmax(0, 1fr);
}

.admin-body .shell > :not(.admin-nav) {
    grid-column: 2;
}

.admin-body .page-heading.compact {
    display: grid;
    gap: 6px;
    max-width: none;
    margin-bottom: 22px;
    padding: 2px 0 4px;
}

.admin-body .eyebrow {
    margin: 0;
    color: var(--gold);
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0;
}

.admin-body h1 {
    margin: 0;
    font-size: clamp(1.9rem, 3vw, 2.7rem);
    line-height: 1.06;
}

.admin-body h2 {
    margin-bottom: 12px;
    color: #101b24;
    font-size: 1.08rem;
    font-weight: 820;
}

.admin-body p {
    color: #6a7684;
}

.admin-body .checkout-panel,
.admin-body .admin-table-wrap,
.admin-body .notice,
.admin-body .empty-state {
    border-color: rgba(112, 128, 146, 0.24);
    box-shadow: var(--shadow-soft);
}

.admin-body .checkout-panel {
    padding: clamp(18px, 2vw, 24px);
}

.admin-body .checkout-panel > h2:first-child,
.admin-body .checkout-panel > .eyebrow:first-child + h2 {
    padding-bottom: 12px;
    border-bottom: 1px solid var(--surface-soft);
}

.admin-body .stack-form {
    gap: 14px;
}

.admin-body .stack-form label,
.admin-body .order-filter-form label,
.admin-body .event-topic-filter label,
.admin-body .settings-method-row label,
.admin-body .topic-format-editor label {
    display: grid;
    gap: 7px;
    color: #334454;
    font-size: 0.84rem;
    font-weight: 790;
}

.admin-body .stack-form input,
.admin-body .stack-form textarea,
.admin-body .stack-form select,
.admin-body .order-filter-form input,
.admin-body .order-filter-form select,
.admin-body .inline-admin-form select,
.admin-body .event-topic-filter select,
.admin-body .purchase-form select,
.admin-body .purchase-form input {
    min-height: 44px;
    padding-inline: 12px;
    color: #17212b;
    background: #ffffff;
    border: 1px solid #d7e0e7;
    border-radius: 8px;
    box-shadow: inset 0 1px 0 rgba(20, 32, 44, 0.03);
}

.admin-body .stack-form textarea {
    min-height: 104px;
    padding-top: 11px;
}

.admin-body .stack-form input[type="file"] {
    padding: 9px 12px;
}

.admin-body .stack-form input[type="color"] {
    min-height: 48px;
    padding: 5px;
}

.admin-body input:focus,
.admin-body textarea:focus,
.admin-body select:focus {
    border-color: var(--accent) !important;
    outline: 3px solid rgba(15, 102, 113, 0.14) !important;
}

.admin-body .button {
    min-height: 42px;
    padding: 0 16px;
    border: 1px solid rgba(15, 102, 113, 0.16);
    border-radius: 8px;
    background: linear-gradient(180deg, #11727d, var(--accent-strong));
    box-shadow: 0 8px 18px rgba(15, 102, 113, 0.16);
    font-weight: 790;
    transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.admin-body .button:hover {
    background: linear-gradient(180deg, #0f6671, #063d45);
    box-shadow: 0 10px 22px rgba(15, 102, 113, 0.2);
    transform: translateY(-1px);
}

.admin-body .button.secondary {
    color: var(--accent-strong);
    background: #ffffff;
    border-color: rgba(15, 102, 113, 0.22);
    box-shadow: 0 6px 14px rgba(20, 32, 44, 0.06);
}

.admin-body .button.secondary:hover {
    background: var(--accent-soft);
}

.admin-body .button.danger {
    border-color: rgba(154, 42, 24, 0.22);
    background: linear-gradient(180deg, #b23a23, #862213);
}

.admin-body .link-button {
    color: #9a2a18;
    font-weight: 780;
}

.admin-body .admin-form-split {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #e6edf2;
}

.admin-body .admin-form-split:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.admin-body .admin-form-split h2 {
    margin-bottom: 4px;
}

.admin-body .settings-checklist {
    gap: 12px;
    padding: 16px;
    background: #fbfdfe;
    border-color: #dbe4ea;
}

.admin-body .settings-checklist legend {
    color: var(--accent-strong);
}

.admin-body .settings-grid,
.admin-body .color-grid {
    gap: 14px;
}

.admin-body .settings-method-row {
    gap: 14px;
    padding: 14px 0;
}

.admin-body .admin-grid-two {
    gap: 20px;
}

.admin-body .admin-lines-panel {
    margin-top: 22px;
}

.admin-body .admin-stat-grid {
    gap: 18px;
}

.admin-body .admin-stat-grid .checkout-panel {
    position: relative;
    overflow: hidden;
}

.admin-body .admin-stat-grid .checkout-panel::after {
    position: absolute;
    inset: auto 18px 18px auto;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(201, 146, 47, 0.25);
    border-radius: 8px;
    background: var(--gold-soft);
    content: "";
}

.admin-body .admin-stat-grid h2 {
    margin-bottom: 6px;
    color: var(--accent-strong);
    font-size: clamp(1.7rem, 2vw, 2.2rem);
}

.admin-body .compact-list a,
.admin-body .compact-list span {
    padding: 13px 0;
}

.admin-body .compact-list a:hover {
    color: var(--accent-strong);
}

.admin-body .topic-admin-row,
.admin-body .event-admin-card,
.admin-body .image-cleanup-row {
    border-color: var(--border);
    box-shadow: 0 4px 12px rgba(20, 32, 44, 0.04);
}

.admin-body .topic-admin-row {
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #ffffff;
}

.admin-body .topic-admin-row:last-child {
    border-bottom: 1px solid var(--border);
}

.admin-body .topic-admin-list {
    gap: 12px;
}

.admin-body .topics-admin-layout {
    gap: 22px;
}

.admin-body .topic-editor-panel,
.admin-body .topic-list-panel {
    padding: 0;
    overflow: hidden;
}

.admin-body .topic-editor-panel > *:not(.topic-editor-heading),
.admin-body .topic-list-panel > *:not(.topic-list-heading) {
    margin-right: 24px;
    margin-left: 24px;
}

.admin-body .topic-editor-panel > .topic-editor-actions {
    margin-bottom: 24px;
}

.admin-body .topic-editor-heading,
.admin-body .topic-list-heading {
    margin: 0 0 22px;
    padding: 18px 22px;
    color: #ffffff;
    background: var(--heading-background);
    border-bottom: 3px solid var(--gold);
}

.admin-body .topic-editor-heading .eyebrow,
.admin-body .topic-list-heading .eyebrow {
    color: rgba(255, 255, 255, 0.74);
}

.admin-body .topic-editor-heading h2,
.admin-body .topic-list-heading h2 {
    color: #ffffff;
    font-size: 1.15rem;
    font-weight: 850;
}

.admin-body .topic-list-heading .badge {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.22);
}

.admin-body .topic-editor-fields {
    margin-bottom: 16px;
}

.admin-body .topic-admin-avatar,
.admin-body .event-admin-avatar {
    background: linear-gradient(135deg, #e8f3f4, #f8fafb);
}

.admin-body .topic-admin-avatar {
    border: 1px solid var(--border);
}

.admin-body .topic-admin-row {
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 16px;
    padding: 16px;
}

.admin-body .topic-admin-main h3 {
    color: #10242c;
    font-size: 1.12rem;
}

.admin-body .topic-admin-main .action-row {
    gap: 8px;
}

.admin-body .admin-table-wrap {
    border-radius: 8px;
}

.admin-body .admin-table th {
    background: #f8fafb;
    color: #5d6a79;
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0;
}

.admin-body .admin-table th,
.admin-body .admin-table td {
    padding: 14px 16px;
}

.admin-body .admin-table tr:hover td {
    background: #fbfdfe;
}

.admin-body .order-filter-form,
.admin-body .event-topic-filter {
    padding: 16px;
    background: #ffffff;
    border: 1px solid rgba(112, 128, 146, 0.22);
    border-radius: 8px;
    box-shadow: var(--shadow-soft);
}

.admin-body .event-topic-filter {
    margin-top: 14px;
}

.admin-body .inline-status {
    position: relative;
    max-width: none;
    min-height: 58px;
    margin: 0 0 24px;
    padding: 17px 20px 17px 58px;
    color: #06351f;
    background:
        linear-gradient(135deg, rgba(213, 249, 229, 0.98), rgba(236, 255, 244, 0.98)),
        #d9f7e7;
    border: 1px solid #75ce98;
    border-left: 8px solid #128344;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: 0;
    box-shadow: 0 18px 36px rgba(22, 134, 75, 0.2);
}

.admin-body .inline-status::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 50%;
    width: 24px;
    height: 24px;
    background: #128344;
    border-radius: 50%;
    transform: translateY(-50%);
    box-shadow: inset 0 0 0 6px rgba(255, 255, 255, 0.22);
}

.admin-body .inline-status::after {
    content: "";
    position: absolute;
    left: 27px;
    top: 50%;
    width: 6px;
    height: 11px;
    border: solid #ffffff;
    border-width: 0 3px 3px 0;
    transform: translateY(-58%) rotate(45deg);
}

.admin-lines-panel > .inline-status {
    margin: 18px 20px 0;
}

.admin-body .form-error {
    padding: 12px 15px;
    border-radius: 8px;
}

.admin-body .breadcrumb {
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid rgba(112, 128, 146, 0.2);
    border-radius: 8px;
    box-shadow: var(--shadow-soft);
}

.admin-body .appearance-preview {
    background:
        linear-gradient(135deg, rgba(15, 102, 113, 0.08), rgba(201, 146, 47, 0.08)),
        #ffffff;
}

.admin-body .field-help summary {
    border-color: rgba(15, 102, 113, 0.22);
    color: var(--accent-strong);
    background: var(--accent-soft);
}

.admin-body .field-help div {
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.admin-body .event-create-panel,
.admin-body .event-list-panel,
.admin-body .smart-import-panel {
    margin-bottom: 22px;
}

.admin-body .event-create-fields {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.admin-body .event-admin-grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 14px;
}

.admin-body .event-admin-card-link {
    min-height: 92px;
    padding: 12px;
}

.admin-body .image-cleanup-list {
    grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
    gap: 14px;
}

.admin-body .checkout-panel {
    position: relative;
    overflow: hidden;
}

.admin-body .checkout-panel::before {
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, var(--accent), var(--gold));
    content: "";
    opacity: 0.72;
}

.admin-body .checkout-panel > * {
    position: relative;
}

.admin-body .admin-list-meta,
.admin-body .bulk-actions,
.admin-body .event-topic-filter {
    border-color: #e3ebf0;
}

.admin-body .detail-list div {
    padding: 13px 0;
}

.admin-dashboard-body .page-heading {
    padding: 22px 24px;
    background:
        linear-gradient(135deg, rgba(15, 102, 113, 0.1), rgba(201, 146, 47, 0.09)),
        #ffffff;
    border: 1px solid rgba(112, 128, 146, 0.22);
    border-radius: 8px;
    box-shadow: var(--shadow-soft);
}

.admin-dashboard-body .page-heading h1 {
    color: #0b2229;
}

.admin-dashboard-stats {
    grid-template-columns: repeat(3, minmax(220px, 1fr));
}

.admin-stat-card {
    min-height: 190px;
    display: grid;
    align-content: start;
    gap: 8px;
}

.admin-body .admin-stat-card::after {
    inset: auto 18px 18px auto;
    width: 54px;
    height: 54px;
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(201, 146, 47, 0.18)),
        var(--gold-soft);
}

.admin-stat-card h2 {
    padding-bottom: 10px;
    border-bottom: 1px solid #e6edf2;
}

.admin-stat-card .button {
    justify-self: start;
    margin-top: 2px;
}

.admin-body .compact-list a {
    border: 1px solid transparent;
    border-bottom-color: var(--surface-soft);
    border-radius: 8px;
}

.admin-body .compact-list a:hover {
    padding-inline: 12px;
    background: #f7fbfc;
    border-color: #dbe6eb;
}

.admin-login-body {
    min-height: 100vh;
    background:
        linear-gradient(115deg, rgba(13, 40, 48, 0.06) 0 45%, transparent 45%),
        linear-gradient(180deg, #f9fbfc, #eef3f5);
}

.admin-login-body .topbar {
    box-shadow: 0 1px 0 rgba(20, 32, 44, 0.06);
}

.admin-login-shell {
    display: grid !important;
    grid-template-columns: 1fr !important;
    place-items: start center;
    width: min(100% - 32px, 520px) !important;
    min-height: calc(100vh - 72px);
    padding-top: clamp(54px, 10vh, 110px) !important;
}

.admin-login-shell > * {
    grid-column: 1 !important;
}

.admin-login-card {
    width: min(100%, 440px);
    padding: 28px;
}

.admin-login-card h1 {
    margin-bottom: 8px;
    font-size: clamp(2rem, 7vw, 2.7rem);
    overflow-wrap: anywhere;
}

.admin-login-card .stack-form {
    margin-top: 20px;
}

.admin-login-card .button {
    width: 100%;
}

.admin-login-card .admin-recovery {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #dfe8ee;
}

.admin-login-card .admin-recovery summary {
    color: var(--accent-strong);
    cursor: pointer;
    font-weight: 820;
}

@media (max-width: 1080px) {
    .admin-body .event-create-fields {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }

    .admin-body .settings-method-row,
    .admin-body .settings-method-row.payment-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .admin-body .shell,
    .admin-body .shell:has(> .admin-nav:not([open])) {
        grid-template-columns: 1fr;
        gap: 18px;
        width: min(100% - 24px, 1120px);
        padding-top: 22px;
    }

    .admin-body .shell > :not(.admin-nav) {
        grid-column: 1;
    }
}

@media (max-width: 760px) {
    .admin-body .admin-stat-grid,
    .admin-body .admin-grid-two,
    .admin-body .settings-grid,
    .admin-body .color-grid,
    .admin-body .event-create-fields,
    .admin-body .topic-editor-fields,
    .admin-body .settings-method-row,
    .admin-body .settings-method-row.payment-row,
    .admin-body .order-filter-form {
        grid-template-columns: 1fr;
    }

    .admin-body .event-create-options {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .admin-body .event-create-submit {
        display: grid;
    }

    .admin-body .event-create-submit .button,
    .admin-body .button {
        width: 100%;
        margin-left: 0;
        white-space: normal;
    }

    .admin-body .inline-admin-form,
    .admin-body .order-filter-actions,
    .admin-body .table-action-row {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-body .admin-table th,
    .admin-body .admin-table td {
        padding: 12px 13px;
    }

    .admin-dashboard-stats {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .admin-body .topbar {
        min-height: 62px;
    }

    .admin-body .brand {
        font-size: 0.95rem;
    }

    .admin-body .cart-pill {
        min-height: 34px;
        padding-inline: 10px;
    }

    .admin-body h1 {
        font-size: 1.78rem;
    }

    .admin-body .checkout-panel {
        padding: 16px;
    }

    .admin-body .event-admin-grid {
        grid-template-columns: 1fr;
    }
}

/* Admin polish pass: stronger hierarchy and cleaner form sections. */
.admin-body .checkout-panel,
.admin-body .admin-table-wrap {
    background: #ffffff;
    border: 1px solid var(--border);
    box-shadow: 0 18px 38px rgba(15, 28, 38, 0.08);
}

.admin-body .checkout-panel {
    padding: 24px;
}

.admin-body .checkout-panel::before {
    height: 0;
}

.admin-body .checkout-panel > h2:first-child,
.admin-body .event-create-heading,
.admin-body .smart-import-panel > div:first-child,
.admin-body .event-list-panel > h2:first-child {
    margin: -24px -24px 20px;
    padding: 18px 22px;
    background: var(--heading-background);
    border-bottom: 3px solid var(--gold);
    border-radius: 8px 8px 0 0;
}

.admin-body .checkout-panel > h2:first-child,
.admin-body .event-create-heading h2,
.admin-body .smart-import-panel > div:first-child h2,
.admin-body .event-list-panel > h2:first-child {
    color: #ffffff;
    font-size: 1.15rem;
    font-weight: 850;
}

.admin-body .event-create-heading h2,
.admin-body .smart-import-panel > div:first-child h2,
.admin-body .event-list-panel > h2:first-child {
    margin: 0;
    padding: 0;
    border: 0;
}

.admin-body .smart-import-panel > div:first-child .eyebrow,
.admin-body .event-create-heading .helper-text,
.admin-body .smart-import-panel > div:first-child .helper-text {
    color: rgba(255, 255, 255, 0.76);
}

.admin-body .smart-import-panel > div:first-child .eyebrow {
    margin-bottom: 5px;
}

.admin-body .admin-form-split {
    margin: 26px -2px 16px;
    padding: 14px 16px;
    background: #f5f8fa;
    border: 1px solid var(--border);
    border-left: 4px solid var(--accent);
    border-radius: 8px;
}

.admin-body .admin-form-split:first-child {
    margin-top: 0;
}

.admin-body .admin-form-split h2 {
    margin: 0;
    color: #10242c;
    font-size: 1.12rem;
}

.admin-body .admin-form-split .helper-text,
.admin-body .admin-form-split p {
    margin-top: 4px;
    color: #667382;
}

.admin-body .settings-checklist {
    display: grid;
    gap: 16px;
    margin: 8px 0 18px;
    padding: 0 16px 16px;
    background: #fbfdfe;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.admin-body .settings-checklist legend {
    float: left;
    width: calc(100% + 32px);
    margin: 0 -16px 16px;
    padding: 14px 16px;
    color: #ffffff;
    background: #12323a;
    border-bottom: 2px solid var(--gold);
    border-radius: 8px 8px 0 0;
    font-size: 0.98rem;
    font-weight: 850;
}

.admin-body .settings-checklist legend + * {
    clear: both;
}

.admin-body .settings-method-row {
    padding: 16px;
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(15, 28, 38, 0.04);
}

.admin-body .settings-method-row + .settings-method-row {
    margin-top: 4px;
}

.admin-body .settings-method-row:first-of-type,
.admin-body .topic-admin-row:last-child {
    border-top: 1px solid var(--border);
}

.admin-body .stack-form label,
.admin-body .order-filter-form label,
.admin-body .event-topic-filter label,
.admin-body .settings-method-row label,
.admin-body .topic-format-editor label {
    color: #20313d;
    font-size: 0.82rem;
    font-weight: 830;
}

.admin-body .stack-form input,
.admin-body .stack-form textarea,
.admin-body .stack-form select,
.admin-body .order-filter-form input,
.admin-body .order-filter-form select,
.admin-body .inline-admin-form select,
.admin-body .event-topic-filter select {
    border-color: var(--border);
    background: #ffffff;
    font-size: 0.94rem;
}

.admin-body .helper-text {
    color: #667382;
    font-size: 0.94rem;
}

.admin-body .check-row {
    display: flex;
    gap: 10px;
    align-items: center;
    min-height: 34px;
    color: #20313d;
    font-size: 0.9rem;
    line-height: 1.35;
}

.admin-body input[type="checkbox"] {
    appearance: none;
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    margin: 0;
    padding: 0 !important;
    border: 1px solid #9fb0be;
    border-radius: 5px;
    background: #ffffff;
    box-shadow: none;
    cursor: pointer;
}

.admin-body input[type="checkbox"]:checked {
    border-color: var(--accent);
    background: var(--accent);
}

.admin-body input[type="checkbox"]:checked::after {
    width: 9px;
    height: 5px;
    border: solid #ffffff;
    border-width: 0 0 2px 2px;
    content: "";
    transform: rotate(-45deg) translate(1px, -1px);
}

.admin-body .event-create-options,
.admin-body .bulk-actions {
    padding: 14px;
    background: #f7fafb;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.admin-body .smart-import-panel {
    background: #ffffff;
    border-color: var(--border);
}

.admin-body .smart-import-controls {
    padding: 16px;
    background: #f7fafb;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.admin-body .event-topic-filter {
    background: #f7fafb;
}

.admin-body .admin-table {
    border-collapse: separate;
    border-spacing: 0;
}

.admin-body .admin-table th {
    background: #102c34;
    color: #ffffff;
}

.admin-body .admin-table th:first-child {
    border-top-left-radius: 8px;
}

.admin-body .admin-table th:last-child {
    border-top-right-radius: 8px;
}

.admin-body .admin-table td {
    background: #ffffff;
}

.admin-body .admin-table tr:nth-child(even) td {
    background: #f9fbfc;
}

.admin-body .page-heading.compact {
    padding: 20px 22px;
    background: #ffffff;
    border: 1px solid var(--border);
    border-left: 4px solid var(--gold);
    border-radius: 8px;
    box-shadow: var(--shadow-soft);
}

.admin-body .page-heading.compact h1 {
    color: #0f2028;
}

.admin-body .page-heading.compact p:last-child {
    max-width: 860px;
}

.admin-body .field-help summary {
    width: 18px;
    height: 18px;
    font-size: 0.7rem;
}

@media (max-width: 760px) {
    .admin-body .checkout-panel {
        padding: 18px;
    }

    .admin-body .checkout-panel > h2:first-child,
    .admin-body .event-create-heading,
    .admin-body .topic-editor-heading,
    .admin-body .topic-list-heading,
    .admin-body .smart-import-panel > div:first-child,
    .admin-body .event-list-panel > h2:first-child {
        margin: -18px -18px 18px;
        padding: 16px 18px;
    }

    .admin-body .topic-editor-panel > *:not(.topic-editor-heading),
    .admin-body .topic-list-panel > *:not(.topic-list-heading) {
        margin-right: 18px;
        margin-left: 18px;
    }

    .admin-body .topic-admin-row {
        grid-template-columns: 70px minmax(0, 1fr);
        gap: 12px;
        padding: 12px;
    }

    .admin-body .topic-admin-avatar {
        width: 70px;
        height: 58px;
    }

    .admin-body .settings-checklist {
        padding-inline: 12px;
    }

    .admin-body .settings-checklist legend {
        width: calc(100% + 24px);
        margin-inline: -12px;
    }

    .admin-body .smart-import-controls {
        padding: 14px;
    }
}

.admin-event-body .admin-event-stack {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
    align-items: stretch;
}

.admin-event-body .admin-event-stack > .checkout-panel {
    width: 100%;
}

.admin-event-body .admin-event-stack > .checkout-panel:nth-child(1),
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(2),
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(3),
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(4) {
    display: grid;
    grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1.6fr) auto;
    gap: 14px 18px;
    align-items: end;
}

.admin-event-body .admin-event-stack > .checkout-panel:nth-child(1) h2,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(1) .helper-text,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(2) h2,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(2) .helper-text,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(3) h2,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(3) .helper-text,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(4) h2,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(4) .helper-text:first-of-type {
    grid-column: 1 / -1;
}

.admin-event-body .admin-event-stack > .checkout-panel:nth-child(3) .origin-summary-list,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(3) .helper-text:last-of-type {
    grid-column: 1 / -1;
}

.admin-event-body .admin-event-stack > .checkout-panel:nth-child(4) .topic-avatar-preview {
    grid-column: 1;
    grid-row: 3 / span 2;
    min-height: 104px;
}

.admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 16px;
    align-items: end;
}

.admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) h2 {
    grid-column: 1 / -1;
}

.admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) .check-row,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) .helper-text,
.admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) .action-row {
    grid-column: span 2;
}

.admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) .action-row {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    grid-column: 1 / -1;
    padding-top: 8px;
    border-top: 1px solid #e4edf2;
}

.admin-event-body .admin-lines-panel {
    margin-top: 22px;
}

.admin-event-body .admin-lines-panel > h2:first-child {
    margin-bottom: 18px;
}

.admin-event-body .image-cleanup-list {
    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
}

@media (max-width: 1180px) {
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(1),
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(2),
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(3),
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(4),
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(4) .topic-avatar-preview {
        grid-row: auto;
    }
}

@media (max-width: 760px) {
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(1),
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(2),
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(3),
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(4),
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) {
        grid-template-columns: 1fr;
    }

    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) .check-row,
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) .helper-text,
    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) .action-row {
        grid-column: 1;
    }

    .admin-event-body .admin-event-stack > .checkout-panel:nth-child(5) .action-row {
        align-items: stretch;
        flex-direction: column;
    }
}

.admin-event-body .admin-event-stack > .checkout-panel > h2:first-child,
.admin-event-body .admin-lines-panel > h2:first-child {
    display: flex;
    align-items: center;
    min-height: 58px;
    margin: -24px -24px 22px;
    padding: 0 22px;
    color: #ffffff;
    background: var(--heading-background);
    border-bottom: 3px solid var(--gold);
    border-radius: 8px 8px 0 0;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.08), 0 12px 24px rgba(11, 37, 45, 0.10);
    font-size: 1.16rem;
    font-weight: 880;
    letter-spacing: 0;
}

.admin-event-body .admin-event-stack > .checkout-panel > h2:first-child + .helper-text {
    grid-column: 1 / -1;
    max-width: 980px;
    margin: -4px 0 4px;
    padding: 0 0 14px;
    border-bottom: 1px solid #e5edf2;
}

.admin-event-body .admin-event-stack > .checkout-panel {
    padding-top: 24px;
}

.admin-event-body .admin-event-stack > .checkout-panel label:not(.check-row) {
    min-width: 0;
}

.admin-event-body .origin-summary-list {
    display: grid;
    gap: 8px;
    padding: 12px 14px;
    background: #f7fafb;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.admin-event-body .origin-summary-list p {
    margin: 0;
    overflow-wrap: anywhere;
}

.admin-event-body .topic-avatar-preview {
    background: #f7fafb;
}

@media (max-width: 760px) {
    .admin-event-body .admin-event-stack > .checkout-panel > h2:first-child,
    .admin-event-body .admin-lines-panel > h2:first-child {
        min-height: 54px;
        margin: -18px -18px 18px;
        padding: 0 18px;
    }
}

.admin-event-body .page-heading.compact.admin-event-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 18px 24px;
    align-items: center;
    padding: clamp(20px, 2.4vw, 28px);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(239, 246, 248, 0.98)),
        #ffffff;
    border: 1px solid #cbdce4;
    border-left: 6px solid var(--gold);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(15, 32, 40, 0.12);
}

.admin-event-body .admin-event-summary h1 {
    max-width: 820px;
    color: #0f2028;
}

.admin-event-body .admin-event-summary-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.admin-event-body .admin-event-metric {
    min-width: 126px;
    padding: 11px 13px;
    color: #647283;
    background: #ffffff;
    border: 1px solid #dfebf0;
    border-radius: 8px;
    box-shadow: 0 6px 14px rgba(20, 32, 44, 0.05);
    font-size: 0.78rem;
    font-weight: 780;
}

.admin-event-body .admin-event-metric strong {
    display: block;
    margin-bottom: 3px;
    color: var(--accent-strong);
    font-size: 1.2rem;
    line-height: 1.1;
}

.admin-event-body .admin-event-gallery-link {
    white-space: nowrap;
}

.admin-event-body .admin-event-stack {
    gap: 24px;
}

.admin-event-body .admin-event-stack > .checkout-panel.admin-event-panel,
.admin-event-body .admin-lines-panel.admin-event-panel {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    padding: 0;
    background: #ffffff;
    border-color: #dce6ed;
    border-radius: 8px;
    overflow: hidden;
}

.admin-event-body .checkout-panel.admin-event-panel::before {
    display: none;
}

.admin-event-body .admin-panel-heading {
    display: grid;
    gap: 5px;
    padding: 18px 22px 17px;
    color: #ffffff;
    background: var(--heading-background);
    border-bottom: 3px solid var(--border);
}

.admin-event-body .admin-panel-heading span {
    color: #f2c76e;
    font-size: 0.72rem;
    font-weight: 860;
    line-height: 1;
    text-transform: uppercase;
}

.admin-event-body .admin-panel-heading h2 {
    margin: 0;
    color: #ffffff;
    font-size: 1.18rem;
    font-weight: 880;
    line-height: 1.15;
}

.admin-event-body .admin-panel-content {
    display: grid;
    gap: 18px;
    padding: 22px;
}

.admin-event-body .admin-panel-content > .helper-text {
    max-width: 980px;
    margin: 0;
}

.admin-event-body .admin-panel-content--split {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.admin-event-body .admin-event-field-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 16px;
    align-items: end;
}

.admin-event-body .admin-event-field-grid--action {
    grid-template-columns: minmax(260px, 1fr) auto;
}

.admin-event-body .admin-form-field {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.admin-event-body .admin-form-field label {
    min-width: 0;
}

.admin-event-body .admin-event-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.admin-event-body .admin-event-actions .button {
    white-space: normal;
}

.admin-event-body .admin-avatar-layout {
    grid-template-columns: minmax(190px, 260px) minmax(0, 1fr);
    align-items: center;
}

.admin-event-body .admin-event-stack > .checkout-panel.admin-event-panel .topic-avatar-preview {
    grid-column: auto;
    grid-row: auto;
    display: grid;
    gap: 12px;
    place-items: center;
    min-height: 160px;
    padding: 14px;
    background: #f7fafb;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.admin-event-body .topic-avatar-preview img {
    width: 100%;
    max-height: 150px;
    object-fit: cover;
    border-radius: 8px;
}

.admin-event-body .topic-avatar-preview .check-row {
    justify-self: stretch;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.admin-event-body .admin-event-switches {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 12px;
    padding: 14px;
    background: #f7fafb;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.admin-event-body .admin-event-panel--details .admin-event-switches .check-row {
    display: flex;
    grid-column: auto;
    min-height: 52px;
    padding: 11px 12px;
    background: #ffffff;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.admin-event-body .admin-event-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding-top: 16px;
    border-top: 1px solid #e6edf2;
}

.admin-event-body .admin-event-footer .helper-text {
    margin: 0;
}

.admin-event-body .admin-event-footer .action-row {
    display: flex;
    grid-column: auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    margin: 0;
    padding-top: 0;
    border-top: 0;
}

.admin-event-body .stack-form label.check-row,
.admin-event-body .admin-lines-panel label.check-row {
    display: flex;
    grid-template-columns: none;
    gap: 10px;
    align-items: center;
}

.admin-event-body .admin-panel-content--photos {
    gap: 16px;
}

.admin-event-body .admin-lines-panel .bulk-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: #f7fafb;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.admin-event-body .image-cleanup-list {
    grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
    gap: 14px;
}

.admin-event-body .image-cleanup-row {
    position: relative;
    min-height: 118px;
    padding: 0;
    background: #edf5f7;
    border: 1px solid #d8e4ea;
    border-radius: 8px;
    overflow: hidden;
}

.admin-event-body .image-cleanup-row input {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
    background: #ffffff;
    box-shadow: 0 4px 10px rgba(20, 32, 44, 0.18);
}

.admin-event-body .image-cleanup-row img {
    width: 100%;
    height: 118px;
    object-fit: cover;
    border-radius: 0;
}

.admin-event-body .image-cleanup-row:has(input:checked) {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(15, 102, 113, 0.16);
}

@media (max-width: 980px) {
    .admin-event-body .page-heading.compact.admin-event-summary,
    .admin-event-body .admin-panel-content--split,
    .admin-event-body .admin-avatar-layout {
        grid-template-columns: 1fr;
    }

    .admin-event-body .admin-event-summary-metrics,
    .admin-event-body .admin-event-actions {
        justify-content: flex-start;
    }

    .admin-event-body .admin-event-field-grid,
    .admin-event-body .admin-event-field-grid--action {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-event-body .admin-event-switches {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .admin-event-body .admin-panel-heading {
        padding: 16px 18px;
    }

    .admin-event-body .admin-panel-content {
        padding: 18px;
    }

    .admin-event-body .admin-event-field-grid,
    .admin-event-body .admin-event-field-grid--action,
    .admin-event-body .admin-event-switches {
        grid-template-columns: 1fr;
    }

    .admin-event-body .admin-event-actions,
    .admin-event-body .admin-event-footer .action-row,
    .admin-event-body .admin-event-actions .button,
    .admin-event-body .admin-event-footer .button {
        width: 100%;
    }

    .admin-event-body .admin-event-summary-metrics {
        display: grid;
        grid-template-columns: 1fr;
    }

    .admin-event-body .admin-lines-panel .bulk-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-event-body .image-cleanup-list {
        grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
        gap: 10px;
    }

    .admin-event-body .image-cleanup-row,
    .admin-event-body .image-cleanup-row img {
        min-height: 98px;
        height: 98px;
    }
}

.admin-settings-body .page-heading.compact {
    display: grid;
    gap: 6px;
    padding: clamp(20px, 2.4vw, 28px);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(247, 250, 251, 0.96)),
        #ffffff;
    border: 1px solid #dce6ed;
    border-left: 4px solid var(--gold);
    border-radius: 8px;
    box-shadow: var(--shadow-soft);
}

.admin-settings-body .admin-settings-form,
.admin-settings-body .settings-test-panel {
    display: grid;
    gap: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
}

.admin-settings-body .admin-settings-form::before,
.admin-settings-body .settings-test-panel::before {
    display: none;
}

.admin-settings-body .admin-settings-form > .admin-form-split,
.admin-settings-body .settings-test-panel > .admin-form-split {
    display: grid;
    gap: 5px;
    margin: 24px 0 0;
    padding: 18px 22px 17px;
    color: #ffffff;
    background:
        linear-gradient(135deg, rgba(17, 68, 77, 0.96), rgba(12, 40, 48, 0.98)),
        #102a32;
    border: 1px solid #0f3038;
    border-bottom: 3px solid var(--gold);
    border-radius: 8px 8px 0 0;
    box-shadow: 0 18px 34px rgba(15, 28, 38, 0.08);
}

.admin-settings-body .admin-settings-form > .admin-form-split:first-of-type,
.admin-settings-body .settings-test-panel > .admin-form-split:first-of-type {
    margin-top: 0;
}

.admin-settings-body .admin-form-split span {
    color: #f2c76e;
    font-size: 0.72rem;
    font-weight: 860;
    line-height: 1;
    text-transform: uppercase;
}

.admin-settings-body .admin-form-split h2 {
    margin: 0;
    color: #ffffff;
    font-size: 1.18rem;
    font-weight: 880;
    line-height: 1.15;
}

.admin-settings-body .admin-form-split .helper-text,
.admin-settings-body .admin-form-split p {
    margin: 0;
    color: rgba(255, 255, 255, 0.76);
}

.admin-settings-body .admin-settings-form > .settings-grid,
.admin-settings-body .settings-test-panel > .settings-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 16px;
    margin: 0 0 20px;
    padding: 22px;
    background: #ffffff;
    border: 1px solid #dce6ed;
    border-top: 0;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 18px 34px rgba(15, 28, 38, 0.08);
}

.admin-settings-body .admin-settings-form > .settings-grid label,
.admin-settings-body .settings-checklist .settings-grid label,
.admin-settings-body .settings-test-panel > .settings-grid label {
    min-width: 0;
}

.admin-settings-body .admin-settings-form > .settings-grid label:has(#business_address),
.admin-settings-body .admin-settings-form > .settings-grid label:has(#business_email),
.admin-settings-body .admin-settings-form > .settings-grid label:has(#bank_account) {
    grid-column: span 2;
}

.admin-settings-body .settings-checklist {
    display: grid;
    gap: 16px;
    margin: 18px 0 20px;
    padding: 0 22px 22px;
    background: #ffffff;
    border: 1px solid #dce6ed;
    border-radius: 8px;
    box-shadow: 0 14px 30px rgba(15, 28, 38, 0.06);
    overflow: hidden;
}

.admin-settings-body .admin-form-split + .settings-checklist {
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.admin-settings-body .settings-checklist legend {
    float: left;
    width: calc(100% + 44px);
    margin: 0 -22px 18px;
    padding: 15px 22px;
    color: #16313a;
    background: #f3f7f9;
    border-bottom: 1px solid #dce6ed;
    font-size: 0.98rem;
    font-weight: 880;
}

.admin-settings-body .settings-checklist legend + * {
    clear: both;
}

.admin-settings-body .settings-checklist > .settings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.admin-settings-body .settings-method-row {
    display: grid;
    grid-template-columns: minmax(120px, 0.55fr) minmax(220px, 1.45fr) minmax(130px, 0.7fr);
    gap: 14px;
    align-items: end;
    padding: 16px;
    background: #fbfdfe;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
    box-shadow: none;
}

.admin-settings-body .settings-method-row + .settings-method-row {
    margin-top: 0;
}

.admin-settings-body .settings-method-row.order-status-row {
    grid-template-columns: 130px minmax(0, 1fr);
}

.admin-settings-body .admin-settings-form,
.admin-settings-body .settings-checklist {
    min-width: 0;
}

@media (max-width: 760px) {
    .admin-settings-body .settings-method-row.order-status-row {
        grid-template-columns: minmax(0, 1fr);
    }
}

.admin-settings-body .settings-method-row.payment-row {
    grid-template-columns: minmax(120px, 0.5fr) minmax(220px, 1fr) minmax(130px, 0.6fr) minmax(260px, 1.4fr);
}

.admin-settings-body .card-payment-row .helper-text {
    grid-column: 1 / -1;
    margin: 0;
}

.admin-settings-body .settings-method-row.paypal-online-row {
    grid-template-columns: minmax(180px, 0.8fr) minmax(170px, 0.65fr) minmax(110px, 0.45fr) minmax(260px, 1.2fr) minmax(260px, 1.2fr);
    align-items: end;
}

.admin-settings-body .settings-method-row.paypal-online-row .helper-text {
    grid-column: 1 / -1;
    margin: 0;
}

.admin-settings-body .settings-method-row.paypal-settings {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 20px 24px;
}

.admin-settings-body .paypal-settings > .check-row,
.admin-settings-body .paypal-settings > .paypal-credentials-help {
    grid-column: 1 / -1;
}

.admin-settings-body .paypal-settings label {
    min-width: 0;
}

.admin-settings-body .paypal-settings label .helper-text {
    font-weight: 400;
    font-size: 0.8rem;
    line-height: 1.5;
}

.paypal-credentials-help summary {
    color: var(--accent-strong);
    cursor: pointer;
    font-weight: 600;
}

.paypal-credentials-help p {
    margin: 12px 0 0;
    line-height: 1.6;
}

@media (max-width: 640px) {
    .admin-settings-body .settings-method-row.paypal-settings {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }
}

.admin-settings-body .settings-method-row.purchase-option-row {
    grid-template-columns: minmax(120px, 0.45fr) minmax(220px, 0.9fr) minmax(280px, 1.65fr);
    align-items: start;
}

.admin-settings-body .purchase-option-row textarea {
    min-height: 112px;
    resize: vertical;
}

.admin-settings-body .settings-method-row label.check-row,
.admin-settings-body .settings-checklist > label.check-row,
.admin-settings-body .checkbox-with-help .check-row {
    display: flex;
    grid-template-columns: none;
    gap: 10px;
    align-items: center;
    min-height: 44px;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.admin-settings-body .checkbox-with-help {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.admin-settings-body .field-with-help > span {
    min-width: 0;
    color: #20313d;
    font-weight: 830;
}

.admin-settings-body .settings-checklist > select {
    max-width: 320px;
}

.admin-settings-body .settings-checklist > .helper-text {
    margin: -2px 0 0;
    padding: 12px 14px;
    background: #f7fafb;
    border: 1px solid #e1eaf0;
    border-radius: 8px;
}

.admin-settings-body .settings-save-bar {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-top: 6px;
    padding: 18px 0 4px;
}

.admin-settings-body .settings-save-bar .button {
    min-width: 210px;
}

.admin-settings-body .settings-test-panel {
    margin-top: 24px;
}

.admin-settings-body .settings-test-panel > .settings-test-grid {
    grid-template-columns: minmax(260px, 1fr) auto;
}

.admin-settings-body .settings-test-grid {
    align-items: end;
}

.admin-settings-body .settings-test-action {
    display: flex;
    justify-content: flex-end;
    align-items: end;
}

@media (max-width: 1180px) {
    .admin-settings-body .admin-settings-form > .settings-grid,
    .admin-settings-body .settings-test-panel > .settings-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-settings-body .settings-method-row,
    .admin-settings-body .settings-method-row.payment-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .admin-settings-body .admin-settings-form > .admin-form-split,
    .admin-settings-body .settings-test-panel > .admin-form-split {
        padding: 16px 18px;
    }

    .admin-settings-body .admin-settings-form > .settings-grid,
    .admin-settings-body .settings-test-panel > .settings-grid,
    .admin-settings-body .settings-checklist > .settings-grid,
    .admin-settings-body .settings-method-row,
    .admin-settings-body .settings-method-row.payment-row,
    .admin-settings-body .company-logo-settings,
    .admin-settings-body .default-event-avatar-settings {
        grid-template-columns: 1fr;
    }

    .admin-settings-body .default-event-avatar-preview img {
        height: 120px;
    }

    .admin-settings-body .admin-settings-form > .settings-grid label:has(#business_address),
    .admin-settings-body .admin-settings-form > .settings-grid label:has(#business_email),
    .admin-settings-body .admin-settings-form > .settings-grid label:has(#bank_account) {
        grid-column: auto;
    }

    .admin-settings-body .admin-settings-form > .settings-grid,
    .admin-settings-body .settings-test-panel > .settings-grid {
        padding: 18px;
    }

    .admin-settings-body .settings-checklist {
        padding: 0 18px 18px;
    }

    .admin-settings-body .settings-checklist legend {
        width: calc(100% + 36px);
        margin-inline: -18px;
        padding-inline: 18px;
    }

    .admin-settings-body .settings-save-bar,
    .admin-settings-body .settings-save-bar .button,
    .admin-settings-body .settings-test-action,
    .admin-settings-body .settings-test-action .button {
        width: 100%;
    }

    .admin-settings-body .settings-save-bar {
        justify-content: stretch;
    }
}

/* Topics editor polish: compact cards and quieter borders. */
.admin-topics-body,
.admin-events-body {
    --admin-border-soft: color-mix(in srgb, var(--border) 28%, var(--surface));
    --admin-border-mid: color-mix(in srgb, var(--border) 46%, var(--surface));
    --admin-panel-soft: color-mix(in srgb, var(--surface) 86%, var(--background));
    --admin-panel-muted: color-mix(in srgb, var(--surface) 72%, var(--background));
    --admin-focus-ring: color-mix(in srgb, var(--accent) 18%, transparent);
    --admin-heading-bg: var(--heading-background, var(--accent-strong));
}

.admin-topics-body .topics-admin-layout {
    max-width: 1120px;
    margin-inline: auto;
}

.admin-topics-body .page-heading.compact {
    padding: 22px 26px;
    background: var(--surface);
    border: 1px solid var(--admin-border-soft);
    border-left: 5px solid var(--border);
    box-shadow: 0 12px 28px rgba(14, 27, 36, 0.06);
}

.admin-topics-body .topic-editor-panel,
.admin-topics-body .topic-list-panel {
    border-color: var(--admin-border-soft);
    box-shadow: 0 18px 42px rgba(14, 27, 36, 0.09);
}

.admin-topics-body .topic-editor-panel > *:not(.topic-editor-heading),
.admin-topics-body .topic-list-panel > *:not(.topic-list-heading) {
    margin-right: 28px;
    margin-left: 28px;
}

.admin-topics-body .topic-editor-heading,
.admin-topics-body .topic-list-heading {
    padding: 20px 26px;
    background: var(--admin-heading-bg);
    border-bottom: 4px solid var(--border);
}

.admin-topics-body .topic-editor-heading .button {
    color: var(--accent-strong);
    background: var(--surface);
    border-color: rgba(255, 255, 255, 0.42);
    box-shadow: none;
}

.admin-topics-body .topic-editor-section {
    display: grid;
    gap: 18px;
    margin-bottom: 26px;
    padding: 20px;
    background: var(--admin-panel-soft);
    border: 1px solid var(--admin-border-soft);
    border-radius: 8px;
}

.admin-topics-body .topic-editor-section > .admin-form-split {
    margin: -20px -20px 0;
    padding: 16px 20px;
    background: var(--admin-panel-muted);
    border: 0;
    border-bottom: 1px solid var(--admin-border-soft);
    border-left: 5px solid var(--border);
    border-radius: 8px 8px 0 0;
}

.admin-topics-body .topic-editor-section > .admin-form-split h2 {
    font-size: 1.05rem;
}

.admin-topics-body .topic-editor-fields {
    grid-template-columns: minmax(180px, 0.8fr) minmax(240px, 1fr) minmax(260px, 1fr);
    gap: 16px;
    margin-bottom: 0;
}

.admin-topics-body .topic-readonly-id,
.admin-topics-body .topic-avatar-preview,
.admin-topics-body .topic-format-row {
    border-color: var(--admin-border-soft);
}

.admin-topics-body .topic-readonly-id {
    background: var(--surface);
    border-left: 4px solid var(--border);
}

.admin-topics-body .topic-avatar-preview {
    max-width: 520px;
    padding: 14px;
    background: var(--admin-panel-muted);
}

.admin-topics-body .topic-avatar-preview img {
    width: 74px;
    height: 58px;
}

.admin-topics-body .shell:has(> .admin-nav) .topic-editor-panel input,
.admin-topics-body .shell:has(> .admin-nav) .topic-editor-panel select,
.admin-topics-body .shell:has(> .admin-nav) .topic-editor-panel textarea {
    border-color: var(--border);
    border-color: color-mix(in srgb, var(--border) 46%, var(--surface));
    box-shadow: inset 0 1px 0 rgba(15, 28, 38, 0.02);
}

.admin-topics-body .shell:has(> .admin-nav) .topic-editor-panel input:focus,
.admin-topics-body .shell:has(> .admin-nav) .topic-editor-panel select:focus,
.admin-topics-body .shell:has(> .admin-nav) .topic-editor-panel textarea:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--admin-focus-ring);
}

.admin-topics-body .topic-editor-panel input[type="file"] {
    padding: 8px;
    background: var(--surface);
}

.admin-topics-body .topic-editor-panel input[type="file"]::file-selector-button {
    margin-right: 10px;
    padding: 8px 12px;
    color: var(--accent-strong);
    background: var(--admin-panel-muted);
    border: 1px solid var(--admin-border-mid);
    border-radius: 7px;
    font-weight: 800;
}

/* Public category pages keep the image clean and place the title below it. */
.public-events .public-topic-visual {
    min-height: clamp(150px, 18vw, 250px);
    align-items: stretch;
    background-position: center;
    background-size: cover;
}

.public-events .public-topic-visual.has-image {
    background-image:
        linear-gradient(90deg, rgba(8, 18, 24, 0.08), rgba(8, 18, 24, 0.02) 58%, rgba(8, 18, 24, 0.12)),
        var(--hero-image);
}

.public-events .public-topic-visual:not(.has-image) {
    min-height: 170px;
}

.public-events .public-topic-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 0 0 24px;
    padding: 16px 18px;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--heading-background) 10%, var(--surface)), var(--surface) 52%),
        var(--surface);
    border: 1px solid color-mix(in srgb, var(--border) 86%, var(--heading-background) 14%);
    border-left: 5px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(19, 29, 38, 0.07);
}

.public-events .public-topic-heading-main {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 14px;
}

.public-events .public-topic-mark {
    display: grid;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    place-items: center;
    background:
        radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.84), transparent 34%),
        color-mix(in srgb, var(--accent) 13%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--border));
    border-radius: 8px;
}

.public-events .public-topic-mark::before {
    width: 20px;
    height: 20px;
    background-color: var(--accent-strong);
    content: "";
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='14' x='3' y='5' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3Cpath d='M8 15h.01'/%3E%3Cpath d='M12 15h.01'/%3E%3Cpath d='M16 15h.01'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='14' x='3' y='5' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3Cpath d='M8 15h.01'/%3E%3Cpath d='M12 15h.01'/%3E%3Cpath d='M16 15h.01'/%3E%3C/svg%3E") center / contain no-repeat;
}

.public-events .public-topic-heading .breadcrumb {
    margin: 0 0 2px;
    font-size: 0.84rem;
}

.public-events .public-topic-heading .eyebrow {
    margin: 0 0 2px;
    font-size: 0.72rem;
    letter-spacing: 0;
}

.public-events .public-topic-heading h1 {
    margin: 0;
    color: var(--text);
    font-size: clamp(1.35rem, 2.4vw, 2rem);
    line-height: 1.12;
}

.public-events .public-topic-count {
    flex: 0 0 auto;
    margin: 0;
    padding: 7px 10px;
    color: var(--accent-strong);
    background: color-mix(in srgb, var(--accent) 9%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--border));
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 820;
}

/* Appearance settings uses one clear reading column on every screen. */
.admin-appearance-body .admin-appearance-layout {
    display: grid;
    gap: 20px;
    width: min(100%, 1080px);
    margin: 0 auto;
}

.admin-appearance-body .admin-appearance-form {
    display: grid;
    gap: 12px;
    padding: 0 28px 28px;
}

.admin-appearance-body .admin-appearance-form > h2:first-of-type {
    margin: 0 -28px 10px;
    padding: 20px 28px;
    color: #ffffff;
    background: var(--heading-background);
    border-bottom: 4px solid var(--border);
    border-radius: 8px 8px 0 0;
}

.admin-appearance-body .admin-appearance-form > label,
.admin-appearance-body .admin-appearance-form > .header-current-preview,
.admin-appearance-body .admin-appearance-form > .color-grid,
.admin-appearance-body .admin-appearance-form > .settings-grid,
.admin-appearance-body .admin-appearance-form > .settings-checklist,
.admin-appearance-body .admin-appearance-form > .button {
    width: min(100%, 900px);
}

.admin-appearance-body .admin-appearance-form > .admin-form-split {
    margin: 22px 0 2px;
    padding: 16px 18px;
    background: color-mix(in srgb, var(--surface) 78%, var(--background));
    border: 1px solid color-mix(in srgb, var(--border) 58%, var(--surface));
    border-left: 5px solid var(--border);
    border-radius: 8px;
}

.admin-appearance-body .admin-appearance-form > .admin-form-split h2 {
    margin: 0 0 4px;
    font-size: 1.08rem;
}

.admin-appearance-body .admin-appearance-form > .admin-form-split .helper-text {
    margin: 0;
}

.admin-appearance-body .admin-appearance-form .color-grid {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    gap: 12px;
}

.admin-appearance-body .admin-appearance-form .settings-grid {
    grid-template-columns: repeat(4, minmax(140px, 1fr));
}

.admin-appearance-body .admin-appearance-form .settings-checklist {
    background: color-mix(in srgb, var(--surface) 82%, var(--background));
}

.admin-appearance-body .appearance-preview {
    width: 100%;
    padding: 24px 28px;
}

.admin-appearance-body .appearance-preview h2 {
    margin-bottom: 8px;
    font-size: 1.45rem;
}

.admin-appearance-body .appearance-preview .image-settings-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 24px;
}

@media (max-width: 720px) {
    .public-events .public-topic-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        padding: 14px;
    }

    .public-events .public-topic-heading-main {
        align-items: flex-start;
    }

    .public-events .public-topic-mark {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
    }

    .public-events .public-topic-count {
        align-self: flex-start;
    }

    .admin-appearance-body .admin-appearance-form,
    .admin-appearance-body .appearance-preview {
        padding-right: 18px;
        padding-left: 18px;
    }

    .admin-appearance-body .admin-appearance-form > h2:first-of-type {
        margin-right: -18px;
        margin-left: -18px;
        padding-right: 18px;
        padding-left: 18px;
    }

    .admin-appearance-body .admin-appearance-form .color-grid,
    .admin-appearance-body .admin-appearance-form .settings-grid,
    .admin-appearance-body .appearance-preview .image-settings-list {
        grid-template-columns: 1fr;
    }
}

.admin-topics-body .topic-format-editor {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.admin-topics-body .topic-format-row {
    grid-template-columns: 104px minmax(0, 1fr) 128px;
    gap: 14px;
    align-items: end;
    padding: 12px 14px;
    background: var(--surface);
    box-shadow: 0 8px 20px rgba(15, 28, 38, 0.045);
}

.admin-topics-body .topic-format-row:focus-within {
    border-color: var(--admin-border-mid);
    box-shadow: 0 0 0 3px var(--admin-focus-ring);
}

.admin-topics-body .topic-format-index {
    display: flex;
    align-items: center;
    align-self: stretch;
    justify-content: center;
    min-height: 58px;
    padding: 10px;
    color: var(--surface);
    text-align: center;
    background: var(--accent-strong);
    border-radius: 7px;
    white-space: nowrap;
}

.admin-topics-body .topic-format-row label {
    min-width: 0;
}

.admin-topics-body .topic-format-row input {
    min-width: 0;
}

.admin-topics-body .topic-digital-product-card {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) 180px;
    gap: 14px 18px;
    align-items: end;
    padding: 16px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--surface) 94%, var(--accent)), var(--surface)),
        var(--surface);
    border: 1px solid var(--admin-border-mid);
    border-left: 5px solid var(--accent);
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(15, 28, 38, 0.045);
}

.admin-topics-body .topic-digital-product-card:focus-within {
    border-color: var(--admin-border-mid);
    box-shadow: 0 0 0 3px var(--admin-focus-ring);
}

.admin-topics-body .topic-digital-product-card .check-row {
    min-height: 48px;
    padding: 12px 14px;
    background: color-mix(in srgb, var(--accent) 8%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--border));
    border-radius: 8px;
    font-weight: 850;
}

.admin-topics-body .topic-digital-product-card .helper-text {
    grid-column: 1 / -1;
    margin: 0;
}

.admin-topics-body .topic-purchase-options {
    display: grid;
    gap: 14px;
}

.admin-topics-body .topic-purchase-option-card {
    overflow: hidden;
    background: color-mix(in srgb, var(--surface) 96%, var(--accent) 4%);
    border: 1px solid var(--admin-border-mid);
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(15, 28, 38, 0.045);
}

.admin-topics-body .topic-purchase-option-card:focus-within {
    border-color: var(--admin-border-mid);
    box-shadow: 0 0 0 3px var(--admin-focus-ring);
}

.admin-topics-body .topic-purchase-option-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    color: var(--surface);
    background: var(--accent-strong);
}

.admin-topics-body .topic-purchase-option-head span {
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.admin-topics-body .topic-purchase-option-head .check-row {
    min-height: auto;
    color: var(--surface);
}

.admin-topics-body .topic-purchase-option-grid {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) 150px minmax(240px, 1.4fr);
    gap: 14px;
    align-items: start;
    padding: 14px;
}

.admin-topics-body .topic-purchase-option-grid label {
    min-width: 0;
}

.admin-topics-body .topic-purchase-option-choices {
    grid-row: span 2;
}

.admin-topics-body .topic-purchase-option-grid textarea {
    min-height: 116px;
    resize: vertical;
}

.admin-topics-body .topic-editor-actions {
    justify-content: flex-end;
    margin-top: -4px;
    padding-top: 4px;
}

.admin-topics-body .topic-editor-actions .button {
    min-width: 190px;
}

@media (max-width: 760px) {
    .admin-topics-body .topic-editor-panel > *:not(.topic-editor-heading),
    .admin-topics-body .topic-list-panel > *:not(.topic-list-heading) {
        margin-right: 16px;
        margin-left: 16px;
    }

    .admin-topics-body .topic-editor-fields,
    .admin-topics-body .topic-format-row,
    .admin-topics-body .topic-digital-product-card,
    .admin-topics-body .topic-purchase-option-grid {
        grid-template-columns: 1fr;
    }

    .admin-topics-body .topic-purchase-option-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-topics-body .topic-format-index {
        justify-content: flex-start;
        min-height: 40px;
    }

    .admin-topics-body .topic-editor-actions,
    .admin-topics-body .topic-editor-actions .button {
        width: 100%;
    }
}

/* Events create card: cleaner grouping for manual event creation. */
.admin-events-body .shell:has(> .admin-nav) .event-create-panel {
    max-width: 1120px;
    margin-inline: auto;
    padding: 0;
    border-color: var(--admin-border-soft);
    box-shadow: 0 18px 42px rgba(14, 27, 36, 0.09);
    scroll-margin-top: 88px;
}

.admin-events-body .shell:has(> .admin-nav) .event-create-panel::before {
    display: none;
}

.admin-events-body .event-create-form {
    gap: 0;
}

.admin-events-body .event-create-heading {
    margin: 0;
    padding: 20px 26px;
    background: var(--admin-heading-bg);
    border-bottom: 4px solid var(--border);
    border-radius: 8px 8px 0 0;
}

.admin-events-body .event-create-heading h2 {
    margin: 0;
    color: #ffffff;
    font-size: 1.16rem;
    font-weight: 880;
}

.admin-events-body .event-create-heading .helper-text {
    max-width: 780px;
    margin-top: 5px;
    color: rgba(255, 255, 255, 0.78);
}

.admin-events-body .event-create-fields {
    grid-template-columns: minmax(220px, 1.2fr) minmax(190px, 1fr) minmax(150px, 0.8fr) minmax(150px, 0.8fr);
    gap: 16px;
    margin: 26px 26px 18px;
    padding: 20px;
    background: var(--admin-panel-soft);
    border: 1px solid var(--admin-border-soft);
    border-left: 5px solid var(--border);
    border-radius: 8px;
}

.admin-events-body .event-create-fields label {
    min-width: 0;
}

.admin-events-body .shell:has(> .admin-nav) .event-create-panel input,
.admin-events-body .shell:has(> .admin-nav) .event-create-panel select {
    border-color: var(--border);
    border-color: color-mix(in srgb, var(--border) 46%, var(--surface));
}

.admin-events-body .shell:has(> .admin-nav) .event-create-panel input:focus,
.admin-events-body .shell:has(> .admin-nav) .event-create-panel select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--admin-focus-ring);
}

.admin-events-body .event-create-options {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(340px, 1.1fr);
    gap: 18px;
    align-items: stretch;
    margin: 0 26px 18px;
    padding: 0;
    background: transparent;
    border: 0;
}

.admin-events-body .event-create-option-card,
.admin-events-body .event-create-origin {
    display: grid;
    gap: 14px;
    align-content: start;
    padding: 18px;
    background: var(--admin-panel-soft);
    border: 1px solid var(--admin-border-soft);
    border-radius: 8px;
}

.admin-events-body .event-create-option-card h3,
.admin-events-body .event-create-origin h3 {
    margin: -18px -18px 2px;
    padding: 14px 18px;
    color: var(--text);
    background: var(--admin-panel-muted);
    border-bottom: 1px solid var(--admin-border-soft);
    border-left: 5px solid var(--border);
    border-radius: 8px 8px 0 0;
    font-size: 1.02rem;
    font-weight: 860;
}

.admin-events-body .event-create-checks {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.admin-events-body .event-create-checks .check-row,
.admin-events-body .event-create-import-check {
    min-height: 58px;
    padding: 12px 14px;
    background: var(--surface);
    border: 1px solid var(--admin-border-soft);
    border-radius: 8px;
}

.admin-events-body .event-create-import-check {
    min-height: 64px;
    border-left: 5px solid var(--border);
    font-size: 0.96rem;
}

.admin-events-body .event-create-origin-grid {
    gap: 14px;
}

.admin-events-body .event-create-origin-summary {
    margin-top: 0;
    padding: 12px 14px;
    background: var(--surface);
    border: 1px solid var(--admin-border-soft);
}

.admin-events-body .event-create-origin .smart-progress[data-event-create-progress] {
    margin: 0;
    padding: 12px 14px;
    background: var(--surface);
    border: 1px solid var(--admin-border-soft);
    border-left: 5px solid var(--border);
    border-radius: 8px;
}

.admin-events-body .event-create-submit {
    margin: 0 26px 26px;
    padding: 16px 18px;
    background: var(--admin-panel-muted);
    border: 1px solid var(--admin-border-soft);
}

.admin-events-body .event-create-submit .button {
    min-width: 170px;
}

.admin-events-body .page-heading.compact {
    padding: 22px 26px;
    background: var(--surface);
    border: 1px solid var(--admin-border-soft);
    border-left: 5px solid var(--border);
    box-shadow: 0 12px 28px rgba(14, 27, 36, 0.06);
}

@media (max-width: 1180px) {
    .admin-events-body .event-create-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-events-body .event-create-options {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .admin-events-body .event-create-heading {
        padding: 18px;
    }

    .admin-events-body .event-create-fields,
    .admin-events-body .event-create-options,
    .admin-events-body .event-create-submit {
        margin-right: 16px;
        margin-left: 16px;
    }

    .admin-events-body .event-create-fields,
    .admin-events-body .event-create-options,
    .admin-events-body .event-create-checks {
        grid-template-columns: 1fr;
    }

    .admin-events-body .event-create-submit {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-events-body .event-create-submit .button {
        width: 100%;
    }
}

/* Admin dashboard: clean control room layout. */
.admin-dashboard-body .page-heading.compact {
    padding: 26px 28px;
    background:
        linear-gradient(135deg, rgba(15, 102, 113, 0.08), rgba(201, 146, 47, 0.07)),
        var(--surface);
    border: 1px solid var(--admin-border-soft, var(--border));
    border-left: 5px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(14, 27, 36, 0.07);
}

.admin-dashboard-body .admin-dashboard-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.admin-dashboard-body .dashboard-metric-card {
    min-height: 0;
    padding: 0;
    display: grid;
    gap: 16px;
    align-content: start;
}

.admin-dashboard-body .dashboard-metric-card::after {
    display: none;
}

.admin-dashboard-body .dashboard-card-heading,
.admin-dashboard-body .dashboard-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.admin-dashboard-body .dashboard-card-heading {
    margin: 0;
    padding: 18px 20px 14px;
    background: var(--admin-panel-muted, #f8fafb);
    border-bottom: 1px solid var(--admin-border-soft, #e3ebf0);
}

.admin-dashboard-body .dashboard-card-heading .eyebrow,
.admin-dashboard-body .dashboard-section-heading .eyebrow {
    margin: 0 0 3px;
}

.admin-dashboard-body .dashboard-card-heading span {
    color: #6a7684;
    font-size: 0.82rem;
    font-weight: 760;
}

.admin-dashboard-body .dashboard-metric-value,
.admin-dashboard-body .dashboard-site-name {
    margin: 0 20px;
    color: var(--accent-strong);
    font-weight: 900;
    line-height: 1;
}

.admin-dashboard-body .dashboard-metric-value {
    font-size: clamp(2.25rem, 4vw, 3.2rem);
}

.admin-dashboard-body .dashboard-site-name {
    font-size: clamp(1.45rem, 2.5vw, 2rem);
    line-height: 1.12;
}

.admin-dashboard-body .dashboard-metric-card > p {
    min-height: 44px;
    margin: 0 20px;
    color: #5f6e7d;
}

.admin-dashboard-body .dashboard-metric-card > .button {
    justify-self: start;
    margin: 0 20px 20px;
}

.admin-dashboard-body .admin-dashboard-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
    gap: 20px;
}

.admin-dashboard-body .dashboard-panel {
    padding: 0;
}

.admin-dashboard-body .dashboard-section-heading {
    margin: 0;
    padding: 18px 20px;
    color: #ffffff;
    background: var(--heading-background);
    border-bottom: 3px solid var(--border);
}

.admin-dashboard-body .dashboard-section-heading h2 {
    margin: 0;
    color: #ffffff;
    font-size: 1.12rem;
}

.admin-dashboard-body .dashboard-section-heading .eyebrow {
    color: rgba(255, 255, 255, 0.72);
}

.admin-dashboard-body .dashboard-section-heading .button {
    color: #0d2830;
    background: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
    box-shadow: none;
}

.admin-dashboard-body .dashboard-event-list,
.admin-dashboard-body .dashboard-action-list {
    display: grid;
    gap: 10px;
    padding: 18px 20px 20px;
}

.admin-dashboard-body .dashboard-event-list a,
.admin-dashboard-body .dashboard-action-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 66px;
    padding: 14px 16px;
    color: var(--text);
    text-decoration: none;
    background: #ffffff;
    border: 1px solid var(--admin-border-soft, #e3ebf0);
    border-left: 5px solid transparent;
    border-radius: 8px;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.admin-dashboard-body .dashboard-event-list a:hover,
.admin-dashboard-body .dashboard-action-list a:hover {
    border-color: rgba(15, 102, 113, 0.24);
    border-left-color: var(--border);
    box-shadow: 0 12px 24px rgba(14, 27, 36, 0.08);
    transform: translateY(-1px);
}

.admin-dashboard-body .dashboard-event-main {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.admin-dashboard-body .dashboard-event-main strong,
.admin-dashboard-body .dashboard-action-list strong {
    color: #10242c;
    font-size: 0.98rem;
}

.admin-dashboard-body .dashboard-event-main small,
.admin-dashboard-body .dashboard-action-list span {
    color: #647282;
    font-size: 0.86rem;
}

.admin-dashboard-body .dashboard-event-count {
    flex: 0 0 auto;
    padding: 7px 10px;
    color: var(--accent-strong);
    background: var(--accent-soft);
    border: 1px solid rgba(15, 102, 113, 0.12);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 820;
}

.admin-dashboard-body .dashboard-action-list a {
    display: grid;
    justify-content: stretch;
    gap: 4px;
    min-height: 74px;
}

.admin-dashboard-body .empty-dashboard-text {
    margin: 0;
    padding: 22px 20px;
}

@media (max-width: 980px) {
    .admin-dashboard-body .admin-dashboard-stats,
    .admin-dashboard-body .admin-dashboard-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .admin-dashboard-body .page-heading.compact {
        padding: 20px;
    }

    .admin-dashboard-body .dashboard-section-heading,
    .admin-dashboard-body .dashboard-event-list a {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-dashboard-body .dashboard-section-heading .button,
    .admin-dashboard-body .dashboard-metric-card > .button {
        width: 100%;
    }

    .admin-dashboard-body .dashboard-event-count {
        justify-self: start;
    }
}
