:root{color-scheme:dark;--bg-0: #05070d;--bg-1: #0b1020;--bg-2: rgba(255, 255, 255, .04);--border: rgba(255, 255, 255, .09);--border-strong: rgba(255, 255, 255, .18);--text: #e6ecff;--text-dim: #9aa3bd;--accent: #7c5cff;--accent-2: #22d3ee;--ok: #34d399;--err: #f87171;--warn: #fbbf24;--mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--text);background:radial-gradient(1200px 800px at 10% -10%,rgba(124,92,255,.25),transparent 60%),radial-gradient(1000px 700px at 110% 10%,rgba(34,211,238,.18),transparent 60%),linear-gradient(180deg,var(--bg-1),var(--bg-0));min-height:100%;-webkit-font-smoothing:antialiased}.shell{max-width:1180px;margin:0 auto;padding:40px 24px 80px}.hero{display:flex;align-items:baseline;gap:14px;margin-bottom:28px;flex-wrap:wrap}.hero h1{font-size:28px;margin:0;letter-spacing:-.02em}.hero .tag{padding:4px 10px;border-radius:999px;font-size:12px;color:var(--accent-2);background:#22d3ee1a;border:1px solid rgba(34,211,238,.35);font-family:var(--mono)}.hero p{color:var(--text-dim);margin:6px 0 0;flex-basis:100%;font-size:14px}.tabs{display:inline-flex;padding:4px;background:#ffffff0a;border:1px solid var(--border);border-radius:12px;gap:4px;margin-bottom:20px}.tabs button{background:transparent;border:0;color:var(--text-dim);padding:8px 14px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500}.tabs button.active{background:linear-gradient(180deg,#7c5cff59,#7c5cff26);color:#fff;box-shadow:inset 0 0 0 1px #ffffff0f}.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media (max-width: 900px){.grid{grid-template-columns:1fr}}.card{background:linear-gradient(180deg,#ffffff0d,#ffffff05);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:0 20px 40px #00000059}.card h2{font-size:15px;margin:0 0 4px;letter-spacing:.02em;text-transform:uppercase;color:var(--text-dim);font-weight:600}.card .lead{color:var(--text);font-size:20px;font-weight:600;margin:0 0 16px;letter-spacing:-.01em}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.field label{font-size:12px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.06em}.field input{background:var(--bg-2);border:1px solid var(--border);border-radius:10px;padding:10px 12px;color:var(--text);font-family:var(--mono);font-size:14px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #7c5cff2e}.hint{font-size:11px;color:var(--text-dim);font-family:var(--mono)}.row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}button.primary,button.ghost,button.chip{cursor:pointer;font-size:13px;padding:10px 14px;border-radius:10px;border:1px solid var(--border);color:var(--text);background:#ffffff0a;transition:transform .05s ease,background .15s ease,border-color .15s ease}button.primary{background:linear-gradient(180deg,#7c5cff,#5b3cf0);border-color:#ffffff24;font-weight:600}button.primary:hover{filter:brightness(1.1)}button.chip{padding:6px 10px;font-size:12px;border-radius:999px;color:var(--text-dim)}button.chip:hover{color:var(--text);border-color:var(--border-strong)}button:active{transform:translateY(1px)}.result{margin-top:16px;border-top:1px dashed var(--border);padding-top:16px}.kv{display:grid;grid-template-columns:160px 1fr auto;gap:8px 12px;align-items:center;padding:6px 0;border-bottom:1px dotted rgba(255,255,255,.06)}.kv:last-child{border-bottom:0}.kv .k{font-size:12px;color:var(--text-dim);letter-spacing:.04em;text-transform:uppercase}.kv .v{font-family:var(--mono);font-size:13px;color:var(--text);word-break:break-all}.kv .v.accent{color:var(--accent-2)}.kv .v.pill{display:inline-block;padding:3px 8px;border-radius:6px;background:#7c5cff24;border:1px solid rgba(124,92,255,.4)}.big{font-family:var(--mono);font-size:18px;color:#fff;background:linear-gradient(180deg,#7c5cff29,#22d3ee0f);border:1px solid rgba(124,92,255,.35);padding:14px 16px;border-radius:12px;word-break:break-all;letter-spacing:.04em}.status{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:600;font-family:var(--mono)}.status.ok{background:#34d3991f;color:var(--ok);border:1px solid rgba(52,211,153,.35)}.status.err{background:#f871711f;color:var(--err);border:1px solid rgba(248,113,113,.35)}.status .dot{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}.error-box{margin-top:10px;padding:10px 12px;border-radius:10px;background:#f8717114;border:1px solid rgba(248,113,113,.35);color:#fecaca;font-family:var(--mono);font-size:12.5px}.spec{margin-top:26px}.spec table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12.5px}.spec th,.spec td{padding:8px 10px;text-align:left;border-bottom:1px dotted rgba(255,255,255,.07)}.spec th{color:var(--text-dim);font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:11px}.footer{margin-top:40px;color:var(--text-dim);font-size:12px;text-align:center}.footer code{font-family:var(--mono);color:var(--text)}.copy-flash{color:var(--ok);font-size:11px;font-family:var(--mono);margin-left:6px}
