:root{--bg: #000000;--ink: #f4efe6;--dim: #8f8578;--faint: #5d564c;--surface: rgba(255, 255, 255, .035);--surface-2: rgba(255, 255, 255, .06);--border: rgba(255, 255, 255, .1);--border-strong: rgba(255, 255, 255, .18);--accent: #dfa13c;--flame: #d1503f;--ok: #8bb56a;--mono: ui-monospace, "JetBrains Mono", "SFMono-Regular", "Cascadia Code", Menlo, Consolas, monospace;--r-card: 18px;--r-input: 11px}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--mono);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(65vw 60vh at 12% -8%,rgba(223,161,60,.13),transparent 62%),radial-gradient(60vw 60vh at 108% 112%,rgba(181,55,42,.12),transparent 62%),radial-gradient(40vw 30vh at 70% 20%,rgba(223,161,60,.04),transparent 70%);pointer-events:none}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");pointer-events:none}::selection{background:#dfa13c59;color:var(--ink)}#app{max-width:52rem;margin:0 auto;padding:2.2rem 1.25rem 6rem}h1{margin:0;font-weight:700;font-size:clamp(1.9rem,6vw,2.9rem);letter-spacing:-.02em;line-height:1.02}h1 .thin{color:var(--dim);font-weight:400}.kicker{display:inline-flex;align-items:center;font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}.kicker.flame{color:var(--flame)}.muted{color:var(--dim);font-size:.85rem}.error{color:var(--flame)}.tag{display:inline-flex;align-items:center;gap:.4rem;padding:.28rem .7rem;border:1px solid var(--border);border-radius:999px;font-size:.7rem;letter-spacing:.06em;color:var(--dim);text-transform:uppercase}.tag.ok{color:var(--ok);border-color:#8bb56a59}.tag.warn{color:var(--flame);border-color:#d1503f66}.card{background:linear-gradient(168deg,#fff1,#ffffff05 55%);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border:1px solid var(--border);border-radius:var(--r-card);padding:1.35rem 1.45rem;box-shadow:inset 0 1px #ffffff17,0 24px 48px -28px #000000e6}.card+.card{margin-top:1.15rem}textarea,input,select{width:100%;background:#00000059;color:var(--ink);border:1px solid var(--border);border-radius:var(--r-input);padding:.75rem .85rem;font-family:inherit;font-size:.92rem}textarea{min-height:11rem;resize:vertical;line-height:1.5}textarea:focus,input:focus,select:focus{outline:none;border-color:#dfa13c8c;background:#00000080;box-shadow:0 0 0 3px #dfa13c1f}button:focus-visible,a:focus-visible{outline:2px solid rgba(223,161,60,.7);outline-offset:2px}label.field{display:block}label.field>.kicker{display:block;margin-bottom:.5rem}button{font-family:var(--mono);cursor:pointer;border-radius:var(--r-input);border:1px solid transparent;font-size:.82rem;font-weight:700;letter-spacing:.03em;padding:.7rem 1.2rem;background:var(--ink);color:#000;transition:transform .06s ease,background .15s ease,border-color .15s ease}button:hover{transform:translateY(-1px)}button:active{transform:translateY(0)}button:disabled{opacity:.4;cursor:default;transform:none}button.outline{background:transparent;color:var(--ink);border-color:var(--border-strong)}button.outline:hover{border-color:var(--ink);background:var(--surface-2)}button.ghost{background:transparent;color:var(--dim);border-color:var(--border);padding:.5rem .85rem;font-size:.76rem}button.ghost:hover{color:var(--ink);border-color:var(--border-strong)}button.icon{background:transparent;border-color:var(--border);color:var(--dim);padding:.5rem .7rem;display:inline-flex;align-items:center;gap:.45rem}button.icon:hover{color:var(--ink);border-color:var(--border-strong)}button.iconbtn{padding:.6rem;display:inline-flex;align-items:center;justify-content:center;line-height:0}button.iconbtn svg{display:block;flex-shrink:0}.seg{display:inline-flex;background:#0006;border:1px solid var(--border);border-radius:999px;padding:4px;gap:2px}.seg button{background:transparent;color:var(--dim);border:none;border-radius:999px;padding:.5rem 1.05rem;font-size:.76rem;letter-spacing:.04em;transform:none}.seg button:hover{color:var(--ink);transform:none;background:var(--surface)}.seg button.active{background:var(--ink);color:#000}.seg button.active:hover{background:var(--ink)}pre{background:#00000073;border:1px solid var(--border);border-radius:var(--r-input);padding:1rem;margin:0;overflow:auto;white-space:pre-wrap;word-break:break-word;font-size:.85rem;color:var(--ink)}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.row-between{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.stack{display:flex;flex-direction:column;gap:.85rem}.inline{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}.view-enter-active{transition:opacity .18s ease,transform .18s ease}.view-leave-active{transition:opacity .12s ease}.view-enter-from{opacity:0;transform:translateY(8px)}.view-leave-to{opacity:0}@media (prefers-reduced-motion: reduce){*,*:before,*:after{transition:none!important;animation:none!important}}*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
