/* App-specific styles beyond the theme */

/* Public landing */
.landing-shell { background:#050506; color:var(--text-1); min-height:100vh; overflow:hidden; scroll-padding-top:84px; }
.landing-header { position:fixed; z-index:20; inset:0 0 auto; height:84px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(22px,5vw,78px); border-bottom:1px solid rgba(255,255,255,.06); background:#050506; box-shadow:0 12px 36px rgba(0,0,0,.28); }
.landing-brand { color:var(--text-1); font-size:18px; font-weight:600; letter-spacing:.24em; text-decoration:none; }
.brand-o { display:inline-grid; place-items:center; color:var(--gold-primary); position:relative; }
.brand-o::after { content:""; position:absolute; width:4px; height:4px; border-radius:50%; background:var(--gold-primary); }
.landing-header nav { display:flex; align-items:center; gap:clamp(16px,3vw,38px); }
.landing-header nav a,.landing-signin { color:var(--text-2); font:400 11px/1 var(--f-mono); letter-spacing:.08em; text-transform:uppercase; text-decoration:none; background:none; border:0; cursor:pointer; }
.landing-header nav a:hover,.landing-signin:hover { color:var(--gold-primary); }
.landing-signin { border:1px solid var(--border-mid); border-radius:999px; padding:11px 16px; }
.landing-hero { position:relative; min-height:100svh; display:grid; align-items:center; padding:128px clamp(22px,8vw,120px) 100px; isolation:isolate; background:radial-gradient(circle at 72% 46%,rgba(201,168,97,.07),transparent 32%),#050506; }
.landing-hero::before,.lifecycle-section::before { content:""; position:absolute; inset:0; z-index:-1; opacity:.22; background-image:radial-gradient(circle,rgba(201,168,97,.42) .65px,transparent .8px); background-size:18px 18px; mask-image:linear-gradient(90deg,transparent,black 45%,black 80%,transparent); }
.hero-scene { position:absolute; z-index:-1; inset:84px 0 0 44%; overflow:hidden; }
.hero-scene canvas { width:100%!important; height:100%!important; opacity:.95; }
.hero-css-orbit { position:absolute; width:min(48vw,580px); aspect-ratio:1; border:1px solid rgba(201,168,97,.18); border-radius:50%; left:18%; top:50%; transform:translateY(-50%); box-shadow:0 0 80px rgba(201,168,97,.05),inset 0 0 70px rgba(201,168,97,.025); animation:heroOrbitBreath 5.5s ease-in-out infinite; will-change:transform,opacity; }
.hero-css-orbit::before,.hero-css-orbit::after { content:""; position:absolute; border:1px solid rgba(201,168,97,.12); border-radius:50%; inset:14%; will-change:transform,opacity; }
.hero-css-orbit::before { border-top-color:rgba(226,197,132,.52); border-right-color:rgba(201,168,97,.03); animation:heroOrbitSpin 13s linear infinite; }
.hero-css-orbit::after { inset:29%; border-color:rgba(201,168,97,.25); border-left-color:rgba(226,197,132,.62); border-bottom-color:rgba(201,168,97,.04); animation:heroOrbitSpinReverse 9s linear infinite; }
.hero-scene.has-webgl .hero-css-orbit { opacity:.2; }
.hero-copy { max-width:820px; position:relative; z-index:2; }
.landing-eyebrow { font:400 10px/1.4 var(--f-mono); text-transform:uppercase; letter-spacing:.18em; color:var(--gold-primary); margin:0 0 20px; }
.landing-hero h1 { font:400 clamp(50px,7.1vw,104px)/.96 var(--f-display); letter-spacing:-.045em; max-width:1000px; margin:0; }
.landing-hero h1 em { color:var(--gold-primary); font-weight:400; }
.hero-lede { margin:34px 0 0; max-width:650px; color:var(--text-2); font-size:clamp(15px,1.4vw,18px); line-height:1.8; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:36px; }
.landing-button { appearance:none; border-radius:999px; min-height:48px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; font:500 11px/1 var(--f-mono); letter-spacing:.07em; text-transform:uppercase; text-decoration:none; cursor:pointer; transition:transform .2s,background .2s,border-color .2s; }
.landing-button:hover { transform:translateY(-2px); }
.landing-button.primary { background:var(--gold-primary); color:#0a0907; border:1px solid var(--gold-primary); }
.landing-button.primary:hover { background:var(--gold-accent); }
.landing-button.secondary { background:rgba(5,5,6,.65); color:var(--text-1); border:1px solid var(--border-mid); }
.landing-button:disabled { opacity:.5; cursor:not-allowed; transform:none; }
.hero-proof { position:absolute; inset:auto clamp(22px,5vw,78px) 28px; display:flex; justify-content:flex-end; gap:28px; color:var(--text-3); font:300 9px/1 var(--f-mono); letter-spacing:.08em; text-transform:uppercase; }
.landing-section { position:relative; padding:clamp(82px,10vw,150px) clamp(22px,8vw,120px); border-top:1px solid var(--border-soft); }
.landing-section[id] { scroll-margin-top:84px; }
.section-heading { max-width:750px; }
.section-heading h2,.application-intro h2 { font:400 clamp(38px,5vw,68px)/1.06 var(--f-display); letter-spacing:-.035em; margin:0; }
.section-heading>p:last-child { color:var(--text-2); font-size:15px; line-height:1.8; max-width:620px; margin-top:24px; }
.pillar-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:70px; border-top:1px solid var(--border-mid); }
.pillar { padding:28px 28px 16px 0; border-right:1px solid var(--border-soft); min-height:240px; }
.pillar+.pillar { padding-left:28px; }
.pillar:last-child { border-right:0; }
.pillar-number { color:var(--gold-primary); font:300 10px/1 var(--f-mono); }
.pillar h3 { font:500 22px/1.2 var(--f-display); margin:70px 0 14px; }
.pillar p { color:var(--text-2); font-size:13px; line-height:1.75; }
.lifecycle-section { overflow:hidden; isolation:isolate; background:#09090b; }
.lifecycle-section::before { z-index:-1; opacity:.48; background-image:radial-gradient(circle,rgba(224,224,228,.25) 1px,transparent 1.35px); background-size:16px 16px; background-position:center 7px; mask-image:radial-gradient(ellipse 78% 44% at 50% 68%,#000 28%,rgba(0,0,0,.82) 60%,transparent 100%); }
.lifecycle { --progress:0%; list-style:none; display:grid; grid-template-columns:repeat(5,1fr); margin-top:82px; position:relative; }
.lifecycle::before,.lifecycle::after { content:""; position:absolute; height:1px; top:31px; left:6%; right:6%; background:var(--border-mid); }
.lifecycle::after { right:auto; width:var(--progress); max-width:88%; background:linear-gradient(90deg,var(--gold-dark),var(--gold-primary)); transition:width 1.5s cubic-bezier(.2,.7,.2,1) .25s; }
.lifecycle.is-visible { --progress:88%; }
.lifecycle-step { position:relative; display:flex; flex-direction:column; align-items:center; min-width:0; }
.lifecycle-icon { width:62px; height:62px; position:relative; z-index:2; display:grid; place-items:center; border-radius:16px; background:#151517; border:1px solid var(--border-mid); color:var(--gold-primary); opacity:.35; transform:scale(.8); transition:opacity .5s,transform .5s,border-color .5s; }
.lifecycle.is-visible .lifecycle-icon { opacity:1; transform:scale(1); border-color:rgba(201,168,97,.38); }
.lifecycle.is-visible li:nth-child(2) .lifecycle-icon { transition-delay:.2s }.lifecycle.is-visible li:nth-child(3) .lifecycle-icon{transition-delay:.4s}.lifecycle.is-visible li:nth-child(4) .lifecycle-icon{transition-delay:.6s}.lifecycle.is-visible li:nth-child(5) .lifecycle-icon{transition-delay:.8s}
.lifecycle-icon svg { width:25px; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.lifecycle-card { width:100%; text-align:center; padding:24px 10px 0; }
.state-pill { display:inline-block; padding:5px 8px; border-radius:999px; font:500 8px/1 var(--f-mono); letter-spacing:.05em; text-transform:uppercase; color:#c9a861; background:rgba(201,168,97,.1); }
.state-pill.open { color:#64a5da;background:rgba(37,99,235,.14) }.state-pill.pending{color:#d99a48;background:rgba(193,125,42,.14)}.state-pill.accepted,.state-pill.settled{color:#65c68b;background:rgba(45,122,86,.16)}
.lifecycle-card h3 { margin:16px 0 7px; font:500 16px/1.2 var(--f-display); }
.lifecycle-card p { color:var(--text-3); font:300 9px/1.55 var(--f-mono); }
.disclosure-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:10vw; align-items:end; }
.disclosure-copy>p { color:var(--text-2); line-height:1.85; font-size:16px; }
.control-list { display:grid; grid-template-columns:1fr 1fr; margin-top:34px; border-top:1px solid var(--border-mid); }
.control-list span { padding:16px 4px; border-bottom:1px solid var(--border-soft); color:var(--gold-primary); font:300 10px/1 var(--f-mono); text-transform:uppercase; letter-spacing:.05em; }
.application-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(50px,9vw,140px); background:#09090b; }
.application-intro { position:sticky; top:100px; align-self:start; }
.application-intro>p:not(.landing-eyebrow) { color:var(--text-2); line-height:1.8; margin-top:25px; max-width:470px; }
.application-intro .privacy-note { font-size:12px; color:var(--text-3); }.application-intro a,.consent a { color:var(--gold-primary); }
.application-panel { background:#111113; border:1px solid var(--border-mid); padding:clamp(24px,4vw,52px); border-radius:18px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { margin-bottom:20px; }.field label { display:block; color:var(--text-2); font:400 10px/1 var(--f-mono); text-transform:uppercase; letter-spacing:.07em; margin-bottom:9px; }
.field input,.field select,.field textarea { width:100%; border:1px solid var(--border-mid); border-radius:8px; background:#080809; color:var(--text-1); padding:13px 14px; font:400 14px/1.5 var(--f-ui); outline:none; }
.field select { color-scheme:dark; -webkit-text-fill-color:var(--text-1); }
.field select option { background:#111113; color:var(--text-1); }
.field textarea { resize:vertical; min-height:130px; }.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--gold-primary); box-shadow:0 0 0 3px var(--gold-dim); }
.field [aria-invalid="True"],.field [aria-invalid="true"] { border-color:var(--error-red); }
.field-help { color:var(--text-3); font:300 9px/1 var(--f-mono); margin-top:7px; }.field-error { display:block; min-height:16px; margin-top:5px; color:#dc6f62; font-size:11px; }
.consent { display:flex; gap:10px; align-items:flex-start; color:var(--text-2); font-size:12px; line-height:1.6; }.consent input { margin-top:3px; accent-color:var(--gold-primary); }
.honeypot { position:absolute!important; left:-9999px!important; width:1px;height:1px;overflow:hidden; }
.turnstile-slot { margin:18px 0 4px; min-height:65px; color:var(--error-red); font-size:11px; }.form-alert { padding:12px 14px; border:1px solid rgba(192,57,43,.45); background:var(--red-dim); color:#e7a299; border-radius:8px; font-size:12px; margin:14px 0; }
.submit-application { width:100%; margin-top:14px; }.application-success { min-height:420px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; outline:none; }.application-success>span { display:grid; place-items:center; width:54px;height:54px;border:1px solid var(--gold-primary);color:var(--gold-primary);border-radius:50%;font-size:24px; }.application-success h3 { font:400 34px/1.2 var(--f-display); margin:24px 0 12px; }.application-success p { color:var(--text-2); max-width:390px; }
.landing-footer { padding:50px clamp(22px,5vw,78px) 30px; border-top:1px solid var(--border-soft); display:grid; grid-template-columns:1fr 1fr 1fr; align-items:start; gap:30px; color:var(--text-3); }
.landing-footer>p { text-align:center;font-family:var(--f-display); }.landing-footer>div:not(.footer-legal) { justify-self:end;display:flex;gap:20px }.landing-footer a,.landing-footer button { color:var(--text-2);background:none;border:0;font:300 10px/1 var(--f-mono);text-transform:uppercase;text-decoration:none;cursor:pointer }.landing-footer .footer-legal { grid-column:1/-1;width:100%;border-top:1px solid var(--border-soft);padding-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:10px 36px }.landing-footer .footer-legal p,.landing-footer .footer-legal small { margin:0;font:300 9px/1.65 var(--f-mono);text-align:left }.landing-footer .footer-legal strong { color:var(--text-2);font-weight:500 }.landing-footer .footer-legal a { font:inherit;text-transform:none;text-decoration:underline;text-underline-offset:2px }.landing-footer .footer-legal small { grid-column:1/-1;margin-top:8px;color:var(--text-3) }
.reveal { opacity:0; transform:translateY(20px); transition:opacity .7s ease,transform .7s ease; }.reveal.is-visible { opacity:1;transform:none; }
.login-modal-backdrop { position:fixed; z-index:3000; inset:0; background:rgba(0,0,0,.82); backdrop-filter:blur(8px); display:grid; place-items:center; padding:20px; animation:fadeIn .2s; }
.login-modal { width:min(440px,100%); max-height:calc(100svh - 40px); overflow:auto; background:#111113; border:1px solid rgba(201,168,97,.3); border-radius:16px; padding:38px; box-shadow:0 30px 100px #000; position:relative; }.modal-close { position:absolute;right:15px;top:12px;background:none;border:0;color:var(--text-2);font-size:27px;cursor:pointer; }.modal-brand { letter-spacing:.2em;font-weight:600;margin-bottom:28px; }.login-modal h2 { font:400 36px/1.2 var(--f-display);margin:0 0 28px; }.modal-submit { width:100%;margin:6px 0; }.modal-link { display:block;margin:14px auto 0;color:var(--gold-primary);background:none;border:0;cursor:pointer;font-size:12px; }.invitation-entry { border-top:1px solid var(--border-soft);margin-top:26px;padding-top:20px;display:flex;justify-content:space-between;color:var(--text-3);font-size:11px; }.invitation-entry a { color:var(--gold-primary);text-decoration:none; }.modal-open { overflow:hidden; }
@keyframes fadeIn { from{opacity:0}to{opacity:1} }
@keyframes heroOrbitBreath { 0%,100%{transform:translateY(-50%) scale(.985);opacity:.72} 50%{transform:translateY(-50%) scale(1.025);opacity:1} }
@keyframes heroOrbitSpin { to{transform:rotate(360deg)} }
@keyframes heroOrbitSpinReverse { to{transform:rotate(-360deg)} }
@media(max-width:900px){.pillar-grid{grid-template-columns:1fr 1fr}.pillar:nth-child(2){border-right:0}.lifecycle{grid-template-columns:1fr;gap:20px;margin-left:30px}.lifecycle::before,.lifecycle::after{width:1px;height:auto;left:30px;top:3%;bottom:3%;right:auto}.lifecycle::after{max-width:none;width:1px;height:var(--progress)}.lifecycle.is-visible{--progress:94%}.lifecycle-step{flex-direction:row;align-items:center}.lifecycle-card{text-align:left;padding:0 0 0 24px}.disclosure-grid,.application-section{grid-template-columns:1fr}.application-intro{position:static}.hero-scene{inset:84px -30% 0 34%;opacity:.7}}
@media(max-width:600px){.landing-shell{scroll-padding-top:70px}.landing-header{height:70px}.landing-section[id]{scroll-margin-top:70px}.landing-header nav>a{display:none}.landing-header nav{gap:8px}.landing-signin{padding:10px 12px}.landing-hero{padding:115px 22px 100px}.hero-copy{width:100%;min-width:0}.landing-hero h1{font-size:clamp(44px,13vw,64px)}.hero-actions{display:grid;grid-template-columns:1fr;width:100%}.hero-actions .landing-button{width:100%}.hero-proof{display:none}.hero-scene{inset:70px -70% 0 20%;opacity:.5}.pillar-grid{grid-template-columns:1fr}.pillar,.pillar+.pillar{padding:24px 0;border-right:0;border-bottom:1px solid var(--border-soft);min-height:auto}.pillar h3{margin-top:34px}.form-row{grid-template-columns:1fr}.application-section{padding-left:22px;padding-right:22px}.landing-footer{grid-template-columns:1fr}.landing-footer>p{text-align:left}.landing-footer>div:not(.footer-legal){justify-self:start}.landing-footer .footer-legal{grid-template-columns:1fr}.landing-footer .footer-legal small{grid-column:1}.login-modal{padding:30px 22px}.lifecycle-section::before{opacity:.36;mask-image:linear-gradient(to bottom,transparent 3%,#000 16%,#000 90%,transparent 100%)}.lifecycle{margin-left:0}.application-panel{margin:0 -8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.reveal{opacity:1;transform:none;transition:none}.lifecycle{--progress:88%}.lifecycle-icon{opacity:1;transform:none;transition:none}.landing-button{transition:none}.hero-css-orbit,.hero-css-orbit::before,.hero-css-orbit::after{animation:none}.hero-css-orbit{box-shadow:none}.login-modal-backdrop{animation:none}}
.privacy-page{min-height:100vh;background:#09090b;color:var(--text-1)}.privacy-page>header{height:84px;padding:0 clamp(22px,5vw,78px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-soft)}.privacy-page>header>a:last-child{color:var(--text-2);font:300 10px/1 var(--f-mono);text-transform:uppercase;text-decoration:none}.privacy-page main{width:min(780px,calc(100% - 44px));margin:0 auto;padding:90px 0 120px}.privacy-page h1{font:400 clamp(48px,7vw,76px)/1 var(--f-display);margin-bottom:38px}.privacy-page section{padding:32px 0;border-top:1px solid var(--border-soft)}.privacy-page h2{font:500 24px/1.2 var(--f-display);margin-bottom:15px}.privacy-page section p{color:var(--text-2);font-size:14px;line-height:1.85;margin-top:10px}.privacy-page section a{color:var(--gold-primary);text-underline-offset:3px}.legal-review-notice{border:1px solid rgba(193,125,42,.5);background:var(--amber-dim);color:#d9b078;padding:15px 18px;border-radius:8px;margin-bottom:46px;font-size:12px;line-height:1.6}
.membership-hub{padding:32px;max-width:1100px}.membership-hub-header{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}.membership-hub-header h1{font-size:32px;margin:0 0 6px}.membership-hub-header>div>p:last-child{color:var(--text-2)}.hub-tabs{display:flex;border-bottom:1px solid var(--border-mid);margin-bottom:24px}.hub-tabs>button{display:flex;align-items:center;gap:8px;background:none;border:0;border-bottom:2px solid transparent;color:var(--text-2);padding:13px 18px;font:500 12px/1 var(--f-ui);cursor:pointer}.hub-tabs>button.active{color:var(--gold-primary);border-bottom-color:var(--gold-primary)}.hub-filters{display:flex;gap:8px;margin-bottom:18px}.hub-filters button{background:var(--surface);border:1px solid var(--border-mid);color:var(--text-2);border-radius:999px;padding:8px 14px;cursor:pointer;font-size:11px}.hub-filters button.active{border-color:var(--gold-primary);color:var(--gold-primary)}.hub-loading{display:grid;place-items:center;padding:70px}.hub-error{border-color:var(--red)}.application-list,.invitation-list{display:grid;gap:14px}.council-application,.hub-invitation{background:var(--surface);border:1px solid var(--border-soft);border-radius:10px;padding:22px}.application-summary,.hub-invitation{display:flex;justify-content:space-between;gap:20px}.application-summary h2,.hub-invitation h2{font:500 21px/1.2 var(--f-display);margin:10px 0 4px}.application-summary a{color:var(--text-2);font-size:12px}.application-summary dl{display:flex;gap:28px}.application-summary dt{color:var(--text-3);font:300 9px/1 var(--f-mono);text-transform:uppercase}.application-summary dd{color:var(--text-2);font-size:12px;margin-top:7px}.application-reason{color:var(--text-2);line-height:1.7;margin:20px 0;padding:18px 0;border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft)}.decision-history summary{color:var(--gold-primary);cursor:pointer;font-size:11px}.decision-row{display:grid;grid-template-columns:100px 1fr;padding:12px 0;border-bottom:1px solid var(--border-soft);font-size:11px;color:var(--text-2)}.decision-row p{grid-column:1/-1;color:var(--text-3);margin-top:6px}.review-controls{margin-top:18px}.review-controls label{display:block;color:var(--text-3);font:300 9px/1 var(--f-mono);text-transform:uppercase;margin-bottom:7px}.review-controls textarea{width:100%;background:#09090b;border:1px solid var(--border-mid);color:var(--text-1);border-radius:6px;padding:10px;resize:vertical}.review-controls>div{display:flex;gap:8px;margin-top:10px}.danger{border-color:var(--red)!important;color:#df776d!important}.hub-invitation small,.hub-invitation p{color:var(--text-3)}.hub-invitation-actions{display:flex;gap:8px;align-items:start}.hub-toast{position:fixed;right:24px;bottom:24px;background:var(--surface-3);border:1px solid var(--gold-primary);border-radius:8px;padding:13px 18px;z-index:1000}.state-pill.submitted{color:#d99a48;background:var(--amber-dim)}.state-pill.approved{color:#65c68b;background:var(--green-dim)}.state-pill.declined{color:#df776d;background:var(--red-dim)}@media(max-width:700px){.membership-hub{padding:22px}.membership-hub-header,.application-summary,.hub-invitation{flex-direction:column}.application-summary dl{flex-wrap:wrap}}

/* Page transition */
.page-enter {
    opacity: 0;
    transform: translateY(8px);
}

.page-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: all 0.2s ease-out;
}

/* Image viewer overlay */
.image-viewer-overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.95);
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
}

.image-viewer-overlay img {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    transition: transform 0.2s ease;
}

/* Typing indicator animation */
.typing-indicator {
    display: inline-flex;
    gap: 4px;
    padding: 8px 12px;
}

.typing-indicator span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--subtitle-gray);
    animation: bounce 1.4s infinite;
}

.typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
.typing-indicator span:nth-child(3) { animation-delay: 0.4s; }

@keyframes bounce {
    0%, 60%, 100% { transform: translateY(0); }
    30% { transform: translateY(-8px); }
}

/* Search overlay */
.search-overlay {
    position: fixed;
    inset: 0;
    background-color: var(--overlay-black-80);
    z-index: 500;
    display: flex;
    flex-direction: column;
    padding: 24px;
}

.search-overlay .search-input {
    font-size: 18px;
    padding: 16px;
    background-color: var(--card-background);
    border: 1px solid var(--gold-dark);
    border-radius: var(--border-radius-lg);
    color: var(--white-text);
    outline: none;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
}

/* Empty state */
.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    text-align: center;
    color: var(--subtitle-gray);
}

.empty-state-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.5;
}

/* =========================================
   MARKET PAGE
   ========================================= */

.market-page,
.my-items-page {
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 24px;
}

.profile-page {
    padding-top: 24px;
}

.market-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 28px;
}

.market-header h1 {
    color: var(--white-text);
    font-size: 28px;
    font-weight: 700;
    margin: 0;
    letter-spacing: -0.5px;
}

.market-search {
    position: relative;
    margin-bottom: 28px;
    z-index: 500;
}

.search-backdrop {
    position: fixed;
    inset: 0;
    z-index: -1;
}

.search-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--card-background);
    border: 1px solid var(--gold-dark);
    border-top: none;
    border-radius: 0 0 var(--border-radius-lg) var(--border-radius-lg);
    max-height: 400px;
    overflow-y: auto;
    z-index: 1;
}

.search-dropdown .search-result-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    cursor: pointer;
    border-bottom: 1px solid var(--card-background-dark);
    transition: background 0.15s ease;
}

.search-dropdown .search-result-item:last-child {
    border-bottom: none;
}

.search-dropdown .search-result-item:hover {
    background: var(--card-background-dark);
}

.market-search .input-field {
    background-color: var(--card-background);
    border: 1px solid transparent;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    font-size: 15px;
    padding: 14px 20px;
    border-radius: var(--border-radius-lg);
}

.market-search .input-field:focus {
    border-color: var(--gold-dark);
    box-shadow: 0 0 0 3px rgba(201, 168, 97, 0.1);
}

.market-search:has(.search-dropdown) .input-field {
    border-color: var(--gold-dark);
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
}

/* Category sections */
.category-section {
    margin-bottom: 40px;
}

.category-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.category-header h2 {
    color: var(--gold-primary);
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    letter-spacing: 0.3px;
}

.category-header .item-count {
    color: var(--placeholder-gray);
    font-size: 13px;
    margin-left: 10px;
}

.category-header .view-all {
    color: var(--gold-dark);
    font-size: 13px;
    font-weight: 600;
    background: none;
    border: 1px solid var(--gold-dark);
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 6px 16px;
    letter-spacing: 0.3px;
    white-space: nowrap;
    flex-shrink: 0;
}

.category-header .view-all:hover {
    color: var(--black-primary);
    background-color: var(--gold-primary);
    border-color: var(--gold-primary);
}

/* Saved search badges */
.saved-search-badges {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.saved-search-badge {
    background: var(--card-background);
    color: var(--gray-text);
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.saved-search-badge:hover {
    border-color: var(--gold-dark);
    color: var(--gold-primary);
}

/* Horizontal scroll rail */
.horizontal-scroll {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 16px;
    overflow-x: auto;
    padding: 8px 0 12px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.06) transparent;
}

.horizontal-scroll::-webkit-scrollbar {
    height: 2px;
}

.horizontal-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.horizontal-scroll::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.06);
    border-radius: 1px;
}

.horizontal-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.12);
}

.horizontal-scroll > div {
    flex-shrink: 0;
}

/* =========================================
   ARTIFACT CARD
   ========================================= */

.artifact-card {
    cursor: pointer;
    border: 1px solid transparent;
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.artifact-card:hover {
    transform: translateY(-4px);
    border-color: var(--gold-dark);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(201, 168, 97, 0.15);
}

.artifact-card:active {
    transform: translateY(-1px);
    transition-duration: 0.1s;
}

.artifact-image-container {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background-color: var(--card-background-dark);
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
}

.artifact-image-container .loading-image-container {
    position: absolute;
    inset: 0;
    min-height: 0;
}

.artifact-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.artifact-card:hover .artifact-image-container img {
    transform: scale(1.05);
}

.artifact-info {
    padding: 14px 16px 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.artifact-title {
    color: var(--white-text);
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.3;
}

.artifact-category {
    color: var(--subtitle-gray);
    font-size: 12px;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 500;
}

.artifact-price {
    color: var(--gold-primary);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.3px;
    margin-top: auto;
}

.artifact-location {
    color: var(--placeholder-gray);
    font-size: 12px;
    margin-top: 6px;
}

/* Gated/redacted card variants */
.artifact-card.is-redacted:hover {
    border-color: var(--border-mid);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}
.artifact-image-gated {
    background:
        repeating-linear-gradient(
            45deg,
            rgba(255,255,255,0.025) 0,
            rgba(255,255,255,0.025) 10px,
            transparent 10px,
            transparent 20px
        ),
        var(--card-background-dark);
}

/* =========================================
   LOADING IMAGE / PLACEHOLDER
   ========================================= */

.loading-image-container {
    position: relative;
    min-height: 80px;
}

.loading-image-container .hidden {
    display: none;
}

.image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--card-background-dark) 0%, var(--card-background) 100%);
    color: var(--placeholder-gray);
    font-size: 11px;
    gap: 8px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.image-placeholder svg {
    opacity: 0.3;
}

/* Search result thumbnail */
.search-result-thumb {
    width: 48px;
    height: 48px;
    border-radius: var(--border-radius);
    overflow: hidden;
    flex-shrink: 0;
}

.search-result-thumb img,
.search-result-thumb .image-placeholder {
    width: 48px;
    height: 48px;
}

/* =========================================
   ARTIFACT DETAIL PAGE
   ========================================= */

.artifact-detail-page {
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 24px;
}

.detail-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--subtitle-gray);
    background: none;
    border: none;
    cursor: pointer;
    font-size: 14px;
    padding: 8px 0;
    transition: color 0.2s ease;
}

.detail-back-btn:hover {
    color: var(--gold-primary);
}

/* Image carousel */
.detail-carousel {
    position: relative;
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    margin: 0 auto 28px;
    background: var(--card-background-dark);
    aspect-ratio: 16 / 10;
    max-width: 800px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.detail-carousel img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    cursor: pointer;
    transition: opacity 0.3s ease;
    position: relative;
    z-index: 1;
}

.detail-carousel img:hover {
    opacity: 0.9;
}

.detail-carousel > .image-placeholder {
    position: absolute;
    inset: 0;
}

.carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.6);
    color: var(--white-text);
    border: none;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    cursor: pointer;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, transform 0.2s ease;
    backdrop-filter: blur(4px);
    z-index: 2;
}

.carousel-btn:hover:not(:disabled) {
    background: rgba(201, 168, 97, 0.3);
    transform: translateY(-50%) scale(1.1);
}

.carousel-btn:disabled {
    opacity: 0.3;
    cursor: default;
}

.carousel-btn.prev { left: 12px; }
.carousel-btn.next { right: 12px; }

/* Title section */
.detail-title-section {
    margin-bottom: 28px;
}

.detail-title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.detail-title {
    color: var(--white-text);
    font-size: 26px;
    font-weight: 700;
    margin: 0;
    letter-spacing: -0.5px;
    line-height: 1.2;
}

.detail-price {
    color: var(--gold-primary);
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 8px;
    letter-spacing: -0.3px;
}

.detail-meta {
    color: var(--subtitle-gray);
    font-size: 14px;
}

.detail-meta span + span::before {
    content: "\00b7";
    margin: 0 8px;
    color: var(--placeholder-gray);
}

.fav-btn {
    background: transparent;
    border: 1px solid var(--gold-dark);
    font-size: 22px;
    cursor: pointer;
    padding: 6px 12px;
    border-radius: var(--border-radius);
    transition: all 0.2s ease;
    line-height: 1;
    color: var(--gold-primary);
    /* Force text-style rendering — block the OS emoji presentation
       so the heart respects our `color` instead of becoming a red emoji. */
    font-variant-emoji: text;
    -webkit-font-feature-settings: "tnum";
}

.fav-btn.is-active {
    background: var(--gold-dim);
    border-color: var(--gold-primary);
    color: var(--gold-accent);
}

.fav-btn:hover {
    background: var(--gold-dim);
    border-color: var(--gold-primary);
}

/* Description */
.detail-description {
    margin-bottom: 28px;
}

.detail-description h3 {
    color: var(--gold-primary);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
}

.detail-description p {
    color: var(--gray-text);
    font-size: 15px;
    line-height: 1.7;
}

/* Details panel */
.detail-panel {
    background: var(--card-background);
    border-radius: var(--border-radius-lg);
    padding: 20px 24px;
    margin-bottom: 28px;
    border: 1px solid rgba(255, 255, 255, 0.04);
}

.detail-panel h3 {
    color: var(--gold-primary);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 16px;
}

.detail-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    gap: 24px;
}

.detail-row + .detail-row {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
}

.detail-row .label {
    color: var(--subtitle-gray);
    font-size: 14px;
    flex-shrink: 0;
    min-width: 100px;
}

.detail-row .value {
    color: var(--white-text);
    font-size: 14px;
    font-weight: 500;
    flex: 1;
}

/* Ownership info */
.ownership-panel {
    background: var(--card-background);
    border-radius: var(--border-radius-lg);
    padding: 20px 24px;
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    gap: 16px;
    border: 1px solid rgba(255, 255, 255, 0.04);
}

.ownership-icon {
    font-size: 28px;
    flex-shrink: 0;
}

.ownership-panel .owner-name {
    color: var(--white-text);
    font-weight: 600;
    font-size: 15px;
}

.ownership-panel .owner-sub {
    color: var(--subtitle-gray);
    font-size: 13px;
    margin-top: 2px;
}

/* Action buttons row */
.detail-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 28px;
}

/* Council review panel */
.council-panel {
    background: var(--card-background);
    border-radius: var(--border-radius-lg);
    padding: 24px;
    margin-bottom: 28px;
    border: 1px solid rgba(201, 168, 97, 0.15);
}

.council-panel h3 {
    color: var(--gold-primary);
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 16px;
}

.council-panel .actions {
    display: flex;
    gap: 12px;
}

.council-panel .actions .btn {
    flex: 1;
}

/* Review status */
.review-footer {
    text-align: center;
    padding: 16px;
    color: var(--placeholder-gray);
    font-size: 12px;
    letter-spacing: 0.3px;
}

/* =========================================
   CATEGORY PAGE
   ========================================= */

.category-page {
    max-width: 1200px;
    margin: 0 auto;
}

.category-page-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.category-page-header h1 {
    color: var(--gold-primary);
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    flex: 1;
    letter-spacing: -0.3px;
}

/* Toolbar */
.category-toolbar {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap;
    align-items: center;
}

.popup-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    background: var(--card-background);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--border-radius-lg);
    min-width: 160px;
    margin-top: 6px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
    overflow: hidden;
}

.popup-menu button {
    display: block;
    width: 100%;
    text-align: left;
    padding: 10px 16px;
    background: none;
    border: none;
    color: var(--gray-text);
    cursor: pointer;
    font-size: 14px;
    transition: all 0.15s ease;
}

.popup-menu button:hover {
    background: var(--card-background-dark);
    color: var(--gold-primary);
}

.popup-menu button.active {
    color: var(--gold-primary);
    font-weight: 600;
}

/* Filter panel */
.filter-panel {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    background: var(--card-background);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--border-radius-lg);
    padding: 20px;
    min-width: 300px;
    margin-top: 6px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}

.filter-panel label {
    color: var(--subtitle-gray);
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: block;
    margin-bottom: 6px;
}

.filter-panel .field-group {
    margin-bottom: 16px;
}

.filter-panel .field-row {
    display: flex;
    gap: 8px;
}

.filter-actions {
    display: flex;
    gap: 8px;
    margin-top: 4px;
}

.filter-actions .btn {
    flex: 1;
}

/* Location dropdown */
.location-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 20;
    background: var(--card-background-dark);
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-top: none;
}

.location-dropdown div {
    padding: 10px 14px;
    cursor: pointer;
    color: var(--gray-text);
    font-size: 14px;
    transition: all 0.15s ease;
}

.location-dropdown div:hover {
    background: var(--card-background);
    color: var(--gold-primary);
}

/* Load more */
.load-more {
    text-align: center;
    margin-top: 32px;
    padding-bottom: 16px;
}

/* =========================================
   SPINNER / LOADING
   ========================================= */

.spinner {
    width: 20px;
    height: 20px;
    border: 2px solid var(--card-background);
    border-top-color: var(--gold-primary);
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
    display: inline-block;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.spinner-lg {
    width: 40px;
    height: 40px;
    border-width: 3px;
}

.loading-center {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 64px;
}

/* =========================================
   MISC
   ========================================= */

/* Disabled button states */
.btn:disabled {
    opacity: 0.5;
    cursor: default;
    pointer-events: none;
}

/* =========================================
   MESSAGES SPLIT-VIEW
   ========================================= */

.messages-layout {
    display: flex;
    height: 100vh;
    gap: 1px;
    background: var(--card-background-dark);
}

.messages-sidebar {
    width: 380px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--dark-background);
}

.messages-sidebar-header {
    padding: 20px;
    border-bottom: 1px solid var(--card-background);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.messages-sidebar-header h2 {
    color: var(--white-text);
    font-size: 20px;
    font-weight: 700;
    margin: 0;
}

.messages-sidebar-list {
    flex: 1;
    overflow-y: auto;
}

.messages-chat-panel {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--dark-background);
}

.messages-empty-chat {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--subtitle-gray);
    gap: 8px;
}

.messages-empty-chat svg {
    opacity: 0.3;
    margin-bottom: 8px;
}

/* Conversation list items */
.conversation-item {
    transition: background 0.15s ease;
}

.conversation-item:hover {
    background: var(--card-background-dark) !important;
}

.conversation-item.active {
    background: var(--card-background-dark) !important;
    border-left: 3px solid var(--gold-primary);
}

/* Chat message bubbles */
.message-bubble {
    max-width: 280px;
    padding: 12px;
    border-radius: 16px;
    margin-bottom: 8px;
    word-wrap: break-word;
}

.message-bubble.mine {
    align-self: flex-end;
    background: #3D3D00;
}

.message-bubble.theirs {
    align-self: flex-start;
    background: var(--card-background-dark);
}

.message-bubble.nda-document {
    align-self: center;
    max-width: 60%;
    background: transparent;
}

.message-text {
    color: var(--white-text);
    font-size: 14px;
    line-height: 1.4;
}

.message-time {
    font-size: 11px;
    color: var(--subtitle-gray);
    text-align: right;
    margin-top: 4px;
}

.sender-name {
    color: var(--gold-primary);
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 4px;
}

/* Chat offer cards */
.offer-card {
    align-self: center;
    min-width: 250px;
    max-width: 300px;
    padding: 16px;
    border-radius: 12px;
    border: 1px solid var(--gold-primary);
    background: var(--card-background-dark);
    margin-bottom: 8px;
    text-align: center;
}

.offer-header {
    font-size: 12px;
    color: var(--subtitle-gray);
    margin-bottom: 8px;
}

.offer-amount {
    font-size: 28px;
    font-weight: 700;
    color: var(--gold-primary);
}

.offer-status {
    margin-top: 8px;
}

.offer-status .status-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    color: var(--white-text);
}

.offer-actions {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

/* Date header in chat */
.date-header {
    text-align: center;
    padding: 16px 0 8px;
    color: var(--subtitle-gray);
    font-size: 12px;
    font-weight: 600;
}

/* Blazor error UI override */
#blazor-error-ui {
    background: var(--error-background);
    color: var(--error-red);
    padding: 16px;
}

/* NDA Overlay */
.nda-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    background: var(--black-primary, #0A0A0A);
    display: flex;
    flex-direction: column;
}

.nda-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    border-bottom: 1px solid var(--card-border, #2A2A2A);
}

.nda-header h2 {
    color: var(--gold-primary, #8B7340);
    font-size: 20px;
    margin: 0;
}

.nda-close-btn {
    background: none;
    border: none;
    color: var(--gray-text, #999);
    font-size: 28px;
    cursor: pointer;
    padding: 4px 8px;
    line-height: 1;
}

.nda-close-btn:hover {
    color: var(--white-text, #fff);
}

.nda-content {
    flex: 1;
    overflow-y: auto;
    padding: 24px 80px;
    color: var(--gray-text, #ccc);
    line-height: 1.6;
}

.nda-content h1, .nda-content h2, .nda-content h3 {
    color: var(--white-text, #fff);
}

.nda-footer {
    padding: 16px 24px;
    border-top: 1px solid var(--card-border, #2A2A2A);
    display: flex;
    justify-content: center;
}

.nda-footer .btn {
    min-width: 200px;
}

.nda-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 12px 24px;
}

.nda-btn-text {
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.5px;
}

.nda-btn-sub {
    font-size: 11px;
    font-weight: 400;
    opacity: 0.7;
}
