:root{
  --black:#020203;
  --near-black:#0b0a0d;
  --white:#f7f7f2;
  --paper:#d9d9d4;
  --gray:#8d8c92;
  --purple:#351b55;
  --purple-dark:#190d2b;
  --purple-light:#8d6ab4;
  --static:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' seed='17' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='discrete' tableValues='0 1'/%3E%3CfeFuncG type='discrete' tableValues='0 1'/%3E%3CfeFuncB type='discrete' tableValues='0 1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--black)}
body{
  margin:0;
  min-height:100vh;
  overflow-x:hidden;
  color:var(--white);
  background:
    linear-gradient(90deg,transparent 0 14px,#ffffff0e 15px,transparent 16px) 0 0/32px 32px,
    linear-gradient(transparent 0 14px,#ffffff0b 15px,transparent 16px) 0 0/32px 32px,
    repeating-conic-gradient(from 45deg,var(--purple-dark) 0 25%,var(--black) 0 50%) 0 0/18px 18px;
  font-family:Verdana,Geneva,Arial,sans-serif;
  font-size:16px;
}

button{font:inherit}
button:focus-visible{outline:3px dashed var(--white);outline-offset:3px}

.screen-grid{
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:var(--static);
  background-size:170px 170px;
  opacity:.055;
  mix-blend-mode:screen;
  animation:staticShift .28s steps(2,end) infinite;
}

.edge-tag{
  position:fixed;
  z-index:5;
  top:48%;
  padding:5px 12px;
  color:var(--black);
  background:var(--white);
  border:2px solid var(--black);
  outline:2px solid var(--white);
  font:700 12px/1 "Courier New",monospace;
  letter-spacing:1px;
  writing-mode:vertical-rl;
  text-orientation:mixed;
  box-shadow:4px 4px 0 var(--purple);
}
.edge-tag-left{left:3px;transform:translateY(-50%) rotate(180deg)}
.edge-tag-right{right:3px;transform:translateY(-50%)}

.site-shell{
  position:relative;
  width:min(1240px,calc(100vw - 38px));
  margin:12px auto 48px;
  padding:5px;
  background:var(--black);
  border:3px solid var(--white);
  outline:3px solid var(--black);
  box-shadow:0 0 0 6px var(--purple-light),8px 9px 0 6px #000;
}

.site-shell::before,
.site-shell::after{
  content:"✦ ✧ ★ + ✦ + ★ ✧ ✦";
  position:absolute;
  z-index:4;
  color:var(--white);
  background:var(--purple);
  border:2px solid var(--white);
  padding:3px 8px;
  font:700 12px/1 "Courier New",monospace;
  white-space:nowrap;
}
.site-shell::before{left:-20px;top:128px;transform:rotate(-4deg)}
.site-shell::after{right:-22px;top:310px;transform:rotate(5deg)}

.microbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:28px;
  padding:4px 8px;
  color:var(--white);
  background:var(--black);
  border:2px solid var(--white);
  font:700 12px/1.2 "Courier New",monospace;
  letter-spacing:.5px;
  overflow:hidden;
}
.microbar-center{color:var(--paper)}
.online-dot{display:inline-block;width:9px;height:9px;background:var(--white);box-shadow:0 0 0 2px var(--purple);animation:blink .9s steps(1,end) infinite}

.hero{
  position:relative;
  min-height:226px;
  margin-top:5px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:22px 32px 24px;
  border:3px solid var(--white);
  background:
    linear-gradient(105deg,transparent 0 53%,#ffffff10 53% 54%,transparent 54%),
    repeating-linear-gradient(0deg,#060509 0 4px,#17121d 4px 6px,#020203 6px 11px);
  box-shadow:inset 0 0 0 4px var(--purple),inset 0 0 0 6px var(--black);
}

.hero::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:14px;
  background:repeating-linear-gradient(90deg,var(--white) 0 10px,var(--black) 10px 20px);
  border-top:2px solid var(--white);
  animation:march .55s steps(2,end) infinite;
}

.static-spill{
  position:absolute;
  z-index:0;
  background-color:var(--paper);
  background-image:var(--static);
  background-size:105px 105px;
  filter:contrast(2.8);
  opacity:.78;
  animation:staticShift .24s steps(2,end) infinite;
}
.static-spill-a{
  width:360px;
  height:255px;
  right:-45px;
  top:-45px;
  clip-path:polygon(13% 0,100% 0,100% 77%,87% 73%,81% 100%,58% 87%,43% 96%,34% 66%,8% 75%,17% 49%,0 32%);
}
.static-spill-b{
  width:175px;
  height:130px;
  left:47%;
  bottom:-41px;
  opacity:.23;
  transform:rotate(7deg);
  clip-path:polygon(10% 12%,82% 0,100% 33%,78% 100%,19% 84%,0 43%);
}

.pixel-swarm{
  position:absolute;
  z-index:2;
  color:var(--white);
  font:900 18px/1 "Courier New",monospace;
  letter-spacing:8px;
  text-shadow:2px 2px 0 var(--purple);
  animation:swarm 1.1s steps(2,end) infinite;
}
.swarm-one{right:305px;top:20px}
.swarm-two{right:345px;bottom:33px;animation-delay:-.4s}

.hero-copy{position:relative;z-index:2;max-width:720px}
.tiny-tag{
  display:inline-block;
  padding:5px 9px;
  color:var(--black);
  background:var(--white);
  border:3px double var(--black);
  outline:2px solid var(--white);
  box-shadow:4px 4px 0 var(--purple-light);
  font:900 14px/1 "Courier New",monospace;
  transform:rotate(-2deg);
  animation:tagTwitch 1.6s steps(2,end) infinite;
}

h1{
  position:relative;
  margin:12px 0 6px;
  color:var(--white);
  font:900 clamp(48px,7vw,82px)/.73 Impact,"Arial Black",sans-serif;
  letter-spacing:-3px;
  text-transform:uppercase;
  transform:skewX(-5deg);
  text-shadow:
    2px 0 0 var(--black),
    4px 0 0 var(--paper),
    7px 4px 0 var(--purple),
    10px 7px 0 var(--white),
    13px 10px 0 var(--black);
  animation:titleJolt 3.1s steps(1,end) infinite;
}

.hero-copy>p{
  display:inline-block;
  margin:8px 0 10px;
  padding:4px 7px;
  color:var(--black);
  background:var(--white);
  border-left:9px solid var(--gray);
  font:700 16px/1.35 "Courier New",monospace;
  box-shadow:5px 5px 0 var(--purple);
}

.hero-badges{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.hero-badges span{
  padding:3px 6px;
  color:var(--white);
  background:var(--black);
  border:2px solid var(--white);
  font:700 12px/1 "Courier New",monospace;
}
.hero-badges span:nth-child(even){color:var(--black);background:var(--white)}

.hero-art{position:relative;z-index:1;width:300px;min-width:300px;height:180px}
.noise-orb{
  position:absolute;
  right:5px;
  top:2px;
  width:142px;
  height:142px;
  border:5px solid var(--black);
  outline:3px solid var(--white);
  border-radius:50%;
  background-color:var(--white);
  background-image:var(--static);
  background-size:90px 90px;
  filter:contrast(2);
  box-shadow:9px 8px 0 var(--purple);
  animation:staticShift .2s steps(2,end) infinite,orbPulse 1.8s steps(3,end) infinite;
}
.hero-cat{
  position:absolute;
  z-index:3;
  right:16px;
  top:52px;
  padding:8px;
  color:var(--white);
  background:var(--black);
  border:2px solid var(--white);
  font:900 18px/1 "Courier New",monospace;
  transform:rotate(5deg);
}
.hero-track{position:absolute;left:0;right:0;bottom:31px;color:var(--white);font:900 20px/1 monospace;white-space:nowrap;overflow:hidden}
.train{position:absolute;left:0;bottom:38px;font-size:45px;filter:grayscale(1) contrast(1.8);animation:trainRun 7s linear infinite}
.arrival{
  position:absolute;
  left:5px;
  top:8px;
  padding:5px 7px;
  color:var(--white);
  background:var(--purple-dark);
  border:2px solid var(--white);
  font:700 11px/1.15 "Courier New",monospace;
  transform:rotate(-3deg);
}
.arrival strong{color:var(--black);background:var(--white)}

.hero-sticker{
  position:absolute;
  z-index:4;
  padding:7px;
  color:var(--black);
  background:var(--white);
  border:3px dotted var(--black);
  outline:2px solid var(--white);
  font:900 11px/1 "Courier New",monospace;
  text-align:center;
}
.sticker-a{right:265px;top:18px;transform:rotate(8deg)}
.sticker-b{right:272px;bottom:22px;transform:rotate(-6deg);color:var(--white);background:var(--purple)}

.nav-strip{
  display:flex;
  align-items:center;
  gap:5px;
  margin-top:5px;
  padding:7px;
  overflow-x:auto;
  background:
    linear-gradient(#ffffff22 0 2px,transparent 2px),
    var(--purple);
  border:3px solid var(--white);
  box-shadow:inset 0 0 0 2px var(--black);
}
.nav-label{padding:5px 7px;color:var(--black);background:var(--white);font:900 13px/1 "Courier New",monospace;white-space:nowrap}
.nav-btn,.side-link,.motion-toggle{
  appearance:none;
  border:2px solid var(--white);
  border-radius:0;
  color:var(--white);
  background:var(--black);
  box-shadow:inset -2px -2px 0 var(--gray),3px 3px 0 #000;
  font:900 14px/1 "Courier New",monospace;
  cursor:pointer;
  white-space:nowrap;
}
.nav-btn{padding:8px 14px}
.nav-btn:hover,.nav-btn.active,.side-link:hover{
  color:var(--black);
  background:var(--white);
  box-shadow:inset -2px -2px 0 var(--gray),3px 3px 0 var(--purple-light);
  transform:translate(-1px,-1px);
}
.motion-toggle{margin-left:auto;padding:7px 9px;font-size:11px;background:var(--purple-dark)}
.motion-toggle:hover{background:var(--white);color:var(--black)}

.ticker{
  height:30px;
  margin-top:5px;
  overflow:hidden;
  color:var(--black);
  background:var(--white);
  border:3px double var(--black);
  outline:2px solid var(--white);
  font:900 16px/22px "Courier New",monospace;
  white-space:nowrap;
}
.ticker div{display:flex;width:max-content;animation:ticker 18s linear infinite}
.ticker span{display:block;padding-right:38px}

.button-ribbon{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:3px;
  margin:6px 0;
  padding:3px;
  background:var(--paper);
  border:2px solid var(--white);
}
.button-ribbon span{
  min-width:0;
  padding:4px 3px;
  overflow:hidden;
  color:var(--white);
  background:var(--black);
  border:1px solid var(--white);
  font:700 11px/1 "Courier New",monospace;
  text-align:center;
  white-space:nowrap;
}
.button-ribbon span:nth-child(even){color:var(--black);background:var(--white);border-color:var(--black)}

.layout{display:grid;grid-template-columns:205px minmax(0,1fr) 195px;gap:7px}
.sidebar{display:flex;flex-direction:column;gap:7px}
.panel{
  position:relative;
  background:
    linear-gradient(90deg,#ffffff08 1px,transparent 1px) 0 0/8px 8px,
    var(--near-black);
  border:2px solid var(--white);
  border-radius:0;
  box-shadow:3px 3px 0 var(--purple-light),5px 5px 0 var(--black);
}
.panel h2{
  margin:0 0 8px;
  padding:6px 7px;
  color:var(--black);
  background:var(--white);
  border-bottom:2px solid var(--gray);
  font:900 15px/1 "Courier New",monospace;
  letter-spacing:.2px;
}
.panel h2 span{display:inline-block;margin-right:4px;padding:2px 4px;color:var(--white);background:var(--black)}
.mini-panel,.button-bank,.sticker-panel,.tiny-note,.scoreless,.static-sample,.signal-panel,.timetable{padding:6px}

.side-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  margin:5px 0;
  padding:7px 8px;
  text-align:left;
  text-transform:uppercase;
}
.side-link:nth-of-type(even){background:var(--purple-dark)}

.micro-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:4px}
.micro-grid span{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:3px;
  color:var(--black);
  background:var(--white);
  border:2px solid var(--black);
  outline:1px solid var(--white);
  font:900 11px/.9 "Courier New",monospace;
  text-align:center;
  animation:microFlip 3s steps(1,end) infinite;
}
.micro-grid span:nth-child(2n){color:var(--white);background:var(--purple);animation-delay:-1s}
.micro-grid span:nth-child(3n){background-image:var(--static);background-size:55px;color:var(--white);text-shadow:1px 1px var(--black);animation-delay:-2s}

.sticker-panel{text-align:center;background:var(--purple-dark)}
.stamp{
  margin:4px;
  padding:13px 5px;
  color:var(--black);
  background:var(--white);
  border:4px dashed var(--black);
  outline:2px solid var(--white);
  font:900 15px/1.05 "Courier New",monospace;
  transform:rotate(-2deg);
  box-shadow:5px 5px 0 var(--purple-light);
}
.stamp strong{font-size:21px}
.pixel-heart{margin:7px 0 -2px;color:var(--white);font:900 44px/1 "Courier New",monospace;text-shadow:4px 3px 0 var(--purple-light);animation:heartBeat 1s steps(2,end) infinite}
.sticker-panel p,.tiny-note p,.static-sample p{margin:8px 2px;font:700 13px/1.45 "Courier New",monospace}

.static-window{
  position:relative;
  display:grid;
  place-items:center;
  height:100px;
  overflow:hidden;
  border:4px double var(--white);
  background-color:var(--white);
  background-image:var(--static);
  background-size:75px 75px;
  filter:contrast(2.5);
  animation:staticShift .18s steps(2,end) infinite;
}
.static-window::before{
  content:"";
  position:absolute;
  width:88px;
  height:82px;
  background:var(--purple);
  clip-path:polygon(0 15%,20% 0,75% 9%,100% 42%,83% 100%,52% 78%,17% 97%,24% 54%);
}
.static-window b{position:relative;z-index:2;padding:4px 6px;color:var(--white);background:var(--black);font:900 22px/1 monospace}
.static-sample{text-align:center}

.loading-bar{height:14px;padding:2px;border:2px solid var(--white);background:var(--black)}
.loading-bar i{display:block;width:62%;height:100%;background:repeating-linear-gradient(90deg,var(--white) 0 7px,var(--black) 7px 10px);animation:loading 1.2s steps(5,end) infinite}

.content{min-height:760px;padding:10px;overflow:hidden}
.page{display:none}
.page.active{display:block;animation:pagePop .2s steps(3,end)}

.page-title-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:7px;
  margin-bottom:9px;
  padding:4px;
  color:var(--black);
  background:var(--white);
  border:3px double var(--black);
  outline:2px solid var(--white);
}
.page-title-row h2{margin:0;font:900 clamp(20px,3vw,30px)/1 Impact,"Arial Black",sans-serif;text-align:center;letter-spacing:.5px}
.title-flash{padding:5px;color:var(--white);background:var(--black);font:900 11px/1 "Courier New",monospace;animation:blink .8s steps(1,end) infinite}
.title-flash.alt{color:var(--white);background:var(--purple);animation-delay:-.4s}

.welcome-grid{display:grid;grid-template-columns:1.35fr .7fr;gap:8px;align-items:stretch}
.welcome-copy{position:relative;padding:10px;border:3px dashed var(--white);background:var(--purple-dark);box-shadow:inset 0 0 0 3px var(--black)}
.welcome-copy p{margin:12px 2px;line-height:1.45}
.mini-head{display:inline-block;margin:-4px 0 3px -4px;padding:4px 7px;color:var(--black);background:var(--white);font:900 12px/1 "Courier New",monospace}
.soft-box{
  margin:9px 0;
  padding:11px;
  color:var(--black);
  background:var(--white);
  border:3px solid var(--black);
  outline:2px solid var(--white);
  box-shadow:4px 4px 0 var(--purple-light);
  font-weight:700;
}
.tiny-status-row{display:flex;flex-wrap:wrap;gap:3px;margin-top:10px}
.tiny-status-row span{padding:3px 5px;border:1px solid var(--white);background:var(--black);font:700 11px/1 "Courier New",monospace}

.mascot-stack{display:grid;grid-template-rows:1fr 27px;gap:6px}
.mascot-card{
  position:relative;
  display:grid;
  place-items:center;
  min-height:210px;
  padding:18px 8px 10px;
  overflow:hidden;
  color:var(--black);
  background-color:var(--white);
  background-image:var(--static);
  background-size:165px 165px;
  border:4px double var(--black);
  outline:2px solid var(--white);
  filter:contrast(1.2);
}
.mascot-card::after{content:"";position:absolute;inset:17px;background:var(--purple);clip-path:polygon(8% 0,95% 8%,100% 83%,70% 100%,5% 89%,0 24%)}
.big-kitty{position:relative;z-index:2;padding:13px;color:var(--white);background:var(--black);font:900 26px/1.05 "Courier New",monospace;white-space:pre;text-align:center;transform:rotate(-2deg)}
.speech{position:absolute;z-index:3;right:3px;bottom:7px;padding:5px 7px;color:var(--black);background:var(--white);border:2px solid var(--black);font:900 12px/1 "Courier New",monospace;transform:rotate(5deg)}
.corner-word{position:absolute;z-index:3;left:3px;top:4px;padding:3px;color:var(--white);background:var(--black);font:900 11px/1 monospace;animation:blink .9s steps(1,end) infinite}
.mini-marquee{overflow:hidden;color:var(--black);background:var(--white);border:2px solid var(--white);font:900 12px/21px "Courier New",monospace;white-space:nowrap}
.mini-marquee span{display:inline-block;padding-left:100%;animation:miniTicker 6s linear infinite}

.cargo-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:10px 0 8px}
.cargo-strip div{display:grid;grid-template-columns:auto 1fr;align-items:center;border:2px solid var(--white);background:var(--black)}
.cargo-strip b{align-self:stretch;display:grid;place-items:center;padding:4px;color:var(--black);background:var(--white);font:900 12px/1 monospace}
.cargo-strip span{padding:6px 4px;font:900 11px/1 monospace;text-align:center}
.cargo-strip div:nth-child(even){background:var(--purple)}

.section-heading{display:flex;align-items:end;justify-content:space-between;gap:8px;border-bottom:4px double var(--white)}
.section-heading h3{margin:9px 0 4px;font:900 22px/1 Impact,"Arial Black",sans-serif;letter-spacing:.5px}
.section-heading span{margin-bottom:4px;font:700 11px/1.2 "Courier New",monospace;text-align:right}

.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:10px}
.gallery.compact{grid-template-columns:repeat(3,minmax(0,1fr))}
.art-card{
  --tilt:0deg;
  position:relative;
  margin:0;
  padding:6px;
  color:var(--black);
  background:var(--white);
  border:4px double var(--black);
  outline:2px solid var(--white);
  box-shadow:5px 5px 0 var(--purple-light),8px 8px 0 var(--black);
  transform:rotate(var(--tilt));
  transition:transform .08s steps(2,end),box-shadow .08s steps(2,end);
}
.art-card::before{content:"NEW ART!!";position:absolute;z-index:2;top:-7px;right:-5px;padding:2px 4px;color:var(--white);background:var(--black);border:1px solid var(--white);font:900 9px/1 monospace;transform:rotate(3deg)}
.art-card:hover{z-index:3;transform:translate(-3px,-3px) rotate(0deg);box-shadow:8px 8px 0 var(--white),11px 11px 0 var(--purple)}
.art-card img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;background-color:var(--paper);background-image:var(--static);background-size:90px;border:2px solid var(--black)}
.art-card .caption{padding:7px 2px 1px;font:900 12px/1.15 "Courier New",monospace;text-align:center;text-transform:uppercase}
.art-card.image-missing img{visibility:hidden}
.art-card.image-missing::after{content:"ART FILE GOES HERE :3";position:absolute;left:12px;right:12px;top:28%;padding:10px 4px;color:var(--white);background:var(--black);border:2px solid var(--white);font:900 12px/1.25 "Courier New",monospace;text-align:center;transform:rotate(-2deg)}

.home-widgets{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:14px}
.tiny-widget{display:flex;flex-direction:column;gap:4px;padding:7px;border:2px solid var(--white);background:var(--purple-dark);font:700 12px/1.2 "Courier New",monospace}
.tiny-widget b{color:var(--black);background:var(--white);padding:3px}
.tiny-widget.invert{color:var(--black);background:var(--white);border-color:var(--gray)}
.tiny-widget.invert b{color:var(--white);background:var(--black)}

.page-intro{padding:10px;border:2px solid var(--white);background:var(--purple-dark);line-height:1.45;text-align:center}
.page-intro b{color:var(--black);background:var(--white);padding:2px 4px}
.pixel-divider{margin:8px 0;padding:4px;overflow:hidden;color:var(--black);background:var(--white);font:900 14px/1 monospace;text-align:center;white-space:nowrap}

.departure-grid{display:grid;grid-template-columns:auto 1fr auto 1fr auto 2fr;gap:2px;margin-bottom:8px;background:var(--white);border:2px solid var(--white)}
.departure-grid span,.departure-grid strong{padding:7px;background:var(--black);font:900 12px/1 "Courier New",monospace}
.departure-grid span{color:var(--black);background:var(--white)}
.big-card{padding:20px;border:4px double var(--white);background:var(--purple-dark);text-align:center;box-shadow:inset 0 0 0 3px var(--black),7px 7px 0 var(--purple-light)}
.choo{margin:18px 0;font-size:62px;filter:grayscale(1) contrast(1.8);animation:chooBounce .7s steps(2,end) infinite}
.rail{overflow:hidden;color:var(--white);font:900 19px/1 "Courier New",monospace;white-space:nowrap}.rail.bottom{transform:rotate(180deg)}
.train-card p{max-width:600px;margin:15px auto;line-height:1.5}

.kitty-grid,.stuff-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.kitty-tile{position:relative;display:grid;place-items:center;min-height:150px;padding:30px 8px 18px;color:var(--white);background:var(--purple-dark);border:3px dashed var(--white);font:900 clamp(22px,3vw,32px)/1 "Courier New",monospace;text-align:center;box-shadow:5px 5px 0 var(--white)}
.kitty-tile:nth-child(even){color:var(--black);background:var(--white);border-color:var(--black);box-shadow:5px 5px 0 var(--purple-light)}
.kitty-tile small{position:absolute;left:4px;top:4px;padding:3px;color:var(--black);background:var(--white);font:900 10px/1 monospace}
.kitty-tile:nth-child(even) small{color:var(--white);background:var(--black)}
.science-note{margin-top:14px;padding:10px;border:3px double var(--white);font-weight:700;text-align:center}.science-note span{display:block;margin:-10px -10px 9px;padding:5px;color:var(--black);background:var(--white);font:900 12px/1 monospace}
.stuff-grid .soft-box{display:flex;flex-direction:column;gap:12px;min-height:130px;align-items:center;justify-content:center;text-align:center}
.stuff-grid .soft-box:nth-child(2),.stuff-grid .soft-box:nth-child(3){color:var(--white);background:var(--purple-dark)}
.stuff-grid b{font:900 13px/1 monospace;text-decoration:underline}

.now-playing{text-align:center}
.disc{margin:2px auto;color:var(--white);font:900 72px/1 monospace;text-shadow:0 0 0 var(--black),6px 5px 0 var(--purple-light);animation:spin 3.5s steps(12,end) infinite}
.track-screen{display:flex;flex-direction:column;gap:6px;padding:7px;color:var(--black);background:var(--white);border:3px double var(--black)}
.track-screen small{font:700 10px/1 monospace}
.scoreless{text-align:center;color:var(--black);background-color:var(--white);background-image:var(--static);background-size:120px;filter:contrast(1.1)}
.score-title{display:inline-block;padding:3px;color:var(--white);background:var(--black);font:900 11px/1 monospace}.score{color:var(--white);font:900 54px/1 Impact,sans-serif;text-shadow:3px 3px 0 var(--black),6px 6px 0 var(--purple)}.score-caption{display:inline-block;padding:5px;color:var(--white);background:var(--black);font:700 11px/1.2 monospace}

.signal-screen{padding:8px;border:2px dashed var(--white);background:var(--purple-dark);text-align:center}.signal-screen p{margin:0 0 7px;font:900 12px/1 monospace}.signal-screen strong{display:block;margin-top:7px;padding:3px;color:var(--black);background:var(--white);font:900 10px/1 monospace}
.signal-bars{display:flex;align-items:end;justify-content:center;gap:4px;height:45px}.signal-bars i{display:block;width:12px;background:var(--white);border:1px solid var(--black);animation:barPulse .8s steps(3,end) infinite}.signal-bars i:nth-child(1){height:12px}.signal-bars i:nth-child(2){height:21px;animation-delay:-.15s}.signal-bars i:nth-child(3){height:31px;animation-delay:-.3s}.signal-bars i:nth-child(4){height:39px;animation-delay:-.45s}.signal-bars i:nth-child(5){height:45px;animation-delay:-.6s}

.timetable>div{display:flex;justify-content:space-between;gap:5px;margin:3px 0;padding:5px;border:1px solid var(--white);font:700 11px/1 monospace}.timetable>div:nth-child(odd){color:var(--black);background:var(--white)}
.rule-note{text-align:center}.rule-note p{font-size:14px}.mini-smile{display:inline-block;margin:3px;padding:6px;color:var(--black);background:var(--white);border:2px solid var(--gray);font:900 22px/1 monospace;animation:tagTwitch 1.2s steps(2,end) infinite}

.footer-badges{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;margin-top:9px;padding:4px;border:2px solid var(--white);background:var(--purple)}
.footer-badges span{overflow:hidden;padding:5px 3px;color:var(--black);background:var(--white);border:2px solid var(--black);font:900 10px/1 monospace;text-align:center;white-space:nowrap}.footer-badges span:nth-child(even){color:var(--white);background:var(--black);border-color:var(--white)}
footer{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:5px;padding:10px;border:3px double var(--white);background:var(--black);font:700 12px/1.2 "Courier New",monospace;text-align:center}footer>span:first-child{color:var(--black);background:var(--white);padding:0 4px}footer small{width:100%;font:700 10px/1 monospace;color:var(--paper)}

.cursor-spark{position:fixed;z-index:9999;pointer-events:none;color:var(--white);font:900 14px/1 monospace;text-shadow:2px 2px var(--purple);animation:sparkOut .55s steps(4,end) forwards}

@keyframes staticShift{0%{background-position:0 0}25%{background-position:17px -9px}50%{background-position:-13px 21px}75%{background-position:8px 7px}100%{background-position:0 0}}
@keyframes blink{0%,48%{opacity:1}49%,78%{opacity:.18}79%,100%{opacity:1}}
@keyframes march{to{background-position:20px 0}}
@keyframes ticker{to{transform:translateX(-50%)}}
@keyframes miniTicker{to{transform:translateX(-100%)}}
@keyframes swarm{0%,100%{transform:translate(0,0)}33%{transform:translate(3px,-2px)}66%{transform:translate(-2px,2px)}}
@keyframes tagTwitch{0%,88%,100%{transform:rotate(-2deg) translate(0)}90%{transform:rotate(1deg) translate(2px,-1px)}94%{transform:rotate(-4deg) translate(-1px,1px)}}
@keyframes titleJolt{0%,92%,100%{transform:skewX(-5deg) translate(0)}93%{transform:skewX(-8deg) translate(3px,-1px)}95%{transform:skewX(-2deg) translate(-2px,1px)}}
@keyframes orbPulse{0%,100%{box-shadow:9px 8px 0 var(--purple)}50%{box-shadow:9px 8px 0 var(--purple),0 0 0 6px var(--white)}}
@keyframes trainRun{0%{transform:translateX(-65px)}100%{transform:translateX(290px)}}
@keyframes microFlip{0%,88%,100%{filter:invert(0)}89%,94%{filter:invert(1)}}
@keyframes heartBeat{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes loading{0%{width:20%}50%{width:88%}100%{width:20%}}
@keyframes pagePop{from{opacity:.25;transform:translate(5px,2px)}to{opacity:1;transform:none}}
@keyframes chooBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes barPulse{0%,100%{filter:invert(0)}50%{filter:invert(1)}}
@keyframes sparkOut{0%{opacity:1;transform:scale(1) rotate(0)}100%{opacity:0;transform:translateY(-16px) scale(.2) rotate(90deg)}}

body.calm-mode *,body.calm-mode *::before,body.calm-mode *::after{animation-play-state:paused!important}
body.calm-mode .screen-grid{display:none}

@media(max-width:1050px){
  .layout{grid-template-columns:180px minmax(0,1fr)}
  .rightbar{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr)}
  .rightbar .rule-note{display:none}
  .hero-art{width:250px;min-width:250px}
  .sticker-a,.sticker-b{display:none}
}

@media(max-width:760px){
  .edge-tag{display:none}
  .site-shell{width:calc(100vw - 12px);margin:6px auto 30px;box-shadow:0 0 0 3px var(--purple-light)}
  .microbar-center{display:none}
  .hero{min-height:220px;padding:20px 15px}
  .hero-art{position:absolute;right:-35px;opacity:.44}
  .hero-copy{max-width:92%}
  h1{font-size:54px}
  .hero-copy>p{font-size:14px;max-width:85%}
  .button-ribbon{grid-template-columns:repeat(3,1fr)}
  .layout{grid-template-columns:1fr}
  .leftbar,.rightbar{display:grid;grid-template-columns:repeat(2,1fr);grid-column:auto}
  .content{grid-row:1;min-height:620px}
  .welcome-grid{grid-template-columns:1fr}
  .mascot-stack{grid-template-columns:1fr;grid-template-rows:190px 27px}
  .mascot-card{min-height:180px}
  .cargo-strip{grid-template-columns:repeat(2,1fr)}
  .gallery,.gallery.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
  .departure-grid{grid-template-columns:auto 1fr}
  .footer-badges{grid-template-columns:repeat(2,1fr)}
  .footer-badges span:last-child{grid-column:1/-1}
}

@media(max-width:480px){
  .microbar{font-size:10px}
  .microbar .blink{display:none}
  .nav-strip{padding:5px}
  .nav-label{display:none}
  .motion-toggle{margin-left:0}
  .hero{min-height:210px}
  h1{font-size:48px;letter-spacing:-2px}
  .hero-badges span{font-size:10px}
  .static-spill-a{right:-150px}
  .title-flash{display:none}
  .page-title-row{grid-template-columns:1fr}
  .page-title-row h2{font-size:22px}
  .content{padding:7px}
  .leftbar,.rightbar{grid-template-columns:1fr}
  .gallery,.gallery.compact{grid-template-columns:1fr 1fr;gap:7px}
  .art-card{padding:4px;box-shadow:3px 3px 0 var(--purple-light)}
  .art-card .caption{font-size:10px}
  .home-widgets,.kitty-grid,.stuff-grid{grid-template-columns:1fr}
  .section-heading{display:block}
  .section-heading span{display:block;text-align:left}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .screen-grid{display:none}
}