/* NikolovStudio Company — техничен слой (сървърна / платка). Зарежда се след app.css и го надгражда.
   Метални модули с винтчета, кабели с щепсели, жива централа, светодиоди за статус. Без inline стилове (CSP). */
:root{
  --m1:#24140c;--m2:#170c07;--m3:#110804;--edge:rgba(255,170,120,.15);--edge2:rgba(255,170,120,.28);
  --led-off:#2b1a12;--g:#4ADE80;--amber:#FBBF24;--red:#F87171;
  --screw:radial-gradient(circle at 42% 38%,#e3d2c3 0 1.3px,#9a8473 1.9px 3.1px,#4a372b 3.6px 4.3px,#0d0704 4.7px 5.3px,transparent 5.7px);
  --panel:linear-gradient(180deg,var(--m1) 0%,var(--m2) 55%,var(--m3) 100%);
  --panel-shadow:inset 0 1px 0 rgba(255,225,205,.10),inset 0 -2px 0 rgba(0,0,0,.55),0 0 0 1px #050201,0 24px 44px -22px rgba(0,0,0,.95);
}

/* ---------- фон: платка ---------- */
.grid-bg{background-image:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='192' height='192' viewBox='0 0 192 192'%3E%3Cg fill='none' stroke='%23ff5000' stroke-opacity='.10' stroke-width='1.6'%3E%3Cpath d='M0 44 H58 L80 66 H138'/%3E%3Cpath d='M138 66 V112 L162 136 H192'/%3E%3Cpath d='M22 192 V156 L46 132 H104'/%3E%3Cpath d='M104 132 L126 110 V0'/%3E%3Cpath d='M0 112 H36'/%3E%3Cpath d='M164 0 V36 L192 64'/%3E%3C/g%3E%3Cg fill='%23ff5000' fill-opacity='.16'%3E%3Ccircle cx='58' cy='44' r='3.2'/%3E%3Ccircle cx='138' cy='66' r='3.2'/%3E%3Ccircle cx='104' cy='132' r='3.2'/%3E%3Ccircle cx='36' cy='112' r='3.2'/%3E%3Ccircle cx='162' cy='136' r='3.2'/%3E%3Ccircle cx='164' cy='36' r='3.2'/%3E%3C/g%3E%3Cg fill='none' stroke='%23ff5000' stroke-opacity='.16' stroke-width='1.4'%3E%3Ccircle cx='58' cy='44' r='7'/%3E%3Ccircle cx='104' cy='132' r='7'/%3E%3Crect x='150' y='150' width='24' height='14' rx='2'/%3E%3C/g%3E%3C/svg%3E"),
  linear-gradient(rgba(255,80,0,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,80,0,.035) 1px,transparent 1px);
  background-size:192px 192px,24px 24px,24px 24px}

/* ---------- общи части: винтчета, светодиоди, табелки ---------- */
.screws{position:absolute;inset:7px;pointer-events:none;z-index:2;background:var(--screw) left top/12px 12px no-repeat,var(--screw) right top/12px 12px no-repeat,var(--screw) left bottom/12px 12px no-repeat,var(--screw) right bottom/12px 12px no-repeat}
.leds{display:inline-flex;align-items:center;gap:6px}
.led{width:8px;height:8px;border-radius:50%;background:var(--led-off);box-shadow:inset 0 1px 2px rgba(0,0,0,.7),0 0 0 1px rgba(0,0,0,.6);display:block}
.plate{display:inline-flex;align-items:center;white-space:nowrap;flex:none;padding:4px 9px;border-radius:5px;background:linear-gradient(180deg,#120804,#1d0f08);border:1px solid var(--edge);box-shadow:inset 0 1px 2px rgba(0,0,0,.8),0 1px 0 rgba(255,220,200,.06);text-transform:uppercase;letter-spacing:.14em}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes chase{0%,100%{background:var(--led-off);box-shadow:inset 0 1px 2px rgba(0,0,0,.7)}20%{background:var(--flame-txt);box-shadow:0 0 8px var(--flame)}}
@keyframes glowpulse{0%,100%{background:#8a5a12;box-shadow:none}50%{background:var(--amber);box-shadow:0 0 10px var(--amber)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-100%)}}

/* състояния на светодиодите в модула */
.st-free .led-1,.st-ok .led-1,.st-ok .led-2{background:var(--g);box-shadow:0 0 7px rgba(74,222,128,.8),inset 0 -1px 1px rgba(0,0,0,.3)}
.st-free .led-1{opacity:.75}
.st-run .led{animation:chase 1.2s linear infinite}.st-run .led-2{animation-delay:.2s}.st-run .led-3{animation-delay:.4s}
.st-wait .led{animation:glowpulse 1.4s ease-in-out infinite}
.st-warn .led-1{background:var(--amber);box-shadow:0 0 8px var(--amber)}.st-warn .led-2{background:var(--amber);box-shadow:0 0 8px var(--amber);animation:blink 1.6s steps(2) infinite}
.st-bad .led{background:var(--red);box-shadow:0 0 9px var(--red);animation:blink .8s steps(2) infinite}.st-bad .led-2{animation-delay:.4s}

/* ---------- хедър ---------- */
.hdr{background:linear-gradient(180deg,rgba(30,16,9,.92),rgba(14,7,4,.88));border-bottom:1px solid var(--edge);box-shadow:0 1px 0 #000,0 10px 30px -18px rgba(0,0,0,.9)}
.logo{position:relative;background:linear-gradient(180deg,#ff7a38,#ff5000 55%,#c93f00);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 2px #1a0d06,0 0 0 3px rgba(255,140,80,.35),0 6px 14px -4px rgba(255,80,0,.55)}
.pill{background:linear-gradient(180deg,#120804,#1b0e07);border-color:var(--edge);box-shadow:inset 0 1px 3px rgba(0,0,0,.8)}
.pill .dot,.hub-status .dot{box-shadow:0 0 7px currentColor}
.dot-online{color:var(--g)}.dot-tg{color:#9B8BFF}.dot-off{color:transparent}
.back{background:linear-gradient(180deg,#22130b,#150b06);border-color:var(--edge2);box-shadow:inset 0 1px 0 rgba(255,220,200,.08),0 0 0 1px #050201}

/* ---------- броячи: LCD ---------- */
.counter{position:relative;background:linear-gradient(180deg,#0b0503,#120804);border:1px solid var(--edge);box-shadow:inset 0 2px 6px rgba(0,0,0,.85),0 0 0 1px #050201,0 1px 0 rgba(255,220,200,.06);overflow:hidden}
.counter::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)}
.counter-n{font-family:var(--mono);color:var(--flame-txt);text-shadow:0 0 10px rgba(255,80,0,.55)}

/* ---------- бутони: хардуер ---------- */
.btn-flame{background:linear-gradient(180deg,#ff7a38,#ff5000 60%,#e04600);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -3px 0 rgba(0,0,0,.25),0 4px 0 #7a2600,0 10px 18px -8px rgba(255,80,0,.6);transition:transform .12s var(--ease),box-shadow .12s var(--ease)}
.btn-flame:active{transform:translateY(3px);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 1px 0 #7a2600}
.btn-ghost{background:linear-gradient(180deg,#2a170d,#1a0d07);border:1px solid var(--edge2);box-shadow:inset 0 1px 0 rgba(255,220,200,.1),0 3px 0 #050201,0 8px 16px -10px rgba(0,0,0,.9);transition:transform .12s var(--ease),box-shadow .12s var(--ease),border-color .2s}
.btn-ghost:hover{border-color:var(--flame);background:linear-gradient(180deg,#331b0e,#1f1008)}
.btn-ghost:active{transform:translateY(2px);box-shadow:inset 0 1px 0 rgba(255,220,200,.08),0 1px 0 #050201}

/* ---------- сцена ---------- */
.stage{grid-template-rows:auto auto auto auto;row-gap:30px}
.stage .room{align-self:stretch}
.hero-cell{min-height:290px}
.veins path{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.cable-shadow{stroke:rgba(0,0,0,.6);stroke-width:20;transform:translate(0,7px)}
.cable-sheath{stroke:#0b0604;stroke-width:17}
.cable-body{stroke:#3d2417;stroke-width:13}
.cable-hl{stroke:rgba(255,205,175,.24);stroke-width:2.5;transform:translate(-2px,-3.5px)}
.cable-core{stroke:#120804;stroke-width:6}
.vein-flow{stroke:var(--c,var(--flame));stroke-width:3.5;stroke-dasharray:7 17;animation:flow 1.4s linear infinite;filter:drop-shadow(0 0 4px var(--c,var(--flame)));transition:stroke-width .25s var(--ease)}
.vein-flow.trunk{stroke:var(--flame);stroke-width:4;animation-duration:1.05s}
.vein-run{animation-duration:.6s}
.vein-hot{stroke-width:4.5;animation-duration:.55s}
.vein-idle{opacity:.28;animation-duration:3.4s}
.vein-focus{stroke-width:5.5;animation-duration:.45s;opacity:1;filter:drop-shadow(0 0 8px var(--c,var(--flame)))}
.cable-clip{stroke:#7a6454;stroke-width:8;stroke-linecap:butt}
.cable-clip-hl{stroke:rgba(255,230,210,.45);stroke-width:1.5;stroke-linecap:butt}
.junction-o{stroke:#050201;stroke-width:34}
.junction{stroke:#4a3326;stroke-width:28}
.junction-led{stroke:var(--g);stroke-width:7;filter:drop-shadow(0 0 4px var(--g));animation:blink 2.2s steps(2) infinite}
.jl-2{animation-delay:.7s}.jl-3{animation-delay:1.4s}

/* ---------- централата: сървър ---------- */
.hub-cell{margin-top:14px;align-self:start}
.srv{position:relative;display:flex;flex-direction:column;gap:12px;padding:18px 22px 20px;border-radius:16px;background:var(--panel);border:1px solid var(--edge2);box-shadow:var(--panel-shadow),0 0 0 4px rgba(255,80,0,.08)}
.srv.hub-glow{animation:breathe-srv 3.4s ease-in-out infinite}
@keyframes breathe-srv{0%,100%{box-shadow:var(--panel-shadow),0 0 30px rgba(255,80,0,.18)}50%{box-shadow:var(--panel-shadow),0 0 58px rgba(255,80,0,.38)}}
.srv-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 10px}
.srv-id{font-size:10px;letter-spacing:.18em;color:var(--muted2)}
.srv-leds .led{background:var(--g);box-shadow:0 0 7px rgba(74,222,128,.75)}
.srv-leds .led-2{background:var(--flame-txt);box-shadow:0 0 8px var(--flame);animation:blink .9s steps(2) infinite}
.srv-leds .led-3{animation:blink 1.7s steps(2) infinite}
.srv-leds .led-4{background:#9B8BFF;box-shadow:0 0 7px #9B8BFF;animation:blink 2.6s steps(2) infinite .3s}
.srv-leds .led-5{background:var(--flame-txt);box-shadow:0 0 8px var(--flame);animation:blink 1.3s steps(2) infinite .6s}
.srv-leds .led-6{background:var(--led-off);box-shadow:inset 0 1px 2px rgba(0,0,0,.7)}
.srv-plate{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 12px;border-radius:10px;text-align:center;background:linear-gradient(180deg,#110804,#1a0e07);border:1px solid var(--edge);box-shadow:inset 0 2px 6px rgba(0,0,0,.85),0 1px 0 rgba(255,220,200,.06)}
.srv .hub-name{text-shadow:0 2px 0 #000}
.srv-screen{position:relative;display:flex;align-items:center;gap:8px;height:34px;padding:0 12px;border-radius:7px;overflow:hidden;background:#080402;border:1px solid rgba(255,80,0,.35);box-shadow:inset 0 0 14px rgba(255,80,0,.18);color:var(--flame-txt);font-size:12px;text-shadow:0 0 6px rgba(255,80,0,.7)}
.srv-screen::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(255,255,255,.04) 0 1px,transparent 1px 3px)}
.srv-prompt{flex:none;animation:blink 1s steps(2) infinite}
.srv-ticker{flex:1;min-width:0;overflow:hidden;white-space:nowrap}
.srv-ticker span{display:inline-block;padding-left:100%;animation:ticker 18s linear infinite;animation-delay:-5s}
.srv-bottom{display:flex;align-items:center;gap:12px}
.srv-fan{flex:none;width:44px;height:44px}
.fan-ring{fill:#0b0604;stroke:#5a4030;stroke-width:2}
.fan-blades{fill:#6b4c39;stroke:#1a0d06;stroke-width:1;transform-origin:20px 20px;animation:spin 1.6s linear infinite}
.fan-hub{fill:#a08672;stroke:#1a0d06;stroke-width:1}
.srv-vents{flex:none;width:46px;height:34px;border-radius:5px;background:repeating-linear-gradient(180deg,#050201 0 3px,#3a2417 3px 6px);box-shadow:inset 0 1px 3px rgba(0,0,0,.9),0 0 0 1px var(--edge)}
.srv-stats{display:flex;flex-direction:column;gap:4px;min-width:0}
.srv-stats .hub-status{font-size:11px}
.srv-port{position:absolute;left:50%;bottom:-13px;width:34px;height:15px;transform:translateX(-50%);border-radius:0 0 7px 7px;background:linear-gradient(180deg,#5a4030,#2a1a10);border:1px solid #050201;box-shadow:inset 0 1px 0 rgba(255,220,200,.2);z-index:2}

/* ---------- модулите (стаите) ---------- */
.room{border:1px solid var(--edge);border-radius:14px;padding:22px 24px 20px;background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 20%,transparent)) top/100% 3px no-repeat,var(--panel);box-shadow:var(--panel-shadow);overflow:visible}
a.room:hover,a.room:focus-visible,.room.mod-focus{transform:translateY(-4px);box-shadow:var(--panel-shadow),0 0 0 1px color-mix(in srgb,var(--c) 55%,transparent),0 0 34px -6px color-mix(in srgb,var(--c) 45%,transparent)}
.room-head{gap:10px}
.room-num{font-size:10px;color:var(--c)}
.room-head .leds{margin-left:auto;margin-right:2px}
.mod-screen{flex:1;display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:10px;background:linear-gradient(180deg,#0d0603,#140904);border:1px solid rgba(255,170,120,.10);box-shadow:inset 0 2px 8px rgba(0,0,0,.85),0 1px 0 rgba(255,220,200,.05)}
.room-name{text-shadow:0 0 18px color-mix(in srgb,var(--c) 35%,transparent)}
/* порт отстрани и щепселът на кабела */
.port{position:absolute;top:50%;width:30px;height:30px;margin-top:-15px;z-index:3;pointer-events:none}
.port::before{content:"";position:absolute;top:2px;width:12px;height:26px;border-radius:4px;background:linear-gradient(90deg,#0b0604,#2e1c12);border:1px solid #050201;box-shadow:inset 0 1px 0 rgba(255,220,200,.15)}
.plug{position:absolute;top:7px;width:20px;height:16px;border-radius:3px;background:linear-gradient(180deg,#d8c4b2,#8a7362 45%,#4a382c);border:1px solid #050201;box-shadow:0 2px 3px rgba(0,0,0,.6)}
.plug::after{content:"";position:absolute;top:-3px;width:6px;height:20px;border-radius:2px;background:var(--c);box-shadow:0 0 8px var(--c);border:1px solid #050201}
.slot-1 .port,.slot-4 .port,.slot-5 .port{right:-30px}
.slot-1 .port::before,.slot-4 .port::before,.slot-5 .port::before{left:0}
.slot-1 .plug,.slot-4 .plug,.slot-5 .plug{left:10px}
.slot-1 .plug::after,.slot-4 .plug::after,.slot-5 .plug::after{right:-4px}
.slot-2 .port,.slot-3 .port,.slot-6 .port{left:-30px}
.slot-2 .port::before,.slot-3 .port::before,.slot-6 .port::before{right:0}
.slot-2 .plug,.slot-3 .plug,.slot-6 .plug{right:10px}
.slot-2 .plug::after,.slot-3 .plug::after,.slot-6 .plug::after{left:-4px}
/* изключени модули: свободен слот / скоро */
.room-soon{opacity:1;border-style:solid;background:repeating-linear-gradient(135deg,rgba(255,170,120,.035) 0 10px,transparent 10px 20px),var(--panel)}
.room-soon .mod-screen,.room-soon .room-name,.room-soon .room-desc{opacity:.55}
.room-soon .plug::after{background:#3a2a20;box-shadow:none}
.slot-cover{align-self:flex-start;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted2);padding:3px 8px;border:1px dashed var(--edge2);border-radius:4px}
.room-btn-row{display:flex;gap:10px}

/* ---------- история: терминал ---------- */
.term{position:relative;background:linear-gradient(180deg,#0c0603,#100703);border:1px solid var(--edge);box-shadow:var(--panel-shadow);padding:22px 24px}
.term .history-head{padding-bottom:10px;border-bottom:1px solid rgba(255,170,120,.1)}
.term h2{display:flex;align-items:center;gap:12px}
.term-dots{display:inline-flex;gap:6px}.term-dots i{width:10px;height:10px;border-radius:50%;background:#3a2417;box-shadow:inset 0 1px 2px rgba(0,0,0,.6)}
.term-dots i:first-child{background:var(--red)}.term-dots i:nth-child(2){background:var(--amber)}.term-dots i:nth-child(3){background:var(--g)}
.term .hist-row,.term .hist-empty{border-top:1px dashed rgba(255,170,120,.1);font-family:var(--mono)}
.term .hist-when::before{content:"> ";color:var(--flame)}
.term .hist-text{font-family:var(--sans)}
.term .hist-row:first-child .hist-text{color:var(--cream)}

/* ---------- страниците на стаите ---------- */
.card,.topic,.card-plain:not(.term){position:relative;background:var(--panel);border:1px solid var(--edge);box-shadow:var(--panel-shadow)}
.card::before,.topic::before{content:"";position:absolute;inset:7px;pointer-events:none;background:var(--screw) left top/12px 12px no-repeat,var(--screw) right top/12px 12px no-repeat,var(--screw) left bottom/12px 12px no-repeat,var(--screw) right bottom/12px 12px no-repeat}
.card-form{border-color:color-mix(in srgb,var(--c) 40%,transparent);background:linear-gradient(90deg,var(--c),transparent) top/100% 3px no-repeat,var(--panel)}
.room-title{position:relative;padding:14px 18px 14px 20px;border-left:0;border-radius:12px;background:linear-gradient(180deg,rgba(36,20,12,.85),rgba(17,8,4,.85));border:1px solid var(--edge);box-shadow:var(--panel-shadow)}
.room-title::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:0 4px 4px 0;background:var(--c);box-shadow:0 0 12px var(--c)}
.field{background:linear-gradient(180deg,#080402,#0f0703);border-color:var(--edge2);box-shadow:inset 0 2px 6px rgba(0,0,0,.8),0 1px 0 rgba(255,220,200,.05)}
.seg{background:#080402;border-color:var(--edge);box-shadow:inset 0 2px 5px rgba(0,0,0,.8)}
.seg input:checked+span{box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 2px 0 rgba(0,0,0,.5)}
.step{background:linear-gradient(180deg,#0d0603,#140904);box-shadow:inset 0 2px 6px rgba(0,0,0,.8)}
.st-now .num{box-shadow:0 0 10px var(--flame)}
.st-done .num{box-shadow:0 0 8px rgba(74,222,128,.7)}
.topic{background:var(--panel)}
.pick{background:linear-gradient(180deg,#160b06,#0f0703);box-shadow:inset 0 1px 0 rgba(255,220,200,.06),0 0 0 1px #050201}
.health-top{background:var(--panel)}
.thumb{box-shadow:0 0 0 1px #050201,0 8px 16px -8px rgba(0,0,0,.9)}
.status-pill{box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px #050201}

/* ---------- телефон ---------- */
@media (max-width:860px){
  .grid-bg{background-size:160px 160px,20px 20px,20px 20px}
  .m-hub{clip-path:none;padding:0;background:none}
  .m-hub .cut{clip-path:none}
  .m-hub-inner{position:relative;border-radius:14px;background:var(--panel);border:1px solid var(--edge2);box-shadow:var(--panel-shadow),0 0 26px rgba(255,80,0,.16);padding:18px 16px 16px}
  .m-hub .hub-glow,.m-hub-inner.hub-glow{animation:breathe-srv 3.4s ease-in-out infinite}
  .m-hub-top{display:flex;align-items:center;gap:10px}
  .m-hub .srv-leds .led{width:7px;height:7px}
  /* главният кабел вляво и разклоненията */
  .stage{padding-left:50px}
  .stage::before{left:14px;width:16px;border-radius:8px;background:linear-gradient(90deg,#0b0604 0 12%,#3d2417 30%,#6a4330 46%,#3d2417 62%,#0b0604 88%);box-shadow:0 6px 10px rgba(0,0,0,.6)}
  .stage::after{left:20px;width:4px;background-image:repeating-linear-gradient(180deg,var(--flame) 0 7px,transparent 7px 22px)}
  .room::before{left:-36px;top:30px;width:34px;height:12px;border-radius:6px;background:linear-gradient(180deg,#0b0604 0 12%,#3d2417 30%,#6a4330 46%,#3d2417 62%,#0b0604 88%)}
  .room::after{left:-34px;top:34px;width:30px;height:4px;background-image:repeating-linear-gradient(90deg,var(--c,var(--flame)) 0 6px,transparent 6px 16px);filter:drop-shadow(0 0 3px var(--c,var(--flame)))}
  .room .port{left:-14px;right:auto;top:36px}
  .room .port::before{left:6px;right:auto}
  .room .plug{left:0;right:auto;width:14px}
  .room .plug::after{left:auto;right:-4px}
  .room{padding:18px 18px 16px}
  .mod-screen{padding:12px 14px;gap:8px}
  .room-soon .mod-screen,.room-soon .slot-cover{display:none}
  .room-soon{padding:14px 18px}
  .room-head .leds{gap:5px}
  .room-head .led{width:7px;height:7px}
  .term{padding:18px}
}
/* светещи точки за статус (стаите) */
.dot-ok{color:var(--g)}.dot-warn{color:var(--amber)}.dot-bad{color:var(--red)}.dot-run{color:var(--flame)}.dot-wait{color:var(--cream)}
.health-row .dot,.room-hist-title .dot,.room-status .dot,.health-sum .dot{box-shadow:0 0 7px currentColor}