/* StrangerChk — Free Panel v1.1 */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
	--bg:#080404;
	--surface:rgba(18,6,6,.95);
	--card:rgba(28,10,10,.85);
	--glass:rgba(40,14,14,.7);
	--border:rgba(200,50,50,.12);
	--border-hi:rgba(220,60,60,.3);
	--border-active:rgba(220,40,40,.5);
	--text:#b08a8a;
	--text-hi:#ffe6e6;
	--text-dim:#5c3a3a;
	--purple:#dc2626;
	--purple-glow:rgba(220,38,38,.35);
	--indigo:#b91c1c;
	--cyan:#f59e0b;
	--cyan-glow:rgba(245,158,11,.25);
	--green:#10b981;
	--green-glow:rgba(16,185,129,.25);
	--red:#ef4444;
	--red-glow:rgba(239,68,68,.25);
	--amber:#f59e0b;
	--amber-glow:rgba(245,158,11,.25);
	--r:8px;
	--r-lg:14px;
	--r-xl:20px;
	--font:'Rajdhani',sans-serif;
	--display:'Creepster',cursive;
	--display-alt:'Orbitron',sans-serif;
	--mono:'JetBrains Mono',monospace;
	--blur:24px;
}
html{font-size:15px;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh;min-height:100dvh;overflow-x:hidden;overflow-y:auto;max-width:100vw;-webkit-overflow-scrolling:touch}
::selection{background:var(--purple);color:#fff}
::-webkit-scrollbar{width:3px;height:3px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border-hi);border-radius:9px}

/* === MATRIX RAIN CANVAS === */
#matrix-rain{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.15;will-change:transform}

/* === STARS === */
.bg-stars{position:fixed;inset:0;z-index:0;pointer-events:none}
.bg-star{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;animation:starTwinkle var(--dur) ease-in-out infinite}
@keyframes starTwinkle{0%,100%{opacity:.1;transform:scale(.5)}50%{opacity:.8;transform:scale(1.2)}}

/* === BG GRID === */
.bg-grid{position:fixed;inset:0;z-index:0;pointer-events:none;
	background-image:
		linear-gradient(rgba(220,38,38,.03) 1px,transparent 1px),
		linear-gradient(90deg,rgba(220,38,38,.03) 1px,transparent 1px);
	background-size:60px 60px;
}

/* === SCAN BEAM === */
.bg-scanbeam{display:none}

/* === VIGNETTE === */
.bg-vignette{position:fixed;inset:0;z-index:0;pointer-events:none;
	background:
		radial-gradient(ellipse at center,transparent 25%,rgba(8,4,4,.85) 100%),
		linear-gradient(180deg,rgba(220,38,38,.03) 0%,transparent 15%,transparent 85%,rgba(185,28,28,.04) 100%);
}

/* === ANIMATED BG ORBS (optimized - GPU accelerated) === */
.bg-orb{position:fixed;border-radius:50%;pointer-events:none;z-index:0;filter:blur(60px);opacity:.12;will-change:transform;transform:translateZ(0);animation:orbFloat 30s linear infinite}
.bg-orb.orb1{width:500px;height:500px;background:radial-gradient(circle,#dc2626,#7f1d1d 40%,transparent 70%);top:-10%;left:-8%;animation-duration:16s}
.bg-orb.orb2{width:450px;height:450px;background:radial-gradient(circle,#f59e0b,#92400e 40%,transparent 70%);bottom:-10%;right:-8%;animation-duration:22s;animation-delay:-5s}
.bg-orb.orb3{width:400px;height:400px;background:radial-gradient(circle,#b91c1c,#450a0a 40%,transparent 70%);top:40%;left:55%;animation-duration:26s;animation-delay:-10s}
@keyframes orbFloat{0%,100%{transform:translateZ(0) translate(0,0) scale(1)}25%{transform:translateZ(0) translate(40px,-50px) scale(1.12)}50%{transform:translateZ(0) translate(-30px,40px) scale(.92)}75%{transform:translateZ(0) translate(50px,20px) scale(1.06)}}

/* === BOOT OVERLAY — Stranger Things === */
.boot-overlay{position:fixed;inset:0;z-index:9999;background:#050505;display:flex;align-items:center;justify-content:center;transition:opacity .8s,visibility .8s;overflow:hidden}
.boot-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}
.boot-overlay::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(180,30,30,.08),transparent 70%)}
.boot-content{text-align:center;position:relative;z-index:2}

/* Christmas lights */
.st-lights{position:relative;width:340px;height:55px;margin:0 auto 30px}
.lights-wire{position:absolute;inset:0;width:100%;height:100%}
.wire-path{stroke:#3a3a3a;stroke-width:1.5}
.bulb{position:absolute;top:8px;width:12px;height:16px;border-radius:0 0 50% 50%;transform-origin:top center}
.bulb span{display:block;width:6px;height:3px;background:#555;border-radius:1px 1px 0 0;margin:0 auto}
.bulb::after{content:'';display:block;width:12px;height:14px;border-radius:0 0 50% 50%;margin-top:1px;transition:all .3s}
.bulb.b1,.bulb.b4,.bulb.b7{--bc:#dc2626}
.bulb.b2,.bulb.b5,.bulb.b8{--bc:#f59e0b}
.bulb.b3,.bulb.b6,.bulb.b9{--bc:#22c55e}
.bulb::after{background:var(--bc);box-shadow:0 0 6px var(--bc),0 0 12px var(--bc);opacity:.3}
.bulb.on::after{opacity:1;box-shadow:0 0 8px var(--bc),0 0 20px var(--bc),0 0 40px var(--bc)}

/* Portal */
.st-portal{width:120px;height:120px;margin:0 auto 24px;position:relative}
.portal-ring{position:absolute;border-radius:50%;border:1px solid}
.portal-ring.pr1{inset:0;border-color:rgba(220,38,38,.4);animation:portalSpin 6s linear infinite}
.portal-ring.pr2{inset:12px;border-color:rgba(245,158,11,.3);animation:portalSpin 4s linear infinite reverse}
.portal-ring.pr3{inset:24px;border-color:rgba(220,38,38,.2);animation:portalSpin 8s linear infinite}
@keyframes portalSpin{to{transform:rotate(360deg)}}
.portal-core{position:absolute;inset:30px;border-radius:50%;background:radial-gradient(circle,rgba(220,38,38,.6),rgba(120,10,10,.3) 50%,transparent 70%);animation:portalPulse 2s ease-in-out infinite;filter:blur(2px)}
@keyframes portalPulse{0%,100%{opacity:.5;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}
.portal-tendril{position:absolute;width:2px;background:linear-gradient(to top,transparent,rgba(220,38,38,.5),transparent);border-radius:50%;animation:tendrilFloat var(--dur) ease-in-out infinite;opacity:0}
@keyframes tendrilFloat{0%{opacity:0;transform:translateY(0) scaleY(.5)}30%{opacity:.7}70%{opacity:.5}100%{opacity:0;transform:translateY(-40px) scaleY(1.5)}}

/* ST Title */
.st-title{font-family:var(--display);font-size:2.5rem;letter-spacing:6px;color:#dc2626;text-shadow:0 0 20px rgba(220,38,38,.5),0 0 40px rgba(220,38,38,.2),0 0 60px rgba(220,38,38,.1);margin-bottom:20px;opacity:0;animation:stTitleIn 1s ease .8s forwards}
.st-title span{color:#f59e0b;text-shadow:0 0 20px rgba(245,158,11,.5)}
@keyframes stTitleIn{to{opacity:1}}

.boot-bar{width:200px;height:2px;background:rgba(255,255,255,.06);border-radius:2px;margin:0 auto 12px;overflow:hidden}
.boot-fill{height:100%;width:0;background:linear-gradient(90deg,#dc2626,#f59e0b);border-radius:2px;animation:bootLoad 2.2s ease forwards}
@keyframes bootLoad{to{width:100%}}
@keyframes fadeIn{to{opacity:1}}
.boot-text{font-family:var(--display);font-size:.6rem;letter-spacing:3px;color:rgba(220,38,38,.5)}
.boot-dots{animation:blink 1s step-end infinite}
@keyframes blink{50%{opacity:0}}

/* === StrangerChk SHELL === */
.StrangerChk{position:relative;z-index:1;display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;max-height:100vh;max-height:100dvh;padding:20px 30px;opacity:0;transition:opacity .5s;max-width:1400px;margin:0 auto;width:100%;overflow:hidden}
.StrangerChk.visible{opacity:1}

/* === COMMAND BAR === */
.cmd-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;background:rgba(40,14,14,.92);border:1px solid rgba(220,38,38,.12);border-radius:var(--r-xl);margin-bottom:10px;gap:14px;flex-wrap:wrap;position:relative;overflow:hidden}
.cmd-bar::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(220,38,38,.5),rgba(245,158,11,.3),rgba(220,38,38,.5),transparent);opacity:.7;animation:cmdBarGlow 4s ease-in-out infinite}
@keyframes cmdBarGlow{0%,100%{opacity:.5}50%{opacity:.9}}
.cmd-bar::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(220,38,38,.2),transparent)}

.cb-left,.cb-right{display:flex;align-items:center;gap:12px}
.cb-center{flex:1;display:flex;justify-content:center;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Brand */
.cb-brand{display:flex;align-items:center;gap:14px}

/* === ST BRAND BULB ICON === */
.st-brand-icon{width:36px;height:48px;position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer}
.st-bulb-svg{width:100%;height:100%;position:relative;z-index:2}
.bulb-glass{fill:rgba(220,38,38,.1);stroke:var(--purple);stroke-width:1;animation:bulbFlicker 3s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(220,38,38,.4))}
@keyframes bulbFlicker{0%,18%,22%,60%,64%,100%{opacity:1;fill:rgba(220,38,38,.15)}20%{opacity:.3;fill:rgba(220,38,38,.05)}62%{opacity:.5;fill:rgba(220,38,38,.08)}}
.bulb-filament{fill:none;stroke:#f59e0b;stroke-width:1;animation:filamentGlow 3s ease-in-out infinite;filter:drop-shadow(0 0 4px rgba(245,158,11,.6))}
@keyframes filamentGlow{0%,18%,22%,60%,64%,100%{opacity:1}20%{opacity:.2}62%{opacity:.4}}
.st-bulb-glow{position:absolute;inset:-10px;background:radial-gradient(circle,rgba(220,38,38,.2),transparent 70%);z-index:0;animation:bulbFlicker 3s ease-in-out infinite;border-radius:50%}
.st-flicker-particles{position:absolute;inset:-5px;z-index:3;pointer-events:none;overflow:visible}
.st-flicker-p{position:absolute;width:2px;height:2px;border-radius:50%;animation:stFlickerFloat var(--dur) ease-in-out infinite;opacity:0}
@keyframes stFlickerFloat{0%{opacity:0;transform:translateY(0)}30%{opacity:.7}100%{opacity:0;transform:translateY(-20px)}}
.st-brand-icon:hover .bulb-glass{fill:rgba(220,38,38,.3);filter:drop-shadow(0 0 14px rgba(220,38,38,.6))}
.st-brand-icon:hover .st-bulb-glow{opacity:.8}
.brand-info{display:flex;flex-direction:column;line-height:1.15}
.bi-name{font-family:var(--display);font-size:1.5rem;color:#dc2626;letter-spacing:5px;font-weight:400;text-shadow:0 0 15px rgba(220,38,38,.5),0 0 30px rgba(220,38,38,.2)}
.bi-ver{font-size:.65rem;color:var(--purple);letter-spacing:2px;font-weight:600}

/* HUD Circles */
.hud-circles{display:flex;align-items:center;gap:8px}
.hc{position:relative;width:64px;height:64px;cursor:default}
.hc-svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.hc-track{fill:none;stroke:rgba(255,255,255,.04);stroke-width:3}
.hc-fill{fill:none;stroke-width:3;stroke-linecap:round;stroke-dasharray:213.6;stroke-dashoffset:213.6;transition:stroke-dashoffset .8s cubic-bezier(.4,0,.2,1)}
.hcf-green{stroke:var(--green)}
.hcf-red{stroke:var(--red)}
.hcf-amber{stroke:var(--amber)}
.hc-data{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.hc-num{font-family:var(--mono);font-size:1rem;font-weight:700;color:var(--text-hi);line-height:1;transition:transform .2s}
.hc-label{font-size:.35rem;letter-spacing:1.5px;color:var(--text-dim);font-weight:700;margin-top:2px}
.hc:hover .hc-num{transform:scale(1.15)}

/* Timer & Speed */
.cb-timer,.cb-speed{display:flex;align-items:center;gap:5px;font-family:var(--mono);font-size:.85rem;color:var(--text);padding:6px 10px;background:rgba(255,255,255,.02);border-radius:var(--r);border:1px solid var(--border)}
.cb-timer i,.cb-speed i{font-size:.6rem;color:var(--cyan)}
.cb-speed small{font-size:.55rem;color:var(--text-dim)}

/* Status */
.cb-status{display:flex;align-items:center;gap:8px;padding:6px 14px;border-radius:var(--r);background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.12);transition:all .3s;position:relative;overflow:hidden}
.cb-status::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(220,38,38,.05),transparent);animation:statusSweep 3s linear infinite;pointer-events:none}
@keyframes statusSweep{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.cbs-pulse{width:8px;height:8px;border-radius:50%;background:var(--text-dim);transition:all .3s}
.cb-status.running .cbs-pulse{background:var(--green);box-shadow:0 0 12px var(--green-glow);animation:statusPulse 1.5s ease-in-out infinite}
.cb-status.paused .cbs-pulse{background:var(--amber);box-shadow:0 0 12px var(--amber-glow)}
.cb-status.done .cbs-pulse{background:var(--purple);box-shadow:0 0 12px var(--purple-glow)}
@keyframes statusPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}
#status-text{font-family:var(--display);font-size:.8rem;letter-spacing:2px;color:var(--text-dim);font-weight:400}

/* === WORKSPACE === */
.workspace{flex:1;display:grid;grid-template-columns:440px 1fr;gap:10px;min-height:0;overflow:hidden}

/* === PANELS — Upside Down Style === */
.ws-panel{position:relative;background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);display:flex;flex-direction:column;overflow:hidden;transition:border-color .4s;contain:layout style paint;min-height:0}
.ws-panel::before{content:'';position:absolute;inset:0;border-radius:var(--r-lg);background:linear-gradient(180deg,rgba(220,38,38,.06) 0%,transparent 30%,transparent 70%,rgba(185,28,28,.04) 100%);pointer-events:none;z-index:0}
.ws-panel::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(220,38,38,.5),rgba(245,158,11,.4),rgba(220,38,38,.5),transparent);z-index:3;pointer-events:none;animation:panelTopGlow 3s ease-in-out infinite}
@keyframes panelTopGlow{0%,100%{opacity:.7}50%{opacity:.9}}
.ws-panel:hover{border-color:rgba(220,38,38,.25);box-shadow:0 0 30px rgba(220,38,38,.08)}

/* Panel Chrome — Vine Corners */
.panel-chrome{position:absolute;inset:0;pointer-events:none;z-index:2}
.pc-corner{position:absolute;width:26px;height:26px}
.pc-corner::before,.pc-corner::after{content:'';position:absolute;opacity:.4;transition:opacity .4s,width .4s,height .4s,box-shadow .4s,filter .4s}
.pc-corner::before{width:26px;height:2px;background:linear-gradient(90deg,#dc2626,rgba(220,38,38,.2))}
.pc-corner::after{width:2px;height:26px;background:linear-gradient(180deg,#dc2626,rgba(220,38,38,.2))}
.pc-corner.tl{top:0;left:0}.pc-corner.tl::before{top:0;left:0}.pc-corner.tl::after{top:0;left:0}
.pc-corner.tr{top:0;right:0}.pc-corner.tr::before{top:0;right:0;background:linear-gradient(-90deg,#f59e0b,rgba(245,158,11,.2))}.pc-corner.tr::after{top:0;right:0;background:linear-gradient(180deg,#f59e0b,rgba(245,158,11,.2))}
.pc-corner.bl{bottom:0;left:0}.pc-corner.bl::before{bottom:0;left:0}.pc-corner.bl::after{bottom:0;left:0}
.pc-corner.br{bottom:0;right:0}.pc-corner.br::before{bottom:0;right:0;background:linear-gradient(-90deg,#dc2626,transparent)}.pc-corner.br::after{bottom:0;right:0;background:linear-gradient(-180deg,#dc2626,transparent)}
.ws-panel:hover .pc-corner::before{opacity:1;width:34px;box-shadow:0 0 12px rgba(220,38,38,.4);filter:blur(.3px)}
.ws-panel:hover .pc-corner::after{opacity:1;height:34px;box-shadow:0 0 12px rgba(220,38,38,.4);filter:blur(.3px)}

/* Panel Scanline — Upside Down sweep */
.pc-scanline{display:none}

/* Panel inner glow — vine edges */
.ws-panel .panel-body::before{content:'';position:absolute;top:0;left:0;bottom:0;width:2px;background:linear-gradient(180deg,rgba(220,38,38,.3),rgba(220,38,38,.06) 30%,rgba(185,28,28,.04) 70%,rgba(220,38,38,.2));pointer-events:none;opacity:.7}
.ws-panel .panel-body::after{content:'';position:absolute;top:0;right:0;bottom:0;width:2px;background:linear-gradient(180deg,rgba(245,158,11,.2),rgba(245,158,11,.04) 30%,rgba(245,158,11,.04) 70%,rgba(245,158,11,.15));pointer-events:none;opacity:.7}

/* Panel Header — Stranger Lights */
.panel-header{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid rgba(220,38,38,.15);flex-wrap:wrap;position:relative;z-index:1;background:linear-gradient(180deg,rgba(220,38,38,.06),rgba(185,28,28,.02),transparent)}
.panel-header::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(220,38,38,.3),rgba(245,158,11,.2),rgba(220,38,38,.3),transparent);animation:headerLineFlicker 5s ease-in-out infinite}
@keyframes headerLineFlicker{0%,18%,22%,100%{opacity:1}20%{opacity:.3}60%{opacity:.8}62%{opacity:.4}64%{opacity:1}}
.ph-icon{width:34px;height:34px;border-radius:var(--r);background:rgba(220,38,38,.12);border:1px solid rgba(220,38,38,.25);display:flex;align-items:center;justify-content:center;font-size:.75rem;color:var(--purple);position:relative;overflow:hidden;animation:iconFlicker 6s ease-in-out infinite}
@keyframes iconFlicker{0%,15%,17%,60%,62%,100%{opacity:1}16%{opacity:.4}61%{opacity:.5}}
.ph-icon::after{content:'';position:absolute;inset:0;background:radial-gradient(circle,rgba(220,38,38,.3),transparent 70%);opacity:0;transition:opacity .3s}
.ws-panel:hover .ph-icon::after{opacity:1}
.ph-icon.ph-cyan{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.25);color:var(--cyan)}
.ph-icon.ph-cyan::after{background:radial-gradient(circle,rgba(245,158,11,.3),transparent 70%)}
.ph-title{font-family:var(--display);font-size:1.15rem;letter-spacing:3px;color:#dc2626;font-weight:400;text-shadow:0 0 15px rgba(220,38,38,.4),0 0 30px rgba(220,38,38,.15)}
.ph-badge{margin-left:auto;font-family:var(--mono);font-size:.7rem;color:var(--purple);background:rgba(220,38,38,.1);padding:4px 14px;border-radius:20px;border:1px solid rgba(220,38,38,.2);font-weight:600;text-shadow:0 0 10px var(--purple-glow);animation:badgePulse 3s ease-in-out infinite}
@keyframes badgePulse{0%,100%{box-shadow:0 0 0 transparent}50%{box-shadow:0 0 15px rgba(220,38,38,.15)}}

/* Panel Body */
.panel-body{flex:1;padding:16px;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:14px;position:relative;z-index:1;min-height:0}

/* Field Groups */
.field-group{display:flex;flex-direction:column;gap:6px}
.fg-label{font-family:var(--display);font-size:.8rem;letter-spacing:2px;color:rgba(220,38,38,.5);font-weight:400;display:flex;align-items:center;gap:8px;text-transform:uppercase}
.fgl-bar{width:3px;height:14px;background:var(--purple);border-radius:2px;box-shadow:0 0 10px var(--purple-glow);position:relative}
.fgl-bar::after{content:'';position:absolute;inset:0;background:inherit;border-radius:inherit;animation:barPulse 2s ease-in-out infinite}
@keyframes barPulse{0%,100%{opacity:1}50%{opacity:.5}}
.fgl-bar.bar-cyan{background:var(--cyan);box-shadow:0 0 10px var(--cyan-glow)}
.fg-input-wrap{position:relative;border-radius:var(--r);overflow:hidden}
.fg-input-wrap::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(220,38,38,.15),transparent);z-index:1;pointer-events:none}
textarea{width:100%;background:rgba(0,0,0,.4);border:1px solid rgba(220,38,38,.1);border-radius:var(--r);padding:12px 14px;color:var(--text-hi);font-family:var(--mono);font-size:.8rem;resize:none;outline:none;transition:all .4s;line-height:1.6;position:relative}
textarea:focus{border-color:rgba(220,38,38,.4);box-shadow:0 0 30px rgba(220,38,38,.15),inset 0 0 25px rgba(220,38,38,.04),0 0 60px rgba(220,38,38,.05)}
.fg-glow{position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);width:0;height:2px;background:linear-gradient(90deg,transparent,var(--purple),var(--cyan),transparent);transition:width .4s;border-radius:2px;filter:blur(.5px)}
.fg-glow.glow-cyan{background:linear-gradient(90deg,transparent,var(--cyan),var(--purple),transparent)}
textarea:focus~.fg-glow{width:90%}

/* Action Grid */
.action-grid{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.action-grid .btn-launch{flex:1 1 100%}
.action-grid .btn-secondary,.action-grid .btn-gen{flex:1 1 0;min-width:0}
.nx-btn{position:relative;border:1px solid var(--border);border-radius:var(--r);padding:12px 18px;font-family:var(--display);font-size:.85rem;letter-spacing:2px;font-weight:400;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;gap:8px;overflow:hidden;background:transparent;color:var(--text);min-height:48px;min-width:48px;box-sizing:border-box}
.nx-btn:disabled{opacity:.3;cursor:not-allowed}

/* Launch Button — Portal Style */
.btn-launch{background:linear-gradient(135deg,rgba(220,38,38,.2),rgba(185,28,28,.15),rgba(220,38,38,.2));border-color:rgba(220,38,38,.4);color:var(--text-hi);position:relative;animation:launchIdle 3s ease-in-out infinite;padding:14px 24px;font-size:1rem;letter-spacing:3px}
@keyframes launchIdle{0%,100%{box-shadow:0 0 15px rgba(220,38,38,.1),inset 0 0 30px rgba(220,38,38,.03)}50%{box-shadow:0 0 30px rgba(220,38,38,.2),inset 0 0 40px rgba(220,38,38,.06)}}
.btn-launch .btn-bg{position:absolute;inset:0;background:linear-gradient(135deg,#dc2626,#b91c1c,#dc2626);opacity:0;transition:opacity .3s}
.btn-border-anim{position:absolute;inset:-1px;border-radius:inherit;background:conic-gradient(from var(--angle,0deg),transparent 60%,rgba(220,38,38,.6) 80%,rgba(245,158,11,.4) 90%,transparent);opacity:0;transition:opacity .4s;z-index:0;animation:borderSpin 4s linear infinite;--angle:0deg}
@keyframes borderSpin{to{--angle:360deg}}
@property --angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.btn-launch::after{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(245,158,11,.15),rgba(220,38,38,.1),transparent);transition:left .6s;pointer-events:none;z-index:1}
.btn-launch:hover:not(:disabled)::after{left:150%}
.btn-launch:hover:not(:disabled) .btn-bg{opacity:.35}
.btn-launch:hover:not(:disabled) .btn-border-anim{opacity:1}
.btn-launch:hover:not(:disabled){border-color:#dc2626;box-shadow:0 0 40px rgba(220,38,38,.35),0 0 80px rgba(220,38,38,.12),inset 0 0 25px rgba(220,38,38,.06);transform:translateY(-3px) scale(1.02);animation:none}
.btn-launch:active:not(:disabled){transform:translateY(0) scale(.98);box-shadow:0 0 20px rgba(220,38,38,.25)}
.btn-launch i,.btn-launch span{position:relative;z-index:2}
.btn-launch i{font-size:1.1rem;filter:drop-shadow(0 0 6px rgba(220,38,38,.5))}

/* Secondary Buttons — Improved */
.btn-secondary{flex-direction:column;gap:3px;padding:8px 4px;width:auto;height:52px;min-width:0;min-height:52px;max-width:none;max-height:52px;position:relative;overflow:hidden;background:rgba(0,0,0,.3);border-color:rgba(220,38,38,.15);box-sizing:border-box}
.btn-icon-ring{position:absolute;inset:0;border-radius:inherit;opacity:0;transition:all .3s}
.btn-secondary i{font-size:.85rem;position:relative;z-index:1;transition:all .3s}
.btn-label{font-family:var(--font);font-size:.4rem;letter-spacing:1px;color:var(--text-dim);position:relative;z-index:1;transition:all .3s;white-space:nowrap}
.btn-gen{flex-direction:column;gap:3px;padding:8px 4px;width:auto;height:52px;min-width:0;min-height:52px;max-width:none;max-height:52px;box-sizing:border-box}
.btn-pause .btn-icon-ring{background:radial-gradient(circle at center,rgba(245,158,11,.15),transparent 70%)}
.btn-stop .btn-icon-ring{background:radial-gradient(circle at center,rgba(239,68,68,.15),transparent 70%)}
.btn-reset .btn-icon-ring{background:radial-gradient(circle at center,rgba(245,158,11,.15),transparent 70%)}
.btn-gen .btn-icon-ring{background:radial-gradient(circle at center,rgba(168,85,247,.15),transparent 70%)}
.btn-pause:hover:not(:disabled){color:var(--amber);border-color:var(--amber);box-shadow:0 0 25px var(--amber-glow),inset 0 0 15px rgba(245,158,11,.05);transform:translateY(-2px)}
.btn-pause:hover:not(:disabled) .btn-icon-ring{opacity:1}
.btn-pause:hover:not(:disabled) .btn-label{color:var(--amber)}
.btn-stop:hover:not(:disabled){color:var(--red);border-color:var(--red);box-shadow:0 0 25px var(--red-glow),inset 0 0 15px rgba(239,68,68,.05);transform:translateY(-2px)}
.btn-stop:hover:not(:disabled) .btn-icon-ring{opacity:1}
.btn-stop:hover:not(:disabled) .btn-label{color:var(--red)}
.btn-reset:hover{color:var(--cyan);border-color:var(--cyan);box-shadow:0 0 25px var(--cyan-glow),inset 0 0 15px rgba(245,158,11,.05);transform:translateY(-2px)}
.btn-reset:hover .btn-icon-ring{opacity:1}
.btn-reset:hover .btn-label{color:var(--cyan)}
.btn-gen{background:rgba(168,85,247,.06);border-color:rgba(168,85,247,.2)}
.btn-gen:hover{color:#a855f7;border-color:#a855f7;box-shadow:0 0 25px rgba(168,85,247,.25),inset 0 0 15px rgba(168,85,247,.05);transform:translateY(-2px)}
.btn-gen:hover .btn-icon-ring{opacity:1}
.btn-gen:hover .btn-label{color:#a855f7}

/* === GENERATOR MODAL === */
.gen-overlay{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s ease}
.gen-overlay.active{opacity:1;pointer-events:auto}
@keyframes genFadeIn{from{opacity:0}to{opacity:1}}
.gen-modal{position:relative;width:90%;max-width:520px;background:var(--surface);border:1px solid rgba(220,38,38,.2);border-radius:var(--r-xl);padding:0;overflow:hidden;animation:genSlideIn .4s cubic-bezier(.4,0,.2,1);box-shadow:0 0 60px rgba(220,38,38,.15),0 0 120px rgba(0,0,0,.5)}
@keyframes genSlideIn{from{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
.gen-modal::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#dc2626,#f59e0b,#dc2626,transparent)}
.gen-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid rgba(220,38,38,.1)}
.gen-title-wrap{display:flex;align-items:center;gap:10px;color:#dc2626}
.gen-title-wrap i{font-size:1rem;filter:drop-shadow(0 0 6px rgba(220,38,38,.4))}
.gen-title{font-family:var(--display);font-size:1.1rem;letter-spacing:3px;text-shadow:0 0 15px rgba(220,38,38,.3)}
.gen-close{width:32px;height:32px;border:1px solid rgba(220,38,38,.15);border-radius:var(--r);background:transparent;color:var(--text-dim);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.gen-close:hover{color:#dc2626;border-color:#dc2626;box-shadow:0 0 15px rgba(220,38,38,.2)}
.gen-body{padding:14px 16px 16px}
.gen-row{display:flex;gap:8px;margin-bottom:12px;align-items:flex-end;flex-wrap:wrap}
.gen-field{flex:1;min-width:80px}
.gen-field.gen-sm{flex:0 0 70px}
.gen-label{display:block;font-family:var(--display);font-size:.7rem;letter-spacing:2px;color:rgba(220,38,38,.4);margin-bottom:4px}
.gen-input{width:100%;background:rgba(0,0,0,.4);border:1px solid rgba(220,38,38,.12);border-radius:var(--r);padding:10px 12px;color:var(--text-hi);font-family:var(--mono);font-size:.8rem;outline:none;transition:all .3s;box-sizing:border-box}
.gen-input:focus{border-color:rgba(220,38,38,.4);box-shadow:0 0 20px rgba(220,38,38,.1)}
.gen-btn{padding:10px 16px;border:1px solid rgba(220,38,38,.3);border-radius:var(--r);background:linear-gradient(135deg,rgba(220,38,38,.15),rgba(185,28,28,.1));color:var(--text-hi);font-family:var(--display);font-size:.8rem;letter-spacing:2px;cursor:pointer;transition:all .3s;display:flex;align-items:center;gap:6px;white-space:nowrap}
.gen-btn:hover{border-color:#dc2626;box-shadow:0 0 20px rgba(220,38,38,.2);transform:translateY(-1px)}
.gen-btn-copy{background:linear-gradient(135deg,rgba(245,158,11,.1),rgba(245,158,11,.05));border-color:rgba(245,158,11,.2)}
.gen-btn-copy:hover{border-color:#f59e0b;box-shadow:0 0 20px rgba(245,158,11,.2)}
.gen-btn-send{background:linear-gradient(135deg,rgba(16,185,129,.1),rgba(16,185,129,.05));border-color:rgba(16,185,129,.2)}
.gen-btn-send:hover{border-color:#10b981;box-shadow:0 0 20px rgba(16,185,129,.2)}
.gen-output{background:rgba(0,0,0,.4);border:1px solid rgba(220,38,38,.08);border-radius:var(--r);padding:12px;min-height:120px;max-height:200px;overflow-y:auto;font-family:var(--mono);font-size:.75rem;color:var(--text);line-height:1.8;word-break:break-all;-webkit-overflow-scrolling:touch}

/* Progress Section — Portal Energy */
.progress-section{margin-top:auto}
.ps-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.ps-label{font-family:var(--display);font-size:.7rem;letter-spacing:2px;color:rgba(220,38,38,.6);font-weight:400}
.ps-nums{font-family:var(--mono);font-size:.75rem;color:var(--text);display:flex;gap:10px}
.ps-pct{color:var(--purple);font-weight:700;text-shadow:0 0 10px rgba(220,38,38,.3)}
.ps-track{position:relative;height:7px;background:rgba(220,38,38,.04);border-radius:4px;overflow:hidden;border:1px solid rgba(220,38,38,.08)}
.ps-fill{height:100%;width:0%;background:linear-gradient(90deg,#dc2626,#b91c1c,#f59e0b);border-radius:4px;transition:width .4s ease;position:relative;box-shadow:0 0 15px rgba(220,38,38,.3)}
.ps-shine{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(245,158,11,.3),transparent);animation:shineMove 1.5s linear infinite}
@keyframes shineMove{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.ps-markers{position:absolute;inset:0;display:flex;justify-content:space-between;padding:0 1px}
.ps-markers span{width:1px;height:100%;background:rgba(220,38,38,.1)}

/* === OUTPUT PANEL === */
.panel-output .panel-header{gap:8px}

/* Tabs */
.ph-tabs{display:flex;gap:4px;margin-left:auto}
.pt{display:flex;align-items:center;gap:5px;padding:5px 10px;border:1px solid transparent;border-radius:var(--r);background:transparent;font-family:var(--display);font-size:.65rem;letter-spacing:1.5px;color:var(--text-dim);cursor:pointer;transition:all .2s;font-weight:400}
.pt.active{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.15);color:var(--text)}
.pt:hover{color:var(--text)}
.pt-indicator{width:5px;height:5px;border-radius:50%}
.pt-green{background:var(--green)}.pt-red{background:var(--red)}.pt-amber{background:var(--amber)}
.pt-count{font-family:var(--mono);font-size:.65rem;color:var(--purple);font-weight:700}

/* Actions */
.ph-actions{display:flex;gap:4px}
.pa{width:28px;height:28px;border:1px solid var(--border);border-radius:var(--r);background:transparent;color:var(--text-dim);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.7rem;transition:all .2s}
.pa:hover{color:var(--cyan);border-color:var(--cyan);box-shadow:0 0 10px var(--cyan-glow)}

/* Terminal */
.panel-terminal{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:4px;position:relative;z-index:1}
.tab-pane{display:none;padding:8px}
.tab-pane.active{display:block}

/* Empty State — Portal */
.tp-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:200px;gap:16px}
.empty-portal{position:relative;width:120px;height:120px}
.ep-ring{position:absolute;border-radius:50%;border:2px solid}
.ep-ring.r1{inset:0;border-color:rgba(220,38,38,.3);animation:epSpin 8s linear infinite;box-shadow:0 0 15px rgba(220,38,38,.1),inset 0 0 15px rgba(220,38,38,.05)}
.ep-ring.r2{inset:15px;border-color:rgba(245,158,11,.2);animation:epSpin 5s linear infinite reverse;border-style:dashed}
.ep-ring.r3{inset:30px;border-color:rgba(220,38,38,.15);animation:epSpin 3s linear infinite}
@keyframes epSpin{to{transform:rotate(360deg)}}
.ep-core{position:absolute;inset:35px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:rgba(220,38,38,.4);animation:epPulse 3s ease-in-out infinite;background:radial-gradient(circle,rgba(220,38,38,.08),transparent 70%);border-radius:50%}
@keyframes epPulse{0%,100%{opacity:.3;transform:scale(.9);text-shadow:0 0 10px rgba(220,38,38,.2)}50%{opacity:.7;transform:scale(1.1);text-shadow:0 0 25px rgba(220,38,38,.5)}}
.ep-particles{position:absolute;inset:-10px;pointer-events:none}
.ep-p{position:absolute;width:3px;height:3px;border-radius:50%;background:rgba(220,38,38,.5);animation:epFloat var(--dur) ease-in-out infinite;opacity:0}
@keyframes epFloat{0%{opacity:0;transform:translate(0,0)}30%{opacity:.6}100%{opacity:0;transform:translate(var(--dx),var(--dy))}}
.te-main{font-family:var(--display);font-size:1.1rem;letter-spacing:3px;color:rgba(220,38,38,.5);text-shadow:0 0 15px rgba(220,38,38,.2)}
.te-sub{font-size:.7rem;color:var(--text-dim);opacity:.6;font-family:var(--font)}

/* Result Lines — Upside Down Flicker */
.result-line{padding:10px 14px;border-radius:var(--r);margin-bottom:5px;font-family:var(--mono);font-size:.75rem;line-height:1.5;word-break:break-all;border-left:3px solid transparent;transition:all .25s;animation:resultSlide .4s ease;position:relative;overflow:hidden}
@keyframes resultSlide{from{opacity:0;transform:translateX(-20px) scale(.98)}to{opacity:1;transform:translateX(0) scale(1)}}
.result-line::before{content:'';position:absolute;top:0;left:0;bottom:0;width:50px;pointer-events:none;opacity:.4}
.result-line::after{content:'';position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(220,38,38,.1),transparent);pointer-events:none}
.result-line:hover{transform:translateX(8px);box-shadow:0 2px 15px rgba(0,0,0,.3)}
.result-line.live{border-left-color:#10b981;background:linear-gradient(90deg,rgba(16,185,129,.08),rgba(16,185,129,.02));color:var(--green)}
.result-line.live::before{background:linear-gradient(90deg,rgba(16,185,129,.15),transparent)}
.result-line.live:hover{background:linear-gradient(90deg,rgba(16,185,129,.12),rgba(16,185,129,.04));box-shadow:inset 0 0 25px rgba(16,185,129,.04),0 2px 15px rgba(0,0,0,.3)}
.result-line.die{border-left-color:#ef4444;background:linear-gradient(90deg,rgba(239,68,68,.05),rgba(239,68,68,.01));color:var(--text)}
.result-line.die::before{background:linear-gradient(90deg,rgba(239,68,68,.1),transparent)}
.result-line.die:hover{background:linear-gradient(90deg,rgba(239,68,68,.08),rgba(239,68,68,.02))}
.result-line.error{border-left-color:#f59e0b;background:linear-gradient(90deg,rgba(245,158,11,.05),rgba(245,158,11,.01));color:var(--amber)}
.result-line.error::before{background:linear-gradient(90deg,rgba(245,158,11,.1),transparent)}
.result-line.error:hover{background:linear-gradient(90deg,rgba(245,158,11,.08),rgba(245,158,11,.02))}

/* === COOKIE GEN MODAL === */
.btn-cookiegen .btn-icon-ring{background:radial-gradient(circle at center,rgba(245,158,11,.15),transparent 70%)}
.btn-cookiegen:hover .btn-icon-ring{opacity:1}
.btn-cookiegen:hover i{color:#f59e0b;filter:drop-shadow(0 0 6px rgba(245,158,11,.5))}
.btn-cookiegen:hover .btn-label{color:#f59e0b}
.cookiegen-modal{max-width:520px}
.cg-btn-check{white-space:nowrap;align-self:flex-end;margin-bottom:0}
.cg-key-info{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px;background:rgba(220,38,38,.04);border:1px solid rgba(220,38,38,.1);border-radius:var(--r)}
.cg-info-row{display:flex;justify-content:space-between;align-items:center;padding:4px 8px}
.cg-info-label{font-family:var(--display);font-size:.65rem;letter-spacing:1.5px;color:var(--text-dim)}
.cg-info-val{font-family:var(--mono);font-size:.75rem;color:var(--text-hi);font-weight:600}
.cg-info-val.val-green{color:#22c55e}
.cg-info-val.val-amber{color:#f59e0b}
.cg-info-val.val-red{color:#ef4444}
.cg-plan-badge{font-family:var(--mono);font-size:.55rem;padding:2px 8px;border-radius:10px;letter-spacing:1px;font-weight:600}
.cg-plan-badge.plan-credits{background:rgba(245,158,11,.15);color:#f59e0b;border:1px solid rgba(245,158,11,.25)}
.cg-plan-badge.plan-daily{background:rgba(34,197,94,.15);color:#22c55e;border:1px solid rgba(34,197,94,.25)}
.cg-gen-section{display:flex;flex-direction:column;gap:10px;padding-top:10px;border-top:1px solid rgba(220,38,38,.08)}
.cg-btn-generate{white-space:nowrap;background:rgba(220,38,38,.1);border-color:rgba(220,38,38,.3);color:#dc2626}
.cg-btn-generate:hover{background:rgba(220,38,38,.2);box-shadow:0 0 15px rgba(220,38,38,.2)}
.cg-status-area{background:rgba(8,4,4,.6);border:1px solid rgba(220,38,38,.1);border-radius:var(--r);overflow:hidden;margin-top:4px}
.cg-status-header{display:flex;align-items:center;gap:6px;padding:6px 10px;background:rgba(220,38,38,.06);border-bottom:1px solid rgba(220,38,38,.08);font-family:var(--display);font-size:.6rem;letter-spacing:1.5px;color:var(--text-dim)}
.cg-status-header i{color:var(--purple);font-size:.55rem}
.cg-output{max-height:150px;overflow-y:auto;font-family:var(--mono);font-size:.7rem;line-height:1.6;color:var(--text);overscroll-behavior:contain;padding:8px 10px}
.cg-output .cg-line{padding:3px 0;border-bottom:1px solid rgba(220,38,38,.04)}
.cg-output .cg-line.cg-waiting{color:var(--text-dim);font-style:italic}
.cg-output .cg-line.cg-progress{color:var(--text-dim)}
.cg-output .cg-line.cg-success{color:#22c55e;font-weight:600}
.cg-output .cg-line.cg-error{color:#ef4444}
.cg-cookie-result{padding:10px;border-top:1px solid rgba(245,158,11,.15);background:rgba(245,158,11,.03)}
.cg-cookie-label{font-family:var(--display);font-size:.6rem;letter-spacing:1.5px;color:#f59e0b;margin-bottom:6px;display:flex;align-items:center;gap:6px}
.cg-cookie-value{font-family:var(--mono);font-size:.65rem;color:#f59e0b;word-break:break-all;background:rgba(245,158,11,.06);border:1px solid rgba(245,158,11,.15);border-radius:var(--r);padding:8px;margin-bottom:8px;max-height:80px;overflow-y:auto;line-height:1.5}
.cg-cookie-actions{display:flex;gap:6px}
.cg-action-btn{flex:1;padding:8px 10px;border:1px solid rgba(220,38,38,.2);border-radius:var(--r);background:rgba(220,38,38,.08);color:var(--text-hi);font-family:var(--display);font-size:.6rem;letter-spacing:1px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:5px}
.cg-action-btn:hover{background:rgba(220,38,38,.15);border-color:rgba(220,38,38,.35)}
.cg-action-btn i{font-size:.6rem}
.cg-send-btn{border-color:rgba(245,158,11,.2);background:rgba(245,158,11,.08);color:#f59e0b}
.cg-send-btn:hover{background:rgba(245,158,11,.15);border-color:rgba(245,158,11,.35)}
select.gen-input{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23dc2626'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px}

/* === STAFF SECTION === */
.staff-section{margin-top:10px;margin-bottom:6px}
.staff-title{font-family:var(--display);font-size:.75rem;letter-spacing:3px;color:var(--text-dim);text-align:center;margin-bottom:10px;display:flex;align-items:center;justify-content:center;gap:8px}
.staff-title i{color:#dc2626;font-size:.8rem}
.staff-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.staff-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 8px;background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);text-decoration:none;transition:all .3s;position:relative;overflow:hidden}
.staff-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;border-radius:2px 2px 0 0;transition:opacity .3s}
.staff-owner::before{background:linear-gradient(90deg,transparent,#dc2626,transparent);opacity:.6}
.staff-seller::before{background:linear-gradient(90deg,transparent,#f59e0b,transparent);opacity:.6}
.staff-card:hover{border-color:var(--border-hi);transform:translateY(-2px);box-shadow:0 4px 20px rgba(220,38,38,.1)}
.staff-card:hover::before{opacity:1}
.staff-role{font-family:var(--display);font-size:.5rem;letter-spacing:2px;font-weight:600}
.staff-owner .staff-role{color:#dc2626}
.staff-seller .staff-role{color:#f59e0b}
.staff-user{font-family:var(--mono);font-size:.65rem;color:var(--text-hi);display:flex;align-items:center;gap:4px;white-space:nowrap}
.staff-user i{font-size:.7rem;color:#229ED9}

/* === CG STAFF CTA === */
.cg-staff-cta{display:flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(245,158,11,.06);border:1px solid rgba(245,158,11,.15);border-radius:var(--r);margin-bottom:12px;flex-wrap:wrap;font-size:.7rem;color:var(--text)}
.cg-staff-cta>i{color:#f59e0b;font-size:.85rem}
.cg-staff-cta strong{color:#f59e0b}
.cg-staff-links{display:flex;gap:10px;margin-left:auto}
.cg-staff-links a{color:#229ED9;text-decoration:none;font-family:var(--mono);font-size:.6rem;display:flex;align-items:center;gap:3px;transition:color .2s}
.cg-staff-links a:hover{color:#f59e0b}

/* === COOKIE BAR === */
.cookie-bar{margin-bottom:8px}
.cookie-bar-btn{width:100%;display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--card);border:1px solid var(--border);border-radius:var(--r);cursor:pointer;transition:all .3s;position:relative;overflow:hidden;font-family:var(--display);color:var(--text)}
.cookie-bar-btn::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#dc2626,transparent);opacity:.5;transition:opacity .3s}
.cookie-bar-btn:hover{border-color:var(--border-hi);background:rgba(220,38,38,.06)}
.cookie-bar-btn:hover::before{opacity:1}
.cookie-bar-btn i{font-size:.85rem;color:#dc2626}
.cookie-bar-text{font-size:.7rem;letter-spacing:2px;font-weight:600}
.cookie-bar-status{margin-left:auto;font-family:var(--mono);font-size:.55rem;letter-spacing:1px;padding:3px 10px;border-radius:12px;border:1px solid transparent}
.cookie-bar.has-cookie .cookie-bar-btn{border-color:rgba(34,197,94,.25)}
.cookie-bar.has-cookie .cookie-bar-btn::before{background:linear-gradient(90deg,transparent,#22c55e,transparent)}
.cookie-bar.has-cookie .cookie-bar-status{color:#22c55e;border-color:rgba(34,197,94,.2);background:rgba(34,197,94,.08)}
.cookie-bar:not(.has-cookie) .cookie-bar-status{color:var(--text-dim);border-color:var(--border);background:rgba(220,38,38,.06)}

/* === COOKIE MODAL === */
.cookie-modal{max-width:520px}
.cookie-textarea{width:100%;min-height:120px;resize:vertical;font-family:var(--mono);font-size:.75rem;line-height:1.6;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);color:var(--text-hi);padding:12px;transition:border-color .3s,box-shadow .3s}
.cookie-textarea:focus{border-color:var(--border-active);box-shadow:0 0 0 3px rgba(220,38,38,.1);outline:none}
.cookie-textarea::placeholder{color:var(--text-dim)}
.cookie-modal-actions{display:flex;gap:8px;margin-top:10px}
.cookie-save-btn{flex:2;background:linear-gradient(135deg,rgba(220,38,38,.15),rgba(185,28,28,.1))!important;border-color:rgba(220,38,38,.3)!important;color:#dc2626!important}
.cookie-save-btn:hover{background:linear-gradient(135deg,rgba(220,38,38,.25),rgba(185,28,28,.15))!important;box-shadow:0 0 20px rgba(220,38,38,.15)}
.cookie-clear-btn{flex:1;background:rgba(220,38,38,.06)!important;border-color:var(--border)!important;color:var(--text-dim)!important}
.cookie-clear-btn:hover{border-color:rgba(220,38,38,.3)!important;color:var(--text)!important}

/* === MUTE BUTTON === */
.cb-mute{width:32px;height:32px;border-radius:50%;border:1px solid rgba(220,38,38,.2);background:rgba(220,38,38,.06);color:var(--text-dim);font-size:.7rem;cursor:pointer;transition:all .25s;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cb-mute:hover{background:rgba(220,38,38,.15);color:var(--text-hi);border-color:rgba(220,38,38,.4)}
.cb-mute.muted{color:rgba(220,38,38,.3)}
.cb-mute.muted:hover{color:#dc2626}

/* === FOOTER — Stranger === */
.StrangerChk-foot{padding:10px 0 4px;position:relative}
.nf-line{height:1px;background:linear-gradient(90deg,transparent,rgba(220,38,38,.3),rgba(245,158,11,.2),rgba(220,38,38,.3),transparent);margin-bottom:10px;animation:footerLineFlicker 5s ease-in-out infinite}
@keyframes footerLineFlicker{0%,100%{opacity:.8}50%{opacity:.4}}
.nf-content{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.nf-item{font-family:var(--display);font-size:.8rem;letter-spacing:2px;color:var(--text)}
.nf-sep{font-size:.5rem;color:var(--purple);opacity:.6;animation:sepPulse 2s ease-in-out infinite}
@keyframes sepPulse{0%,100%{opacity:.3}50%{opacity:.7}}
.nf-link a{color:var(--purple);text-decoration:none;transition:all .3s}
.nf-link a:hover{color:#f59e0b;text-shadow:0 0 10px rgba(245,158,11,.3)}

/* ============================================
   RESPONSIVE
   ============================================ */

/* Large Desktop */
@media(min-width:1400px){
	.workspace{grid-template-columns:480px 1fr}
	html{font-size:16px}
}

/* Tablet Landscape */
@media(max-width:1100px){
	.workspace{grid-template-columns:380px 1fr}
	.hc{width:54px;height:54px}
	.hc-num{font-size:.85rem}
	.cmd-bar{gap:10px}
}

/* Tablet Portrait */
@media(max-width:900px){
	.workspace{grid-template-columns:1fr;grid-template-rows:auto 1fr}
	.panel-input{max-height:55vh}
	.cmd-bar{padding:8px 12px}
	.hud-circles{gap:4px}
	.hc{width:48px;height:48px}
	.hc-num{font-size:.8rem}
	.hc-label{font-size:.3rem}
	.cb-timer,.cb-speed{padding:4px 8px;font-size:.75rem}
	.panel-body{padding:14px}
	.ph-tabs{margin-left:0}
}

/* Mobile */
@media(max-width:600px){
	html{font-size:15px}
	.StrangerChk{padding:12px 10px;min-height:auto;max-height:none;overflow-y:auto}
	.cmd-bar{flex-direction:column;gap:10px;border-radius:var(--r-lg);padding:12px}
	.cb-left,.cb-center,.cb-right{width:100%;justify-content:center}
	.hud-circles{flex-wrap:wrap;justify-content:center;gap:8px}
	.hc{width:58px;height:58px}
	.hc-num{font-size:.95rem}
	.hc-label{font-size:.38rem}
	.cb-right{gap:8px;flex-wrap:wrap}
	.cb-timer,.cb-speed{font-size:.85rem;padding:5px 10px}
	.workspace{gap:8px}
	.panel-input{max-height:none}
	.panel-body{padding:14px}
	.action-grid{gap:8px}
	.btn-launch{padding:16px 22px;font-size:1.05rem}
	.nx-btn{font-size:1rem}
	.btn-secondary,.btn-gen{height:52px;min-height:52px;max-height:52px}
	.btn-icon-ring{width:26px;height:26px;font-size:.7rem}
	.btn-label{font-size:.42rem}
	.gen-modal{width:95%;max-width:none;max-height:85vh;max-height:85dvh;overflow-y:auto;margin:auto}
	.cookiegen-modal{max-width:none;max-height:85vh;max-height:85dvh;overflow-y:auto}
	.gen-row{flex-direction:column}
	.gen-field.gen-sm{flex:1}
	.gen-body{padding:14px}
	.gen-input{padding:10px 12px;font-size:.85rem}
	.gen-label{font-size:.7rem}
	.cg-key-info{grid-template-columns:1fr}
	.cg-btn-check{width:100%;min-height:44px;font-size:.8rem}
	.cg-cookie-actions{flex-direction:column}
	.cg-action-btn{min-height:44px;font-size:.8rem}
	.cg-output{max-height:140px}
	.cg-cookie-value{font-size:.65rem}
	.gen-overlay{padding:10px;align-items:center;overflow-y:auto}
	.ph-tabs{flex-wrap:wrap;gap:4px;margin-left:0;width:100%;order:10}
	.pt{padding:8px 10px;font-size:.6rem;min-height:38px}
	.bi-name{font-size:1.35rem;letter-spacing:4px}
	.bi-ver{font-size:.6rem}
	.pc-corner{width:14px;height:14px}
	.pc-corner::before{width:14px}
	.pc-corner::after{height:14px}
	.panel-header{padding:12px 14px;gap:10px;flex-wrap:wrap}
	.ph-badge{font-size:.65rem;padding:3px 10px}
	.ph-icon{font-size:1rem}
	.ph-actions{margin-left:auto}
	textarea{padding:12px;font-size:16px;min-height:120px}
	.result-line{padding:10px 12px;font-size:.75rem}
	.nf-content{gap:8px}
	.nf-item{font-size:.75rem;letter-spacing:1.5px}
	.panel-terminal{max-height:50vh;overflow-y:auto;overscroll-behavior:contain}
	.staff-grid{grid-template-columns:repeat(2,1fr)}
	.cg-staff-cta{flex-direction:column;text-align:center;font-size:.65rem}
	.cg-staff-links{margin-left:0;justify-content:center}
	.brand-hex{width:44px;height:44px;font-size:1.3rem}
	.cb-brand{gap:12px}
}

/* Small Phones */
@media(max-width:380px){
	html{font-size:13px}
	.hc{width:52px;height:52px}
	.hc-num{font-size:.85rem}
	.action-grid{gap:6px}
	.nx-btn{padding:10px 8px;min-height:48px;font-size:.95rem}
	.cb-brand{gap:8px}
	.brand-hex{width:38px;height:38px;font-size:1.15rem}
	.bi-name{font-size:1.15rem;letter-spacing:2px}
	.bi-ver{font-size:.5rem}
	.cb-timer,.cb-speed{font-size:.75rem;padding:4px 8px}
	.ph-badge{font-size:.6rem;padding:3px 8px}
}

/* Very Small Phones */
@media(max-width:320px){
	html{font-size:12px}
	.hud-circles{gap:4px}
	.hc{width:44px;height:44px}
	.hc-num{font-size:.7rem}
	.hc-label{display:none}
	.action-grid{gap:5px}
}

/* Landscape Mobile */
@media(max-height:500px) and (orientation:landscape){
	.cmd-bar{padding:6px 12px;flex-direction:row}
	.cb-left,.cb-center,.cb-right{width:auto}
	.hc{width:40px;height:40px}
	.hc-num{font-size:.7rem}
	.hc-label{display:none}
	.workspace{grid-template-columns:1fr 1fr}
	.panel-input{max-height:none}
	.boot-hex{width:60px;height:60px}
}