/* ==========================================================
   SurveyHustler — Design System
   ========================================================== */

/* ---- CSS Variables ---- */
:root {
    --page: #FAF8EF;
    --card: #FFFDF6;
    --primary: #B9955A;
    --primary-hover: #C8AA78;
    --primary-light: rgba(185, 149, 90, 0.12);
    --primary-border: #C8AA78;
    --border-gold: #C8AA78;
    --nav: #242426;
    --disabled: #EEEAE1;

    --bg: var(--page);
    --white: var(--card);

    --text: #29292C;
    --text-secondary: #77736C;
    --text-muted: #77736C;
    --text-faint: #77736C;

    --error: #C62828;
    --error-bg: rgba(214, 34, 34, 0.07);
    --success: #2E7D4F;
    --success-bg: rgba(71, 135, 71, 0.08);
    --warning-bg: #FFF8E1;
    --warning-text: #B8860B;

    --border: var(--border-gold);
    --border-light: var(--disabled);
    --shadow-sm: 0 2px 8px rgba(46, 47, 50, 0.06);
    --shadow: 0 4px 24px rgba(46, 47, 50, 0.08);
    --shadow-lg: 0 12px 48px rgba(46, 47, 50, 0.12);

    --radius-sm: 8px;
    --radius: 12px;
    --radius-lg: 16px;
    --ease: 0.2s ease;
}

/* ---- Reset ---- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

/* ---- Base ---- */
html { height: 100%; }
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: var(--bg);
    color: var(--text);
    min-height: 100vh;
    line-height: 1.5;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

/* ---- Customer support FAQ ---- */
.faq-page { max-width: 780px; padding-top: 24px; padding-bottom: 56px; }
.faq-header {
    background: #242426;
    color: #FFFDF6;
    border: 1px solid var(--primary-border);
    border-radius: var(--radius-lg);
    padding: 28px 24px;
    margin-bottom: 20px;
}
.faq-header h1 { color: #FFFDF6; margin-bottom: 8px; }
.faq-header p { color: #EEEAE1; }
.faq-header .faq-eyebrow {
    color: #C8AA78;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 6px;
}
.faq-search, .faq-human {
    background: #FFFDF6;
    border: 1px solid #C8AA78;
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: var(--shadow-sm);
}
.faq-search label { display: block; font-size: 15px; }
.faq-search input { min-height: 48px; background: #FFFDF6; }
.faq-count { font-size: 14px; margin-top: 8px; }
.faq-list { display: grid; gap: 12px; margin-bottom: 20px; }
.faq-item {
    background: #FFFDF6;
    border: 1px solid var(--primary-border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
}
.faq-item summary {
    min-height: 48px;
    padding: 16px 48px 16px 18px;
    cursor: pointer;
    font-weight: 700;
    position: relative;
}
.faq-item summary:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }
.faq-item p { padding: 0 18px 18px; font-size: 15px; }
.faq-empty { padding: 20px; text-align: center; }
.faq-human h2 { margin-bottom: 8px; }
.faq-human .btn { margin-top: 16px; min-height: 44px; }

@media (max-width: 480px) {
    .faq-page { padding: 20px; }
    .faq-page .top-logo { margin-bottom: 20px; }
    .faq-header { padding: 24px 20px; }
    .faq-human .btn { width: 100%; }
}

/* ---- Typography ---- */
h1 { font-size: 26px; font-weight: 700; color: var(--text); }
h2 { font-size: 20px; font-weight: 700; color: var(--text); }
h3 { font-size: 16px; font-weight: 700; color: var(--text); }
p  { color: var(--text-secondary); line-height: 1.65; font-size: 14px; }
a  { color: var(--text); text-decoration-color: var(--primary); text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible, button:focus-visible, [role="button"]:focus-visible {
    outline: 3px solid rgba(185, 149, 90, 0.55);
    outline-offset: 3px;
}

/* ==========================================================
   LAYOUT  A — Split  (form page + wood banner on desktop)
   Desktop ≥ 1025 px : left wood 38 % ·  right content 62 %
   Tablet / Mobile    : wood hidden, logo on top
   ========================================================== */
.layout-split { display: flex; min-height: 100vh; }

.wood-banner {
    width: 38%;
    min-height: 100vh;
    background: url('/static/wood%20bg.jpg') center / cover no-repeat;
    position: fixed;
    left: 0; top: 0; bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.wood-banner::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(46, 47, 50, 0.30);
}
.banner-logo {
    width: 200px;
    position: relative;
    z-index: 1;
    filter: drop-shadow(0 4px 16px rgba(0,0,0,0.35));
}

.content-split {
    margin-left: 38%;
    width: 62%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 56px;
}

.mobile-logo { display: none; text-align: center; margin-bottom: 28px; }
.mobile-logo img { height: 52px; }

/* ==========================================================
   LAYOUT  B — Center  (status / info pages)
   ========================================================== */
.layout-center {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px 24px;
}

.top-logo { margin-bottom: 32px; }
.top-logo img { height: 48px; }

/* ==========================================================
   LAYOUT  C — Wide page  (multi-section setup / creation)
   ========================================================== */
.layout-page {
    max-width: 1000px;
    margin: 0 auto;
    padding: 32px 24px;
}
.layout-page .top-logo { text-align: center; margin-bottom: 24px; }

.page-header {
    background: var(--nav);
    color: var(--white);
    padding: 28px 36px;
    border-radius: var(--radius-lg);
    margin-bottom: 28px;
    text-align: center;
}
.page-header h1 { color: var(--card); font-size: 24px; margin-bottom: 6px; }
.page-header p  { color: var(--disabled); font-size: 14px; }

/* ==========================================================
   CARDS
   ========================================================== */
.card {
    background: var(--white);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 40px;
    width: 100%;
    max-width: 520px;
}
.card-wide { max-width: 640px; }
.card-xl   { max-width: 900px; }
.card-full { max-width: 1000px; }
.card.text-center { text-align: center; }

.card-section {
    background: var(--white);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius);
    padding: 28px;
    box-shadow: var(--shadow-sm);
}

/* ==========================================================
   FORM  ELEMENTS
   ========================================================== */
.form-section { margin-bottom: 24px; }
.form-section-title {
    color: var(--primary);
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--border-light);
}
.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
}
.form-row.full { grid-template-columns: 1fr; }
.form-group {
    display: flex;
    flex-direction: column;
}

label {
    font-weight: 600;
    color: var(--text);
    margin-bottom: 6px;
    font-size: 14px;
}
.required { color: var(--error); }

input, select, textarea {
    padding: 11px 14px;
    border: 1.5px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-family: inherit;
    color: var(--text);
    background: var(--white);
    min-height: 48px;
    transition: border-color var(--ease), box-shadow var(--ease);
    width: 100%;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-light);
}
input::placeholder, textarea::placeholder { color: var(--text-faint); }
textarea { resize: vertical; min-height: 80px; }

.field-error { color: var(--error); font-size: 12px; margin-top: 5px; }
.search-select { position: relative; }
.search-select input { min-height: 44px; }
.search-select-list { position: absolute; z-index: 20; top: calc(100% + 4px); left: 0; right: 0; max-height: 220px; overflow-y: auto; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-sm); box-shadow: var(--shadow); }
.search-select-list button { display: block; width: 100%; min-height: 44px; padding: 10px 14px; border: 0; background: var(--white); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.search-select-list button:hover, .search-select-list button:focus { background: var(--primary-light); outline: none; }
.search-select-empty { padding: 12px 14px; color: var(--text-secondary); font-size: 14px; }

/* ==========================================================
   BUTTONS
   ========================================================== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 28px;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 15px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all var(--ease);
    line-height: 1.4;
    min-height: 44px;
    text-decoration: none;
}
.btn-primary {
    background: var(--primary);
    color: var(--text);
}
.btn-primary:hover {
    background: var(--primary-hover);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(179, 147, 94, 0.30);
}
.btn-secondary {
    background: transparent;
    color: var(--text);
    border: 1px solid var(--primary);
}
.btn-secondary:hover {
    background: var(--border);
}
.btn-block { width: 100%; }
.btn:disabled, button:disabled {
    background: var(--disabled);
    color: var(--text-secondary);
    opacity: 1;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

/* Generic <button> inside our pages — primary by default */
button.sh-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 13px 28px;
    background: var(--primary);
    color: var(--text);
    border: none;
    border-radius: var(--radius-sm);
    font-size: 15px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all var(--ease);
    min-height: 48px;
}
button.sh-btn:hover {
    background: var(--primary-hover);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(179, 147, 94, 0.30);
}

/* ==========================================================
   STATUS  /  FEEDBACK
   ========================================================== */
.error-box {
    background: var(--error-bg);
    color: var(--error);
    padding: 12px 16px;
    border-radius: var(--radius-sm);
    font-size: 14px;
    margin-bottom: 20px;
    display: none;
}
.error-box:not([hidden]) { display: block; }
.success-heading { color: var(--success); }
.error-heading   { color: var(--error); }
.highlight-text  { color: var(--text); font-weight: 600; }

.status-icon { font-size: 56px; margin-bottom: 16px; }

.checkmark-circle {
    width: 80px; height: 80px;
    background: var(--success);
    border-radius: 50%;
    margin: 0 auto 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 42px;
    color: var(--white);
    animation: scaleIn 0.5s ease-out;
}
@keyframes scaleIn {
    from { transform: scale(0); opacity: 0; }
    to   { transform: scale(1); opacity: 1; }
}

/* ==========================================================
   PASSWORD  STRENGTH
   ========================================================== */
.password-strength {
    font-size: 14px;
    margin-top: 5px;
    padding: 5px 10px;
    border-radius: 4px;
    display: none;
}
.password-strength.weak   { background: var(--error-bg); color: var(--error); display: block; }
.password-strength.medium { background: var(--warning-bg); color: var(--warning-text); display: block; }
.password-strength.strong { background: var(--success-bg); color: var(--success); display: block; }
.password-mismatch        { color: var(--error); font-size: 14px; margin-top: 5px; display: none; }
.password-match-message { font-size: 14px; margin-top: 5px; }
.password-match-message[data-state="match"] { color: var(--success); }
.password-match-message[data-state="mismatch"] { color: var(--error); }

/* ==========================================================
   SUMMARY  /  INVOICE
   ========================================================== */
.summary-box {
    background: var(--bg);
    border-radius: var(--radius-sm);
    padding: 20px;
    margin: 24px 0;
    border-left: 4px solid var(--primary);
}
.summary-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-light);
    font-size: 14px;
}
.summary-row:last-child { border-bottom: none; }
.summary-label { color: var(--text-muted); }
.summary-value { color: var(--text); font-weight: 600; }
.summary-row.total {
    font-size: 16px;
    font-weight: 700;
    border-bottom: 2px solid var(--primary);
    color: var(--primary);
    padding: 14px 0;
}

/* ==========================================================
   INFO  /  HIGHLIGHT  BOXES
   ========================================================== */
.info-box {
    background: var(--bg);
    padding: 16px 20px;
    border-radius: var(--radius-sm);
    border-left: 4px solid var(--primary);
    margin: 20px 0;
}
.info-box p { font-size: 14px; color: var(--text-secondary); }

.highlight-box {
    background: var(--primary-light);
    padding: 20px;
    border-radius: var(--radius-sm);
    border-left: 4px solid var(--primary);
    margin: 24px 0;
}
.highlight-box strong { color: var(--primary-hover); }

/* ==========================================================
   HINTS  /  CAPTIONS
   ========================================================== */
.hint       { font-size: 14px; color: var(--text-muted); margin-top: 4px; }
.char-count { font-size: 14px; color: var(--text-muted); margin-top: 4px; }

/* ==========================================================
   AMOUNT  BOX  (Withdrawal)
   ========================================================== */
.amount-box {
    background: var(--primary);
    color: var(--text);
    border-radius: var(--radius-sm);
    padding: 20px;
    text-align: center;
    margin-bottom: 24px;
}
.amount-label { font-size: 14px; }
.amount-value { font-size: 32px; font-weight: 700; margin-top: 4px; }

/* ==========================================================
   STEPS  (Google Form Setup)
   ========================================================== */
.step {
    background: var(--bg);
    padding: 16px 20px;
    margin-bottom: 12px;
    border-left: 4px solid var(--primary);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.step p { color: var(--text-secondary); line-height: 1.6; margin-bottom: 6px; }
.step p:last-child { margin-bottom: 0; }
.step code {
    background: var(--border-light);
    padding: 2px 8px;
    border-radius: 4px;
    font-family: 'Consolas', 'Courier New', monospace;
    color: var(--primary-hover);
    font-size: 14px;
}

/* ==========================================================
   TOGGLE  SWITCH
   ========================================================== */
.toggle-switch { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.toggle-switch span { font-size: 14px; font-weight: 600; }
.toggle {
    position: relative;
    display: inline-block !important;
    width: 50px; height: 28px;
    background: var(--border);
    border-radius: 14px;
    cursor: pointer;
    transition: background var(--ease);
    flex-shrink: 0;
    margin: 0 !important;
}
.toggle-slider {
    position: absolute;
    top: 2px; left: 2px;
    width: 24px; height: 24px;
    background: var(--white);
    border-radius: 12px;
    transition: left var(--ease);
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
    pointer-events: none;
}
.toggle.active .toggle-slider { left: 24px; }
.toggle.active { background: var(--primary); }

/* ==========================================================
   SURVEY AUDIENCE TARGETING
   ========================================================== */
.audience-title-row {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--primary);
}
.audience-title-row h2 { margin: 0; }
.audience-estimate-value.is-loading { opacity: .7; }
.paid-total-preview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 12px;
    padding: 13px 15px;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    background: var(--primary-light);
}
.paid-total-preview span { color: var(--text-secondary); }
.paid-total-preview strong { color: var(--primary); font-size: 18px; }
.filter-container { margin-top: 20px; }
.audience-segments { display: grid; gap: 18px; }
.audience-segment {
    padding: 22px;
    border: 1px solid var(--border-light);
    border-radius: var(--radius);
    background: var(--bg);
    box-shadow: var(--shadow-sm);
}
.audience-segment-head,
.audience-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.audience-segment-head { margin-bottom: 8px; }
.audience-segment-head h3 { margin: 0; color: var(--text); font-size: 18px; }
.audience-prompt { margin: 0 0 14px; color: var(--text-secondary); }
.audience-branches {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.audience-branch {
    display: flex;
    min-height: 96px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 5px;
    padding: 16px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--white);
    color: var(--text);
    text-align: left;
    cursor: pointer;
    transition: border-color var(--ease), background var(--ease), box-shadow var(--ease);
}
.audience-branch span { color: var(--text-secondary); font-size: 14px; }
.audience-branch:hover { border-color: var(--primary); }
.audience-branch.is-selected {
    border-color: var(--primary);
    background: var(--primary-light);
    box-shadow: 0 0 0 2px rgba(179, 147, 94, .14);
}
.audience-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--border-light);
}
.audience-field { min-width: 0; }
.audience-field-wide { grid-column: 1 / -1; }
.audience-field label { display: block; margin-bottom: 8px; }
.occupation-lookup { position: relative; }
.audience-chips { display: flex; flex-wrap: wrap; gap: 9px; }
.audience-chip {
    padding: 9px 13px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--white);
    color: var(--text);
    cursor: pointer;
    font-size: 12px;
    font-weight: 400;
}
.audience-chip:hover { border-color: var(--primary); }
.audience-chip.is-selected {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
}
.audience-remove,
.audience-select-all,
.audience-add {
    border: 0;
    background: transparent;
    color: var(--primary);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.audience-remove { color: var(--error); }
.audience-select-all { padding: 4px; }
.audience-add { margin-top: 16px; padding: 8px 2px; text-align: left; }
.audience-branch:focus-visible,
.audience-chip:focus-visible,
.audience-remove:focus-visible,
.audience-select-all:focus-visible,
.audience-add:focus-visible {
    outline: 3px solid rgba(179, 147, 94, .35);
    outline-offset: 3px;
}

/* ==========================================================
   OPTIONAL QUALIFYING QUESTION
   ========================================================== */
.optional-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.optional-section-head h2 { margin-bottom: 6px; }
.optional-section-head p { margin: 0; color: var(--text-secondary); }
.qualifying-fields { margin-top: 22px; }
.qualifying-toggle {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
    padding: 8px 11px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--white);
    color: var(--text-secondary);
    cursor: pointer;
    font: inherit;
    font-weight: 600;
}
.qualifying-toggle-track {
    position: relative;
    width: 36px;
    height: 20px;
    border-radius: 999px;
    background: var(--border);
    transition: background .2s ease;
}
.qualifying-toggle-track span {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--white);
    transition: transform .2s ease;
}
.qualifying-toggle.is-active {
    border-color: var(--primary);
    color: var(--primary);
}
.qualifying-toggle.is-active .qualifying-toggle-track { background: var(--primary); }
.qualifying-toggle.is-active .qualifying-toggle-track span { transform: translateX(16px); }
.qualifying-toggle:focus-visible {
    outline: 3px solid rgba(179, 147, 94, .3);
    outline-offset: 3px;
}

.qualifying-option-list {
    display: grid;
    gap: 10px;
}

.qualifying-option-row {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr) 36px;
    align-items: center;
    gap: 10px;
}

.qualifying-option-row .qualifying-option-input {
    border: 0;
    border-bottom: 1px solid var(--border);
    border-radius: 0;
    background: transparent;
    padding: 10px 4px;
}

.qualifying-option-row .qualifying-option-input:focus {
    border-bottom-color: var(--primary);
    box-shadow: 0 1px 0 var(--primary);
}

.qualifying-radio-preview {
    width: 18px;
    height: 18px;
    border: 2px solid #777;
    border-radius: 50%;
}

.qualifying-remove-option,
.qualifying-add-option {
    border: 0;
    background: transparent;
    color: var(--muted-text);
    cursor: pointer;
}

.qualifying-remove-option {
    min-height: 36px;
    font-size: 25px;
}

.qualifying-add-option {
    margin-top: 10px;
    padding: 8px 0;
    color: var(--primary);
    font-weight: 700;
}

.qualification-choice-list {
    display: grid;
    gap: 14px;
    margin: 22px 0;
}

.qualification-choice {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
    text-align: left;
    cursor: pointer;
}

.qualification-choice input[type="radio"] {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    min-height: 18px;
    margin: 2px 0 0;
    padding: 0;
    accent-color: var(--primary);
}

.qualification-choice span {
    flex: 1;
}

.qualification-result {
    margin-top: 20px;
}
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--text-secondary);
    cursor: pointer;
}
.checkbox-label input[type="checkbox"] {
    width: auto;
    margin: 0;
    accent-color: var(--primary);
}

/* ==========================================================
   GOLDEN EGG BENEFITS
   ========================================================== */
.golden-egg-option {
    margin-top: 22px;
    padding: 18px;
    border: 1px solid var(--primary-border);
    border-radius: var(--radius);
    background: linear-gradient(145deg, rgba(185, 149, 90, 0.11), rgba(255, 253, 246, 0.92));
}

.golden-egg-option > .checkbox-label {
    align-items: flex-start;
    color: var(--text);
}

.golden-egg-benefits {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(185, 149, 90, 0.34);
}

.golden-egg-benefits > strong {
    color: #765A2B;
}

.golden-egg-benefits ul {
    display: grid;
    gap: 8px;
    margin: 10px 0 0;
    padding-left: 20px;
    color: var(--text-secondary);
}

.golden-egg-benefits li::marker {
    color: var(--primary);
}

/* ==========================================================
   REACTIVATION DEAL CARD
   ========================================================== */
.reactivation-page {
    padding-top: 42px;
    padding-bottom: 58px;
}

.reactivation-card {
    display: grid;
    gap: 22px;
    max-width: 680px;
}

.reactivation-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.reactivation-kicker {
    margin-bottom: 6px;
    color: var(--primary);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.reactivation-heading h1,
.reactivation-copy {
    margin: 0;
}

.reactivation-copy {
    color: var(--text-secondary);
}

.deal-badge,
.savings-badge {
    border: 1px solid rgba(46, 125, 79, 0.28);
    border-radius: 999px;
    background: var(--success-bg);
    color: var(--success);
    font-weight: 800;
    white-space: nowrap;
}

.deal-badge {
    padding: 7px 12px;
    font-size: 14px;
}

.reactivation-breakdown {
    overflow: hidden;
    border: 1px solid var(--border-light);
    border-radius: var(--radius);
    background: rgba(255, 253, 246, 0.72);
}

.reactivation-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 15px 18px;
    border-bottom: 1px solid var(--border-light);
}

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

.reactivation-row > span:first-child {
    color: var(--text-secondary);
}

.price-pair,
.total-price-pair {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 10px;
    text-align: right;
}

.original-price,
.original-total {
    color: var(--text-muted);
    text-decoration: line-through;
    text-decoration-thickness: 2px;
}

.deal-price {
    color: var(--success);
    font-size: 20px;
}

.reactivation-total-row {
    align-items: flex-end;
    padding-top: 20px;
    padding-bottom: 20px;
    background: rgba(185, 149, 90, 0.08);
}

.total-price-pair {
    flex-wrap: wrap;
}

.original-total {
    font-size: 15px;
}

.reactivation-total {
    color: #765A2B;
    font-size: 32px;
    line-height: 1;
}

.savings-badge {
    justify-self: start;
    padding: 10px 16px;
    font-size: 16px;
}

.reactivation-golden-option {
    margin-top: 0;
}

.golden-egg-toggle input {
    margin-top: 4px !important;
}

.reactivation-actions {
    display: grid;
    gap: 10px;
}

/* ==========================================================
   BUTTON  GROUPS
   ========================================================== */
.button-group { display: flex; gap: 12px; margin-top: 24px; }
.button-group .btn { flex: 1; }

/* ==========================================================
   FOOTER
   ========================================================== */
.page-footer {
    text-align: center;
    margin-top: 20px;
    color: var(--text-muted);
    font-size: 14px;
}

/* ==========================================================
   LOADER
   ========================================================== */
.loader {
    display: none;
    border: 3px solid var(--border-light);
    border-top: 3px solid var(--primary);
    border-radius: 50%;
    width: 18px; height: 18px;
    animation: spin 0.8s linear infinite;
    margin-right: 8px;
}
@keyframes spin { to { transform: rotate(360deg); } }
button.loading { opacity: 0.6; cursor: not-allowed; }
button.loading .loader { display: inline-block; }

/* ==========================================================
   2-COLUMN  GRID  (survey create form)
   ========================================================== */
.two-col-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
}

/* ==========================================================
   MODAL  OVERLAY  (password verification, confirmations)
   ========================================================== */
.overlay {
    position: fixed;
    inset: 0;
    background: rgba(46, 47, 50, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 24px;
}
.modal {
    background: var(--white);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    padding: 40px;
    max-width: 450px;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    width: 100%;
}
.modal-close {
    width: 44px;
    height: 44px;
    border: 1px solid var(--border-gold);
    border-radius: 50%;
    background: var(--card);
    color: var(--text);
}

/* Reusable feedback and progress components for touched screens. */
.toast {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1100;
    width: min(360px, calc(100% - 40px));
    padding: 14px 16px;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}
.toast-success { border-left: 4px solid var(--success); }
.toast-error { border-left: 4px solid var(--error); }
.progress-steps {
    display: flex;
    gap: 8px;
    margin: 20px 0;
    padding: 0;
    list-style: none;
}
.progress-steps li {
    flex: 1;
    min-height: 6px;
    border-radius: 999px;
    background: var(--disabled);
}
.progress-steps li[aria-current="step"], .progress-steps li.is-complete { background: var(--primary); }

/* Public plan comparison */
.site-header {
    min-height: 64px;
    padding: 10px 24px;
    background: var(--nav);
    color: var(--card);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-weight: 700;
}
.site-header img { width: 44px; height: 44px; object-fit: contain; display: block; }
.plans-page { width: min(100% - 40px, 960px); margin: 0 auto; padding: 48px 0 64px; }
.plans-intro { max-width: 700px; margin: 0 auto 28px; text-align: center; }
.plans-intro .eyebrow { color: var(--text); font-weight: 700; margin-bottom: 6px; }
.plans-intro h1 { margin-bottom: 10px; }
.plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.plan-card {
    background: var(--card);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-lg);
    padding: 28px;
    box-shadow: var(--shadow-sm);
}
.plan-card-featured { border-top: 5px solid var(--primary); padding-top: 24px; }
.plan-name { color: var(--text); font-weight: 700; }
.plan-card h2 { margin: 6px 0 2px; }
.plan-caption { min-height: 24px; }
.plan-card ul { margin: 22px 0 0; padding-left: 20px; color: var(--text-secondary); }
.plan-card li { margin-bottom: 12px; font-size: 14px; }
.availability-note {
    margin: 20px 0;
    padding: 22px;
    background: var(--card);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius);
}
.availability-note h2 { margin-bottom: 6px; }
.plans-return { width: 100%; max-width: 360px; margin: 0 auto; display: flex; }

/* Authenticated Pro comparison and purchase flow */
.pro-compare-page { max-width: 1040px; }
.billing-toggle {
    width: fit-content;
    display: grid;
    grid-template-columns: repeat(2, minmax(112px, 1fr));
    gap: 4px;
    margin: 0 auto 30px;
    padding: 4px;
    background: var(--disabled);
    border: 1px solid var(--border-gold);
    border-radius: 999px;
}
.billing-toggle button {
    min-height: 44px;
    padding: 9px 22px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--text-secondary);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}
.billing-toggle button.is-active {
    background: var(--card);
    color: var(--text);
    box-shadow: var(--shadow-sm);
}
.plan-comparison-grid { align-items: stretch; gap: 28px; }
.comparison-card { position: relative; display: flex; flex-direction: column; padding: 32px; }
.comparison-card.plan-card-featured {
    border: 2px solid var(--primary);
    background: linear-gradient(180deg, var(--primary-light), var(--card) 150px);
    box-shadow: 0 14px 36px rgba(46,47,50,.13);
    transform: translateY(-6px);
}
.recommended-badge {
    position: absolute;
    top: 16px;
    right: 18px;
    padding: 5px 10px;
    border-radius: 999px;
    background: var(--primary);
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
}
.feature-list { display: grid; gap: 0; margin: 22px 0 26px; }
.feature-list p {
    display: grid;
    grid-template-columns: 24px 1fr;
    gap: 10px;
    align-items: start;
    min-height: 50px;
    padding: 13px 0;
    border-bottom: 1px solid var(--border-light);
    color: var(--text-secondary);
}
.feature-mark { display: inline-grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; font-weight: 900; }
.feature-mark.yes { background: var(--success-bg); color: var(--success); }
.feature-mark.no { background: var(--disabled); color: var(--text-muted); }
.current-plan-note {
    min-height: 48px;
    margin-top: auto;
    display: grid;
    place-items: center;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    font-weight: 700;
}
.choose-pro-button { width: 100%; margin-top: auto; }
.comparison-footnote { margin: 24px auto 0; text-align: center; }
.pro-purchase-section {
    margin: 34px 0 42px;
    padding: 32px;
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-lg);
    background: var(--primary-light);
}
.purchase-step { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 30px; font-size: 14px; }
.purchase-step span { color: var(--text-secondary); font-weight: 700; }
.selected-plan-price { margin: 8px 0 30px; font-size: 16px; }
.selected-plan-price strong { color: var(--text); }
.pro-purchase-form { display: grid; gap: 14px; }
.pro-purchase-form label { margin-top: 4px; font-size: 16px; font-weight: 700; }
.pro-purchase-form input {
    width: 100%;
    min-height: 52px;
    padding: 11px 13px;
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-sm);
    background: var(--card);
    color: var(--text);
    font: inherit;
}
.purchase-help { margin: -3px 0 10px; }
.purchase-total {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin: 8px 0 10px;
    padding: 18px;
    border-radius: var(--radius-sm);
    background: var(--card);
}
.purchase-total strong { font-size: 18px; }
.renewal-locked { margin: 30px 0; padding: 20px; border-radius: var(--radius); background: var(--primary-light); }
.pro-status-message {
    margin: 0 0 24px;
    padding: 15px 17px;
    border: 1px solid rgba(46,125,79,.42);
    border-radius: var(--radius);
    background: var(--success-bg);
    color: var(--success);
    font-weight: 700;
}
.test-only-panel {
    margin: 36px 0;
    padding: 20px;
    border: 1px dashed var(--border-gold);
    border-radius: var(--radius);
    background: var(--warning-bg);
}
.test-only-panel p { margin: 7px 0 14px; }

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width: 1024px) {
    .wood-banner { display: none; }
    .content-split { margin-left: 0; width: 100%; padding: 40px 48px; }
    .mobile-logo { display: block; }
}
@media (max-width: 900px) {
    .two-col-grid { grid-template-columns: 1fr; }
    .setup-card {max-width: 85%; }
}
@media (max-width: 768px) {
    .form-row { grid-template-columns: 1fr; }
    .audience-branches,
    .audience-fields { grid-template-columns: 1fr; }
    .audience-field-wide { grid-column: auto; }
    .audience-segment { padding: 18px; }
    .card { padding: 28px 24px; }
    .modal { padding: 28px 24px; }
    .button-group { flex-direction: column; }
    .page-header { padding: 24px; }
    .layout-page { padding: 32px; }
    .content-split { padding: 32px; }
    .plan-grid { grid-template-columns: 1fr; }
    .comparison-card.plan-card-featured { transform: none; }
    h1 { font-size: 22px; }
}
@media (max-width: 480px) {
    .card { padding: 24px 20px; border-radius: var(--radius); }
    .layout-center { padding: 20px; }
    .content-split { padding: 24px 20px; }
    .layout-page { padding: 20px; }
    .overlay { padding: 20px; align-items: flex-start; overflow-y: auto; }
    .modal { padding: 24px 20px; max-height: none; }
    .toast { right: 20px; bottom: max(20px, env(safe-area-inset-bottom)); }
    .site-header { padding: 10px 20px; }
    .plans-page { width: calc(100% - 40px); padding: 32px 0 48px; }
    .plan-card { padding: 24px 20px; }
    .billing-toggle { width: 100%; }
    .billing-toggle button { padding-inline: 12px; }
    .pro-purchase-section { margin: 28px 0 36px; padding: 24px 20px; }
    .purchase-step { align-items: flex-start; flex-direction: column; margin-bottom: 24px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}
/* Phase 9 wallet */
.wallet-body { background: var(--bg, #FAF8EF); color: var(--text, #29292C); min-height: 100vh; }
.wallet-header { min-height: 64px; padding: 10px 22px; background: #242426; color: #FFFDF6; display: flex; align-items: center; gap: 12px; font-weight: 700; }
.wallet-header img { width: 42px; height: 42px; object-fit: contain; }
.wallet-shell { width: min(100% - 40px, 720px); margin: 24px auto 48px; }
.wallet-balance-card, .wallet-card { background: #FFFDF6; border: 1px solid #C8AA78; border-radius: 16px; padding: 22px; box-shadow: 0 5px 18px rgba(36,36,38,.06); }
.wallet-balance-card p, .wallet-balance-card h1 { margin: 0; }
.wallet-balance-card h1 { margin-top: 8px; font-size: clamp(28px, 8vw, 42px); }
.wallet-balance-card span, .wallet-balance-card small { display: block; margin-top: 6px; color: #77736C; }
.wallet-actions { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 16px 0; }
.wallet-action { min-height: 46px; padding: 12px 16px; border: 1px solid #B9955A; border-radius: 10px; color: #29292C; text-decoration: none; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.wallet-action.primary { background: #B9955A; }
.wallet-card h1, .wallet-card h2 { margin-top: 10px; }
.wallet-card label { display: block; margin: 16px 0 6px; font-weight: 700; }
.wallet-card input, .wallet-card select { width: 100%; min-height: 48px; padding: 10px 12px; background: #FAF8EF; border: 1px solid #C8AA78; border-radius: 9px; }
.wallet-card input:focus, .wallet-card select:focus, .wallet-action:focus { outline: 3px solid rgba(185,149,90,.35); outline-offset: 2px; }
.wallet-bank-picker { position: relative; }
.wallet-bank-results { position: absolute; z-index: 30; left: 0; right: 0; max-height: 260px; overflow-y: auto; background: #FFF; border: 1px solid #C8AA78; border-radius: 9px; box-shadow: 0 10px 24px rgba(0,0,0,.14); }
.wallet-bank-option { display: block; width: 100%; min-height: 44px; padding: 10px 12px; border: 0; border-bottom: 1px solid #EEEAE1; background: #FFF; color: #29292C; text-align: left; cursor: pointer; }
.wallet-bank-option:hover, .wallet-bank-option:focus { background: #F4EAD8; outline: 2px solid #B9955A; outline-offset: -2px; }
.wallet-bank-empty { margin: 0; padding: 12px; color: #77736C; }
.wallet-account-status { margin: 8px 0 0; padding: 10px 12px; border-radius: 9px; font-size: 14px; }
.wallet-account-status[data-state="loading"] { background: #F3F4F6; color: #555; }
.wallet-account-status[data-state="success"] { background: #DCFCE7; color: #166534; }
.wallet-account-status[data-state="error"] { background: #FEF2F2; color: #991B1B; }
.wallet-note { color: #77736C; font-size: 14px; text-align: center; }
.history-filter { display: grid; grid-template-columns: 1fr; gap: 8px; margin-bottom: 20px; }
.history-filter button { min-height: 44px; border: 0; border-radius: 9px; background: #B9955A; font-weight: 700; }
.history-month { margin: 24px 0 8px; font-size: 16px; }
.history-item { min-height: 66px; padding: 12px 0; border-bottom: 1px solid #EEEAE1; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.history-item small, .history-item span small { display: block; margin-top: 4px; color: var(--text-secondary); font-size: 14px; }
.history-item span { text-align: right; font-weight: 700; }
.history-item .credit { color: #2E7D4F; }
.history-item .debit { color: #C62828; }
.history-pages { display: flex; justify-content: space-between; margin-top: 20px; }
@media (min-width: 768px) { .wallet-shell { margin-top: 36px; } .wallet-actions { grid-template-columns: repeat(3, 1fr); } .history-filter { grid-template-columns: 1fr auto; align-items: end; } .history-filter label { grid-column: 1 / -1; } }
.combobox { position: relative; }
.combobox-list { position:absolute; z-index:30; top:calc(100% + 4px); left:0; right:0; max-height:min(240px,50vh); overflow-y:auto; overscroll-behavior:contain; touch-action:pan-y; -webkit-overflow-scrolling:touch; background:#fff; border:1px solid #d5d5d5; border-radius:8px; box-shadow:0 10px 24px rgba(0,0,0,.14); }
.combobox-option { display:block; width:100%; padding:11px 12px; border:0; background:#fff; color:#29292c; text-align:left; cursor:pointer; }
.combobox-option:hover,.combobox-option[aria-selected="true"] { background:#f4ead8; }
.field-error { display:block; color:#b42318; margin-top:6px; }
.field-error[hidden], [hidden] { display:none !important; }
.consent-label { display:flex; align-items:flex-start; gap:8px; }
.consent-label input { width:18px; flex:0 0 18px; margin-top:2px; }
/* ==========================================================
   GUIDED GOOGLE SHEET SETUP — STRUCTURE
   ========================================================== */
.setup-page-body { background:var(--page); }
.setup-page { width:min(100%, 960px); padding-top:28px; padding-bottom:max(72px, calc(44px + env(safe-area-inset-bottom))); }
.setup-logo { margin-bottom:28px; }
.setup-intro { max-width:760px; margin:0 auto 36px; text-align:center; }
.setup-intro h1 { margin:7px 0 10px; font-size:clamp(26px,4vw,34px); line-height:1.2; }
.setup-intro > p { max-width:610px; margin:0 auto; font-size:15px; }
.setup-eyebrow,.setup-kicker { display:block; color:#765A2B; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.setup-eyebrow { font-size:12px; }
.setup-progress { max-width:560px; margin:25px auto 0; padding:16px 18px; border:1px solid var(--primary-border); border-radius:var(--radius); background:var(--card); box-shadow:var(--shadow-sm); text-align:left; }
.setup-progress-label { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:10px; font-size:16px; }
.setup-progress-label strong { color:var(--text); }
.setup-progress-label span { color:var(--text-secondary); text-align:right; }
.setup-progress-track { height:7px; overflow:hidden; border-radius:999px; background:var(--disabled); }
.setup-progress-track > span { display:block; width:0; height:100%; border-radius:inherit; background:var(--primary); transition:width var(--ease); }
.setup-checklist { display:flex; align-items:center; justify-content:center; flex-direction:column; gap:24px; margin:0 auto 30px; }
.setup-card {
    position:relative; overflow:hidden; padding:32px 48px 48px; background:var(--card); width:100%;
    border:1px solid var(--primary-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm);
    transition:border-color var(--ease), box-shadow var(--ease), transform var(--ease), background var(--ease);
}

/* Setup-card states */
.setup-card.is-active { border-color:var(--primary); box-shadow:0 10px 28px rgba(46,47,50,.09); }
.setup-card.is-locked { border-color:#D8D3C9; background:#F1EEE6; box-shadow:none; }
.setup-card.is-locked .setup-card-body,.setup-card.is-locked .setup-card-identity { opacity:.68; }
.setup-card.is-complete { border-color:rgba(46,125,79,.45); background:linear-gradient(100deg, rgba(71,135,71,.07), var(--card) 42%); }
.setup-card-head { display:flex; justify-content:space-between; gap:22px; align-items:center; padding-bottom:19px; margin-bottom:24px; border-bottom:1px solid var(--border-light); }
.setup-card-identity { display:flex; min-width:0; align-items:center; gap:15px; }
.setup-card-state { display:flex; flex:0 0 auto; align-items:center; gap:9px; }
.setup-status { display:inline-flex; align-items:center; min-height:28px; padding:5px 10px; border:0; border-radius:999px; background:var(--primary-light); color:#725727; font:inherit; font-weight:800; letter-spacing:.02em; }
.setup-status:disabled { background:var(--primary-light); color:#725727; cursor:default; }
.is-locked .setup-status:disabled { background:#E1DCD2; color:#625E58; }
.is-complete .setup-status { background:var(--success-bg); color:var(--success); cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.is-complete .setup-status:hover { background:#DDEEDC; }
.setup-number { display:grid; flex:0 0 42px; width:42px; height:42px; place-items:center; border:1px solid var(--primary-border); border-radius:50%; background:var(--primary-light); color:#725727; font-weight:800; }
.is-complete .setup-number { border-color:rgba(46,125,79,.45); background:var(--success-bg); color:var(--success); }
.setup-card h2 { margin:2px 0 0; line-height:1.3; }
.setup-card-body { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr); grid-template-areas:"instructions visual" "controls visual" "action visual"; align-items:start; column-gap:42px; row-gap:18px; }
.setup-instructions { grid-area:instructions; min-width:0; }
.setup-instructions > p:not(.setup-note) { line-height:1.6; }
.setup-controls { grid-area:controls; min-width:0; }
.setup-card-action { grid-area:action; align-self:end; }
.setup-chip { display:inline-block; margin:2px 1px; padding:3px 8px; border:1px solid var(--primary-border); border-radius:999px; background:var(--primary-light); color:#664D24; font-weight:800; white-space:nowrap; }
.setup-note { display:flex; gap:9px; width:100%; margin-top:15px; padding:11px 12px; border-radius:var(--radius-sm); background:var(--primary-light); color:var(--text-secondary); line-height:1.5; }
.setup-note > span { display:grid; flex:0 0 20px; width:20px; height:20px; place-items:center; border:1px solid var(--primary-border); border-radius:50%; color:#725727; font-weight:800; }
.setup-done { width:auto !important; min-width:190px; max-width:100%; }
.is-complete .setup-done:disabled { background:var(--success-bg); color:var(--success); border:1px solid rgba(46,125,79,.3); }
.setup-media { grid-area:visual; display:flex; width:100%; aspect-ratio:16/10; min-height:210px; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:20px; border:1px solid #DED8CC; border-radius:var(--radius); background:#F3F0E8; box-shadow:inset 0 0 0 1px rgba(255,255,255,.7); color:var(--text-secondary); text-align:center; }
.setup-media img { display:block; width:100%; height:100%; object-fit:contain; }
.setup-media-icon { display:grid; width:42px; height:42px; margin-bottom:3px; place-items:center; border:1px solid var(--primary-border); border-radius:12px; background:var(--card); color:#725727; font-size:22px; box-shadow:var(--shadow-sm); }
.setup-media strong { color:var(--text); }
.setup-card.is-complete .setup-media { display:none; }
.setup-card.is-complete .setup-card-body { grid-template-columns:1fr; grid-template-areas:"instructions" "controls" "action"; row-gap:14px; }
.setup-field { width:100%; margin:2px 0 6px; }
.setup-field label { display:block; margin-bottom:7px; }
.setup-field input { min-height:50px; background:#FFFEFA; }
.setup-success,.setup-controls .field-error { width:100%; margin:8px 0 0; padding:11px 12px; border-radius:var(--radius-sm); }
.setup-success { background:var(--success-bg); color:var(--success); }
.setup-controls .field-error { background:var(--error-bg); }
.copy-field { display:flex; width:100%; min-height:76px; justify-content:space-between; flex-direction:column; gap:16px; padding:13px 13px 13px 15px; border:1px solid var(--primary-border); border-radius:var(--radius); background:var(--primary-light); color:inherit; text-align:left; cursor:pointer; transition:background var(--ease), border-color var(--ease); }
.copy-field:hover { border-color:var(--primary); background:var(--primary-light); }
.copy-addresses { display:grid; min-width:0; gap:5px; color:var(--text); line-height:1.5; }
.copy-addresses > span { min-width:0; overflow-wrap:anywhere; }
.copy-action { display:inline-flex; flex:0 0 auto; min-height:42px; align-items:center; gap:6px; padding:8px 11px; border-radius:var(--radius-sm); background:var(--primary); color:var(--text); white-space:nowrap; width:fit-content; }
.copy-field:focus-visible,.setup-card button:focus-visible,.setup-card input:focus-visible { outline:3px solid rgba(185,149,90,.55); outline-offset:3px; }
.setup-actions { display:grid; grid-template-columns:minmax(120px,.35fr) minmax(180px,.65fr); gap:12px; padding:18px; border-radius:var(--radius-lg); background:var(--card); box-shadow:var(--shadow-sm); }
.setup-actions .btn { width:100%; min-height:48px; }
.setup-help { margin-top:11px; color:var(--text-secondary); font-size:12px; text-align:center; }

/* Setup-card typography mapping. Change size values only in the media sections below. */
.setup-card h2 {
    font-size:var(--setup-title-font-size);
}
.setup-instructions > p:not(.setup-note),
.setup-number,
.setup-media strong,
.setup-field label,
.setup-field input,
.copy-addresses,
.copy-action,
.setup-card .setup-done {
    font-size:var(--setup-body-font-size);
}
.setup-kicker,
.setup-status,
.setup-note,
.setup-success,
.setup-controls .field-error {
    font-size:var(--setup-small-font-size);
}

@media (prefers-reduced-motion:reduce) { .setup-card,.setup-progress-track > span { transition:none; } }

/* Setup-card desktop typography: edit these three values for desktop. */
@media (min-width:701px) {
    .setup-card {
        --setup-title-font-size:16px;
        --setup-body-font-size:16px;
        --setup-small-font-size:14px;
    }
}

/* Setup-card mobile layout and typography: edit these three values for mobile. */
@media (max-width:768px) {
    .setup-card {
        --setup-title-font-size:19px;
        --setup-body-font-size:16px;
        --setup-small-font-size:14px;
        padding:19px 18px 21px;
    }
    .setup-page { padding:22px 20px max(68px, calc(40px + env(safe-area-inset-bottom))); }
    .setup-logo { margin-bottom:22px; }
    .setup-intro { margin-bottom:28px; text-align:left; }
    .setup-intro > p { margin:0; }
    .setup-progress { margin-top:20px; }
    .setup-progress-label { align-items:flex-start; flex-direction:column; gap:2px; }
    .setup-progress-label span { text-align:left; }
    .setup-checklist { gap:24px; }
    .setup-card-head {
        display: grid !important;
        grid-template-columns: 38px minmax(0, 1fr);
        grid-template-areas:
            "number title"
            ".      status";
        align-items: start;
        column-gap: 11px;
        row-gap: 10px;
    }

    .setup-card-identity {
        display: contents;
    }

    .setup-card-identity .setup-number {
        grid-area: number;
    }

    .setup-card-identity > div {
        grid-area: title;
        min-width: 0;
    }

    .setup-card-state {
        grid-area: status;
        width: auto;
        margin: 0;
        justify-self: start;
    }
    .setup-card-body { grid-template-columns:1fr; grid-template-areas:"instructions" "visual" "controls" "action"; gap:17px; }
    .setup-number { flex-basis:38px; width:38px; height:38px; }
    .setup-instructions > p:not(.setup-note) { line-height:1.55; }
    .setup-media { min-height:0; aspect-ratio:16/9; }
    .setup-done { width:100% !important; }
    .copy-field { align-items:stretch; flex-direction:column; }
    .copy-action { align-self:flex-start; }
    .setup-actions { grid-template-columns:1fr; }
    .setup-actions .btn-primary { order:-1; }
}
@media (max-width:360px) {
    .setup-page { padding-inline:16px; }
    .setup-card { padding-inline:16px; }
    .setup-status { padding-inline:8px; }
    .setup-chip { white-space:normal; }
}

/* Free-offer reward celebration */
.reward-page-body {
    min-height:100vh;
    margin:0;
    background:
        radial-gradient(circle at 15% 18%, rgba(185,149,90,.18), transparent 27%),
        radial-gradient(circle at 87% 76%, rgba(185,149,90,.13), transparent 24%),
        var(--background);
}
.reward-page {
    width:min(100%,820px);
    margin:0 auto;
    padding:30px 24px max(64px, calc(44px + env(safe-area-inset-bottom)));
}
.reward-logo { margin-bottom:26px; text-align:center; }
.reward-card {
    position:relative;
    overflow:hidden;
    padding:48px 54px 44px;
    border:1px solid var(--primary-border);
    border-radius:24px;
    background:linear-gradient(145deg, #FFFDF6 0%, #FFF8E8 62%, #F4E4BF 100%);
    box-shadow:0 22px 55px rgba(83,63,28,.14);
    text-align:center;
}
.reward-card::before {
    content:"";
    position:absolute;
    top:0;
    left:12%;
    width:76%;
    height:5px;
    border-radius:0 0 999px 999px;
    background:linear-gradient(90deg, transparent, var(--primary), transparent);
}
.reward-sparkle {
    position:absolute;
    color:var(--primary);
    font-size:28px;
    opacity:.7;
}
.reward-sparkle-one { top:52px; left:12%; transform:rotate(-12deg); }
.reward-sparkle-two { top:105px; right:11%; font-size:20px; transform:rotate(18deg); }
.reward-icon {
    display:grid;
    width:82px;
    height:82px;
    margin:0 auto 18px;
    place-items:center;
    border:1px solid var(--primary-border);
    border-radius:50%;
    background:#FFFDF6;
    box-shadow:0 10px 24px rgba(83,63,28,.12);
    font-size:42px;
}
.reward-kicker {
    margin:0 0 6px;
    color:#765A2B;
    font-size:13px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.reward-card h1 {
    margin:0 0 12px;
    color:var(--text);
    font-size:clamp(34px,6vw,52px);
    line-height:1.08;
}
.reward-lead {
    max-width:590px;
    margin:0 auto 28px;
    color:var(--text-secondary);
    font-size:20px;
    line-height:1.55;
}
.reward-lead strong { color:var(--text); }
.reward-highlight {
    display:flex;
    max-width:520px;
    margin:0 auto 26px;
    align-items:center;
    justify-content:center;
    gap:18px;
    padding:20px 24px;
    border:1px solid var(--primary-border);
    border-radius:18px;
    background:rgba(255,253,246,.82);
    box-shadow:var(--shadow-sm);
    text-align:left;
}
.reward-number {
    color:#765A2B;
    font-size:58px;
    font-weight:900;
    line-height:1;
}
.reward-highlight div { display:grid; gap:3px; }
.reward-highlight strong { font-size:22px; }
.reward-highlight span:not(.reward-number) { color:var(--text-secondary); font-size:15px; }
.reward-benefits {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin:0 0 24px;
    text-align:left;
}
.reward-benefits > div {
    display:grid;
    grid-template-columns:24px 1fr;
    gap:4px 8px;
    padding:16px;
    border:1px solid rgba(200,170,120,.72);
    border-radius:12px;
    background:rgba(255,253,246,.66);
}
.reward-benefits > div > span {
    grid-row:1 / 3;
    color:var(--success);
    font-size:20px;
    font-weight:900;
}
.reward-benefits strong { font-size:15px; }
.reward-benefits small { color:var(--text-secondary); font-size:12px; line-height:1.4; }
.reward-note {
    margin:0 auto 18px;
    color:var(--text-secondary);
    font-size:13px;
}
.reward-error {
    margin:0 0 16px;
    padding:12px;
    border-radius:var(--radius-sm);
    background:var(--error-bg);
    text-align:left;
}
.reward-actions {
    display:grid;
    grid-template-columns:minmax(170px,.42fr) minmax(240px,.58fr);
    gap:12px;
}
.reward-actions button { width:100%; min-height:52px; }

@media (max-width:700px) {
    .optional-section-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .reward-page { padding:22px 18px max(52px, calc(36px + env(safe-area-inset-bottom))); }
    .reward-logo { margin-bottom:20px; }
    .reward-card { padding:36px 20px 24px; border-radius:18px; }
    .reward-sparkle-one { top:35px; left:7%; }
    .reward-sparkle-two { top:92px; right:6%; }
    .reward-icon { width:70px; height:70px; font-size:36px; }
    .reward-lead { font-size:17px; }
    .reward-highlight { gap:14px; padding:17px 18px; }
    .reward-number { font-size:50px; }
    .reward-highlight strong { font-size:18px; }
    .reward-benefits { grid-template-columns:1fr; }
    .reward-actions { grid-template-columns:1fr; }
    .reward-actions .sh-btn { order:-1; }
}

/* Reactivation and Golden Egg mobile settings */
@media (max-width: 700px) {
    .reactivation-page {
        padding: 22px 14px 44px;
    }

    .reactivation-card {
        gap: 18px;
        padding: 24px 18px;
    }

    .reactivation-heading {
        flex-direction: column;
        gap: 12px;
    }

    .reactivation-heading h1 {
        font-size: 25px;
    }

    .deal-badge {
        align-self: flex-start;
    }

    .reactivation-row {
        align-items: flex-start;
        padding: 14px;
    }

    .price-pair,
    .total-price-pair {
        flex-direction: column;
        align-items: flex-end;
        gap: 3px;
    }

    .reactivation-total {
        font-size: 28px;
    }

    .golden-egg-option {
        padding: 16px;
    }

    .golden-egg-benefits ul {
        font-size: 14px;
    }
}
.sh-btn.is-loading { display:flex; align-items:center; justify-content:center; gap:10px; cursor:wait; }
.sh-btn.is-loading::after { content:""; width:16px; height:16px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:registration-spin .7s linear infinite; }
@keyframes registration-spin { to { transform:rotate(360deg); } }

/* ==========================================================
   ADMIN CONSOLE
   Reuses the SurveyHustler cream, charcoal, and gold system.
   ========================================================== */
.admin-dashboard {
    background:
        radial-gradient(circle at 100% 0, rgba(185, 149, 90, 0.10), transparent 30rem),
        var(--page);
}

.admin-topbar {
    position: sticky;
    z-index: 50;
    top: 0;
    display: flex;
    min-height: 76px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 12px clamp(18px, 4vw, 48px);
    border-bottom: 1px solid rgba(200, 170, 120, 0.55);
    background: rgba(36, 36, 38, 0.98);
    box-shadow: 0 8px 30px rgba(36, 36, 38, 0.13);
}

.admin-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--card);
    text-decoration: none;
}

.admin-brand img {
    width: 46px;
    height: 46px;
    object-fit: contain;
}

.admin-brand span { display: grid; line-height: 1.15; }
.admin-brand strong { font-size: 17px; }
.admin-brand small {
    margin-top: 4px;
    color: var(--primary-border);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admin-session-badge {
    padding: 8px 12px;
    border: 1px solid rgba(200, 170, 120, 0.65);
    border-radius: 999px;
    color: var(--disabled);
    font-size: 12px;
    font-weight: 700;
}

.admin-shell {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    width: min(1500px, 100%);
    min-height: calc(100vh - 76px);
    margin: 0 auto;
}

.admin-sidebar {
    padding: 32px 20px;
    border-right: 1px solid rgba(200, 170, 120, 0.55);
    background: rgba(255, 253, 246, 0.72);
}

.admin-nav-label,
.admin-eyebrow {
    margin: 0 0 10px;
    color: #765A2B;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.admin-nav {
    position: sticky;
    top: 108px;
    display: grid;
    gap: 5px;
}

.admin-nav a {
    display: flex;
    min-height: 42px;
    align-items: center;
    padding: 9px 12px;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 650;
    text-decoration: none;
    transition: background var(--ease), color var(--ease), transform var(--ease);
}

.admin-nav a:hover,
.admin-nav a:focus-visible,
.admin-nav a.is-active {
    background: var(--primary-light);
    color: var(--text);
    transform: translateX(2px);
}

.admin-nav a.is-active {
    box-shadow: inset 3px 0 0 var(--primary);
}

.admin-main {
    min-width: 0;
    padding: clamp(24px, 4vw, 48px);
}

.admin-page-header {
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(200, 170, 120, 0.72);
}

.admin-page-header h1 {
    font-size: clamp(26px, 4vw, 38px);
    line-height: 1.15;
}

.admin-content { min-width: 0; }
.admin-content > h2 {
    margin: 32px 0 14px;
    font-size: 20px;
}
.admin-content > h2:first-child { margin-top: 0; }
.admin-content > hr { display: none; }

.admin-content > section,
.admin-content > form,
.admin-content > p:not(.admin-eyebrow) {
    margin-bottom: 14px;
    padding: 18px 20px;
    border: 1px solid rgba(200, 170, 120, 0.75);
    border-radius: var(--radius);
    background: var(--card);
    box-shadow: var(--shadow-sm);
}

.admin-content > section h3 { margin-bottom: 7px; }
.admin-content > section p + p { margin-top: 7px; }
.admin-content > p { overflow-wrap: anywhere; }
.admin-preserve-copy { white-space: pre-wrap; }

.admin-content > ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
    list-style: none;
}

.admin-content > ul li {
    min-width: 0;
    border: 1px solid rgba(200, 170, 120, 0.75);
    border-radius: var(--radius);
    background: var(--card);
    box-shadow: var(--shadow-sm);
}

.admin-content > ul li a {
    display: block;
    min-height: 74px;
    padding: 19px 20px;
    color: var(--text);
    font-weight: 700;
    text-decoration: none;
}

.admin-content > ul li:hover {
    border-color: var(--primary);
    box-shadow: var(--shadow);
}

.admin-content form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.admin-content form > input:not([type="hidden"]),
.admin-content form > select {
    width: min(100%, 320px);
    flex: 1 1 210px;
}

.admin-content form > button,
.admin-content form > .btn {
    width: auto;
    min-height: 48px;
}

.admin-content form > button:not(.btn) {
    padding: 12px 22px;
    border: 0;
    border-radius: var(--radius-sm);
    background: var(--primary);
    color: var(--text);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.admin-action-form {
    margin-top: 16px;
    padding: 14px;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    background: var(--page);
}

.admin-confirm {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    margin: 0;
    cursor: pointer;
}

.admin-confirm input[type="checkbox"] {
    width: 18px;
    min-height: 18px;
    margin: 0;
    accent-color: var(--primary);
}

.admin-table-wrap {
    width: 100%;
    margin: 0 0 20px;
    overflow-x: auto;
    border: 1px solid rgba(200, 170, 120, 0.75);
    border-radius: var(--radius);
    background: var(--card);
    box-shadow: var(--shadow-sm);
}

.admin-content table {
    width: 100%;
    min-width: 680px;
    border-collapse: collapse;
    background: var(--card);
    font-size: 13px;
}

.admin-content th,
.admin-content td {
    padding: 13px 15px;
    border-bottom: 1px solid var(--border-light);
    text-align: left;
    vertical-align: top;
    overflow-wrap: anywhere;
}

.admin-content th {
    background: var(--nav);
    color: var(--card);
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.admin-content tbody tr:last-child td { border-bottom: 0; }
.admin-content tbody tr:hover td { background: var(--primary-light); }

.admin-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--border-light);
}

.admin-pagination span { color: var(--text-secondary); font-size: 13px; }
.admin-pagination .btn { padding: 9px 16px; }

.admin-login-page {
    background:
        linear-gradient(rgba(36, 36, 38, 0.63), rgba(36, 36, 38, 0.63)),
        url('/static/wood%20bg.jpg') center / cover fixed;
}

.admin-login-card { padding-top: 32px; }
.admin-login-logo {
    display: block;
    width: 84px;
    height: 84px;
    margin: 0 auto 18px;
    object-fit: contain;
}
.admin-login-card h1 { margin-bottom: 8px; }
.admin-login-card form { margin: 24px 0 14px; }

@media (max-width: 900px) {
    .admin-shell { grid-template-columns: 1fr; }
    .admin-sidebar {
        padding: 14px 18px;
        border-right: 0;
        border-bottom: 1px solid rgba(200, 170, 120, 0.55);
    }
    .admin-nav-label { display: none; }
    .admin-nav {
        position: static;
        display: flex;
        gap: 7px;
        overflow-x: auto;
        padding-bottom: 4px;
        scrollbar-width: thin;
    }
    .admin-nav a {
        flex: 0 0 auto;
        min-height: 38px;
        padding: 8px 11px;
        border: 1px solid var(--border-light);
        background: var(--card);
        font-size: 13px;
    }
    .admin-nav a:hover { transform: none; }
    .admin-nav a.is-active {
        border-color: var(--primary);
        box-shadow: inset 0 -3px 0 var(--primary);
        transform: none;
    }
    .admin-main { padding: 26px 20px 48px; }
}

@media (max-width: 620px) {
    .admin-topbar { min-height: 66px; padding: 10px 16px; }
    .admin-brand img { width: 40px; height: 40px; }
    .admin-brand strong { font-size: 15px; }
    .admin-session-badge { display: none; }
    .admin-shell { min-height: calc(100vh - 66px); }
    .admin-content > ul { grid-template-columns: 1fr; }
    .admin-content > section,
    .admin-content > form,
    .admin-content > p:not(.admin-eyebrow) { padding: 16px; }
    .admin-content form > input:not([type="hidden"]),
    .admin-content form > select,
    .admin-content form > button,
    .admin-content form > .btn { width: 100%; flex-basis: 100%; }
    .admin-confirm { width: 100%; }
    .admin-page-header h1 { font-size: 28px; }
}
/* Admin console: scoped foundations reuse the public SurveyHustler palette. */
.console { --c-bg:#FAF8EF; --c-surface:#FFFDF6; --c-ink:#29292C; --c-muted:#68645D; --c-line:#E4DFD2; --c-gold:#B9955A; --c-nav:#242426; --c-green:#23704B; --c-red:#B13838; background:var(--c-bg); color:var(--c-ink); font-size:14px; margin:0; min-height:100vh; }
.console *, .console *::before, .console *::after { box-sizing:border-box; }
.console [hidden] { display:none!important; }
.console h1 { font-size:28px; line-height:1.25; letter-spacing:-.7px; margin:0 0 8px; }
.console h2 { font-size:18px; line-height:1.4; margin:0 0 16px; }
.console h3 { font-size:15px; margin:16px 0 8px; }
.console p { line-height:1.65; margin:8px 0 16px; }
.console a { color:inherit; }
.console button, .console .c-button, .console summary { font:inherit; cursor:pointer; }
.console button, .console .c-button { border:1px solid var(--c-line); border-radius:8px; padding:9px 13px; background:var(--c-surface); color:var(--c-ink); line-height:1.3; text-decoration:none; min-height:38px; }
.console button:hover, .console .c-button:hover { border-color:var(--c-gold); background:#F3EDDE; }
.console .btn-primary { background:var(--c-gold); border-color:var(--c-gold); color:#242426; font-weight:600; }
.console button:disabled { opacity:.5; cursor:not-allowed; }
.console input, .console select, .console textarea { font:inherit; padding:10px 12px; border:1px solid #D5CEBF; border-radius:8px; background:#FFFEFA; color:var(--c-ink); min-width:0; max-width:100%; }
.console textarea { width:100%; min-height:96px; resize:vertical; line-height:1.6; }
.console :focus-visible { outline:3px solid #987239; outline-offset:3px; }
.console .c-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.console .c-skip { position:fixed; top:-60px; left:20px; z-index:100; padding:12px; background:var(--c-surface); }
.console .c-skip:focus { top:12px; }
.c-sidebar { width:222px; position:fixed; inset:0 auto 0 0; background:var(--c-nav); color:#EEEADF; padding:30px 16px 20px; display:flex; flex-direction:column; z-index:30; }
.console .c-brand { text-decoration:none; font-size:21px; font-weight:750; letter-spacing:-.8px; display:block; padding:0 12px 34px; }
.c-brand span { color:#D7B97D; }.c-brand small { display:block; font-size:9px; letter-spacing:2px; margin-top:9px; font-weight:500; color:#BDB8AB; }
.c-sidebar nav { flex:1; display:flex; flex-direction:column; gap:6px; }
.console .c-nav-link { color:#D8D4CB; display:flex; align-items:center; gap:12px; border-radius:8px; padding:12px; text-decoration:none; min-height:46px; }
.console .c-nav-link:hover { background:#343432; }.console .c-nav-link.is-active { background:#3E392F; color:#ECD3A2; box-shadow:inset 3px 0 #C5A366; }
.c-icon { width:19px; height:19px; flex-shrink:0; }.c-settings-link { margin-top:auto; }.c-sidebar-foot { padding:22px 12px 0; font-size:12px; color:#C4BFB2; }.c-sidebar-foot small { display:block; font-size:10px; margin-top:5px; }
.c-app { margin-left:222px; min-width:0; }.c-topbar { min-height:78px; display:flex; align-items:center; gap:22px; padding:16px 24px; border-bottom:1px solid var(--c-line); background:var(--c-surface); position:relative; z-index:20; }
.c-global-search { position:relative; flex:1; max-width:640px; }.c-global-search input { width:100%; background:var(--c-bg); }.c-profile { margin-left:auto; }.c-profile summary { display:flex; align-items:center; gap:9px; }.c-avatar { width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#E8DDC3; color:#624A25; font-weight:650; }.c-avatar-large { width:52px; height:52px; font-size:24px; }
.c-notifications, .c-profile { position:relative; }.c-notifications summary { white-space:nowrap; display:flex; gap:8px; align-items:center; }.console .c-badge { min-width:20px; min-height:20px; border-radius:20px; font-size:11px; padding:2px 6px; color:#fff; background:#AD3737; text-align:center; margin-left:auto; }
.c-popover { position:absolute; top:calc(100% + 14px); right:0; width:340px; max-width:calc(100vw - 32px); max-height:65vh; overflow:auto; padding:12px; background:var(--c-surface); border:1px solid var(--c-line); border-radius:12px; box-shadow:0 12px 40px #24242620; z-index:40; }.c-global-search .c-popover { width:100%; left:0; }.c-popover a,.c-popover>button { display:block; padding:12px; text-decoration:none; width:100%; text-align:left; border:0; }.c-popover small { display:block; color:var(--c-muted); margin-bottom:5px; }.c-popover a:hover { background:#F0EADC; border-radius:8px; }.c-popover p { overflow-wrap:anywhere; }
.c-main { padding:28px 24px; max-width:1700px; margin:auto; }.c-page-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:26px; }.c-page-heading>span { font-size:12px; }.console .c-eyebrow { font-size:10px; line-height:1.4; letter-spacing:1.5px; text-transform:uppercase; color:var(--c-muted); margin:0 0 8px; font-weight:650; }.c-muted { color:var(--c-muted); }.c-page-heading p:last-child { margin-bottom:0; }
.c-card { padding:22px; background:var(--c-surface); border:1px solid var(--c-line); border-radius:12px; box-shadow:0 2px 4px #24242603; min-width:0; }.console a.c-card { text-decoration:none; transition:border-color .15s,box-shadow .15s; }.console a.c-card:hover { border-color:var(--c-gold); box-shadow:0 4px 12px #24242608; }.c-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:24px; }.c-stat { display:flex; flex-direction:column; gap:14px; }.c-stat>span { font-size:13px; font-weight:550; }.c-stat strong { font-size:30px; font-weight:650; line-height:1.1; letter-spacing:-.6px; font-variant-numeric:tabular-nums; }.c-stat small { color:var(--c-muted); font-size:11px; line-height:1.5; }.c-stats small { display:block; color:var(--c-muted); margin-bottom:9px; }.c-three { grid-template-columns:repeat(3,minmax(0,1fr)); padding:20px 0; margin:0; }.c-three strong { font-size:22px; display:block; margin-bottom:5px; font-variant-numeric:tabular-nums; }
.c-toolbar { display:flex; gap:12px; align-items:end; flex-wrap:wrap; margin:24px 0 16px; }.c-toolbar label { display:grid; gap:6px; font-size:12px; }.c-toolbar .c-muted { margin-left:auto; font-size:11px; padding-bottom:10px; }.c-bento { display:grid; grid-template-columns:minmax(0,2fr) minmax(240px,1fr); gap:18px; }.c-financial-stack { display:grid; gap:16px; }.c-chart-card { display:flex; flex-direction:column; }.c-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }.c-section-heading h2 { margin:0; }.c-legend { font-size:10px; display:flex; align-items:center; gap:5px; white-space:nowrap; }.c-dot { display:inline-block; width:7px; height:7px; border-radius:2px; }.c-in { background:var(--c-green); }.c-out { background:#C58360; }#cash-chart { flex:1; }#cash-chart svg { width:100%; min-height:180px; display:block; }#cash-chart text { font-family:inherit; font-size:11px; fill:var(--c-muted); }.c-grid-line { stroke:#E8E4DA; }.c-chart-in { fill:#397C5C; }.c-chart-out { fill:#C58360; }.c-chart-empty { display:grid; place-items:center; min-height:210px; color:var(--c-muted); }.c-chart-data { font-size:11px; margin-top:8px; }.c-chart-totals { display:flex; gap:32px; margin-top:18px; padding-top:16px; border-top:1px solid var(--c-line); color:var(--c-muted); font-size:11px; }.c-chart-totals strong { display:block; color:var(--c-ink); font-size:17px; margin-top:5px; }.console .c-positive { color:var(--c-green); }.console .c-negative,.console .c-error { color:var(--c-red); }.c-notice { padding:12px 14px; background:#F7EDD4; border-left:3px solid #BA9144; border-radius:4px; font-size:12px; line-height:1.6; }.c-attention { margin:28px 0; }.c-attention-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.c-attention-grid h3 { margin:8px 0 16px; }.c-attention-grid small { color:var(--c-muted); }
.c-tabs { display:flex; gap:8px; overflow:auto; border-bottom:1px solid var(--c-line); padding:0 0 12px; margin:0 0 24px; }.console .c-tabs a,.console .c-tabs button { white-space:nowrap; padding:9px 13px; text-decoration:none; border:0; background:transparent; }.console .c-tabs [aria-current],.console .c-tabs [aria-pressed="true"] { background:#EDE3CE; border-radius:8px; color:#654D27; font-weight:600; }
.console .c-tabs a { display:inline-flex; align-items:center; gap:7px; }.c-tab-dot { width:7px; height:7px; flex:0 0 7px; border-radius:50%; background:var(--c-red); box-shadow:0 0 0 2px var(--c-surface); }.c-tab-dot[hidden] { display:none; }
.c-table { border:1px solid var(--c-line); border-radius:12px; background:var(--c-surface); margin-bottom:24px; min-width:0; }.c-table-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:14px; }.c-table-search { display:flex; flex:1; gap:6px; min-width:260px; }.c-table-search input { width:100%; min-width:100px; }.c-table-search select { max-width:145px; }.c-filters,.c-columns { position:relative; }.c-filters summary,.c-columns summary { padding:9px 12px; border:1px solid var(--c-line); border-radius:8px; list-style:none; }.c-filter-panel { position:absolute; top:calc(100% + 8px); right:0; background:var(--c-surface); padding:16px; width:260px; z-index:15; border:1px solid var(--c-line); border-radius:12px; box-shadow:0 10px 30px #24242615; display:grid; gap:10px; max-height:400px; overflow:auto; }.c-filter-panel label { display:grid; gap:5px; font-size:12px; }.c-filter-chips { display:flex; flex-wrap:wrap; gap:6px; padding:0 14px 14px; }.console .c-filter-chips button { padding:5px 10px; min-height:28px; font-size:11px; background:#F0E9DB; border-radius:24px; }.c-table-scroll { overflow:auto; width:100%; }.console table { width:100%; border-collapse:collapse; text-align:left; font-size:12px; margin:0; }.console th { background:#F3EFE4; color:#666155; font-size:11px; font-weight:600; white-space:nowrap; }.console th,.console td { padding:14px 16px; border-bottom:1px solid #EEE9DD; vertical-align:middle; max-width:300px; }.console td { line-height:1.5; overflow-wrap:anywhere; }.console th button { border:0; background:none; padding:0; min-height:22px; font:inherit; color:inherit; }.console tbody tr:hover { background:#FBF6E9; }.console .c-number { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }.console .c-link { padding:0; min-height:24px; border:0; background:none; color:#715523; font-weight:600; text-align:left; text-decoration:underline; text-underline-offset:3px; }.console .c-link:hover { color:#382A14; background:none; }.c-status { display:inline-block; padding:4px 8px; font-size:10px; border-radius:5px; background:#EAF0E7; color:#345943; white-space:nowrap; }.c-status.is-pending { background:#F4E8CA; color:#775918; }.c-status.is-failed { background:#F8E3DE; color:#A02F2F; }.c-ref { max-width:170px; display:inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; }.console .c-copy { padding:4px; min-height:24px; border:0; }.c-table-footer { padding:12px 16px; display:flex; align-items:center; gap:10px; font-size:11px; }.c-table-footer>span { margin-right:auto; }.c-table-footer select { padding:6px; }.c-table-footer button { font-size:11px; min-height:32px; }.c-table-state { text-align:center; padding:48px 24px; color:var(--c-muted); }.c-table[aria-busy="true"] { opacity:.65; }
.console .c-table table { min-width:850px; }
.console .c-table td { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:260px; }
.console #money-summary { margin-bottom:24px; }
.c-review { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr); gap:22px; align-items:start; }.c-review>div>.c-card { margin-bottom:24px; }.c-decision { position:sticky; top:20px; }.c-form { display:grid; gap:16px; margin:18px 0; }.c-form label { display:grid; gap:7px; font-size:12px; font-weight:550; }.console .c-check { display:flex; gap:8px; align-items:center; font-weight:400; }.c-check input { width:16px; height:16px; flex-shrink:0; }.c-details { display:grid; grid-template-columns:minmax(100px,1fr) minmax(0,1.3fr); gap:12px 16px; margin:24px 0; font-size:12px; }.c-details dt { color:var(--c-muted); }.c-details dd { margin:0; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }.c-wrap { overflow-wrap:anywhere; }.c-form-question { border-top:1px solid var(--c-line); padding:16px 0; }.console pre { white-space:pre-wrap; overflow-wrap:anywhere; font-size:11px; max-width:100%; }.console .c-danger-button { color:var(--c-red); }.c-timeline { border-left:2px solid #D9C7A4; padding:6px 16px; margin:16px 0; }.c-timeline small { color:var(--c-muted); font-size:10px; }.c-prewrap { white-space:pre-wrap; }.c-review .c-decision-form button { width:100%; }
.console dialog { background:var(--c-surface); color:var(--c-ink); border:1px solid var(--c-line); border-radius:16px; padding:0; box-shadow:0 24px 80px #19191930; max-height:90dvh; }.console dialog::backdrop { background:#24242680; backdrop-filter:blur(2px); }.c-user-dialog { width:960px; max-width:calc(100vw - 48px); }.c-detail-dialog { width:600px; max-width:calc(100vw - 32px); }.c-dialog-bar { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:14px 24px; background:var(--c-bg); border-bottom:1px solid var(--c-line); position:sticky; top:0; z-index:20; font-size:12px; }.c-dialog-bar>div { display:flex; align-items:center; gap:16px; }.c-dialog-bar h2 { margin:0; }#user-content,#detail-content { padding:24px; }.c-user-header { margin-bottom:24px; }.c-user-actions { display:flex; gap:8px; flex-wrap:wrap; padding:16px 0 10px; }.c-user-action-panel:empty { display:none; }.c-confirm-panel { border:1px solid #D6BA83; padding:20px; border-radius:12px; margin:16px 0; }.c-confirm-panel button { margin-right:8px; }.c-toast { position:fixed; bottom:24px; right:24px; background:var(--c-nav); color:#fff; border-radius:10px; box-shadow:0 8px 30px #0003; padding:16px 22px; z-index:100; max-width:calc(100vw - 48px); }.c-footer { display:flex; justify-content:space-between; padding:12px 24px 24px; font-size:10px; color:var(--c-muted); }.c-mobile { display:none; }
.console-auth { display:grid; place-items:center; padding:32px 16px; }.c-auth-card { width:460px; max-width:100%; background:var(--c-surface); border:1px solid var(--c-line); padding:36px; border-radius:16px; box-shadow:0 6px 25px #24242608; }.c-auth-card .c-brand { padding:0 0 36px; }.c-auth-card .c-brand small { color:var(--c-muted); }.c-auth-card h1 { font-size:25px; }.c-auth-card>small { color:var(--c-muted); font-size:11px; }.c-qr { width:210px; max-width:100%; background:#fff; margin:auto; }.c-recovery { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:20px 0; }.c-recovery code { font-size:12px; }.c-auth-footer { text-align:center; font-size:12px; }
.c-legacy { overflow:auto; }.c-legacy .admin-actions { display:flex; flex-wrap:wrap; gap:12px; }.c-legacy .admin-panel { background:var(--c-surface); padding:20px; border:1px solid var(--c-line); border-radius:12px; margin:16px 0; }
@media(min-width:1500px){.c-main { padding:32px; }.c-stat strong { font-size:36px; }}
@media(max-width:1100px){.c-sidebar { width:190px; }.c-app { margin-left:190px; }.c-sidebar .c-brand { font-size:18px; }.c-main { padding:24px 20px; }.c-stat { padding:18px; }.c-stat strong { font-size:25px; }.c-profile-name { display:none; }.c-table-search { flex-basis:100%; }.c-bento { grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr); }.c-review { grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr); }.c-legend { flex-wrap:wrap; }}
@media(max-width:850px){.c-sidebar { transform:translateX(-100%); width:240px; transition:transform .18s; }.c-sidebar.is-open { transform:translateX(0); box-shadow:0 0 0 100vmax #24242670; }.c-sidebar.is-open .c-nav-close { display:block; margin-bottom:16px; }.c-app { margin-left:0; }.c-mobile { display:block; }.c-nav-close { display:none; }.c-topbar { gap:12px; padding:14px 20px; }.c-notifications summary { font-size:12px; }.c-page-heading>span { display:none; }.c-review { grid-template-columns:1fr; }.c-decision { position:static; }.c-decision-form { background:var(--c-surface); border-top:1px solid var(--c-line); padding-top:16px; }.c-main { padding:24px 16px; }.c-bento { grid-template-columns:1fr 1fr; }.c-chart-card { grid-column:1/-1; }.c-financial-stack { grid-column:1/-1; grid-template-columns:1fr 1fr; }.c-user-dialog { max-width:calc(100vw - 24px); }.c-chart-card .c-section-heading { flex-wrap:wrap; }}

/* Registration questions */
.question-card { max-width:720px; }
.question-kicker { color:#397c5c; font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:12px; margin-bottom:8px; }
.question-progress { margin:28px 0 24px; }
.question-progress-copy { display:flex; justify-content:space-between; gap:16px; font-size:13px; font-weight:700; color:#4e514d; margin-bottom:8px; }
.question-progress-track { height:8px; overflow:hidden; border-radius:999px; background:#e7e8e3; }
.question-progress-track span { display:block; height:100%; width:33%; border-radius:inherit; background:#397c5c; transition:width .2s ease; }
.question-step { border:0; margin:0; padding:0; min-width:0; }
.question-step legend { width:100%; font-size:clamp(21px,4vw,28px); line-height:1.25; font-weight:750; color:#242426; margin-bottom:8px; }
.question-help { color:#696c67; margin:0 0 20px; }
.question-options { display:grid; gap:10px; }
.question-choice { display:block; cursor:pointer; }
.question-choice input { position:absolute; opacity:0; pointer-events:none; }
.question-choice span { display:flex; align-items:center; min-height:52px; padding:13px 16px; border:1px solid #d8d9d3; border-radius:10px; background:#fff; color:#292b29; transition:border-color .15s,box-shadow .15s,background .15s; }
.question-choice span::before { content:""; width:18px; height:18px; flex:0 0 18px; margin-right:12px; border:2px solid #a7aaa3; border-radius:50%; box-sizing:border-box; }
.question-choice input:checked + span { border-color:#397c5c; background:#f2f8f4; box-shadow:0 0 0 2px #397c5c22; }
.question-choice input:checked + span::before { border:5px solid #397c5c; }
.question-choice input:focus-visible + span { outline:3px solid #397c5c55; outline-offset:2px; }
.question-actions { display:flex; justify-content:flex-end; gap:12px; margin-top:26px; }
.question-actions .question-back { padding:11px 18px; border:1px solid #c9cbc5; border-radius:8px; background:#fff; cursor:pointer; }
.question-actions .sh-btn { width:auto; min-width:150px; }
@media(max-width:600px){.registration-questions-page .card { padding:24px 18px; }.question-actions { display:grid; grid-template-columns:1fr; }.question-actions button { width:100% !important; }.question-actions .question-back { order:2; }.question-choice span { min-height:56px; }}

/* Registration insight charts */
.c-insights-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:18px; }
.c-insight-wide { grid-column:1/-1; }
.c-insight-pie-wrap { display:grid; grid-template-columns:minmax(160px,220px) 1fr; align-items:center; gap:24px; }
.c-insight-pie { width:min(100%,220px); aspect-ratio:1; border-radius:50%; margin:auto; position:relative; }
.c-insight-pie::after { content:""; position:absolute; inset:28%; border-radius:50%; background:var(--c-surface,#fff); }
.c-insight-legend,.c-insight-bars { display:grid; gap:12px; }
.c-insight-row { display:grid; grid-template-columns:minmax(140px,1fr) auto; gap:10px; align-items:center; font-size:12px; }
.c-insight-row strong { font-size:12px; }
.c-insight-label { display:flex; align-items:center; gap:8px; min-width:0; }
.c-insight-swatch { width:10px; height:10px; border-radius:3px; flex:0 0 10px; }
.c-insight-bar-row { display:grid; grid-template-columns:minmax(170px,1fr) minmax(120px,2fr) 90px; gap:12px; align-items:center; font-size:12px; }
.c-insight-bar-track { height:12px; border-radius:999px; overflow:hidden; background:#e8e9e4; }
.c-insight-bar-fill { display:block; height:100%; min-width:2px; border-radius:inherit; background:#397c5c; }
.c-insight-empty { min-height:140px; display:grid; place-items:center; color:var(--c-muted); text-align:center; }
@media(max-width:800px){.c-insights-grid { grid-template-columns:1fr; }.c-insight-wide { grid-column:auto; }.c-insight-pie-wrap { grid-template-columns:1fr; }.c-insight-bar-row { grid-template-columns:1fr auto; }.c-insight-bar-track { grid-column:1/-1; grid-row:2; }}
@media(max-width:560px){.c-topbar { padding:12px; flex-wrap:wrap; gap:10px; }.c-global-search { order:4; flex-basis:100%; max-width:none; }.c-notifications { margin-left:auto; }.c-profile { margin-left:0; }.c-stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.c-stat { padding:16px; gap:10px; }.c-stat strong { font-size:25px; }.c-stat>span { font-size:11px; }.c-card { padding:18px; }.c-main h1 { font-size:25px; }.c-toolbar { gap:10px; }.c-toolbar .c-muted { margin:0; flex-basis:100%; }.c-attention-grid { grid-template-columns:1fr; gap:10px; }.c-attention-grid .c-card { padding:14px 16px; }.c-attention-grid h3 { margin:6px 0 8px; }.c-financial-stack { gap:10px; }.c-financial-stack .c-stat strong { font-size:22px; }.c-table-toolbar { padding:10px; }.c-table-search { flex-wrap:wrap; min-width:0; }.c-table-search input { flex-basis:100%; }.c-table-search select { flex:1; max-width:none; }.c-table-footer { flex-wrap:wrap; padding:12px; gap:8px; }.c-table-footer>span { width:100%; }.c-filters .c-filter-panel { left:0; right:auto; }.c-columns .c-filter-panel { right:-80px; }.c-three { grid-template-columns:1fr 1fr; row-gap:20px; }.c-three>div:first-child { grid-column:1/-1; }.console .c-user-dialog { width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; margin:0; border:0; border-radius:0; }.c-dialog-bar { padding:12px 16px; }.c-dialog-bar>span { display:none; }.c-dialog-bar>div { width:100%; justify-content:space-between; }#user-content,#detail-content { padding:18px 14px; }.c-footer { padding:12px 16px 24px; }.c-footer span { display:none; }.c-auth-card { padding:26px 22px; }.c-user-actions>* { flex:1 1 40%; text-align:center; }}
@media(prefers-reduced-motion:reduce){.console *, .console *::before, .console *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }}

/* Public legal documents */
.legal-page { margin:0; color:#2c2923; background:#f5efdf; line-height:1.72; }
.legal-page a { color:#73551d; text-underline-offset:3px; }
.legal-page a:focus-visible,.legal-page button:focus-visible { outline:3px solid #b88935; outline-offset:3px; border-radius:4px; }
.legal-header { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:10px clamp(18px,5vw,72px); background:#292722; border-bottom:4px solid #bd9348; }
.legal-brand { display:flex; align-items:center; gap:12px; color:#fff!important; text-decoration:none; font-weight:700; letter-spacing:.01em; }
.legal-brand img { width:46px; height:46px; object-fit:contain; border-radius:50%; background:#f8f2e3; }
.legal-header nav { display:flex; gap:8px; }
.legal-header nav a { color:#eee6d5; text-decoration:none; padding:9px 13px; border-radius:999px; }
.legal-header nav a[aria-current] { color:#292722; background:#d8b66f; font-weight:700; }
.legal-shell { width:min(1180px,calc(100% - 32px)); margin:38px auto 72px; display:grid; grid-template-columns:220px minmax(0,760px); justify-content:center; gap:42px; align-items:start; }
.legal-toc { position:sticky; top:24px; border-left:3px solid #bd9348; padding:14px 0 14px 20px; font-size:14px; }
.legal-toc strong { display:block; color:#292722; margin-bottom:10px; }
.legal-toc ol { margin:0; padding-left:18px; }
.legal-toc li { margin:6px 0; }
.legal-content { min-width:0; }
.legal-hero { padding:clamp(26px,5vw,50px); color:#fff; background:linear-gradient(135deg,#292722,#493e2e); border-radius:18px; box-shadow:0 14px 40px #3b2d1620; }
.legal-hero h1 { color:#f7f0df; font-size:clamp(34px,6vw,54px); line-height:1.08; margin:2px 0 14px; }
.legal-hero a { color:#f0cf8b; }
.legal-kicker { margin:0; color:#deb96f; text-transform:uppercase; letter-spacing:.14em; font-size:12px; font-weight:800; }
.legal-updated { color:#ded4c1; font-size:13px; }
.legal-notice { margin:18px 0; padding:18px 20px; background:#eadbb9; border-radius:12px; border:1px solid #d4bd8c; }
.legal-card { scroll-margin-top:22px; margin:18px 0; padding:clamp(22px,4vw,34px); background:#fffdf7; border:1px solid #ded3bb; border-radius:14px; box-shadow:0 3px 16px #3b2d1608; }
.legal-card h2 { margin-top:0; color:#332f27; font-size:clamp(21px,3vw,27px); line-height:1.25; }
.legal-card p:last-child,.legal-card ul:last-child { margin-bottom:0; }
.legal-card li { margin:8px 0; }
.legal-actions { text-align:center; padding:26px 10px; }
.legal-actions .sh-btn { display:inline-block; width:auto; margin:5px; text-decoration:none; }
.legal-secondary { display:inline-block; margin:5px; padding:11px 18px; border:1px solid #8a6b32; border-radius:8px; text-decoration:none; font-weight:700; }
.legal-actions p { color:#696253; font-size:12px; }
@media(max-width:820px){.legal-shell { grid-template-columns:1fr; gap:18px; margin-top:20px; }.legal-toc { position:static; border:1px solid #d8c8a5; border-radius:12px; padding:16px 20px; background:#fffaf0; }.legal-toc ol { columns:2; }.legal-header { align-items:flex-start; }.legal-brand span { display:none; }}
@media(max-width:480px){.legal-header { align-items:center; }.legal-header nav a { padding:8px 10px; }.legal-toc ol { columns:1; }.legal-shell { width:min(100% - 20px,760px); }.legal-card { border-radius:10px; }.legal-actions .sh-btn,.legal-secondary { display:block; width:100%; box-sizing:border-box; margin:8px 0; }}
@media print {.legal-page { background:#fff; color:#000; }.legal-header,.legal-toc,.legal-actions { display:none!important; }.legal-shell { display:block; width:100%; margin:0; }.legal-hero { color:#000; background:#fff; box-shadow:none; padding:0 0 20px; border-bottom:2px solid #000; border-radius:0; }.legal-hero h1,.legal-kicker,.legal-updated { color:#000; }.legal-card,.legal-notice { break-inside:avoid; box-shadow:none; border:0; padding:12px 0; margin:0; background:#fff; }}

/* User settings */
.settings-page { margin:0; background:#f5efdf; color:#2c2923; }
.settings-shell { width:min(760px,calc(100% - 28px)); margin:28px auto 70px; }
.settings-head { display:flex; gap:18px; align-items:center; padding:24px; color:#fff; background:linear-gradient(135deg,#292722,#493e2e); border-bottom:4px solid #bd9348; border-radius:16px; }
.settings-head img { width:72px; height:72px; object-fit:contain; background:#fff8e8; border-radius:50%; }.settings-head h1 { margin:2px 0; color:#fff; }.settings-head p:last-child { margin:0;color:#e5dccb; }
.settings-card { margin-top:18px; padding:clamp(20px,5vw,34px); background:#fffdf7; border:1px solid #ded3bb; border-radius:14px; box-shadow:0 3px 16px #3b2d1608; }.settings-card h2 { margin-top:0; }
.toggle-row { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:17px 0; border-top:1px solid #e7dfcf; cursor:pointer; }.toggle-row span { display:grid; gap:3px; }.toggle-row small,.settings-help { color:#6d6658; }.toggle-row input { width:22px; height:22px; accent-color:#8a682a; flex:none; }
.settings-form { display:grid; gap:16px; }.settings-form label { display:grid; gap:7px; font-weight:650; }.settings-form input { width:100%; box-sizing:border-box; }.settings-alert { margin:18px 0 0; padding:14px 18px; border-radius:10px; background:#e5f0e7; border:1px solid #a9c7ae; }.settings-alert[hidden] { display:none; }.settings-danger { border-color:#d5b5a9; }.settings-foot { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; padding:26px; }.settings-foot a { color:#624b23; }
@media(max-width:520px){.settings-head { align-items:flex-start; }.settings-head img { width:52px;height:52px; }.toggle-row { align-items:flex-start; }.settings-card .sh-btn { width:100%; }}
/* Institution catalogue manager */
.c-filter-form,.c-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.8rem;align-items:end}
.c-table-wrap{max-width:100%;overflow-x:auto}
.c-table-wrap table{width:100%;border-collapse:collapse}
.c-table-wrap th,.c-table-wrap td{padding:.8rem;text-align:left;vertical-align:top;border-bottom:1px solid rgba(73,57,39,.16)}
.c-compact-form{display:grid;gap:.5rem;min-width:16rem}
.catalogue-create{grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:28px;align-items:start}
.catalogue-create-fields{display:grid;gap:18px}
.catalogue-create textarea{resize:vertical}
.catalogue-editor{max-width:1080px;margin-inline:auto;display:grid;gap:24px}
.catalogue-editor .c-card{padding:28px}
.catalogue-section-nav{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:24px}
.catalogue-editor section{scroll-margin-top:24px}
.catalogue-details-form{max-width:640px}
.catalogue-field-pair,.catalogue-record-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.catalogue-record{border:1px solid var(--c-line);border-radius:10px;margin:14px 0;background:var(--c-surface);min-width:0}
.catalogue-record summary{padding:16px;cursor:pointer;line-height:1.6;overflow-wrap:anywhere}
.catalogue-record summary small{display:block;color:var(--c-muted);margin-top:4px}
.catalogue-record-body{padding:0 18px 20px}
.catalogue-entry-form{padding:0 18px 18px;max-width:540px}
.catalogue-add{margin-top:20px;border-top:1px solid var(--c-line);padding-top:16px}
.catalogue-add>summary{cursor:pointer;color:var(--c-gold);font-weight:600;padding:8px 0}
.catalogue-edit-link{display:inline-block;padding:8px 14px;border:1px solid var(--c-line);border-radius:8px;text-decoration:none;white-space:nowrap}
.catalogue-editor button,.catalogue-create button{justify-self:start}
.catalogue-editor :focus-visible,.catalogue-edit-link:focus-visible{outline:2px solid var(--c-gold);outline-offset:4px}
[hidden].combobox{display:none!important}
@media(max-width:760px){.catalogue-create,.catalogue-field-pair,.catalogue-record-grid{grid-template-columns:1fr}.catalogue-editor .c-card{padding:18px}.catalogue-entry-form{padding:0 12px 12px}}
.c-pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:1rem}
.c-pagination a{font-weight:700}
.c-legacy details{margin:.5rem 0}
.c-legacy textarea{width:100%;resize:vertical}
@media (max-width:700px){.c-table-wrap table{min-width:58rem}.c-form-grid,.c-filter-form{grid-template-columns:1fr}}
@media print{.c-filter-form,.c-pagination,.c-legacy form,.c-sidebar{display:none!important}.c-table-wrap{overflow:visible}.c-table-wrap table{min-width:0}}