/* 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{display:flex;flex-direction:row;min-height:100vh;min-height:100dvh;position:relative;z-index:1;max-width:none;width:100%;overflow-x:hidden}
.StrangerChk.visible{opacity:1}

/* === COMMAND BAR === */
.cmd-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:rgba(18,6,6,.8);border:1px solid rgba(255,255,255,.05);border-radius:var(--r-lg);margin-bottom:14px;gap:12px;position:relative;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}

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

/* === 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:6px}
.hc{position:relative;width:48px;height:48px;cursor:default;flex-shrink:0}
.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:.8rem;font-weight:700;color:var(--text-hi);line-height:1;transition:transform .2s}
.hc-label{font-size:.3rem;letter-spacing:1.5px;color:var(--text-dim);font-weight:700;margin-top:1px}
.hc:hover .hc-num{transform:scale(1.12)}

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

/* Status */
.cb-status{display:flex;align-items:center;gap:6px;padding:4px 12px;border-radius:6px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);transition:all .3s}
.cbs-pulse{width:6px;height:6px;border-radius:50%;background:var(--text-dim);transition:all .3s}
.cb-status.running .cbs-pulse{background:var(--green);box-shadow:0 0 8px var(--green-glow);animation:statusPulse 1.5s ease-in-out infinite}
.cb-status.paused .cbs-pulse{background:var(--amber);box-shadow:0 0 8px var(--amber-glow)}
.cb-status.done .cbs-pulse{background:var(--purple);box-shadow:0 0 8px 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:.7rem;letter-spacing:2px;color:var(--text-dim);font-weight:400}

/* === WORKSPACE === */
.workspace{flex:1;display:grid;grid-template-columns:420px 1fr;gap:16px;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:16px 20px;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:18px 20px;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:16px;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,.fg-input{width:100%;background:rgba(0,0,0,.4);border:1px solid rgba(220,38,38,.1);border-radius:var(--r);padding:10px 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;box-sizing:border-box}
select.fg-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 12px center;padding-right:32px}
select.fg-input.input-cyan{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='%236366f1'/%3E%3C/svg%3E")}
select.fg-input.input-green{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='%2322c55e'/%3E%3C/svg%3E")}
textarea:focus,.fg-input: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-input.input-cyan{border-color:rgba(99,102,241,.2)}
.fg-input.input-cyan:focus{border-color:rgba(99,102,241,.5);box-shadow:0 0 30px rgba(99,102,241,.15)}
.fg-input.input-green{border-color:rgba(34,197,94,.2)}
.fg-input.input-green:focus{border-color:rgba(34,197,94,.5);box-shadow:0 0 30px rgba(34,197,94,.15)}
.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:10px;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:14px 20px;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;padding-top:8px}
.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:8px 12px;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 16px;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 SIDEBAR === */
.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}

/* GEN COOKIE — Full Width Prominent Button */
.btn-cookiegen-promo{position:relative;width:100%;border:1px solid rgba(245,158,11,.3);border-radius:var(--r-lg);padding:0;overflow:hidden;cursor:pointer;background:transparent;transition:all .4s cubic-bezier(.4,0,.2,1);min-height:60px;box-sizing:border-box}
.btn-cookiegen-promo-bg{position:absolute;inset:0;background:linear-gradient(135deg,rgba(245,158,11,.08),rgba(217,119,6,.04),rgba(245,158,11,.08));transition:opacity .3s;opacity:.7}
.btn-cookiegen-promo-border{position:absolute;inset:-1px;border-radius:inherit;background:conic-gradient(from var(--cg-angle,0deg),transparent 55%,rgba(245,158,11,.5) 75%,rgba(220,38,38,.4) 88%,transparent);opacity:0;transition:opacity .4s;animation:cgBorderSpin 5s linear infinite;--cg-angle:0deg}
@keyframes cgBorderSpin{to{--cg-angle:360deg}}
@property --cg-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.btn-cookiegen-promo::after{content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(245,158,11,.12),transparent);transition:left .7s;pointer-events:none;z-index:2}
.btn-cookiegen-promo:hover{border-color:rgba(245,158,11,.6);box-shadow:0 0 30px rgba(245,158,11,.15),0 0 60px rgba(245,158,11,.05),inset 0 0 30px rgba(245,158,11,.04);transform:translateY(-2px)}
.btn-cookiegen-promo:hover .btn-cookiegen-promo-bg{opacity:1}
.btn-cookiegen-promo:hover .btn-cookiegen-promo-border{opacity:1}
.btn-cookiegen-promo:hover::after{left:150%}
.btn-cookiegen-promo:hover .bcg-left{color:#f59e0b;border-color:rgba(245,158,11,.5);box-shadow:0 0 20px rgba(245,158,11,.3)}
.btn-cookiegen-promo:hover .bcg-left::after{opacity:.8}
.btn-cookiegen-promo:hover .bcg-title{color:#f59e0b;text-shadow:0 0 15px rgba(245,158,11,.4)}
.btn-cookiegen-promo:hover .bcg-arrow{color:#f59e0b;transform:translateX(4px)}
.btn-cookiegen-promo:active{transform:translateY(0) scale(.98)}

.btn-cookiegen-promo-content{position:relative;z-index:3;display:flex;align-items:center;gap:14px;padding:14px 20px}
.bcg-left{width:40px;height:40px;border-radius:var(--r);background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.2);display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--amber);transition:all .3s;flex-shrink:0;position:relative}
.bcg-left::after{content:'';position:absolute;inset:-4px;background:radial-gradient(circle,rgba(245,158,11,.15),transparent 70%);border-radius:50%;opacity:0;transition:opacity .3s}
.bcg-info{display:flex;flex-direction:column;flex:1;min-width:0}
.bcg-title{font-family:var(--display);font-size:1rem;letter-spacing:3px;color:var(--text-hi);transition:all .3s;text-shadow:0 0 10px rgba(245,158,11,.15)}
.bcg-sub{font-family:var(--mono);font-size:.6rem;letter-spacing:1px;color:var(--text-dim);margin-top:2px}
.bcg-arrow{color:var(--text-dim);font-size:.7rem;transition:all .3s;flex-shrink:0}

/* Sidebar overlay backdrop */
.cg-sidebar-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9998;opacity:0;visibility:hidden;pointer-events:none;transition:all .35s ease;backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}
.cg-sidebar-overlay.active{opacity:1;visibility:visible;pointer-events:auto;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}

/* Sidebar panel */
.cg-sidebar{position:fixed;top:0;right:0;width:420px;max-width:92vw;height:100vh;height:100dvh;background:var(--surface);border-left:1px solid rgba(220,38,38,.2);z-index:9999;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .4s cubic-bezier(.4,0,.2,1);overflow:hidden;box-shadow:-8px 0 40px rgba(0,0,0,.6),-2px 0 20px rgba(220,38,38,.08)}
.cg-sidebar.active{transform:translateX(0)}

/* Sidebar top glow line */
.cg-sidebar::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#dc2626,#f59e0b,#dc2626,transparent);z-index:2}
/* Sidebar left edge vine */
.cg-sidebar::after{content:'';position:absolute;top:0;left:0;bottom:0;width:2px;background:linear-gradient(180deg,rgba(220,38,38,.5),rgba(220,38,38,.1) 30%,rgba(185,28,28,.08) 70%,rgba(220,38,38,.3));z-index:2;pointer-events:none}

/* Sidebar header */
.cg-sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid rgba(220,38,38,.12);background:linear-gradient(180deg,rgba(220,38,38,.06),rgba(185,28,28,.02),transparent);flex-shrink:0;position:relative;z-index:1}
.cg-sidebar-title{display:flex;align-items:center;gap:10px;color:#dc2626}
.cg-sidebar-title i{font-size:1rem;filter:drop-shadow(0 0 6px rgba(220,38,38,.4))}
.cg-sidebar-title span{font-family:var(--display);font-size:1.1rem;letter-spacing:3px;text-shadow:0 0 15px rgba(220,38,38,.3)}
.cg-sidebar-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}
.cg-sidebar-close:hover{color:#dc2626;border-color:#dc2626;box-shadow:0 0 15px rgba(220,38,38,.2)}

/* Sidebar body */
.cg-sidebar-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px 20px 20px;display:flex;flex-direction:column;gap:12px;position:relative;z-index:1}

/* Sidebar row (replaces gen-row inside sidebar) */
.cg-sidebar-row{display:flex;gap:8px;margin-bottom:12px;align-items:flex-end;flex-wrap:wrap}
.cg-sidebar-field{flex:1;min-width:80px}

/* Corner vine decorations inside sidebar */
.cg-sidebar-body::before{content:'';position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(180deg,rgba(220,38,38,.2),rgba(220,38,38,.04) 40%,transparent);pointer-events:none;z-index:0}
.cg-sidebar-body::after{content:'';position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,rgba(245,158,11,.15),rgba(245,158,11,.03) 40%,transparent);pointer-events:none;z-index:0}
.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}
/* Progress bar */
.cg-progress-area{padding:12px 10px}
.cg-progress-bar-wrap{width:100%;height:6px;background:rgba(220,38,38,.08);border-radius:3px;overflow:hidden;position:relative}
.cg-progress-bar{height:100%;width:0%;background:linear-gradient(90deg,#dc2626,#f59e0b);border-radius:3px;transition:width .6s ease;box-shadow:0 0 8px rgba(220,38,38,.4)}
.cg-progress-bar.bar-success{background:linear-gradient(90deg,#10b981,#22c55e)!important;box-shadow:0 0 8px rgba(16,185,129,.4)}
.cg-progress-bar.bar-error{background:#ef4444!important;box-shadow:0 0 8px rgba(239,68,68,.4)}
.cg-progress-info{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.cg-progress-step{font-family:var(--mono);font-size:.72rem;color:var(--text)}
.cg-progress-pct{font-family:var(--display-alt);font-size:.7rem;color:var(--text-dim);letter-spacing:1px}
.cg-progress-steps{display:flex;gap:4px;margin-top:10px;flex-wrap:wrap}
.cg-step{font-family:var(--mono);font-size:.6rem;padding:3px 8px;border-radius:4px;background:rgba(220,38,38,.05);border:1px solid rgba(220,38,38,.08);color:var(--text-dim);display:flex;align-items:center;gap:4px;transition:all .3s}
.cg-step i{font-size:.55rem}
.cg-step.step-active{background:rgba(220,38,38,.12);border-color:rgba(220,38,38,.3);color:#dc2626;animation:stepPulse 1.5s ease-in-out infinite}
.cg-step.step-done{background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.2);color:#10b981}
.cg-step.step-error{background:rgba(239,68,68,.08);border-color:rgba(239,68,68,.2);color:#ef4444}
@keyframes stepPulse{0%,100%{opacity:1}50%{opacity:.6}}
.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:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.03);color:var(--text-dim);font-size:.6rem;cursor:pointer;transition:all .25s;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cb-mute:hover{background:rgba(220,38,38,.1);color:var(--text-hi);border-color:rgba(220,38,38,.25)}
.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)}

/* === SIDEBAR NAVIGATION === */
.sidebar{width:220px;min-width:220px;background:rgba(18,6,6,.96);border-right:1px solid rgba(220,38,38,.15);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;height:100dvh;z-index:10;overflow-y:auto;-webkit-overflow-scrolling:touch;transition:transform .4s cubic-bezier(.4,0,.2,1),box-shadow .4s}
.sidebar::after{content:'';position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,rgba(220,38,38,.5),rgba(220,38,38,.08) 30%,rgba(185,28,28,.06) 70%,rgba(220,38,38,.3));pointer-events:none}
.sidebar::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#dc2626,#f59e0b,#dc2626,transparent);z-index:2}
.sidebar.active{box-shadow:-8px 0 40px rgba(0,0,0,.6),-2px 0 20px rgba(220,38,38,.08)}
.main-content{flex:1;min-width:0;display:flex;flex-direction:column;padding:24px 32px;max-width:1400px;overflow-x:hidden;transition:margin-left .4s cubic-bezier(.4,0,.2,1)}

/* Sidebar overlay for mobile */
.sidebar-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9998;opacity:0;visibility:hidden;pointer-events:none;transition:all .4s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}
.sidebar-overlay.active{opacity:1;visibility:visible;pointer-events:auto;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}

/* Hamburger toggle button */
.sidebar-toggle{position:fixed;top:16px;left:16px;z-index:10000;width:36px;height:36px;border-radius:8px;border:1px solid rgba(220,38,38,.3);background:rgba(18,6,6,.8);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;visibility:hidden;pointer-events:none}
.sidebar-toggle.visible{opacity:1;visibility:visible;pointer-events:auto}
.sidebar-toggle:hover{border-color:rgba(220,38,38,.6);box-shadow:0 0 20px rgba(220,38,38,.3);transform:scale(1.05)}
.sidebar-toggle i{font-size:1.1rem;color:#dc2626;transition:all .3s}
.sidebar-toggle:hover i{color:#f59e0b;filter:drop-shadow(0 0 6px rgba(245,158,11,.5))}

/* Sidebar Brand */
.sb-brand{padding:20px 16px;border-bottom:1px solid rgba(220,38,38,.12);display:flex;align-items:center;gap:12px;flex-shrink:0}
.sb-brand .st-brand-icon{width:30px;height:40px;flex-shrink:0}
.sb-brand .st-brand-icon .bulb-glass{fill:rgba(220,38,38,.15);animation:bulbFlicker 3s ease-in-out infinite}
.sb-brand .brand-info .bi-name{font-family:var(--display);font-size:1.1rem;color:#dc2626;letter-spacing:4px;font-weight:400;text-shadow:0 0 12px rgba(220,38,38,.4),0 0 25px rgba(220,38,38,.15);display:block;line-height:1.2}
.sb-brand .brand-info .bi-ver{font-size:.5rem;color:var(--purple);letter-spacing:2px;font-weight:600;display:block;margin-top:2px}

/* Sidebar Nav Items */
.sb-nav{flex:1;padding:12px 8px;display:flex;flex-direction:column;gap:4px}
.sb-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border:none;background:transparent;border-radius:var(--r);cursor:pointer;transition:all .3s;font-family:var(--font);color:var(--text-dim);text-align:left;position:relative;overflow:hidden;font-size:.75rem;letter-spacing:1px}
.sb-item::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:0;background:linear-gradient(180deg,#dc2626,#f59e0b);border-radius:0 2px 2px 0;transition:height .3s}
.sb-item i{font-size:.9rem;width:20px;text-align:center;transition:all .3s;flex-shrink:0}
.sb-item:hover{background:rgba(220,38,38,.06);color:var(--text)}
.sb-item.active{background:rgba(220,38,38,.1);color:var(--text-hi);border-color:rgba(220,38,38,.15)}
.sb-item.active::before{height:24px}
.sb-item.active i{color:#dc2626;filter:drop-shadow(0 0 6px rgba(220,38,38,.5))}
.sb-label{font-weight:600}

/* Sidebar Footer */
.sb-footer{padding:12px 16px;border-top:1px solid rgba(220,38,38,.1);flex-shrink:0}
.sb-f-line{height:1px;background:linear-gradient(90deg,transparent,rgba(220,38,38,.3),transparent);margin-bottom:10px}
.sb-f-credits{font-size:.55rem;color:var(--text-dim);text-align:center;margin-bottom:6px;letter-spacing:.5px}
.sb-f-link{display:flex;align-items:center;justify-content:center;gap:6px;font-size:.6rem;color:var(--purple);text-decoration:none;transition:color .3s;font-family:var(--mono)}
.sb-f-link:hover{color:#f59e0b}
.sb-f-link i{font-size:.7rem}

/* Sidebar Staff */
.sb-staff{padding:0 0 8px}
.sb-staff-title{font-family:var(--display);font-size:.6rem;letter-spacing:2px;color:var(--text-dim);text-align:center;margin-bottom:6px;display:flex;align-items:center;justify-content:center;gap:6px}
.sb-staff-title i{color:#dc2626;font-size:.55rem}
.sb-staff-card{display:flex;align-items:center;justify-content:space-between;padding:5px 8px;border-radius:6px;text-decoration:none;transition:all .2s;gap:6px;margin-bottom:2px}
.sb-staff-card:hover{background:rgba(220,38,38,.06)}
.sb-staff-role{font-family:var(--display);font-size:.45rem;letter-spacing:1.5px;font-weight:700;min-width:42px;text-align:center;padding:2px 4px;border-radius:3px}
.sb-staff-role.owner{color:#dc2626;background:rgba(220,38,38,.1)}
.sb-staff-role.seller{color:#f59e0b;background:rgba(245,158,11,.1)}
.sb-staff-user{font-family:var(--mono);font-size:.55rem;color:var(--text);display:flex;align-items:center;gap:4px;white-space:nowrap}
.sb-staff-user i{font-size:.6rem;color:#229ED9}
.sb-f-ver{display:block;font-size:.5rem;color:var(--text-dim);margin-top:2px;letter-spacing:.5px}

/* Command Bar adjustments */
.cb-brand-mobile{display:none;align-items:center;gap:6px}
.cb-brand-mobile .bi-name{font-size:1rem;letter-spacing:3px}
.cb-brand-mobile .bi-ver{font-size:.5rem}
.cb-active-mode{display:flex;align-items:center;gap:6px;padding:4px 10px;background:rgba(220,38,38,.06);border:1px solid rgba(220,38,38,.1);border-radius:6px;font-family:var(--display);font-size:.7rem;letter-spacing:2px;color:#dc2626}
.cb-active-mode i{font-size:.75rem;opacity:.8}

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

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

/* Tablet Landscape */
@media(max-width:1100px){
	.workspace{grid-template-columns:380px 1fr}
	.hc{width:44px;height:44px}
	.hc-num{font-size:.75rem}
	.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:42px;height:42px}
	.hc-num{font-size:.7rem}
	.hc-label{font-size:.28rem}
	.cb-timer,.cb-speed{padding:3px 6px;font-size:.65rem}
	.panel-body{padding:14px}
	.ph-tabs{margin-left:0}
	.sidebar{display:none}
	.main-content{padding:16px 12px}
}

/* Mobile */
@media(max-width:600px){
	html{font-size:15px}
	.StrangerChk{padding:12px 10px;min-height:auto;max-height:none;overflow-y:auto;flex-direction:column}
	.cmd-bar{flex-direction:column;gap:8px;border-radius:var(--r-lg);padding:10px 10px 10px 52px;width:100%;margin-top:8px}
	.cb-left{justify-content:flex-start}
	.cb-brand-mobile{padding-left:4px}
	.hud-circles{flex-wrap:nowrap;justify-content:center;gap:4px;overflow-x:auto;padding-bottom:4px;width:100%}
	.hc{width:46px;height:46px;flex-shrink:0}
	.hc-num{font-size:.75rem}
	.hc-label{font-size:.28rem}
	.cb-right{gap:4px;justify-content:center}
	.cb-timer,.cb-speed,.cb-status{font-size:.65rem;padding:3px 6px}
	.workspace{gap:12px;display:flex;flex-direction:column}
	.panel-input,.panel-output{width:100%;max-height:none;flex:none}
	.panel-body{padding:12px}
	.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
	.action-grid .btn-launch{grid-column:span 2;padding:14px;font-size:1rem}
	.nx-btn{font-size:.9rem;min-height:44px}
	.btn-secondary,.btn-gen{height:48px;min-height:48px}
	.btn-label{font-size:.38rem}
	.gen-modal{width:95%;max-width:none;max-height:90vh;overflow-y:auto;margin:auto}
	.gen-row{flex-direction:row;gap:6px}
	.gen-field{flex:1}
	.gen-field.gen-sm{flex:0 0 60px}
	.gen-input{padding:8px 10px;font-size:16px!important}
	.tp-empty{min-height:140px;gap:10px}
	.empty-portal{width:80px;height:80px}
	.ep-core{inset:25px;font-size:1.2rem}
	.te-main{font-size:.9rem}
	textarea, input[type="text"], input[type="number"], select{font-size:16px!important}
	.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}
	.cg-sidebar{width:100vw;max-width:100vw}
	.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}
	.bcg-title{font-size:.9rem;letter-spacing:2px}
	.bcg-sub{font-size:.55rem}
	.bcg-left{width:36px;height:36px;font-size:1rem}
	.btn-cookiegen-promo-content{padding:12px 16px;gap:12px}
	.brand-hex{width:44px;height:44px;font-size:1.3rem}
	.main-content{padding:12px 10px}
}

/* Medium-small Phones */
@media(max-width:480px){
	.hc{width:44px;height:44px}
	.hc-num{font-size:.72rem}
	.hc-label{font-size:.28rem}
	.action-grid{gap:6px}
	.btn-secondary,.btn-gen{height:48px;min-height:48px;max-height:48px}
	.nf-item{font-size:.65rem}
	.staff-grid{gap:6px}
}

/* Small Phones */
@media(max-width:380px){
	html{font-size:13px}
	.hc{width:42px;height:42px}
	.hc-num{font-size:.7rem}
	.action-grid{gap:6px}
	.nx-btn{padding:10px 8px;min-height:48px;font-size:.95rem}
	.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:.65rem;padding:3px 6px}
	.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:38px;height:38px}
	.hc-num{font-size:.6rem}
	.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:36px;height:36px}
	.hc-num{font-size:.6rem}
	.hc-label{display:none}
	.workspace{grid-template-columns:1fr 1fr}
	.panel-input{max-height:none}
	.boot-hex{width:60px;height:60px}
}

/* === MODE TOGGLE === */
.mode-toggle{display:flex;gap:0;border-radius:8px;overflow:hidden;border:1px solid rgba(99,102,241,.2)}
.mode-btn{
	flex:1;padding:.5rem .4rem;border:none;background:rgba(0,0,0,.4);color:#64748b;
	font-family:'JetBrains Mono',monospace;font-size:.65rem;font-weight:600;cursor:pointer;
	display:flex;align-items:center;justify-content:center;gap:.4rem;transition:all .3s;
	letter-spacing:.03em;text-transform:uppercase;position:relative;
}
.mode-btn:hover{color:#94a3b8;background:rgba(0,0,0,.5)}
.mode-btn.active{background:rgba(99,102,241,.15);color:#a5b4fc;border-color:rgba(99,102,241,.4);text-shadow:0 0 8px rgba(99,102,241,.3)}
.mode-btn.active:first-child{box-shadow:inset 2px 0 8px rgba(220,38,38,.15)}
.mode-btn.active:last-child{box-shadow:inset -2px 0 8px rgba(34,197,94,.15)}
.mode-btn i{font-size:.75rem}

/* === ADMIN PANEL === */
.admin-overlay{display:none;position:fixed;inset:0;z-index:99999;background:rgba(4,2,2,.97);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);overflow-y:auto;font-family:'JetBrains Mono',monospace}
.admin-overlay[style*="display: block"], .admin-overlay[style*="display:block"]{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.admin-overlay.active{display:flex;align-items:flex-start;justify-content:center;padding:2rem}
.admin-auth{width:100%;max-width:400px;margin-top:10vh}
.admin-auth-box{background:rgba(18,6,6,.95);border:1px solid rgba(220,38,38,.3);border-radius:12px;padding:2.5rem;text-align:center;position:relative;overflow:hidden}
.admin-auth-box::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#dc2626,transparent);animation:admin-scan 2s linear infinite}
@keyframes admin-scan{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.admin-auth-icon{font-size:2.5rem;color:#dc2626;margin-bottom:1rem;filter:drop-shadow(0 0 15px rgba(220,38,38,.5))}
.admin-auth-title{font-size:1.2rem;color:#f8fafc;font-weight:700;letter-spacing:.1em;margin-bottom:.3rem;font-family:'Orbitron',sans-serif}
.admin-auth-sub{font-size:.65rem;color:#64748b;letter-spacing:.15em;margin-bottom:1.5rem}
.admin-input{width:100%;padding:.65rem .8rem;background:rgba(0,0,0,.5);border:1px solid rgba(220,38,38,.2);border-radius:8px;color:#e2e8f0;font-family:'JetBrains Mono',monospace;font-size:.75rem;outline:none;transition:border-color .3s}
.admin-input:focus{border-color:rgba(220,38,38,.5);box-shadow:0 0 12px rgba(220,38,38,.15)}
.admin-input-full{width:100%;padding:.55rem .7rem;background:rgba(0,0,0,.4);border:1px solid rgba(220,38,38,.2);border-radius:6px;color:#e2e8f0;font-family:'JetBrains Mono',monospace;font-size:.7rem;outline:none;transition:border-color .3s}
.admin-input-full:focus{border-color:rgba(220,38,38,.5)}
.admin-btn{padding:.6rem 1.2rem;background:rgba(220,38,38,.15);border:1px solid rgba(220,38,38,.3);border-radius:8px;color:#f87171;font-family:'Orbitron',sans-serif;font-size:.65rem;font-weight:600;letter-spacing:.1em;cursor:pointer;transition:all .3s;text-transform:uppercase;display:inline-flex;align-items:center;gap:.5rem}
.admin-btn:hover{background:rgba(220,38,38,.25);border-color:rgba(220,38,38,.5);box-shadow:0 0 15px rgba(220,38,38,.2)}
.admin-btn-sm{padding:.35rem .7rem;background:rgba(220,38,38,.1);border:1px solid rgba(220,38,38,.2);border-radius:6px;color:#f87171;font-family:'JetBrains Mono',monospace;font-size:.6rem;cursor:pointer;transition:all .3s}
.admin-btn-sm:hover{background:rgba(220,38,38,.2)}
.admin-auth-status{margin-top:.8rem;font-size:.65rem;color:#ef4444;min-height:1rem}
.admin-panel{width:100%;max-width:900px;animation:admin-fadein .3s ease}
.admin-live-container{background:rgba(0,0,0,.6);border:1px solid rgba(220,38,38,.15);border-radius:10px;height:400px;overflow-y:auto;padding:1rem;font-family:'JetBrains Mono',monospace;display:flex;flex-direction:column;gap:8px}
.admin-live-hit{padding:8px 12px;background:rgba(220,38,38,.05);border-left:3px solid #dc2626;border-radius:4px;font-size:.7rem;animation:hit-slide .3s ease}
.admin-live-hit.hit-approved{background:rgba(34,197,94,.05);border-left-color:#22c55e;color:#86efac}
.admin-live-hit.hit-declined{background:rgba(239,68,68,.05);border-left-color:#ef4444;color:#fca5a5}
@keyframes hit-slide{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}
@keyframes admin-fadein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.admin-header{display:flex;align-items:center;justify-content:space-between;padding:.8rem 1.2rem;background:rgba(18,6,6,.95);border:1px solid rgba(220,38,38,.2);border-radius:10px 10px 0 0;border-bottom:none}
.admin-header-left{display:flex;align-items:center;gap:.6rem;color:#f87171;font-size:.75rem;font-weight:700}
.admin-header-title{font-family:'Orbitron',sans-serif;letter-spacing:.08em;font-size:.7rem}
.admin-header-ver{font-size:.5rem;color:#475569;background:rgba(0,0,0,.4);padding:.15rem .4rem;border-radius:4px}
.admin-header-right{display:flex;align-items:center;gap:1rem}
.admin-header-status{font-size:.6rem;color:#22c55e;letter-spacing:.05em}
.admin-close{background:none;border:none;color:#64748b;font-size:1rem;cursor:pointer;transition:color .3s;padding:.3rem}
.admin-close:hover{color:#f87171}
.admin-tabs{display:flex;background:rgba(18,6,6,.95);border-left:1px solid rgba(220,38,38,.2);border-right:1px solid rgba(220,38,38,.2);overflow-x:auto}
.admin-tab{flex:1;padding:.6rem .5rem;background:none;border:none;border-bottom:2px solid transparent;color:#64748b;font-family:'JetBrains Mono',monospace;font-size:.6rem;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:.4rem;white-space:nowrap;letter-spacing:.05em}
.admin-tab:hover{color:#94a3b8;background:rgba(220,38,38,.05)}
.admin-tab.active{color:#f87171;border-bottom-color:#dc2626;background:rgba(220,38,38,.08)}
.admin-tab i{font-size:.65rem}
.admin-body{background:rgba(18,6,6,.95);border:1px solid rgba(220,38,38,.2);border-top:none;border-radius:0 0 10px 10px;padding:1.2rem;min-height:400px}
.admin-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem;padding-bottom:.5rem;border-bottom:1px solid rgba(220,38,38,.1)}
.admin-section-header span{font-size:.65rem;color:#94a3b8;font-weight:600;letter-spacing:.08em;display:flex;align-items:center;gap:.4rem}
.admin-section-header i{color:#dc2626;font-size:.6rem}
.admin-gates-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.6rem}
.admin-gate-card{background:rgba(0,0,0,.4);border:1px solid rgba(220,38,38,.15);border-radius:8px;padding:.7rem;text-align:center;cursor:pointer;transition:all .3s;position:relative}
.admin-gate-card:hover{border-color:rgba(220,38,38,.3)}
.admin-gate-card.enabled{border-color:rgba(34,197,94,.3);background:rgba(34,197,94,.05)}
.admin-gate-card.enabled .admin-gate-dot{background:#22c55e;box-shadow:0 0 8px rgba(34,197,94,.5)}
.admin-gate-card.disabled{border-color:rgba(239,68,68,.3);background:rgba(239,68,68,.05)}
.admin-gate-card.disabled .admin-gate-dot{background:#ef4444}
.admin-gate-dot{width:8px;height:8px;border-radius:50%;background:#64748b;position:absolute;top:.5rem;right:.5rem;transition:all .3s}
.admin-gate-name{font-size:.7rem;color:#e2e8f0;font-weight:600;margin-top:.3rem}
.admin-gate-domain{font-size:.5rem;color:#475569;margin-top:.15rem}
.admin-gate-checks{font-size:.55rem;color:#94a3b8;margin-top:.3rem}
.admin-loading{color:#475569;font-size:.65rem;text-align:center;padding:2rem;display:flex;align-items:center;justify-content:center;gap:.5rem}
.admin-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}
.admin-stat-card{background:rgba(0,0,0,.4);border:1px solid rgba(220,38,38,.15);border-radius:8px;padding:1rem;text-align:center}
.admin-stat-card.stat-green{border-color:rgba(34,197,94,.2)}
.admin-stat-card.stat-red{border-color:rgba(239,68,68,.2)}
.admin-stat-card.stat-amber{border-color:rgba(245,158,11,.2)}
.admin-stat-num{font-size:1.4rem;font-weight:700;color:#f87171;font-family:'Orbitron',sans-serif}
.stat-green .admin-stat-num{color:#22c55e}
.stat-red .admin-stat-num{color:#ef4444}
.stat-amber .admin-stat-num{color:#f59e0b}
.admin-stat-label{font-size:.5rem;color:#64748b;letter-spacing:.1em;margin-top:.3rem}
.admin-config-list{display:flex;flex-direction:column;gap:.7rem}
.admin-cfg-row{display:flex;flex-direction:column;gap:.25rem}
.admin-cfg-row label{font-size:.6rem;color:#94a3b8;letter-spacing:.05em}
.admin-logs-table-wrap,.admin-rl-table-wrap{overflow-x:auto;border:1px solid rgba(220,38,38,.1);border-radius:8px}
.admin-logs-table{width:100%;border-collapse:collapse;font-size:.6rem}
.admin-logs-table th{background:rgba(0,0,0,.5);color:#94a3b8;padding:.5rem .6rem;text-align:left;font-weight:600;letter-spacing:.05em;border-bottom:1px solid rgba(220,38,38,.15);white-space:nowrap}
.admin-logs-table td{padding:.4rem .6rem;border-bottom:1px solid rgba(220,38,38,.07);color:#cbd5e1;white-space:nowrap}
.admin-logs-table tr:hover td{background:rgba(220,38,38,.03)}
.admin-region-stats{display:flex;flex-direction:column;gap:.3rem}
.admin-region-row{display:flex;align-items:center;gap:.8rem;padding:.4rem .6rem;background:rgba(0,0,0,.3);border-radius:6px;font-size:.6rem}
.admin-region-name{color:#e2e8f0;min-width:80px;font-weight:600}
.admin-region-bar{flex:1;height:6px;background:rgba(220,38,38,.1);border-radius:3px;overflow:hidden}
.admin-region-bar-fill{height:100%;background:linear-gradient(90deg,#dc2626,#f59e0b);border-radius:3px;transition:width .5s}
.admin-region-count{color:#94a3b8;min-width:40px;text-align:right}
.admin-activity-log{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:.2rem}
.admin-activity-item{display:flex;align-items:center;gap:.5rem;padding:.3rem .5rem;background:rgba(0,0,0,.2);border-radius:4px;font-size:.55rem}
.admin-activity-time{color:#475569;min-width:50px}
.admin-activity-msg{color:#94a3b8}
.admin-error-log{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:.2rem}
.admin-error-item{padding:.4rem .6rem;background:rgba(239,68,68,.05);border:1px solid rgba(239,68,68,.1);border-radius:6px;font-size:.55rem;color:#fca5a5}
.admin-blacklist{display:flex;flex-direction:column;gap:.2rem}
.admin-bl-item{display:flex;align-items:center;justify-content:space-between;padding:.3rem .6rem;background:rgba(0,0,0,.3);border-radius:6px;font-size:.6rem;color:#94a3b8}
.admin-bl-item button{background:none;border:none;color:#ef4444;cursor:pointer;font-size:.7rem;padding:.2rem}
@media(max-width:640px){.admin-stats-grid{grid-template-columns:repeat(2,1fr)}.admin-gates-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}}

/* === RESPONSIVE SIDEBAR === */
@media(max-width:1024px){
	.sidebar{width:260px;min-width:260px}
	.main-content{padding:16px 20px}
}

@media(max-width:768px){
	.sidebar-toggle{opacity:1;visibility:visible;pointer-events:auto}
	.sidebar{display:flex;position:fixed;top:0;left:0;width:280px;min-width:280px;max-width:90vw;height:100dvh;z-index:9999;transform:translateX(-100%);box-shadow:4px 0 40px rgba(0,0,0,.6);border-right:1px solid rgba(220,38,38,.3)}
	.sidebar.active{transform:translateX(0)}
	.main-content{margin-left:0}
	.cb-brand-mobile{display:flex}
	.StrangerChk{overflow-x:hidden}
}

@media(max-width:640px){
	.sidebar{width:280px;min-width:280px}
	.main-content{padding:12px 16px}
	.cmd-bar{padding:6px 12px 6px 52px;gap:8px}
	.cb-center{gap:4px}
	.hc{width:36px;height:36px}
	.cb-timer,.cb-speed,.cb-status,.cb-mute{font-size:.6rem;padding:3px 6px}
	.cb-timer i,.cb-speed i,.cb-mute i{font-size:.4rem}
	.btn-launch{font-size:.8rem;padding:12px 20px}
	.action-grid .btn-secondary,.action-grid .btn-gen,.action-grid .btn-gen{height:44px;min-height:44px}
	.workspace{grid-template-columns:1fr;gap:12px}
	.panel-body{padding:14px 16px}
	.panel-header{padding:12px 16px}
	.ph-title{font-size:1rem}
	.ph-badge{font-size:.6rem}
	.field-group textarea{resize:vertical;min-height:100px}
}

@media(max-width:480px){
	.hc{width:32px;height:32px}
	.hc-num{font-size:.6rem}
	.hc-label{font-size:.3rem}
	.cb-left .cb-brand-mobile span{bi-name{font-size:.8rem}}
	.btn-launch{font-size:.7rem;padding:10px 16px;gap:4px}
	.action-grid{flex-wrap:wrap}
	.action-grid .btn-launch{flex:1 1 100%}
	.action-grid .btn-secondary,.action-grid .btn-gen{flex:1 1 48%}
	.panel-body{padding:10px 12px}
	.panel-header{padding:10px 12px}
	.ph-title{font-size:.9rem}
	.ph-badge{font-size:.5rem}
	.field-group textarea{min-height:80px;font-size:.65rem;padding:10px 12px}
	.fg-label{font-size:.65rem}
	.ps-label{font-size:.6rem}
	.ps-nums{font-size:.6rem}
}