/* WolfDomains · domains.wolfstack.io · v1.0 — tokens de marca WolfStack */
:root{
  --paper:#FBFAF7; --surface:#FFFFFF; --surface-2:#F3F1EC; --ink:#14181A; --soft:#5C666B; --faint:#8C959A;
  --rule:#DDD9D0; --rule-2:#C9C4B8;
  --accent:#5B47E0; --accent-soft:#ECE9FC; --on-accent:#FFFFFF;
  --good:#1C6B4A; --good-soft:#E3F1EA; --crit:#B32D1B; --crit-soft:#F8E6E2; --high:#8A5A00; --high-soft:#F7EDD6;
  --van:#FFFFFF; --van-line:#C9C4B8; --tire:#23292C;
  --shadow:0 1px 2px rgba(20,24,26,.05),0 14px 40px rgba(20,24,26,.08);
  --display:"Poppins",system-ui,sans-serif; --body:"Inter",system-ui,sans-serif; --mono:"DM Mono",ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --paper:#111416; --surface:#181C1F; --surface-2:#1F2427; --ink:#EFEDE8; --soft:#9CA5A9; --faint:#6D777C;
    --rule:#2A3135; --rule-2:#3A4348;
    --accent:#8E80F5; --accent-soft:#25213F; --on-accent:#111416;
    --good:#4CC38A; --good-soft:#15291F; --crit:#F07A66; --crit-soft:#33191430; --high:#E4B45A; --high-soft:#2E2412;
    --van:#E9E7E1; --van-line:#8C959A; --tire:#050606;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 14px 40px rgba(0,0,0,.35);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --paper:#111416; --surface:#181C1F; --surface-2:#1F2427; --ink:#EFEDE8; --soft:#9CA5A9; --faint:#6D777C;
  --rule:#2A3135; --rule-2:#3A4348;
  --accent:#8E80F5; --accent-soft:#25213F; --on-accent:#111416;
  --good:#4CC38A; --good-soft:#15291F; --crit:#F07A66; --crit-soft:#33191430; --high:#E4B45A; --high-soft:#2E2412;
  --van:#E9E7E1; --van-line:#8C959A; --tire:#050606;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 14px 40px rgba(0,0,0,.35);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:15.5px;line-height:1.55;-webkit-font-smoothing:antialiased;margin:0;padding-inline:18px;padding-block:0 120px}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.wrap{max-width:1120px;margin:0 auto}

.bar{display:flex;align-items:center;gap:14px;padding-block:16px;border-bottom:1px solid var(--ink);flex-wrap:wrap}
.mark{font-family:var(--display);font-weight:900;font-size:19px;letter-spacing:-.03em}
.mark b{color:var(--accent)}
.bar-r{margin-left:auto;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.bar-r b{color:var(--high);font-weight:500}

.grid{display:grid;gap:32px;padding-top:40px}
.intro{order:0}.show{order:1}.list{order:2;min-width:0}.intro{min-width:0}
@media (min-width:960px){.grid{grid-template-columns:minmax(0,1fr) 470px;column-gap:56px;row-gap:0;align-items:start}.intro{grid-column:1;grid-row:1}.list{grid-column:1;grid-row:2}.show{grid-column:2;grid-row:1/span 2}}

.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--soft)}
h1{font-family:var(--display);font-weight:900;font-size:clamp(32px,6vw,54px);line-height:1.03;letter-spacing:-.035em;margin:12px 0 0;text-wrap:balance}
.sub{color:var(--soft);font-size:16px;max-width:52ch;margin:14px 0 0}

.search{margin-top:28px}
.lbl{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);margin-bottom:8px}
.field{display:flex;border:2px solid var(--ink);background:var(--surface);border-radius:4px}
.field:focus-within{box-shadow:4px 4px 0 var(--accent)}
.field input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-family:var(--display);font-weight:700;font-size:clamp(19px,4.2vw,26px);letter-spacing:-.02em;padding:14px 16px}
.go{background:var(--ink);color:var(--paper);font-family:var(--display);font-weight:700;font-size:15px;padding:0 22px;border-radius:0}
.go:hover{background:var(--accent);color:var(--on-accent)}
.try{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--faint);align-items:center}
.try button{font-family:var(--mono);font-size:12px;color:var(--soft);border-bottom:1px dashed var(--rule-2);padding:2px 0;margin-right:8px}
.try button:hover{color:var(--accent);border-color:var(--accent)}
.err{color:var(--crit);font-size:14px;margin-top:10px}

/* libro de resultados */
.ledger{margin-top:34px}
.l-head{display:flex;align-items:baseline;gap:10px;padding-bottom:9px;border-bottom:1px solid var(--ink)}
.l-head h2{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--soft);margin:0}
.l-count{margin-left:auto;font-family:var(--mono);font-size:12px;color:var(--soft);font-variant-numeric:tabular-nums}
.row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:14px 4px;border-bottom:1px solid var(--rule);width:100%;text-align:left;transition:background .15s}
.row[data-sel]{cursor:pointer}
.row[data-sel]:hover{background:var(--surface-2)}
.row.pick{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
.dom{font-family:var(--mono);font-size:16.5px;overflow-wrap:anywhere}
.dom .t{color:var(--accent)}
.row.taken .dom{color:var(--faint);text-decoration:line-through;text-decoration-thickness:1px}
.row.taken .dom .t{color:var(--faint)}
.meta{grid-column:1;font-size:12.5px;color:var(--soft)}
.right{grid-row:1/span 2;grid-column:2;display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.tag{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:3px 7px;border-radius:3px;white-space:nowrap}
.tag.wait{color:var(--faint)}
.tag.wait::after{content:"";display:inline-block;width:18px;margin-left:4px;border-bottom:1px dotted var(--faint);animation:dots 1s steps(3) infinite}
@keyframes dots{from{width:4px}to{width:18px}}
.tag.available{color:var(--good);background:var(--good-soft)}
.tag.taken{color:var(--crit);background:var(--crit-soft)}
.tag.premium{color:var(--high);background:var(--high-soft)}
.tag.manual{color:var(--soft);border:1px solid var(--rule-2)}
.pr{font-family:var(--display);font-weight:700;font-size:16px;font-variant-numeric:tabular-nums;white-space:nowrap}
.pr small{font-family:var(--body);font-weight:400;font-size:12px;color:var(--soft)}
.row.fresh{animation:ink .6s ease}
@keyframes ink{from{background:var(--accent-soft)}}
.alts{margin-top:18px;font-size:14px;color:var(--soft)}
.alts-list{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px}
.alt{font-family:var(--mono);font-size:13.5px;color:var(--ink);border-bottom:1px solid var(--rule-2)}
.alt:hover{color:var(--accent);border-color:var(--accent)}
.alt[data-s="taken"]{color:var(--faint);text-decoration:line-through;pointer-events:none;border-color:transparent}
.alt[data-s="wait"]{color:var(--faint)}

/* vitrina */
.show{position:relative}
@media (min-width:960px){.show{position:sticky;top:calc(env(safe-area-inset-top,0px) + 20px)}}
.show-card{background:var(--surface);border:1px solid var(--rule);box-shadow:var(--shadow);padding:22px;border-radius:6px;position:relative;overflow:hidden}
.show-t{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:16px}
.van{width:100%;height:auto;display:block}
.van text{font-family:var(--display)}
.mock{margin-top:18px;display:grid;gap:12px}
.browser{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--rule);border-radius:999px;background:var(--surface-2);font-family:var(--mono);font-size:13.5px;min-width:0}
.lock{width:13px;height:13px;flex:0 0 auto;color:var(--good)}
.browser .u{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.browser .u b{font-weight:500;color:var(--ink)}
.browser .u span{color:var(--faint)}
.sig{border-left:3px solid var(--accent);padding:4px 0 4px 12px;font-size:13.5px;line-height:1.5}
.sig b{font-family:var(--display);font-weight:700;display:block;font-size:14.5px}
.sig .m{font-family:var(--mono);font-size:12.5px;color:var(--accent);overflow-wrap:anywhere}
.stamp{position:absolute;right:18px;top:62px;transform:rotate(-8deg) scale(1);padding:8px 14px 9px;border:2.5px solid currentColor;box-shadow:0 0 0 1.5px var(--surface),0 0 0 4px currentColor;font-family:var(--display);font-weight:900;font-size:20px;letter-spacing:.02em;text-transform:uppercase;line-height:1;background:var(--surface);transition:color .2s}
.stamp small{display:block;font-family:var(--mono);font-weight:500;font-size:9.5px;letter-spacing:.12em;margin-top:4px}
.stamp.available{color:var(--good)} .stamp.taken{color:var(--crit)} .stamp.premium{color:var(--high)} .stamp.manual,.stamp.wait{color:var(--soft)}
.stamp.hit{animation:thud .42s cubic-bezier(.2,1.6,.4,1)}
@keyframes thud{0%{transform:rotate(-14deg) scale(1.9);opacity:0}100%{transform:rotate(-8deg) scale(1);opacity:1}}
.show-cta{margin-top:18px;display:flex;align-items:center;gap:14px;padding-top:16px;border-top:1px dashed var(--rule-2);flex-wrap:wrap}
.show-cta .big{font-family:var(--display);font-weight:900;font-size:26px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.show-cta .big small{font-family:var(--body);font-weight:400;font-size:13px;color:var(--soft);letter-spacing:0}
.buy{margin-left:auto;background:var(--accent);color:var(--on-accent);font-family:var(--display);font-weight:700;font-size:15px;padding:14px 22px;border-radius:4px}
.buy:hover{filter:brightness(1.08)}
.buy:disabled{background:var(--surface-2);color:var(--faint);cursor:default;filter:none}
.note{font-size:12.5px;color:var(--soft);margin-top:10px}

.facts{margin-top:40px;border-top:1px solid var(--ink)}
.facts li{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:13px 0;border-bottom:1px solid var(--rule);font-size:14.5px}
.facts{list-style:none;padding:0}
.facts b{font-family:var(--display);font-weight:600}
.facts span{color:var(--soft)}
@media (max-width:520px){.facts li{grid-template-columns:1fr;gap:2px}}

/* hoja compartida (checkout) */
.scrim{position:fixed;inset:0;z-index:40;background:rgba(20,24,26,.5);backdrop-filter:blur(3px);display:flex;align-items:flex-end;justify-content:center}
@media (min-width:700px){.scrim{align-items:center;padding:20px}}
.sheet{background:var(--surface);color:var(--ink);width:100%;max-width:540px;max-height:92vh;overflow-y:auto;padding:24px 22px calc(24px + env(safe-area-inset-bottom,0px));border-top:3px solid var(--ink);animation:rise .3s ease;
}
@keyframes rise{from{transform:translateY(30px);opacity:0}}
.sh-top{display:flex;align-items:flex-start;gap:12px}
.sh-top h2{font-family:var(--display);font-weight:900;font-size:24px;letter-spacing:-.025em;margin:4px 0 0;overflow-wrap:anywhere}
.x{margin-left:auto;width:34px;height:34px;border:1px solid var(--rule-2);border-radius:4px;color:var(--soft);font-size:18px;flex:0 0 auto}
.lines{margin:18px 0;font-family:var(--mono);font-size:13.5px;border-top:1px dashed var(--rule-2)}
.ln{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed var(--rule-2)}
.ln span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.ln.tot{font-family:var(--display);font-weight:900;font-size:18px;border-bottom:0}
.inc0{color:var(--good)}
.sec{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:22px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--ink)}
.fs{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.fs .full{grid-column:1/-1}
@media (max-width:480px){.fs{grid-template-columns:1fr}}
label.f{display:grid;gap:5px;font-family:var(--mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--soft)}
.f input{font-family:var(--body);font-size:15px;letter-spacing:0;text-transform:none;color:var(--ink);background:var(--paper);border:1px solid var(--rule-2);border-radius:3px;padding:11px 12px;width:100%}
.f input:focus{outline:2px solid var(--accent);outline-offset:0}
.ack{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--soft);margin-top:14px}
.ack input{margin-top:3px;accent-color:var(--accent)}
.ack.prem{color:var(--high)}
.pay{width:100%;margin-top:20px;padding:16px;background:var(--accent);color:var(--on-accent);border-radius:4px}
.pay:hover{background:var(--accent);filter:brightness(1.08)}
.pay:disabled{opacity:.55;cursor:default}
.fine{font-size:12px;color:var(--soft);text-align:center;margin-top:12px}
.formerr{color:var(--crit);font-size:13.5px;margin-top:10px}
.prov h2{font-family:var(--display);font-weight:900;font-size:clamp(26px,6vw,34px);line-height:1.05;letter-spacing:-.03em;margin:8px 0 0;overflow-wrap:anywhere}
.prov .browser{margin:18px 0 4px}
.prov .lock{color:var(--faint);transition:color .3s}
.prov .browser.ok .lock{color:var(--good)}
.typed{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.caret{display:inline-block;width:1px;height:15px;background:var(--accent);vertical-align:-3px;animation:blink 1s step-end infinite}
@keyframes blink{50%{opacity:0}}
.steps{list-style:none;padding:0;margin:16px 0 0}
.st{display:grid;grid-template-columns:28px 1fr;gap:12px;padding:10px 0;border-bottom:1px dashed var(--rule-2);opacity:.4;transition:opacity .3s}
.st:last-child{border-bottom:0}
.st.on,.st.done{opacity:1}
.dotc{width:22px;height:22px;border:1.5px solid var(--rule-2);display:grid;place-items:center;font-family:var(--mono);font-size:11px;border-radius:2px}
.st.on .dotc{border-color:var(--accent);color:var(--accent)}
.st.done .dotc{background:var(--good);border-color:var(--good);color:var(--surface)}
.st b{display:block;font-weight:600;font-size:14.5px}
.st span{font-size:13px;color:var(--soft)}
.foot{margin-top:50px;padding-top:16px;border-top:1px solid var(--rule);font-size:12px;color:var(--soft);line-height:1.7}

/* página de estado (/ready) */
.ready{max-width:620px;margin:0 auto;padding-top:48px}
.ready .prov h2{font-size:clamp(30px,7vw,44px)}
.ready .card{background:var(--surface);border:1px solid var(--rule);box-shadow:var(--shadow);padding:26px 22px;border-radius:6px;margin-top:24px}
.msg{margin-top:18px;padding:14px 16px;border-left:3px solid var(--accent);background:var(--surface-2);font-size:14.5px}
.msg.bad{border-color:var(--crit)}
.msg.warn{border-color:var(--high)}
.back{display:inline-block;margin-top:22px;font-family:var(--display);font-weight:700;color:var(--accent);text-decoration:none;border-bottom:1.5px solid currentColor}

/* herramientas de la barra: tema e idioma (mismo patrón que las plantillas WolfStack) */
.tools{display:flex;align-items:center;gap:8px}
.bar-r+.tools{margin-left:0}
.bar-r{margin-left:auto}
@media (max-width:560px){.bar-r{display:none}.tools{margin-left:auto}}
.theme-toggle{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:999px;border:0;background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--rule-2)}
.theme-toggle:hover{box-shadow:inset 0 0 0 1.5px var(--accent);color:var(--accent)}
.theme-toggle svg{width:16px;height:16px}
.theme-toggle .i-sun{display:none}
:root[data-theme="dark"] .theme-toggle .i-sun{display:block}
:root[data-theme="dark"] .theme-toggle .i-moon{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .theme-toggle .i-sun{display:block}:root:not([data-theme="light"]) .theme-toggle .i-moon{display:none}}
.lang-toggle{display:inline-flex;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule-2);padding:3px}
.lang-toggle button{border:0;background:transparent;color:var(--soft);padding:.3em .7em;border-radius:999px;font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.06em}
.lang-toggle button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}