:root {
  color-scheme: dark;
  --ink: #eef5f3;
  --muted: #9caaa8;
  --bg: #08101d;
  --panel: #0e1928;
  --panel-2: #122236;
  --line: #25364a;
  --mint: #72e4bd;
  --gold: #f4c96b;
  --max: 1120px;
}
* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; color: var(--ink); background: radial-gradient(circle at 80% -20%, #1c4260 0, transparent 38rem), var(--bg); font: 16px/1.6 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: inherit; }
.skip { position: absolute; left: -999px; top: 0; background: var(--mint); color: #06120d; padding: .7rem 1rem; z-index: 20; }
.skip:focus { left: 0; }
header, footer { width: min(var(--max), calc(100% - 2rem)); margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
header { padding: .75rem 0; border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: .75rem; text-decoration: none; font-weight: 750; letter-spacing: -.02em; }
.brand-mark { display: block; width: 1.9rem; height: 1.9rem; }
.brand-copy { display: flex; flex-direction: column; line-height: 1.05; }
.brand-copy small { color: var(--muted); font-size: .61rem; letter-spacing: .14em; margin-top: .22rem; text-transform: uppercase; }
.header-actions { display:flex; align-items:center; gap:.9rem; }
.header-actions a { display:inline-flex; align-items:center; min-height:36px; color:var(--muted); font-size:.8125rem; font-weight:600; text-decoration:none; }
.header-actions .header-services { display:inline-flex; align-items:center; gap:.35rem; color:var(--ink); }
.header-services .services-icon { color:var(--mint); font-size:1rem; }
.header-actions .header-login { border:1px solid var(--line); border-radius:.55rem; color:var(--mint); padding:.48rem .72rem; }
.header-actions a:hover { color:var(--mint); }
main { width: min(var(--max), calc(100% - 2rem)); margin: auto; }
.hero { padding: clamp(4rem, 9vw, 8rem) 0 5rem; max-width: 930px; }
.eyebrow { margin: 0 0 .8rem; color: var(--mint); font-size: .76rem; letter-spacing: .18em; font-weight: 800; }
h1, h2, h3 { margin: 0; line-height: 1.05; letter-spacing: -.045em; }
h1 { font-size: clamp(2.8rem, 7vw, 6.2rem); max-width: 13ch; }
h2 { font-size: clamp(2rem, 4vw, 3.5rem); }
h3 { font-size: clamp(1.35rem, 2vw, 1.75rem); overflow-wrap: anywhere; }
.lede { color: #c6d3d0; font-size: clamp(1.05rem, 2vw, 1.32rem); max-width: 62ch; margin: 1.8rem 0 2.2rem; }
.status-row { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: 1rem; overflow: hidden; background: rgba(14,25,40,.75); }
.status-row div { padding: 1.15rem 1.3rem; display: flex; flex-direction: column; }
.status-row div + div { border-left: 1px solid var(--line); }
.status-row strong { color: var(--mint); }
.status-row span { color: var(--muted); font-size: .88rem; }
.section { padding: 2rem 0; border-top: 1px solid var(--line); }
.manage { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.manage-copy { color: #c0cdca; max-width: 54ch; }
.search-card { padding: 1.4rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--panel); }
.session-status { margin-top: 0; color: var(--muted); font-size: .86rem; }
.search-row button, .central-sign-in { display: inline-flex; justify-content: center; border: 0; border-radius: .65rem; background: var(--mint); color: #07130f; padding: .72rem 1rem; font-weight: 800; text-decoration: none; cursor: pointer; }
.auth-options { display:grid; gap:1rem; }
.auth-intro { padding-bottom:.2rem; }
.auth-intro .eyebrow { margin-bottom:.45rem; }
.auth-intro h3 { font-size:1.25rem; letter-spacing:-.02em; }
.central-sign-in { width:100%; justify-content:space-between; }
.central-signup { display:flex; justify-content:center; width:100%; border:1px solid var(--line); border-radius:.65rem; color:var(--mint); padding:.68rem 1rem; font-size:.82rem; font-weight:800; text-decoration:none; }
.sign-out { border:0; background:none; color:var(--mint); padding:0; cursor:pointer; font:inherit; font-weight:750; }
.billing-notice { margin:.8rem 0 0; padding:.8rem .9rem; border-left:3px solid var(--gold); border-radius:0 .55rem .55rem 0; background:rgba(244,201,107,.08); color:#d8cfb8; font-size:.82rem; }
.billing-notice strong { color:var(--gold); }
.manager-button { width:100%; margin:.8rem 0 1.1rem; border:1px solid var(--mint); border-radius:.65rem; background:rgba(114,228,189,.08); color:var(--mint); padding:.72rem 1rem; cursor:pointer; font:inherit; font-weight:800; }
.manager-button:hover { background:rgba(114,228,189,.14); }
.search-card label { display: block; color: var(--muted); font-size: .75rem; font-weight: 750; letter-spacing: .08em; margin-bottom: .45rem; text-transform: uppercase; }
.action-picker { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; border: 0; padding: 0; margin: 0 0 1rem; }
.action-picker legend { grid-column: 1/-1; color: var(--muted); font-size: .75rem; font-weight: 750; letter-spacing: .08em; margin-bottom: .45rem; text-transform: uppercase; }
.action-picker label { display: flex; align-items: center; gap: .5rem; min-height: 3rem; margin: 0; padding: .65rem .7rem; border: 1px solid var(--line); border-radius: .65rem; color: var(--ink); font-size: .78rem; letter-spacing: 0; text-transform: none; cursor: pointer; }
.action-picker input { accent-color: var(--mint); }
.search-row { display: flex; gap: .6rem; }
.search-row input { min-width: 0; flex: 1; min-height:44px; border: 1px solid var(--line); border-radius: .5rem; background: var(--bg); color: var(--ink); padding: .625rem .75rem; font-family:inherit; font-size:16px; line-height:1.375; }
.search-result { margin-top: 1rem; }
.loading { color: var(--muted); }
.result-card { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items:center; gap: .5rem 1rem; border: 1px solid var(--line); border-radius: .5rem; padding: .75rem 1rem; }
.result-card > span { font-size:.75rem; font-weight:600; }
.result-card.available span { color: var(--mint); }
.result-card.taken span { color: var(--gold); }
.result-card small { color: var(--muted); font-size:.8125rem; line-height:1.5; }
.result-card button, .order-submit { grid-column: 1/-1; margin-top: .55rem; border: 0; border-radius: .65rem; background: var(--mint); color: #07130f; padding: .72rem 1rem; font: inherit; font-weight: 800; cursor: pointer; }
.domain-order { display: grid; gap: 1rem; margin-top: 1rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.order-head h3 { font-size: 1.25rem; letter-spacing: -.02em; }
.order-head p, .order-note { margin: .35rem 0 0; color: var(--muted); font-size: .82rem; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.field-grid label { margin: 0; font-size:.875rem; line-height:1.5; }
.field-grid label span { font-weight: 500; text-transform: none; letter-spacing: 0; }
.field-grid .wide { grid-column: 1/-1; }
.field-grid input { display: block; width: 100%; min-height:44px; margin-top: .35rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--bg); color: var(--ink); padding: .625rem .75rem; font-family:inherit; font-size:16px; line-height:1.375; }
.check { display: flex !important; gap: .6rem; align-items: flex-start; margin: 0 !important; color: #c0cdca !important; font-size: .78rem !important; letter-spacing: 0 !important; line-height: 1.45; text-transform: none !important; }
.check input { flex: 0 0 auto; margin-top: .2rem; accent-color: var(--mint); }
.domain-order output { min-height: 1.4rem; color: #ffaaa0; font-size: .82rem; }
.section-head, .boundary { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(2rem, 6vw, 6rem); align-items: end; }
.updated { color: var(--muted); text-align: right; margin: 0; }
.domain-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.domain-card { min-width: 0; padding: 1rem; background: var(--panel); border: 1px solid var(--line); border-radius: .625rem; }
.card-top { display: flex; justify-content: space-between; gap: .5rem; margin-bottom: .75rem; }
.kind { color: var(--muted); text-transform: uppercase; font-size: .68rem; letter-spacing: .12em; }
.status { display: inline-flex; align-items: center; gap: .4rem; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; }
.status i { width: .5rem; height: .5rem; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 .25rem rgba(244,201,107,.09); }
.status.active i { background: var(--mint); box-shadow: 0 0 0 .25rem rgba(114,228,189,.09); }
.service { margin:.5rem 0 .75rem; color: #c0cdca; font-size:.875rem; }
dl { margin: .75rem 0; }
dl div { padding: .4rem 0; border-top: 1px solid var(--line); }
dt { color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .09em; }
dd { margin: .15rem 0 0; font-size: .9rem; overflow-wrap: anywhere; }
.next { margin:.75rem 0 0; color: var(--muted); font-size: .8125rem; line-height:1.5; }
.next strong { color: var(--ink); }
.domain-link { display: inline-flex; gap: .4rem; color: var(--mint); font-weight: 750; text-decoration: none; }
.domain-link:hover { text-decoration: underline; }
.boundary { align-items: start; }
.boundary-copy { color: #c0cdca; font-size: 1.05rem; }
.callout { padding: 1.2rem 1.3rem; background: rgba(114,228,189,.08); border-left: 3px solid var(--mint); border-radius: 0 .7rem .7rem 0; }
code { color: var(--mint); font: .9em ui-monospace, SFMono-Regular, Menlo, monospace; }
footer { margin-top: 1rem; padding: 1.5rem 0 2rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .85rem; }
.legal { max-width: 860px; padding: clamp(3rem, 8vw, 6rem) 0; }
.legal h1 { max-width: 15ch; font-size: clamp(2.7rem, 6vw, 5rem); }
.legal section { padding: 2rem 0; border-top: 1px solid var(--line); }
.legal section h2 { font-size: clamp(1.4rem, 3vw, 2rem); letter-spacing: -.025em; }
.legal section p { color: #c6d3d0; }
.legal a, .check a { color: var(--mint); }
.legal-contact { padding: 1.2rem 1.3rem; background: rgba(114,228,189,.08); border-left: 3px solid var(--mint); }
.error { grid-column: 1/-1; color: #ffaaa0; }
:focus-visible { outline: 3px solid var(--mint); outline-offset: 3px; }
[hidden] { display: none !important; }
@media (max-width: 800px) {
  .domain-grid { grid-template-columns: 1fr; }
  .section-head, .boundary { grid-template-columns: 1fr; }
  .manage { grid-template-columns: 1fr; }
  .updated { text-align: left; }
  .status-row { grid-template-columns: 1fr; }
  .status-row div + div { border-left: 0; border-top: 1px solid var(--line); }
  .next { min-height: 0; }
}
@media (max-width: 520px) { .action-picker, .field-grid { grid-template-columns: 1fr; } .field-grid .wide { grid-column: auto; } .header-actions { gap:.55rem; } .header-actions a { font-size:.7rem; } .header-actions .header-login { padding:.42rem .55rem; } .services-label { display:none; } }

.header-sign-out { border:1px solid var(--mint); border-radius:.55rem; background:rgba(114,228,189,.08); color:var(--mint); padding:.48rem .72rem; cursor:pointer; font:inherit; font-size:.78rem; font-weight:800; }
.header-sign-out:hover { background:rgba(114,228,189,.14); }
.dashboard { padding: 2rem 0; font-size:.9375rem; }
.dashboard-head { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1.5rem; align-items:center; }
.dashboard h2 { font-size:1.5rem; line-height:1.25; }
.domain-card h3 { font-size:1.125rem; line-height:1.35; font-weight:650; letter-spacing:-.02em; }
.account-line { margin:.5rem 0 0; color:var(--muted); font-size:.875rem; }
.account-line strong { color:var(--ink); font-weight:600; overflow-wrap:anywhere; }
.dashboard-summary { display:flex; flex-wrap:wrap; gap:1.5rem; }
.dashboard-summary div { display:flex; align-items:baseline; gap:.4rem; min-width:0; }
.dashboard-summary strong { color:var(--ink); font-size:1.25rem; line-height:1.2; font-weight:600; }
.dashboard-summary span { color:var(--muted); font-size:.8125rem; }
.dashboard-panel { margin-top:1rem; padding:clamp(1.1rem,3vw,1.5rem); border:1px solid var(--line); border-radius:1.1rem; background:rgba(14,25,40,.78); }
.inventory-panel { margin-top:1.2rem; }
.action-panel form { max-width:760px; }
.section-head.compact { grid-template-columns:1fr auto; gap:1rem; align-items:center; }
.section-head.compact h2 { font-size:1.5rem; line-height:1.25; }
.empty-state { grid-column:1/-1; display:grid; gap:.35rem; padding:1rem 0; color:var(--muted); font-size:.875rem; }
.empty-state strong { color:var(--ink); font-size:1rem; }
.empty-state span { max-width:62ch; }
body[data-view="dashboard"] footer { margin-top:0; }
@media (max-width: 800px) {
  .dashboard-head { grid-template-columns:1fr; align-items:start; }
  .dashboard-summary { width:100%; }
  .section-head.compact { grid-template-columns:1fr; align-items:start; }
  .action-panel { max-width:none; }
}
@media (max-width: 520px) {
  .dashboard { padding-top:1rem; }
  .dashboard-panel { border-radius:.625rem; padding:1rem; }
  .dashboard-summary { gap:1rem; }
  .dashboard-summary div { padding:0; }
  .header-sign-out { padding:.42rem .55rem; font-size:.7rem; }
}

.shop-hero { padding: 2rem 0 1.5rem; max-width: 920px; }
.shop-hero h1 { max-width:none; font-size:2.25rem; line-height:1.2; font-weight:650; letter-spacing:-.035em; }
.shop-hero .lede { margin:.75rem 0 1.25rem; max-width:70ch; font-size:.9375rem; line-height:1.5; }
.shop-search { margin-top:1rem; padding:.875rem; border:1px solid var(--line); border-radius:.625rem; background:var(--panel); }
.shop-search label { display:block; color:var(--muted); font-size:.75rem; font-weight:800; letter-spacing:.1em; margin-bottom:.55rem; text-transform:uppercase; }
.shop-results { padding:1.5rem 0 2rem; font-size:.9375rem; }
.shop-results .search-result { display:grid; gap:.5rem; margin-top:1rem; }
.continue-card, .checkout-card { max-width:760px; margin-top:1.5rem; padding:1rem; border:1px solid var(--line); border-radius:.625rem; background:var(--panel); }
.result-card.available { border-color: rgba(114,228,189,.45); }
.result-card.unsupported, .result-card.taken { background: rgba(244,201,107,.05); }
.result-card div { min-width:0; display:grid; gap:.25rem; }
.result-card strong { overflow-wrap:anywhere; }
.result-card button { grid-column:auto; margin:0; justify-self:end; min-width:5.25rem; min-height:44px; padding:.625rem 1rem; border-radius:.5rem; font-size:.875rem; line-height:1.4; font-weight:650; }
.checkout-card .check strong { color: var(--ink); }
.manager-actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1rem; }
.manager-actions .manager-button { width:auto; margin:0; }
.manager-button.secondary { border-color: var(--line); color:#c6d3d0; background:rgba(255,255,255,.03); }
body[data-view="public"] #dashboard { display:none !important; }
body[data-view="shop"] #auth-options { display:none; }
@media (max-width: 800px) {
  .shop-hero { padding-top:1.5rem; }
  .result-card { grid-template-columns:minmax(0,1fr) auto auto; }
  .result-card button { min-width:5.25rem; }
}
@media (max-width: 520px) {
  .shop-search { padding:.9rem; }
  .continue-card, .checkout-card { padding:1rem; }
  .manager-actions { display:grid; }
  .manager-actions .manager-button { width:100%; }
}

.shop-search button, .order-submit { min-height:44px; font-size:.875rem; line-height:1.4; font-weight:650; }
.manager-actions .manager-button { min-height:44px; padding:.625rem .875rem; font-size:.875rem; line-height:1.4; font-weight:600; }
.domain-card dl div:has(dd:empty) { display:none; }
@media (max-width: 600px) {
  .shop-hero h1 { font-size:1.75rem; }
  .result-card { grid-template-columns:minmax(0,1fr) auto; padding:.75rem; }
  .result-card > div { grid-column:1/-1; }
  .result-card > span { grid-row:2; }
  .result-card button { grid-row:2; grid-column:2; }
  .header-actions a, .header-sign-out { min-height:44px; }
}
@media (max-width: 360px) {
  .shop-search .search-row { flex-direction:column; }
}
