@charset "UTF-8";

:root {
  --green:        #00ff41;
  --green-dim:    #00cc33;
  --green-glow:   rgba(0, 255, 65, 0.15);
  --green-glow2:  rgba(0, 255, 65, 0.06);
  --black:        #0d0d0d;
  --black2:       #111111;
  --black3:       #161616;
  --border:       rgba(0, 255, 65, 0.25);
  --font: 'JetBrains Mono', 'Courier New', monospace;
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;
  --space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;
  --space-12:3rem;--space-16:4rem;
  --text-xs:clamp(0.7rem,0.65rem + 0.25vw,0.8rem);
  --text-sm:clamp(0.8rem,0.75rem + 0.3vw,0.9rem);
  --text-base:clamp(0.875rem,0.82rem + 0.25vw,1rem);
  --text-lg:clamp(1rem,0.9rem + 0.6vw,1.35rem);
  --text-xl:clamp(1.3rem,1rem + 1vw,1.8rem);
  --radius-sm:2px;--radius-md:3px;--radius-lg:4px;--radius-full:9999px;
  --transition: 120ms ease;
  --content-default:1100px;--content-narrow:720px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:4rem}
body{
  min-height:100dvh;font-family:var(--font);font-size:var(--text-base);
  color:var(--green);background:var(--black);line-height:1.65;overflow-x:hidden;
  position:relative;
}
body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:1000;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.12) 2px,rgba(0,0,0,0.12) 4px);
}
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:999;
  background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,0.6) 100%);
}
img{display:block;max-width:100%;height:auto}
ul[role=list],ol[role=list]{list-style:none}
input,button,textarea,select{font:inherit;color:inherit}
h1,h2,h3{text-wrap:balance;line-height:1.2;font-family:var(--font)}
p,li{text-wrap:pretty;max-width:72ch}
::selection{background:var(--green);color:var(--black)}
:focus-visible{outline:1px solid var(--green);outline-offset:3px}
button{cursor:pointer;background:none;border:none}
a{color:var(--green);text-decoration:none}
a:hover{color:#fff;text-shadow:0 0 8px var(--green)}
a,button,[role=button],input,textarea,select{
  transition:color var(--transition),background var(--transition),
  border-color var(--transition),box-shadow var(--transition);
}
.skip-link{position:absolute;transform:translateY(-100%);left:1rem;top:.5rem;
  padding:.5rem 1rem;background:var(--green);color:var(--black);z-index:200;font-size:var(--text-sm)}
.skip-link:focus{transform:translateY(0)}

#matrix-canvas{
  position:fixed;top:0;left:0;width:100%;height:100%;
  pointer-events:none;z-index:0;opacity:0.18;
}

.container{max-width:var(--content-default);margin-inline:auto;padding-inline:var(--space-6);position:relative;z-index:1}
.main-layout{display:grid;grid-template-columns:220px 1fr;gap:var(--space-8);padding-block:var(--space-8)}
@media(max-width:768px){.main-layout{grid-template-columns:1fr}.sidebar{order:2}}

.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(13,13,13,0.96);border-bottom:1px solid var(--border);
  backdrop-filter:blur(4px);
}
.header-inner{display:flex;align-items:center;gap:var(--space-6);height:52px}
.logo{display:flex;align-items:center;gap:var(--space-3);color:var(--green)}
.logo-text{
  font-family:var(--font);font-size:var(--text-lg);font-weight:700;
  letter-spacing:-0.01em;color:var(--green);
  text-shadow:0 0 12px rgba(0,255,65,0.5);
}
.main-nav{display:flex;gap:var(--space-1);margin-left:auto}
.main-nav a{
  font-family:var(--font);font-size:var(--text-xs);color:var(--green-dim);
  padding:var(--space-2) var(--space-3);border:1px solid transparent;
  border-radius:var(--radius-sm);letter-spacing:0.02em;
}
.main-nav a:hover{color:var(--green);border-color:var(--border);text-shadow:0 0 8px var(--green);background:var(--green-glow2)}
.theme-toggle{
  display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:var(--radius-sm);
  color:var(--green-dim);border:1px solid var(--border);flex-shrink:0;
}
.theme-toggle:hover{color:var(--green);border-color:var(--green);box-shadow:0 0 8px var(--green-glow)}
@media(max-width:640px){.main-nav{display:none}}

.terminal-banner{
  background:var(--black2);border-bottom:1px solid var(--border);
  padding:var(--space-2) 0;font-family:var(--font);font-size:var(--text-xs);
  position:relative;z-index:1;
}
.tb-prompt{color:var(--green);margin-right:var(--space-2);font-weight:700}
.tb-cmd{color:var(--green-dim)}
.tb-cursor{color:var(--green);animation:blink 1s step-end infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

.sidebar{display:flex;flex-direction:column;gap:var(--space-5)}
.widget{
  background:var(--black2);border:1px solid var(--border);
  border-radius:var(--radius-md);padding:var(--space-4);
  box-shadow:0 0 12px var(--green-glow2);
}
.widget-title{
  font-family:var(--font);font-size:var(--text-xs);font-weight:700;
  color:var(--green);margin-bottom:var(--space-3);
  letter-spacing:0.06em;text-transform:uppercase;
}
.prompt-icon{color:var(--green);margin-right:var(--space-1)}
.cat-list{list-style:none;display:flex;flex-direction:column;gap:1px}
.cat-list a{
  font-family:var(--font);font-size:var(--text-xs);
  color:var(--green-dim);padding:var(--space-1) var(--space-2);
  border-radius:var(--radius-sm);display:flex;align-items:center;gap:var(--space-2);
}
.cat-list a::before{content:'> ';color:transparent}
.cat-list a:hover,.cat-list a.active{color:var(--green);background:var(--green-glow2)}
.cat-list a.active::before{color:var(--green)}
.cat-list a:hover{text-shadow:0 0 6px var(--green)}
.tag-cloud{display:flex;flex-wrap:wrap;gap:var(--space-1)}
.tag{
  font-family:var(--font);font-size:var(--text-xs);color:var(--green);
  border:1px solid var(--border);padding:1px var(--space-2);
  border-radius:var(--radius-sm);background:transparent;
}
.tag:hover,.tag.active{
  border-color:var(--green);background:var(--green-glow2);
  box-shadow:0 0 6px var(--green-glow);text-shadow:0 0 6px var(--green);
}

.posts-area{min-width:0}
.posts-grid{display:grid;gap:var(--space-4)}
.post-card{
  background:var(--black2);border:1px solid var(--border);
  border-radius:var(--radius-md);padding:var(--space-5);
  position:relative;overflow:hidden;
}
.post-card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:2px;
  background:transparent;transition:background var(--transition);
}
.post-card:hover{border-color:var(--green);box-shadow:0 0 16px var(--green-glow),inset 0 0 20px var(--green-glow2)}
.post-card:hover::before{background:var(--green);box-shadow:0 0 8px var(--green)}
.post-meta{
  display:flex;align-items:center;gap:var(--space-3);
  font-family:var(--font);font-size:var(--text-xs);
  color:var(--green-dim);margin-bottom:var(--space-3);flex-wrap:wrap;
}
.post-cat{color:var(--green);font-weight:700;letter-spacing:0.1em;text-transform:uppercase}
.post-title{font-size:var(--text-lg);margin-bottom:var(--space-2)}
.post-title a{color:var(--green)}
.post-title a:hover{color:#fff;text-shadow:0 0 10px var(--green)}
.post-excerpt{font-size:var(--text-sm);color:var(--green-dim);margin-bottom:var(--space-3);max-width:none;line-height:1.7}
.post-tags{display:flex;flex-wrap:wrap;gap:var(--space-1)}
.filter-info{
  font-family:var(--font);font-size:var(--text-sm);color:var(--green-dim);
  margin-bottom:var(--space-4);padding:var(--space-3) var(--space-4);
  background:var(--black2);border:1px solid var(--border);border-radius:var(--radius-md);
}
.clear-filter{color:#ff4444;margin-left:var(--space-3);font-size:var(--text-xs)}
.clear-filter:hover{color:#ff0000;text-shadow:0 0 6px #ff0000}

.post-single-wrap{
  grid-column:1/-1;max-width:var(--content-narrow);
  margin-inline:auto;width:100%;padding-block:var(--space-8);
}
.breadcrumb{font-family:var(--font);font-size:var(--text-xs);color:var(--green-dim);margin-bottom:var(--space-6)}
.breadcrumb a{color:var(--green-dim)}
.breadcrumb a:hover{color:var(--green)}
.breadcrumb a::after{content:" /";margin:0 var(--space-1);color:var(--border)}
.post-header{margin-bottom:var(--space-8);padding-bottom:var(--space-6);border-bottom:1px solid var(--border)}
.cat-badge{
  color:var(--green);font-weight:700;font-size:var(--text-xs);
  letter-spacing:0.1em;text-transform:uppercase;
  border:1px solid var(--border);padding:1px var(--space-2);border-radius:var(--radius-sm);
}
.post-single-title{font-size:var(--text-xl);margin-block:var(--space-4);color:var(--green);text-shadow:0 0 20px rgba(0,255,65,0.3)}
.post-body{line-height:1.8;color:var(--green-dim)}
.post-body h2{font-size:var(--text-lg);margin-block:var(--space-8) var(--space-3);color:var(--green);font-family:var(--font)}
.post-body h2::before{content:"## ";color:rgba(0,255,65,0.3)}
.post-body h3{font-size:var(--text-base);font-weight:700;margin-block:var(--space-6) var(--space-2);color:var(--green)}
.post-body p{margin-bottom:var(--space-4);max-width:none}
.code-block{
  background:var(--black3);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:var(--space-5);overflow-x:auto;font-family:var(--font);
  font-size:var(--text-sm);line-height:1.6;margin-block:var(--space-5);
  position:relative;box-shadow:0 0 12px var(--green-glow2),inset 0 0 30px rgba(0,0,0,0.3);
}
.code-block::before{
  content:attr(data-lang);position:absolute;top:var(--space-2);right:var(--space-3);
  font-size:var(--text-xs);color:var(--green-dim);text-transform:uppercase;letter-spacing:0.08em;
}
.code-block code{color:var(--green)}
.inline-code{
  font-family:var(--font);font-size:0.9em;
  background:var(--black3);border:1px solid var(--border);
  border-radius:var(--radius-sm);padding:1px 5px;color:var(--green);
}

.admin-wrap{grid-column:1/-1;max-width:var(--content-narrow);margin-inline:auto;padding-block:var(--space-8);width:100%}
.page-title{font-size:var(--text-xl);font-family:var(--font);margin-bottom:var(--space-6);color:var(--green);text-shadow:0 0 16px rgba(0,255,65,0.3)}
.auth-card{background:var(--black2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-8);max-width:400px;box-shadow:0 0 20px var(--green-glow2)}
.auth-card h2{font-family:var(--font);font-size:var(--text-lg);margin-bottom:var(--space-2);color:var(--green)}
.auth-hint{font-size:var(--text-xs);color:var(--green-dim);margin-bottom:var(--space-6)}
.auth-form,.post-form{display:flex;flex-direction:column;gap:var(--space-4)}
label{font-family:var(--font);font-size:var(--text-xs);color:var(--green);margin-bottom:var(--space-1);display:block;letter-spacing:0.06em;text-transform:uppercase}
input[type=text],input[type=password],textarea,select{
  width:100%;background:var(--black3);border:1px solid var(--border);
  border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);
  font-size:var(--text-sm);color:var(--green);outline:none;
}
input[type=text]:focus,input[type=password]:focus,textarea:focus{
  border-color:var(--green);box-shadow:0 0 0 2px var(--green-glow),0 0 12px var(--green-glow);
}
input::placeholder,textarea::placeholder{color:rgba(0,255,65,0.25)}
textarea{font-family:var(--font);font-size:var(--text-xs);line-height:1.7;resize:vertical;min-height:400px}
.form-row-half{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.editor-toolbar{display:flex;gap:var(--space-1);margin-bottom:var(--space-2);flex-wrap:wrap}
.editor-toolbar button{
  font-family:var(--font);font-size:var(--text-xs);
  padding:var(--space-1) var(--space-3);border:1px solid var(--border);
  border-radius:var(--radius-sm);background:var(--black3);color:var(--green-dim);
}
.editor-toolbar button:hover{border-color:var(--green);color:var(--green);box-shadow:0 0 6px var(--green-glow)}
.form-actions{display:flex;gap:var(--space-3);align-items:center;padding-top:var(--space-2)}
.btn-primary{
  display:inline-flex;align-items:center;gap:var(--space-2);
  background:transparent;color:var(--green);
  padding:var(--space-3) var(--space-6);border:1px solid var(--green);
  border-radius:var(--radius-sm);font-family:var(--font);font-size:var(--text-sm);
  font-weight:700;text-decoration:none;cursor:pointer;
  box-shadow:0 0 10px var(--green-glow);letter-spacing:0.04em;
}
.btn-primary:hover{background:var(--green);color:var(--black);box-shadow:0 0 20px var(--green),0 0 40px var(--green-glow);text-shadow:none}
.btn-secondary{
  display:inline-flex;align-items:center;color:var(--green-dim);
  padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);
  font-family:var(--font);font-size:var(--text-sm);text-decoration:none;border:1px solid var(--border);
}
.btn-secondary:hover{border-color:var(--green);color:var(--green)}
.btn-danger{
  font-family:var(--font);font-size:var(--text-xs);color:#ff4444;
  padding:var(--space-1) var(--space-3);border:1px solid #ff4444;
  border-radius:var(--radius-sm);background:none;cursor:pointer;white-space:nowrap;
}
.btn-danger:hover{background:#ff4444;color:var(--black)}
.admin-toolbar{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6)}
.admin-stat{font-family:var(--font);font-size:var(--text-xs);color:var(--green-dim)}
.admin-posts{display:flex;flex-direction:column;gap:var(--space-2)}
.admin-post-row{
  background:var(--black2);border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:var(--space-3) var(--space-4);display:flex;align-items:center;
  justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;
}
.admin-post-row:hover{border-color:var(--green)}
.apost-info{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;min-width:0}
.apost-title{font-family:var(--font);font-size:var(--text-sm);color:var(--green);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:400px}
.apost-title:hover{text-shadow:0 0 8px var(--green)}
.apost-date{font-family:var(--font);font-size:var(--text-xs);color:var(--green-dim)}
.delete-form{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}
.del-pass{width:110px;font-size:var(--text-xs);padding:var(--space-1) var(--space-2)}
.flash-msg{
  background:transparent;border:1px solid var(--green);color:var(--green);
  padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);
  font-family:var(--font);font-size:var(--text-sm);margin-top:var(--space-4);
  box-shadow:0 0 10px var(--green-glow);
}
.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--space-16) var(--space-8);color:var(--green-dim)}
.empty-icon{font-size:3rem;margin-bottom:var(--space-4)}
.empty-state h3{font-family:var(--font);color:var(--green);margin-bottom:var(--space-2)}
.empty-state p{margin-bottom:var(--space-6);font-size:var(--text-sm)}
.site-footer{border-top:1px solid var(--border);padding-block:var(--space-6);margin-top:var(--space-16);position:relative;z-index:1}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap}
.footer-cmd,.footer-copy{font-family:var(--font);font-size:var(--text-xs);color:var(--green-dim)}

/* ── COMMENTS ───────────────────────────────────────────────────────────── */
.comments-section {
  margin-top: var(--space-12);
  padding-top: var(--space-8);
  border-top: 1px solid var(--border);
}
.comments-title {
  font-family: var(--font);
  font-size: var(--text-lg);
  color: var(--green);
  margin-bottom: var(--space-6);
}
.comments-count { color: var(--green-dim) }
.comments-list { display: flex; flex-direction: column; gap: var(--space-4); margin-bottom: var(--space-8) }
.comment-item {
  background: var(--black2);
  border: 1px solid var(--border);
  border-left: 3px solid var(--green);
  border-radius: var(--radius-md);
  padding: var(--space-4);
}
.comment-meta {
  display: flex; gap: var(--space-4); align-items: center;
  margin-bottom: var(--space-2);
  font-family: var(--font); font-size: var(--text-xs);
}
.comment-author { color: var(--green); font-weight: 700 }
.comment-date   { color: var(--green-dim) }
.comment-body   { font-size: var(--text-sm); color: var(--green-dim); line-height: 1.7 }
.no-comments    { color: var(--green-dim); font-size: var(--text-sm); margin-bottom: var(--space-8) }

.comment-form { margin-top: var(--space-6) }
.comment-form-title {
  font-family: var(--font); font-size: var(--text-sm);
  color: var(--green-dim); margin-bottom: var(--space-4);
}
.comment-form textarea { min-height: 100px }

/* ── ADMIN COMMENTS ─────────────────────────────────────────────────────── */
.admin-comments-group { margin-bottom: var(--space-2) }
.admin-comments-post-title {
  font-family: var(--font); font-size: var(--text-sm);
  color: var(--green-dim); padding: var(--space-2) var(--space-4);
  background: var(--black2); border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}
.admin-comments-post-title a { color: var(--green) }
.admin-comment-row {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: var(--space-4); padding: var(--space-3) var(--space-4) var(--space-3) var(--space-8);
  background: var(--black3); border: 1px solid var(--border);
  border-top: none; border-radius: 0 0 var(--radius-sm) var(--radius-sm);
}
.acomment-info { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0 }
.acomment-author { font-family: var(--font); font-size: var(--text-xs); color: var(--green); font-weight: 700 }
.acomment-text  { font-size: var(--text-xs); color: var(--green-dim); max-width: 600px }
.acomment-date  { font-size: var(--text-xs); color: var(--green-dark) }
