:root{
  color-scheme:dark;--bg:#0a0a0f;--fg:#e0e0e0;--card:#12121a;--muted:#1c1c2e;--muted-fg:#858c9c;
  --green:#00ff88;--pink:#ff00ff;--cyan:#00d4ff;--border:#2a2a3a;--red:#ff3366;
  --cut:polygon(0 11px,11px 0,calc(100% - 11px) 0,100% 11px,100% calc(100% - 11px),calc(100% - 11px) 100%,11px 100%,0 calc(100% - 11px));
  --cut-sm:polygon(0 7px,7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px));
}
*{box-sizing:border-box}html{background:var(--bg);min-height:100%}body{margin:0;min-height:100vh;color:var(--fg);font-family:"JetBrains Mono",Consolas,monospace;line-height:1.5;background:radial-gradient(circle at 8% 0,rgba(255,0,255,.09),transparent 28rem),radial-gradient(circle at 90% 10%,rgba(0,212,255,.08),transparent 30rem),var(--bg);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-1;background-image:linear-gradient(rgba(0,255,136,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,136,.028) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(#000,rgba(0,0,0,.4),transparent)}
body:after{content:"";position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.22;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.36) 2px,rgba(0,0,0,.36) 4px)}
[hidden]{display:none!important}button,input,textarea,select{font:inherit}button{touch-action:manipulation}.scan-beam{position:fixed;z-index:998;left:0;top:-18vh;width:100%;height:14vh;pointer-events:none;background:linear-gradient(transparent,rgba(0,255,136,.13),transparent);animation:scan 11s linear infinite}
.site-header{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem clamp(.8rem,4vw,3rem);border-bottom:1px solid rgba(0,255,136,.22);background:rgba(10,10,15,.9);backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:.75rem;color:inherit;text-decoration:none;min-width:0}.brand-mark{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;color:var(--bg);background:var(--green);clip-path:var(--cut-sm);font-family:Orbitron,monospace;font-weight:800;box-shadow:0 0 6px var(--green),0 0 16px rgba(0,255,136,.28)}.brand small,.card small{display:block;color:var(--cyan);font-family:"Share Tech Mono",monospace;font-size:.69rem;letter-spacing:.17em}.brand strong{display:block;font-family:Orbitron,monospace;font-size:clamp(1rem,2.3vw,1.45rem);letter-spacing:.13em;line-height:1.05}.api-status{display:flex;align-items:center;gap:.45rem;min-height:38px;padding:.45rem .7rem;border:1px solid var(--border);clip-path:var(--cut-sm);color:var(--muted-fg);font-size:.68rem;letter-spacing:.08em;white-space:nowrap}.api-status i{width:8px;height:8px;border-radius:50%;background:#697080}.api-status.online{color:var(--green);border-color:rgba(0,255,136,.45)}.api-status.online i{background:var(--green);box-shadow:0 0 7px var(--green)}.api-status.offline{color:var(--red)}.api-status.offline i{background:var(--red);box-shadow:0 0 7px var(--red)}
.shell{width:min(1480px,100%);margin:auto;padding:clamp(.8rem,3vw,2.3rem)}.hero{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(270px,.7fr);gap:1.2rem;align-items:end;margin:clamp(1.2rem,4vw,4rem) 0 1.5rem}.hero h1,.viewer-header h1,.error h1{margin:.25rem 0 .8rem;max-width:16ch;font-family:Orbitron,monospace;font-size:clamp(2.2rem,6vw,5.5rem);line-height:.98;letter-spacing:-.035em;text-transform:uppercase;text-shadow:-2px 0 rgba(255,0,255,.72),2px 0 rgba(0,212,255,.72),0 0 25px rgba(0,255,136,.22)}.hero>div>p:last-child{max-width:75ch;color:#aeb3bf}.terminal{color:var(--green);font-size:.79rem;letter-spacing:.08em;text-transform:uppercase}.cursor{animation:blink 1s step-end infinite}
.card{position:relative;border:1px solid var(--border);background:rgba(18,18,26,.94);clip-path:var(--cut)}.card:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,rgba(0,255,136,.05),transparent 38%,rgba(0,212,255,.03));pointer-events:none}.hud{padding:1rem;transform:rotate(.35deg);border-color:rgba(0,255,136,.32);box-shadow:0 0 20px rgba(0,255,136,.08)}.hud div{display:flex;justify-content:space-between;gap:1rem;padding:.68rem 0;border-bottom:1px dashed rgba(133,140,156,.25);font-size:.74rem}.hud div:last-child{border:0}.hud span{color:var(--muted-fg)}.hud b{color:var(--green)}
.creator-grid{display:grid;grid-template-columns:minmax(330px,.78fr) minmax(0,1.45fr);gap:1.1rem;align-items:start}.terminal-card,.preview-card{padding:1.15rem}.terminal-card{padding-top:3.7rem;background:rgba(8,8,13,.97)}.terminal-bar{position:absolute;inset:0 0 auto;height:42px;display:flex;align-items:center;gap:.4rem;padding:0 .9rem;border-bottom:1px solid var(--border);background:#111119}.terminal-bar i{width:9px;height:9px;border-radius:50%}.terminal-bar i:nth-child(1){background:var(--red);box-shadow:0 0 5px var(--red)}.terminal-bar i:nth-child(2){background:#ffcf33;box-shadow:0 0 5px #ffcf33}.terminal-bar i:nth-child(3){background:var(--green);box-shadow:0 0 5px var(--green)}.terminal-bar span{margin-left:auto;color:var(--muted-fg);font-size:.66rem;letter-spacing:.11em}
label{display:block;margin:.8rem 0 .4rem;color:#bbc0cc;font-family:"Share Tech Mono",monospace;font-size:.8rem;letter-spacing:.11em;text-transform:uppercase}.label-row{display:flex;align-items:end;justify-content:space-between;gap:.6rem}.prompt-field{position:relative}.prompt-field>span{position:absolute;z-index:2;left:.8rem;top:50%;transform:translateY(-50%);color:var(--green)}.prompt-field.textarea>span{top:.75rem;transform:none}.prompt-field input,.prompt-field textarea,.plain-input{width:100%;color:var(--fg);border:1px solid var(--border);outline:0;background:#101018;clip-path:var(--cut-sm);transition:.12s}.prompt-field input{min-height:48px;padding:.7rem .8rem .7rem 1.9rem}.prompt-field textarea{min-height:250px;padding:.75rem .8rem .75rem 1.9rem;resize:vertical;font-size:.81rem;tab-size:4}.plain-input{min-height:45px;padding:.65rem .75rem}.prompt-field input:focus,.prompt-field textarea:focus,.plain-input:focus{border-color:var(--green);box-shadow:0 0 4px var(--green),0 0 10px rgba(0,255,136,.2)}
.helper{margin:.55rem 0;color:var(--muted-fg);font-size:.74rem}.helper.success{color:var(--green)}.helper.warning{color:#ffd04a}.helper.error-text{color:var(--red)}.actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:.9rem}.btn,.segment{display:inline-flex;align-items:center;justify-content:center;min-height:45px;padding:.65rem .95rem;color:var(--fg);border:1px solid var(--border);background:transparent;clip-path:var(--cut-sm);cursor:pointer;text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-size:.73rem;font-weight:700;transition:.1s steps(3)}.btn:hover:not(:disabled),.btn:focus-visible,.segment:hover,.segment:focus-visible{transform:translateY(-1px);outline:0}.btn:focus-visible,.segment:focus-visible{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--green)}.btn.primary{color:var(--green);border:2px solid var(--green)}.btn.primary:hover{color:var(--bg);background:var(--green);box-shadow:0 0 5px var(--green),0 0 14px rgba(0,255,136,.35)}.btn.secondary{color:var(--pink);border:2px solid var(--pink)}.btn.secondary:hover{color:var(--bg);background:var(--pink);box-shadow:0 0 15px rgba(255,0,255,.45)}.btn.ghost{border-color:transparent}.btn:hover:not(.primary):not(.secondary):not(.danger){color:var(--green);border-color:var(--green)}.btn.danger{color:var(--red);border-color:rgba(255,51,102,.65)}.btn.danger:hover{color:white;background:var(--red)}.btn.tiny{min-height:38px;padding:.42rem .65rem;font-size:.65rem}.btn:disabled{opacity:.38;cursor:not-allowed}.btn.create{width:100%;color:var(--bg);background:var(--green);border:2px solid var(--green);box-shadow:0 0 5px var(--green),0 0 15px rgba(0,255,136,.28)}.btn.create:hover:not(:disabled){filter:brightness(1.12);box-shadow:0 0 10px var(--green),0 0 30px rgba(0,255,136,.4);animation:micro .2s steps(3)}.inline{width:max-content;margin-top:.8rem}
details{margin-top:1rem;border-top:1px solid var(--border)}summary{min-height:46px;padding:.8rem 0;color:var(--cyan);cursor:pointer;text-transform:uppercase;letter-spacing:.08em;font-size:.73rem}.details-body{padding-bottom:.25rem}.toggle-pair{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.check{display:flex;align-items:center;gap:.6rem;min-height:42px;margin:0;color:#c5c8d1;font-family:inherit;font-size:.75rem;letter-spacing:0;text-transform:none;cursor:pointer}.check input{width:20px;height:20px;accent-color:var(--green)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:.9rem}.section-head h2,.share h2,.complete h2{margin:.1rem 0;font-family:Orbitron,monospace;font-size:clamp(1.3rem,3vw,2rem);text-transform:uppercase}.metric{min-width:70px;padding-left:.9rem;border-left:1px solid var(--border);text-align:right}.metric b{display:block;color:var(--green);font-family:Orbitron,monospace;font-size:1.4rem}.metric span{color:var(--muted-fg);font-size:.62rem}.empty{display:grid;place-items:center;min-height:380px;padding:1.5rem;border:1px dashed #303041;background:rgba(7,7,12,.5);color:var(--muted-fg);text-align:center}.plate-dots{width:150px;height:96px;opacity:.55;background-image:radial-gradient(circle,transparent 0 10px,rgba(0,212,255,.55) 11px 12px,transparent 13px);background-size:25px 25px;filter:drop-shadow(0 0 5px rgba(0,212,255,.35))}.create-zone{margin-top:.9rem;padding-top:.8rem;border-top:1px solid var(--border)}
.plate-scroll{width:100%;overflow:auto;overscroll-behavior-inline:contain;scrollbar-color:var(--cyan) var(--muted)}.plate-grid{display:grid;grid-template-columns:40px repeat(12,62px);gap:5px;width:max-content;padding:.35rem}.plate-corner,.plate-head{display:grid;place-items:center;min-height:33px;color:var(--cyan);font-size:.67rem}.plate-well{position:relative;min-width:62px;min-height:62px;padding:.34rem;overflow:hidden;border:1px solid #303042;background:#101018;clip-path:var(--cut-sm)}.plate-well.active{border-color:color-mix(in srgb,var(--well-accent,var(--cyan)) 66%,var(--border));box-shadow:inset 0 0 14px color-mix(in srgb,var(--well-accent,var(--cyan)) 8%,transparent)}.plate-well.inactive{opacity:.4}.coord{display:block;margin-bottom:.2rem;color:var(--well-accent,var(--cyan));font-size:.59rem;font-weight:700}.value{display:-webkit-box;overflow:hidden;overflow-wrap:anywhere;color:#d7d9e0;font-size:.66rem;line-height:1.18;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.share{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.5rem;align-items:center;margin-top:1.1rem;padding:1.4rem;border-color:rgba(0,255,136,.55);box-shadow:0 0 15px rgba(0,255,136,.13)}.share p{color:#afb4c0}.share a{display:block;margin:.8rem 0;color:var(--cyan);overflow-wrap:anywhere}.qr-shell{display:grid;place-items:center;min-width:265px;min-height:265px;padding:14px;background:white;clip-path:var(--cut);box-shadow:0 0 22px rgba(0,212,255,.35)}#qrCode svg{display:block;width:240px;max-width:100%;height:auto}
.loading,.error{max-width:720px;margin:12vh auto 0;padding:1.6rem}.loading p{color:var(--green)}.loading-line{height:4px;overflow:hidden;background:var(--muted)}.loading-line i{display:block;width:35%;height:100%;background:var(--green);box-shadow:0 0 8px var(--green);animation:load 1.15s steps(8) infinite}.error{border-color:rgba(255,51,102,.55)}.error h1{font-size:clamp(2rem,6vw,4rem)}
.viewer-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.8rem 1.5rem;margin:.8rem 0;padding:1rem;border-color:rgba(0,255,136,.33)}.viewer-header h1{max-width:none;margin:.15rem 0;font-size:clamp(1.7rem,5vw,3.5rem)}.progress{align-self:center;min-width:150px;text-align:right}.progress>div{display:flex;justify-content:flex-end;align-items:baseline;gap:.25rem;color:var(--muted-fg);font-family:Orbitron,monospace}.progress b{color:var(--green);font-size:2.15rem;text-shadow:0 0 12px rgba(0,255,136,.45)}.progress small{color:var(--muted-fg)}.progress-bar{grid-column:1/-1;height:5px;overflow:hidden;background:#20202e}.progress-bar i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--cyan),var(--green));box-shadow:0 0 8px var(--green);transition:width .18s steps(8)}
.viewer-controls{position:sticky;top:70px;z-index:30;display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:.9rem;padding:.65rem;border:1px solid var(--border);background:rgba(10,10,15,.94);backdrop-filter:blur(12px);clip-path:var(--cut-sm)}.segments{display:grid;grid-template-columns:1fr 1fr;min-width:250px;border:1px solid #343446;clip-path:var(--cut-sm)}.segment{border:0;clip-path:none}.segment.active{color:var(--bg);background:var(--green);box-shadow:0 0 9px rgba(0,255,136,.4)}.check.compact{margin-right:auto}
.touch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:.65rem;padding-bottom:4rem}.touch-well{--well-accent:var(--cyan);position:relative;display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr;gap:.2rem .6rem;min-height:92px;padding:.75rem;overflow:hidden;color:var(--fg);border:1px solid color-mix(in srgb,var(--well-accent) 65%,var(--border));background:linear-gradient(145deg,color-mix(in srgb,var(--well-accent) 7%,#111119),#101018 70%);clip-path:var(--cut-sm);text-align:left;cursor:pointer;transition:.1s steps(3)}.touch-well:hover,.touch-well:focus-visible{transform:translateY(-1px);outline:0;box-shadow:0 0 12px color-mix(in srgb,var(--well-accent) 30%,transparent)}.touch-coordinate{grid-row:1/3;display:grid;place-items:center;min-width:42px;padding-right:.6rem;color:var(--well-accent);border-right:1px solid color-mix(in srgb,var(--well-accent) 35%,transparent);font-family:Orbitron,monospace;font-size:.8rem;font-weight:800}.touch-state{justify-self:end;color:var(--muted-fg);font-size:.61rem;letter-spacing:.06em}.touch-value{grid-column:2/4;align-self:center;overflow-wrap:anywhere;font-size:.82rem;line-height:1.22}.touch-well.completed{--well-accent:var(--green);border-color:var(--green);background:linear-gradient(145deg,rgba(0,255,136,.24),rgba(0,255,136,.07));box-shadow:inset 0 0 20px rgba(0,255,136,.08),0 0 7px rgba(0,255,136,.35)}.touch-well.completed:after{content:"✓";position:absolute;right:.35rem;bottom:-.4rem;color:rgba(0,255,136,.15);font:800 4.4rem/1 Orbitron}.touch-well.completed .touch-state{color:var(--green)}.filtered{display:none!important}
.viewer-plate{grid-template-columns:42px repeat(12,76px);padding-bottom:1rem}.viewer-plate .plate-well{min-width:76px;min-height:76px;padding:0;border:0}.well-button{width:100%;height:100%;min-height:76px;padding:.4rem;color:inherit;border:1px solid #303042;background:transparent;clip-path:var(--cut-sm);text-align:left;cursor:pointer}.well-button:hover,.well-button:focus-visible{border-color:var(--well-accent,var(--cyan));outline:0}.plate-well.completed .well-button{border-color:var(--green);background:rgba(0,255,136,.15);box-shadow:0 0 7px rgba(0,255,136,.38)}.plate-well.completed .coord{color:var(--green)}.plate-well.completed .value:after{content:" ✓";color:var(--green)}.complete{margin:1rem 0 4rem;padding:1.2rem;border-color:var(--green);box-shadow:0 0 13px rgba(0,255,136,.2)}
.toast{position:fixed;z-index:2000;right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));max-width:calc(100vw - 2rem);padding:.75rem .9rem;color:var(--bg);background:var(--green);clip-path:var(--cut-sm);box-shadow:0 0 13px rgba(0,255,136,.48);opacity:0;transform:translateY(12px);pointer-events:none;transition:.13s steps(4);font-size:.75rem;font-weight:700}.toast.show{opacity:1;transform:none}.toast.bad{color:white;background:var(--red);box-shadow:0 0 13px rgba(255,51,102,.5)}
.glitch{position:relative;animation:rgb 7s steps(2) infinite}.glitch:before,.glitch:after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;opacity:.48}.glitch:before{color:var(--pink);transform:translateX(-1px);clip-path:inset(18% 0 60% 0)}.glitch:after{color:var(--cyan);transform:translateX(1px);clip-path:inset(66% 0 9% 0)}
@keyframes scan{from{transform:translateY(-100%)}to{transform:translateY(130vh)}}@keyframes blink{50%{opacity:0}}@keyframes load{from{transform:translateX(-100%)}to{transform:translateX(380%)}}@keyframes micro{33%{transform:translate(-2px,1px)}66%{transform:translate(2px,-1px)}}@keyframes rgb{0%,94%,100%{text-shadow:-1px 0 var(--pink),1px 0 var(--cyan)}96%{text-shadow:2px 0 var(--pink),-2px 0 var(--cyan)}}
@media(max-width:960px){.hero,.creator-grid{grid-template-columns:1fr}.hud{display:none}.share{grid-template-columns:1fr}.qr-shell{justify-self:start}}
@media(max-width:680px){.site-header{padding:.7rem .75rem}.brand small{display:none}.brand-mark{width:40px;height:40px;flex-basis:40px}.api-status{max-width:125px;overflow:hidden}.shell{padding:.7rem}.hero{margin-top:1.1rem}.hero h1{font-size:clamp(2rem,12vw,3.4rem)}.terminal-card,.preview-card{padding:1rem}.terminal-card{padding-top:3.6rem}.toggle-pair{grid-template-columns:1fr}.empty{min-height:270px}.share{padding:1rem}.qr-shell{justify-self:stretch;min-width:0;min-height:0;aspect-ratio:1}.viewer-header{grid-template-columns:1fr auto;padding:.85rem}.viewer-header h1{font-size:clamp(1.45rem,8vw,2.35rem)}.progress{min-width:108px}.progress b{font-size:1.75rem}.viewer-controls{top:63px;display:grid;grid-template-columns:1fr 1fr}.segments{grid-column:1/-1;min-width:0}.check.compact{margin:0}.viewer-controls .btn{width:100%}.touch-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.touch-well{grid-template-columns:1fr auto;grid-template-rows:auto auto 1fr;min-height:124px;padding:.65rem}.touch-coordinate{grid-row:auto;place-items:start;min-width:0;padding:0 0 .38rem;border-right:0;border-bottom:1px solid color-mix(in srgb,var(--well-accent) 35%,transparent)}.touch-state{grid-column:2;grid-row:1}.touch-value{grid-column:1/3;grid-row:2/4;align-self:start;padding-top:.25rem;font-size:.78rem}}
@media(max-width:390px){.touch-grid{grid-template-columns:1fr}.touch-well{min-height:90px;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr}.touch-coordinate{grid-row:1/3;min-width:42px;padding:0 .6rem 0 0;border-right:1px solid color-mix(in srgb,var(--well-accent) 35%,transparent);border-bottom:0;place-items:center}.touch-state{grid-column:3;grid-row:1}.touch-value{grid-column:2/4;grid-row:2;padding-top:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.scan-beam{display:none}}
