/* SYSTEM_CHECKMATE — Norse Matrix visual polish
   Shared, additive styling. Original page styles remain intact. */
:root{
  --sc-rune:#00ff88;
  --sc-rune-soft:#79ffc0;
  --sc-rune-dim:#006c42;
  --sc-void:#020604;
  --sc-panel:#07110c;
  --sc-line:rgba(0,255,136,.25);
  --sc-glow:rgba(0,255,136,.13);
}
html{scroll-behavior:smooth;scroll-padding-top:18px}
body{
  background-color:var(--sc-void);
  background-image:radial-gradient(ellipse at 50% -18%,rgba(0,255,136,.055),transparent 55%);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--sc-rune);color:#00180b}
a{transition:color .18s ease,text-shadow .18s ease,opacity .18s ease}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--sc-rune-soft);outline-offset:4px}
img{max-width:100%}
nav{
  position:relative;
  border-color:var(--sc-rune-dim)!important;
  background:linear-gradient(100deg,rgba(0,255,136,.065),rgba(2,6,4,.96) 70%)!important;
  box-shadow:inset 0 1px rgba(0,255,136,.08),0 8px 24px rgba(0,0,0,.14);
}
nav a{position:relative;text-decoration:none}
nav a:hover,nav a:focus-visible{color:#e0ffed!important}
h1,h2,h3{ text-wrap:balance }
p{ text-wrap:pretty }
.wrapper,.wrap{isolation:isolate}
.wrapper>h1,.wrap>h1{
  border-color:rgba(0,255,136,.55)!important;
  box-shadow:inset 0 0 0 1px rgba(0,255,136,.045),0 12px 32px rgba(0,0,0,.24),0 0 22px rgba(0,255,136,.055)!important;
}
.btn,button{
  transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease;
}
.btn:active,button:active{transform:translateY(1px)}
.grid{align-items:stretch}
.card{
  position:relative;
  isolation:isolate;
  border:1px solid rgba(0,255,136,.48)!important;
  background:linear-gradient(145deg,rgba(0,255,136,.035),rgba(0,0,0,.97) 72%)!important;
  box-shadow:inset 0 0 0 1px rgba(0,255,136,.025),0 8px 24px rgba(0,0,0,.16)!important;
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease!important;
}
/* Four fine angular corners: a digital interpretation of Norse knotwork. */
.card:before{
  content:"";
  position:absolute;
  z-index:4;
  inset:3px;
  pointer-events:none;
  border:1px solid transparent;
  background:
    linear-gradient(135deg,transparent 43%,var(--sc-rune) 45% 49%,transparent 51%) left top/13px 13px no-repeat,
    linear-gradient(225deg,transparent 43%,var(--sc-rune) 45% 49%,transparent 51%) right top/13px 13px no-repeat,
    linear-gradient(45deg,transparent 43%,var(--sc-rune) 45% 49%,transparent 51%) left bottom/13px 13px no-repeat,
    linear-gradient(315deg,transparent 43%,var(--sc-rune) 45% 49%,transparent 51%) right bottom/13px 13px no-repeat;
  opacity:.82;
}
.card:after{
  content:"";
  position:absolute;
  z-index:3;
  inset:7px;
  pointer-events:none;
  border:1px solid rgba(0,255,136,.12);
  opacity:.9;
}
.card:hover,.card:focus-within{
  border-color:var(--sc-rune)!important;
  box-shadow:inset 0 0 0 1px rgba(0,255,136,.08),0 10px 30px rgba(0,255,136,.075),0 8px 24px rgba(0,0,0,.2)!important;
}
.card img{
  border-color:rgba(0,255,136,.22)!important;
  transition:filter .25s ease,transform .35s ease;
}
.card:hover img{filter:saturate(1.045) contrast(1.025)}
.card-caption,.caption{color:#b7e9cc}
hr{border:0;border-top:1px solid var(--sc-line)}
footer{color:#87cba6}
input,textarea,select{max-width:100%;background:#030a06;color:#d9ffea;border:1px solid var(--sc-rune-dim)}
@media(max-width:600px){
  html{scroll-padding-top:10px}
  .card:hover,.card:focus-within{transform:none!important}
  .card:before{inset:3px;background-size:11px 11px;opacity:.75}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

/* --- SYSTEM_CHECKMATE: unified, restrained site-wide finish --- */
/* Preserve the original 90s terminal identity; improve rhythm and readability. */
body{
  line-height:1.65;
  background-image:
    radial-gradient(ellipse at 50% -18%,rgba(0,255,136,.055),transparent 55%),
    linear-gradient(180deg,rgba(0,18,10,.18),transparent 280px);
}
a{
  color:#8fffc0;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}
a:hover{color:#d8ffea}
nav{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 16px;
  padding:12px clamp(12px,2.2vw,20px);
  margin-bottom:24px;
}
nav a{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  padding:4px 3px;
  line-height:1.4;
}
.wrapper,.wrap{
  box-sizing:border-box;
  width:100%;
}
.wrapper>h1,.wrap>h1{
  border-left:2px solid var(--sc-rune)!important;
  background:
    radial-gradient(ellipse at 92% 0%,rgba(0,255,136,.085),transparent 48%),
    linear-gradient(145deg,rgba(3,20,13,.9),rgba(0,0,0,.98) 72%)!important;
  padding:clamp(18px,3vw,30px);
}
h1,h2,h3{
  line-height:1.28;
  letter-spacing:-.018em;
}
p,li{line-height:1.75}
img,video,iframe{max-width:100%;height:auto}
audio{display:block;width:100%;max-width:100%;margin-block:12px}
button,.btn{min-height:40px}
footer{
  border-top:1px solid var(--sc-line);
  margin-top:32px;
  padding-top:18px;
  line-height:1.75;
}
@media(max-width:600px){
  nav{gap:6px 12px;padding:10px 12px;margin-bottom:18px}
  nav a{min-height:36px}
  .wrapper>h1,.wrap>h1{padding:20px 16px}
  p,li{line-height:1.7}
}
