*,
*::before,
*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#020408;--term:rgba(0,0,0,.96);--panel:rgba(0,18,0,.88);--panel2:rgba(0,30,10,.7);
  --acc:#00ff6a;--acc2:#32ff8f;--accd:#00aa44;--danger:#ff5252;--warn:#ffeb3b;
  --t:#e0ffed;--ts:#a8ffcf;--td:#6bdc9b;--b:#00aa44;--bs:#005822;
  --radius:6px;--font:"Courier New",monospace;
}
html,body{width:100%;height:100%}
body{background:var(--bg);color:var(--t);font-family:var(--font);overflow:hidden}
.matrix-bg{position:fixed;inset:0;background:#000;overflow:hidden;z-index:-2}
.matrix-bg::before{content:"";position:absolute;inset:-120%;
  background-image:linear-gradient(to bottom,rgba(0,255,0,.14) 1px,transparent 1px),
                   radial-gradient(circle at 10% 10%,rgba(0,255,0,.18),transparent 60%),
                   radial-gradient(circle at 90% 90%,rgba(0,255,120,.18),transparent 60%);
  background-size:100% 18px,100% 100%,100% 100%;opacity:.4;animation:ms 22s linear infinite}
@keyframes ms{from{transform:translateY(0)}to{transform:translateY(50%)}}
.app-shell{position:relative;width:100vw;height:100vh;display:flex;padding:6px}
.terminal-window{width:100%;height:100%;background:var(--term);border:1px solid var(--b);
  border-radius:var(--radius);box-shadow:0 0 24px rgba(0,255,120,.25);display:flex;flex-direction:column;overflow:hidden}
.terminal-bar{display:flex;align-items:center;justify-content:space-between;padding:4px 10px;border-bottom:1px solid var(--bs);
  background:linear-gradient(90deg,#001806 0%,#00270c 55%,#001806 100%);font-size:11px;color:var(--ts)}
.term-title{display:flex;align-items:center;gap:8px}
.term-dots{display:flex;gap:4px}
.term-dot{width:8px;height:8px;border-radius:50%;background:#043716;border:1px solid var(--b);box-shadow:0 0 6px rgba(0,255,120,.35)}
.term-label{color:var(--acc2)}.term-path{color:var(--td);opacity:.85}
.term-nav{font-size:11px;white-space:nowrap}
.term-nav a{color:var(--ts);text-decoration:none;margin-left:10px;padding:2px 5px;border-radius:4px;border:1px solid transparent}
.term-nav a::before{content:"$ ";opacity:.5}
.term-nav a:hover{border-color:var(--b);background:#002b11;color:#fff}
.terminal-main{flex:1;padding:8px 10px 10px;background:#000;overflow-y:auto}
.terminal-main::-webkit-scrollbar{width:6px}.terminal-main::-webkit-scrollbar-thumb{background:#00511f}
.term-line{font-size:13px;line-height:1.4;margin-bottom:2px}
.term-prefix{color:var(--acc);margin-right:4px}
.term-warning{color:var(--warn)}.term-error{color:var(--danger)}.small{font-size:11px;color:var(--ts)}
.cursor{display:inline-block;width:8px;background:var(--acc);animation:blink 1s step-end infinite;margin-left:2px}
@keyframes blink{50%{opacity:0}}
.panel{border:1px solid var(--b);border-radius:var(--radius);padding:8px;margin-bottom:8px;background:var(--panel)}
.panel--soft{background:var(--panel2)}
.panel-title{font-size:13px;color:var(--acc2);margin-bottom:4px}
.panel-sub{font-size:12px;color:var(--ts);margin-bottom:4px}
label{display:block;font-size:11px;color:#d3ffe4;margin-bottom:1px}
input,textarea,select{width:100%;background:#020b04;border:1px solid var(--bs);color:var(--t);font-family:var(--font);font-size:12px;padding:4px 5px;margin-bottom:6px;border-radius:4px}
textarea{min-height:60px;resize:vertical}
button.btn,a.btn{display:inline-block;background:#021609;border:1px solid var(--b);color:var(--ts);font-size:12px;padding:4px 9px;border-radius:4px;text-decoration:none;cursor:pointer;margin-top:3px}
button.btn:hover,a.btn:hover{background:#043016;border-color:var(--acc);color:#fff}
.btn--danger{background:#280006;border-color:#ff5252;color:#ffb0b0}
.btn--danger:hover{background:#3b0009;border-color:#ff7a7a;color:#fff}
.badge{display:inline-block;border:1px solid var(--b);border-radius:4px;padding:1px 5px;font-size:10px;margin-top:2px;margin-right:4px}
.badge-paid{border-color:#ffb300;color:#ffecb3}
.flash-box{margin-bottom:6px}.flash-item{font-size:11px;padding:4px 6px;border-radius:4px;margin-bottom:2px}
.flash-item--error{border:1px solid #ff5252;background:#230007;color:#ffcdd2}
.flash-item--success{border:1px solid var(--b);background:#00240f;color:#c8ffdf}
@media(max-width:768px){
  .app-shell{padding:4px}.terminal-window{border-radius:0}
  .terminal-bar{flex-direction:column;align-items:flex-start;gap:3px}
  .term-nav{margin-left:14px;overflow-x:auto}
  .term-nav a::before{content:""}
  /* === Spoils images === */
.spoiler-img-wrap { margin:6px 0; border:1px solid var(--bs); border-radius:4px; background:#010801; padding:6px }
.spoiler-img { max-width:100%; height:auto; display:block; cursor:zoom-in; border-radius:3px }
.spoiler-img-caption { font-size:11px; color:var(--ts); opacity:.8; margin-top:3px; word-break:break-all }

/* Lightbox */
.img-modal {
  position:fixed; inset:0; background:rgba(0,0,0,.92);
  display:none; align-items:center; justify-content:center;
  z-index:9999; padding:18px
}
.img-modal.open { display:flex }
.img-modal img { max-width:96vw; max-height:92vh; border:1px solid var(--b); border-radius:6px }
.img-modal .img-close {
  position:absolute; top:10px; right:14px; background:#160202;
  border:1px solid #ff7a7a; color:#fff; padding:4px 8px; border-radius:4px; cursor:pointer
}

}
