:root{--r:14px;--font:"Inter Variable",Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono:ui-monospace,"JetBrains Mono","Cascadia Code",Consolas,monospace}
[data-theme=pink]{--bg:#0b0610;--bg2:#140a18;--card:rgba(28,14,32,.62);--line:rgba(255,255,255,.09);--txt:#f6eef7;--mut:#b49cb8;--acc:#FF2A6D;--acc2:#b44cff;--acc3:#00e5ff;--glow:rgba(255,42,109,.45);--chip:rgba(255,42,109,.12)}
[data-theme=gold]{--bg:#0c0a07;--bg2:#15110a;--card:rgba(30,24,14,.66);--line:rgba(255,220,150,.12);--txt:#f5ecd9;--mut:#bba57c;--acc:#d9a441;--acc2:#a8743a;--acc3:#f3d58a;--glow:rgba(217,164,65,.4);--chip:rgba(217,164,65,.13)}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--txt);font-family:var(--font);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}
body{min-height:100vh;overflow-x:hidden}
.aurora{position:fixed;inset:-20%;z-index:-1;pointer-events:none;filter:blur(70px) saturate(140%);opacity:.55;background:
 radial-gradient(40% 35% at 20% 20%,var(--acc) 0,transparent 70%),radial-gradient(35% 30% at 80% 10%,var(--acc2) 0,transparent 70%),radial-gradient(40% 40% at 60% 90%,var(--acc3) 0,transparent 75%);animation:aur 22s ease-in-out infinite alternate}
@keyframes aur{0%{transform:translate3d(0,0,0) rotate(0)}100%{transform:translate3d(-4%,3%,0) rotate(8deg)}}
.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;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 baseFrequency='.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
a{color:var(--acc)}
header.top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:12px;padding:10px 18px;background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);flex-wrap:wrap}
.logo{font-weight:800;letter-spacing:.02em;font-size:17px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.logo b{background:linear-gradient(90deg,var(--acc),var(--acc3));-webkit-background-clip:text;background-clip:text;color:transparent}
.logo .dot{width:10px;height:10px;border-radius:50%;background:var(--acc);box-shadow:0 0 14px var(--acc)}
.spacer{flex:1}
.seg{display:inline-flex;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:999px;padding:3px;gap:2px}
.seg button{all:unset;cursor:pointer;padding:6px 12px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--mut);transition:.2s}
.seg button[aria-pressed=true]{background:var(--acc);color:#fff;box-shadow:0 0 18px var(--glow)}
[data-theme=gold] .seg button[aria-pressed=true]{color:#1a1206}
.btn{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.04);font-weight:600;font-size:13px;transition:.18s;white-space:nowrap}
.btn:hover{border-color:var(--acc);box-shadow:0 0 0 3px var(--chip)}
.btn:focus-visible,.seg button:focus-visible,.chip:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.btn.pri{background:linear-gradient(135deg,var(--acc),var(--acc2));border-color:transparent;color:#fff}
[data-theme=gold] .btn.pri{color:#1a1206}
.btn.sm{padding:5px 9px;font-size:12px;border-radius:8px}
.btn.danger:hover{border-color:#ff5a5a;box-shadow:0 0 0 3px rgba(255,90,90,.15)}
kbd{font-family:var(--mono);font-size:11px;padding:1px 6px;border-radius:6px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--mut)}
nav.tabs{display:flex;gap:6px;padding:10px 18px 0;overflow-x:auto;scrollbar-width:none}
nav.tabs button{all:unset;cursor:pointer;padding:9px 14px;border-radius:10px 10px 0 0;color:var(--mut);font-weight:650;font-size:13px;border-bottom:2px solid transparent;white-space:nowrap}
nav.tabs button[aria-selected=true]{color:var(--txt);border-color:var(--acc);background:linear-gradient(to top,var(--chip),transparent)}
main{padding:16px 18px 110px;max-width:1500px;margin:0 auto}
.view{display:none}.view.on{display:block;animation:fade .28s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px}
@media (max-width:980px){.grid{grid-template-columns:1fr}}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px;backdrop-filter:blur(14px);box-shadow:0 10px 40px rgba(0,0,0,.35)}
.card+.card{margin-top:14px}
.card h3{margin:0 0 10px;font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);display:flex;align-items:center;gap:8px}
.card h3 .tag{font-size:10px;letter-spacing:.05em;padding:2px 7px;border-radius:999px;background:var(--chip);color:var(--acc)}
.beam{overflow:hidden}.beam::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--a,0deg),transparent 0 70%,var(--acc) 85%,var(--acc3) 92%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:beam 6s linear infinite;pointer-events:none}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes beam{to{--a:360deg}}
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
label.f{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:var(--mut);font-weight:600}
input,select,textarea{font:inherit;color:var(--txt);background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:9px;padding:8px 10px;outline:none;transition:.15s;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px var(--chip)}
select option{background:var(--bg2)}
textarea{resize:vertical;min-height:64px}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chips{display:flex;flex-wrap:wrap;gap:6px;min-height:28px}
.chip{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.035);font-size:12.5px;transition:.15s}
.chip:hover{border-color:var(--acc)}
.chip.on{background:var(--chip);border-color:var(--acc);color:var(--txt);box-shadow:0 0 10px var(--glow)}
.chip .w{font-family:var(--mono);font-size:10.5px;color:var(--acc)}
.chip .md{margin-left:4px;opacity:.6;cursor:pointer}.chip .md:hover{opacity:1}.gl{text-decoration:underline dotted;text-underline-offset:3px}
.chip .x{opacity:.6}.chip .x:hover{opacity:1}
.chip.lock{border-style:dashed;cursor:not-allowed;background:rgba(255,80,80,.1);border-color:rgba(255,80,80,.5)}
.chip.warn{border-color:#ffb020}
.out{position:relative}
.out pre{margin:0;white-space:pre-wrap;word-break:break-word;font-family:var(--mono);font-size:12.5px;background:rgba(0,0,0,.35);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-height:44px;max-height:320px;overflow:auto}
.out .meta{display:flex;justify-content:space-between;align-items:center;margin:8px 0 6px;font-size:12px;color:var(--mut);gap:8px;flex-wrap:wrap}
.out .meta b{color:var(--txt);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase}
.count{font-family:var(--mono);font-size:11px;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.06)}
.count.ok{color:#5ee6a8}.count.hi{color:#ffb020}.count.bad{color:#ff6b6b}
.bar{height:3px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:4px}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--acc3));transition:width .3s}
.lint{display:flex;flex-direction:column;gap:5px;margin-top:8px}
.lint div{font-size:12px;padding:6px 9px;border-radius:8px;border-left:3px solid #ffb020;background:rgba(255,176,32,.07)}
.lint div.err{border-color:#ff5a5a;background:rgba(255,90,90,.08)}
.lint div.ok{border-color:#5ee6a8;background:rgba(94,230,168,.06)}
.hint{font-size:12px;color:var(--mut)}
.sticky{position:sticky;top:120px}
@media (max-width:980px){.sticky{position:static}}
.dock{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:45;display:flex;gap:6px;padding:7px;border-radius:16px;background:color-mix(in srgb,var(--bg2) 82%,transparent);border:1px solid var(--line);backdrop-filter:blur(16px);box-shadow:0 18px 50px rgba(0,0,0,.5);max-width:calc(100vw - 16px);overflow-x:auto}
.toast{position:fixed;left:50%;top:70px;transform:translateX(-50%);z-index:80;padding:9px 16px;border-radius:999px;background:var(--acc);color:#fff;font-weight:700;box-shadow:0 0 30px var(--glow);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
[data-theme=gold] .toast{color:#1a1206}
.toast.show{opacity:1;transform:translateX(-50%) translateY(6px)}
.overlay{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);display:none;align-items:flex-start;justify-content:center;padding:10vh 12px}
.overlay.on{display:flex}
.palette{width:min(680px,100%);background:var(--bg2);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 90px rgba(0,0,0,.7);overflow:hidden}
.palette input{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:16px 18px;font-size:16px;background:transparent;box-shadow:none}
.plist{max-height:55vh;overflow:auto;padding:6px}
.pitem{display:flex;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:10px;cursor:pointer;font-size:13.5px}
.pitem small{color:var(--mut);font-size:11.5px;text-align:right}
.pitem.act{background:var(--chip);box-shadow:inset 2px 0 0 var(--acc)}
.pgroup{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);padding:8px 12px 4px}
.pfoot{display:flex;gap:12px;padding:8px 14px;border-top:1px solid var(--line);font-size:11.5px;color:var(--mut);flex-wrap:wrap}
.modal{width:min(720px,100%);background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:18px;max-height:80vh;overflow:auto}
.libgrid{display:grid;grid-template-columns:240px 1fr;gap:14px}
@media (max-width:760px){.libgrid{grid-template-columns:1fr}}
.cats{display:flex;flex-direction:column;gap:3px;max-height:70vh;overflow:auto}
@media (max-width:760px){.cats{flex-direction:row;flex-wrap:wrap;max-height:none}}
.cats button{all:unset;cursor:pointer;padding:6px 10px;border-radius:8px;font-size:12.5px;color:var(--mut)}
.cats button.on{background:var(--chip);color:var(--txt)}
.groupbox{margin-bottom:12px}.groupbox h4{margin:0 0 6px;font-size:12px;color:var(--acc);font-weight:650}
.src{font-size:9.5px;padding:0 5px;border-radius:5px;background:rgba(255,255,255,.08);color:var(--mut)}
iframe.unused{width:100%;height:calc(100vh - 170px);min-height:600px;border:1px solid var(--line);border-radius:var(--r);background:#000}
.posegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.pcard{all:unset;cursor:pointer;padding:10px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);transition:.18s}
.pcard:hover,.pcard.on{border-color:var(--acc);box-shadow:0 0 18px var(--glow);transform:translateY(-1px)}
.pcard b{display:block;font-size:13px}.pcard span{font-size:11px;color:var(--mut)}
.mark{background:rgba(255,90,90,.3);border-bottom:2px solid #ff5a5a;border-radius:3px}
.mark.dash{background:rgba(255,176,32,.3);border-color:#ffb020}
.slopview{white-space:pre-wrap;font-family:var(--font);font-size:13.5px;background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:10px;padding:12px;min-height:120px;max-height:420px;overflow:auto}
.lockline{display:flex;gap:8px;align-items:center;font-size:12px;color:#ff9a9a}
.switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:12.5px;user-select:none}
.switch input{appearance:none;width:34px;height:19px;border-radius:999px;background:rgba(255,255,255,.12);position:relative;padding:0;border:0;cursor:pointer}
.switch input::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff;transition:.2s}
.switch input:checked{background:var(--acc)}.switch input:checked::after{left:17px}
details summary{cursor:pointer;color:var(--mut);font-size:12.5px;margin:6px 0}
.guide h4{color:var(--acc);margin:14px 0 6px}.guide p,.guide li{color:var(--txt);font-size:13px}.guide code{font-family:var(--mono);background:rgba(0,0,0,.35);padding:1px 5px;border-radius:5px;font-size:12px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.crafter-intro{max-width:1464px;margin:16px auto;padding:0 18px}.crafter-intro h1{font-size:23px;margin:12px 0 7px}.crafter-intro p{max-width:1100px;margin:7px 0}.crafter-intro nav{display:flex;gap:18px;flex-wrap:wrap}.crafter-intro a{font-weight:650}.copy-manual{width:min(760px,calc(100% - 28px));margin:14px auto;padding:16px;background:var(--bg2);border:2px solid var(--acc);border-radius:14px}.copy-manual textarea{min-height:170px}.copy-manual p{margin:6px 0}.view[hidden]{display:none!important}
.copy-fallback{position:fixed;left:1rem;right:1rem;bottom:6rem;z-index:120;max-width:780px;margin:0 auto!important;background:var(--bg2);border:2px solid var(--acc);box-shadow:0 12px 50px #0009}.copy-fallback textarea{min-height:8rem;max-height:35vh}.copy-fallback button{margin-top:8px}

/* Native keyboard controls preserve the credited chip presentation. */
.chip-group{display:inline-flex;align-items:center;gap:2px;border-radius:999px}
.chip-group.warn{outline:1px solid #ffb020}
.chip-action{padding-inline:7px}
.pitem{font:inherit;color:inherit;text-align:left;width:100%;border:0;background:transparent;cursor:pointer}
button:focus-visible,[role="tabpanel"]:focus-visible,.chips:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.pfoot{flex-wrap:wrap;align-items:center}

/* Persistent warning: transient toasts are not a durable backup guarantee. */
.storage-warning:not([hidden]){padding:12px 14px;border:1px solid #e4ad48;border-radius:10px;background:#34280f;color:#fff2ce;font-size:14px;line-height:1.55}