
@font-face{font-family:"Jakarta";src:url(/assets/font.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
.hue-0{--hue:158}.hue-1{--hue:172}.hue-2{--hue:190}.hue-3{--hue:205}.hue-4{--hue:221}.hue-5{--hue:238}.hue-6{--hue:255}.hue-7{--hue:272}.hue-8{--hue:292}.hue-9{--hue:330}.hue-10{--hue:346}.hue-11{--hue:8}
:root{--hue:221;--bg:#fff;--fg:#0f172a;--muted:#64748b;--line:#e5e7eb;--field:#f8fafc;--panel:#f4f6f9;--card:#fff;--err:#fdecec;--err-fg:#9b1c1c;--shadow:0 1px 2px rgba(15,23,42,.04),0 12px 32px -12px rgba(15,23,42,.14)}
body{--brand:hsl(var(--hue) 70% 32%);--brand-deep:hsl(var(--hue) 75% 17%);--brand-soft:hsl(var(--hue) 60% 94%);--ring:hsl(var(--hue) 70% 40% / .18)}
@media (prefers-color-scheme:dark){
  :root{--bg:#0b0f17;--fg:#e7ebf3;--muted:#94a3b8;--line:#232c3a;--field:#0f1520;--panel:#0d121b;--card:#131a26;--err:#3a1616;--err-fg:#ffb4b4;--shadow:0 12px 32px -12px rgba(0,0,0,.6)}
  body{--brand-soft:hsl(var(--hue) 35% 16%)}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 Jakarta,system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:inherit}
b{font-weight:700}
.public{background:var(--panel)}

/* ---------- Split layout: fits one screen on desktop ---------- */
.split{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh;min-height:100dvh}

.showcase{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:clamp(24px,4.5vh,48px) clamp(28px,4vw,64px);color:#fff;background:linear-gradient(160deg,var(--brand) 0%,var(--brand-deep) 100%)}
.art{position:absolute;top:clamp(-36px,-3vh,-14px);right:clamp(-34px,-2vw,-12px);width:clamp(220px,min(25vw,40vh),380px);height:auto;color:#fff;opacity:.14;pointer-events:none}
.show-center{position:relative;margin:auto 0;padding:24px 0}
.hero{margin:0;font-weight:800}
.headline{display:flex;align-items:center;gap:.3em;font-size:clamp(36px,min(4.6vw,8vh),76px);line-height:1.02;letter-spacing:-.04em}
.forsale-icon{flex:none;display:grid;place-items:center;width:.8em;height:.8em;border-radius:.2em;background:#fff;color:var(--brand);transform:rotate(-8deg);box-shadow:0 10px 26px -10px rgba(0,0,0,.45)}
.forsale-icon svg{width:52%;height:52%}
.domain{display:inline-flex;flex-wrap:wrap;align-items:baseline;margin-top:18px;padding:.16em .55em .2em;border-radius:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.26);font-size:clamp(22px,min(2.4vw,4.2vh),36px);font-weight:700;letter-spacing:-.02em;line-height:1.2}
.domain .nm,.domain .tld{display:inline-block}
.domain .tld{opacity:.6}
.tagline{font-size:clamp(22px,min(2.4vw,4vh),34px);font-weight:700;letter-spacing:-.02em;margin:10px 0 0;opacity:.95}
.show-foot{position:relative}
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;list-style:none;counter-reset:how;margin:0 0 20px;padding:18px 0 0;border-top:1px solid rgba(255,255,255,.18)}
.how li{counter-increment:how;font-size:13px;line-height:1.4}
.how b{display:flex;align-items:center;gap:8px;font-size:14px;margin-bottom:3px}
.how b::before{content:counter(how);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.18);font-size:12px}
.how span{opacity:.75}
.contact{display:flex;flex-direction:column;gap:2px;margin:28px 0 0}
.contact-label{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.8}
.contact-label svg{width:17px;height:17px}
.contact a{font-size:clamp(20px,min(2vw,3.4vh),28px);font-weight:800;letter-spacing:-.01em;text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:rgba(255,255,255,.4);text-underline-offset:6px;overflow-wrap:anywhere;transition:text-decoration-color .15s}
.contact a:hover{text-decoration-color:#fff}

.panel{background:var(--panel);display:flex;align-items:center;justify-content:center;padding:clamp(20px,4vh,48px) clamp(20px,4vw,56px)}
.panel-inner{width:100%;max-width:500px}

.stat-lead{position:relative;display:flex;align-items:center;gap:16px;width:min(100%,460px);margin:30px 0 0;padding:16px 20px 16px 16px;border-radius:18px;background:#fff;color:#0f172a;box-shadow:0 12px 30px -12px rgba(0,0,0,.45)}
.bid-count{position:absolute;top:12px;right:12px;padding:3px 10px;border-radius:99px;background:#f1f5f9;color:#94a3b8;font-size:12px;font-weight:500;line-height:1.4}
.stat-lead small{display:block;font-size:12px;font-weight:600;color:#64748b}
.stat-lead strong{display:block;font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1.2}
.stat-icon{flex:none;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--brand);color:#fff}
.stat-icon svg{width:26px;height:26px}
.stat-body{display:flex;flex-direction:column;min-width:0}
.stat-lead strong{font-size:30px}
.stat-lead em{font-style:normal;font-size:13px;color:#64748b;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.panel-head{margin:0 0 14px}
.panel-head h2{font-size:clamp(28px,min(2.8vw,4.6vh),40px);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:0}
.panel-head p{margin:6px 0 0;color:var(--muted);font-size:15px}
.panel-head p b{color:var(--fg)}
.typewriter{margin:16px 0 0;min-height:1.3em;font-size:clamp(20px,min(2vw,3.6vh),28px);font-weight:600;line-height:1.3;letter-spacing:-.01em;white-space:nowrap;color:rgba(255,255,255,.92)}
.tw-caret{display:inline-block;width:3px;height:1.05em;margin-left:4px;vertical-align:-.17em;border-radius:2px;background:#fff;animation:tw-blink 1s steps(1) infinite}
@keyframes tw-blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.tw-caret{animation:none}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.help{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:6px}

.bidcard{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(18px,3vh,28px);box-shadow:var(--shadow)}
label{display:block;font-size:13px;font-weight:700;margin:0 0 12px}
label .opt{color:var(--muted);font-weight:500}
input,textarea,select{display:block;width:100%;margin-top:6px;padding:11px 13px;font:500 15px Jakarta,system-ui,sans-serif;color:var(--fg);background:var(--field);border:1.5px solid var(--line);border-radius:11px;transition:border-color .15s,box-shadow .15s,background .15s}
textarea{resize:vertical;min-height:62px}
input::placeholder,textarea::placeholder{color:#94a3b8}
input:focus,textarea:focus,select:focus{outline:none;background:var(--bg);border-color:var(--brand);box-shadow:0 0 0 4px var(--ring)}
.amount{display:block;position:relative}
.amount .cur{position:absolute;left:14px;top:50%;transform:translateY(-50%);margin-top:3px;font-weight:800;font-size:20px;color:var(--muted)}
.amount input{padding-left:32px;font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}
button,.btn-secondary{display:inline-block;width:100%;padding:14px;margin-top:2px;border:0;border-radius:12px;cursor:pointer;font:800 16px Jakarta,system-ui,sans-serif;color:#fff;background:var(--brand);text-align:center;text-decoration:none;transition:background .15s,transform .15s}
button:hover{background:var(--brand-deep);transform:translateY(-1px)}
.btn-secondary{background:var(--brand-soft);color:var(--fg);margin-top:18px}
.btn-secondary:hover{filter:brightness(.97)}
.fine{font-size:12px;color:var(--muted);margin:10px 0 0}
.notice{border-radius:10px;padding:10px 14px;margin:0 0 14px;font-size:14px}
.notice ul{margin:0;padding-left:18px}
.error{background:var(--err);color:var(--err-fg)}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

.thanks{text-align:center;padding:40px 28px}
.thanks-icon{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--brand-soft);color:var(--brand);margin-bottom:14px}
.thanks-icon svg{width:28px;height:28px}
.thanks h2{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:0 0 6px}
.thanks p{color:var(--muted);margin:0 auto;max-width:360px}
.thanks p b{color:var(--fg)}

/* Short laptop screens: tighten so everything still fits without scrolling */
@media (min-width:961px) and (max-height:740px){
  .domain{margin-top:12px}
  .stat-lead{margin-top:20px;padding:12px 18px 12px 12px}
  .stat-icon{width:44px;height:44px}
  .contact{margin-top:18px}
  .panel-head{margin-bottom:10px}
  .typewriter{margin-top:10px}
  .help{margin-top:4px}
  .how{margin-bottom:12px;padding-top:12px}
  label{margin-bottom:9px}
  input,textarea{padding:9px 12px}
  textarea{min-height:48px}
}

/* Tablet & phone: stack, normal scrolling */
@media (max-width:960px){
  .split{grid-template-columns:1fr;min-height:0}
  .showcase{padding:28px 24px 32px}
  .show-center{padding:12px 0 28px}
  .headline{font-size:clamp(34px,8.5vw,56px)}
  .how{display:none}
  .panel{padding:28px 20px 40px}
}
@media (max-width:520px){
  .art{width:170px;top:-18px;right:-28px;opacity:.12}
  .typewriter{white-space:normal}
  .showcase{padding:22px 16px 28px}
  .panel{padding:20px 16px 32px}
  .bidcard{padding:20px 16px}
}

/* ---------- Simple pages ---------- */
.simple{max-width:520px;margin:18vh auto 0;padding:0 16px;text-align:center}
.simple h1{font-size:32px;font-weight:800;letter-spacing:-.02em;margin:0 0 8px}
.simple p{color:var(--muted)}
.simple a{color:var(--brand)}

/* ---------- Admin ---------- */
.admin{background:var(--panel)}
.adminbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 20px;border-bottom:1px solid var(--line);background:var(--card)}
.adminbar nav{display:flex;gap:18px;align-items:center}
.adminbar a{text-decoration:none;font-weight:600}
.adminmain{padding:20px;max-width:1300px;margin:0 auto}
.adminmain h1{font-size:26px;font-weight:800;letter-spacing:-.02em}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px;margin:20px 0;box-shadow:var(--shadow)}
.card h2{margin:0 0 16px;font-size:20px;font-weight:800}
.narrow{max-width:460px}
.center-card{margin:12vh auto 0}
.admin button{width:auto;padding:10px 18px;font-size:14px}
.admin .center-card button{width:100%}
.admin button.small{padding:6px 10px;font-size:13px;margin:0}
.admin button.link{background:none;color:var(--fg);padding:0;font-weight:600;margin:0}
.admin .fine{text-align:left}
.inline{display:inline-flex;gap:6px;align-items:center;margin:0}
.warn{background:#fff7e6;color:#8a5300}
@media (prefers-color-scheme:dark){.warn{background:#3a2a0e;color:#ffd48a}}
tfoot td{border-bottom:0;background:var(--field)}
tr.selected td{background:var(--field)}
.visits-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:28px 0 12px}
.visits-head h2{margin:0;font-size:20px;font-weight:800}
.visits-head .filters{margin:0}
.visits-grid{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start}
@media (max-width:900px){.visits-grid{grid-template-columns:1fr}}
.countries{margin:0;padding:18px}
.countries h3{margin:0 0 10px;font-size:16px;font-weight:800}
.countries ol{list-style:none;margin:0;padding:0}
.countries li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:14px}
.countries li:last-child{border-bottom:0}
.flag{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.pager{display:flex;justify-content:space-between;align-items:center;margin:12px 4px}
.pager a{font-weight:700;text-decoration:none}
.quick-action{display:flex;margin-top:6px}
.admin button.btn-reject{background:transparent;color:#b42318;border:1px solid #f3b4ae}
.admin button.btn-reject:hover{background:#fdecec}
.admin button.btn-restore{background:transparent;color:var(--fg);border:1px solid var(--line)}
.admin button.btn-restore:hover{background:var(--field)}
.inline select{width:auto;margin:0;padding:6px 8px}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}
.filters select{width:auto;margin:0}
.tablewrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:14px}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.num{text-align:right;font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}
.msg{max-width:320px;white-space:pre-wrap;word-break:break-word}
.muted{color:var(--muted)}
.small{font-size:12px}
tr.status-spam,tr.status-rejected{opacity:.5}
.badge{font-size:12px;padding:2px 8px;border-radius:99px;border:1px solid var(--line)}
.badge-for_sale{color:#17643a;background:#e7f6ec;border-color:transparent}
.badge-sold{color:#2357d9}
.badge-hidden{color:var(--muted)}
code{font-size:.9em}
