@import url("../../style.css");

body.admin-bar .terminal-rig { padding-top: 32px; }

.terminal-rig {
  width: min(1180px, 96vw);
  margin: 0 auto;
  padding: 24px 0 40px;
}
.terminal-chassis {
  position: relative;
  background: linear-gradient(145deg, #1a1f1d, #0b0e0d);
  border: 1px solid #39423d;
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 28px 80px var(--cwa-shadow), inset 0 1px 0 rgba(255,255,255,.05);
}
.terminal-screw {
  position:absolute; width:10px; height:10px; border-radius:50%;
  background: radial-gradient(circle at 35% 35%, #798079 0 10%, #2e3430 35%, #0a0c0b 70%);
  box-shadow: inset 0 0 0 1px #050606;
}
.screw-tl{top:9px;left:10px}.screw-tr{top:9px;right:10px}.screw-bl{bottom:9px;left:10px}.screw-br{bottom:9px;right:10px}

.terminal-header,.terminal-footer {
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  color:#cfc8a7; letter-spacing:.08em;
}
.terminal-header { padding: 2px 8px 16px; }
.terminal-title { font-size: clamp(.9rem, 2vw, 1.1rem); font-weight:700; }
.terminal-subtitle { color:#7f8a81; font-size:.72rem; margin-top:4px; }
.sound-toggle,.terminal-button {
  border:1px solid #626b65; background:#0c100e; color:#ddd0a3; font:inherit;
  padding:8px 10px; cursor:pointer; border-radius:4px;
}
.sound-toggle:focus-visible,.terminal-button:focus-visible,a:focus-visible,input:focus-visible {
  outline: 2px solid var(--cwa-accent); outline-offset:3px;
}
.terminal-layout { display:grid; grid-template-columns:minmax(0,1fr) 118px; gap:14px; }
.crt-shell {
  background:#030404; border:8px solid #222825; border-radius:18px;
  box-shadow: inset 0 0 0 2px #060706, inset 0 0 40px #000; min-width:0;
}
.crt-screen {
  position:relative; min-height:670px; border-radius:9px; overflow:hidden;
  background: radial-gradient(ellipse at center, rgba(42,64,49,.28) 0%, rgba(3,12,8,.72) 65%, #020504 100%), var(--cwa-screen);
  box-shadow: inset 0 0 60px rgba(0,0,0,.78), inset 0 0 8px rgba(241,215,138,.1);
  padding: clamp(18px, 3vw, 34px);
}
.scanlines {
  pointer-events:none; position:absolute; inset:0; z-index:8; opacity:.18;
  background:repeating-linear-gradient(to bottom,rgba(255,255,255,.04) 0,rgba(255,255,255,.04) 1px,transparent 1px,transparent 4px);
  mix-blend-mode:overlay;
}
.crt-screen::after {
  content:""; pointer-events:none; position:absolute; inset:0; z-index:7;
  background:radial-gradient(ellipse at center,transparent 58%,rgba(0,0,0,.4) 100%);
}
.terminal-brand,.terminal-content,.terminal-console { position:relative; z-index:10; }
.terminal-brand {
  display:flex; align-items:center; gap:15px; padding-bottom:16px; margin-bottom:18px;
  border-bottom:1px dashed var(--cwa-line); font-size:.78rem; line-height:1.45; letter-spacing:.06em;
}
.terminal-logo-wrap { width:60px; flex:0 0 60px; }
.terminal-logo-wrap:empty { display:none; }
.terminal-logo-wrap img { max-height:58px; width:auto; }

.terminal-content { min-height:390px; text-shadow:0 0 7px rgba(240,215,138,.18); }
.terminal-content h1,.terminal-content h2,.terminal-content h3 { color:#f4dfa1; letter-spacing:.05em; }
.terminal-content h1 { font-size:clamp(1.35rem,4vw,2rem); margin:.25em 0 .6em; }
.terminal-content h2 { font-size:1.05rem; margin-top:1.6em; }
.terminal-content p,.terminal-content li { line-height:1.7; }
.terminal-content a { color:#ffd889; text-decoration-thickness:1px; text-underline-offset:3px; }
.terminal-kicker { color:var(--cwa-accent); font-size:.8rem; letter-spacing:.1em; font-weight:700; }
.terminal-dim { color:var(--cwa-dim); }
.terminal-rule { border-top:1px dashed var(--cwa-line); margin:0 0 22px; }

.terminal-menu { list-style:none; margin:22px 0 26px; padding:0; max-width:650px; }
.terminal-menu li { margin:2px 0; }
.terminal-menu-item {
  display:block; padding:8px 10px; color:var(--cwa-text); text-decoration:none;
  border:1px solid transparent; transition:background .08s linear,border-color .08s linear;
}
.terminal-menu-item:hover,.terminal-menu-item.is-selected {
  color:#fff0bd; background:rgba(213,59,53,.12); border-color:rgba(213,59,53,.45);
}
.menu-number { color:var(--cwa-accent); font-weight:700; }
.terminal-home-content { border-top:1px dotted #29342d; padding-top:16px; color:#c8bd92; }

.terminal-console { border-top:1px dashed var(--cwa-line); margin-top:24px; padding-top:15px; }
.terminal-transcript { font-size:.84rem; color:#bcb18b; max-height:140px; overflow:auto; }
.terminal-transcript-line { margin:3px 0; white-space:pre-wrap; }
.terminal-transcript-line.command { color:#ebd493; }
.terminal-transcript-line.error { color:#ff8e87; }
.terminal-command-form { display:flex; align-items:center; gap:8px; margin-top:7px; }
.prompt-label { font-weight:700; color:#f0d78a; }
#terminal-command {
  flex:1; min-width:0; border:0; outline:0; background:transparent; color:#fff0bd;
  font:inherit; caret-color:transparent; padding:4px 0;
}
.terminal-cursor { animation:terminalBlink 1s steps(1,end) infinite; }

.modem-panel {
  background:linear-gradient(180deg,#171c19,#090c0a); border:1px solid #3b463f;
  border-radius:10px; padding:16px 14px; box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  color:#b3baaf; min-height:420px;
}
.modem-model { font-size:.72rem; text-align:center; letter-spacing:.12em; color:#d2d5ce; }
.modem-divider { height:1px; background:#303a34; margin:14px 0; }
.modem-row { display:flex; justify-content:space-between; align-items:center; margin:13px 0; font-size:.78rem; }
.led {
  width:13px; height:13px; border-radius:50%; background:var(--cwa-led-off);
  border:1px solid #465047; box-shadow:inset 0 0 4px #000;
}
.led.is-on {
  background:var(--cwa-led-on);
  box-shadow:0 0 5px rgba(217,255,117,.8),0 0 12px rgba(217,255,117,.3),inset 0 0 2px #fff;
}
.led-tx.is-on,.led-rx.is-on { background:#ffb14a; box-shadow:0 0 8px rgba(255,177,74,.7); }
.led-dtr.is-on,.led-dsr.is-on { background:#65d5ff; box-shadow:0 0 8px rgba(101,213,255,.65); }
.modem-readout { display:flex; flex-direction:column; align-items:center; gap:4px; font-size:.68rem; color:#879188; }
.modem-link { margin-top:24px; padding:10px 4px; border:1px solid #303a34; text-align:center; font-size:.7rem; letter-spacing:.08em; }
.modem-link strong { color:#cde77f; }
.terminal-footer { padding:13px 7px 0; font-size:.67rem; flex-wrap:wrap; justify-content:flex-start; }
.footer-status { margin-left:auto; color:#9aa59b; }

.boot-screen {
  position:fixed; inset:0; z-index:99999; display:grid; place-items:center; background:#030504;
  color:var(--cwa-text); padding:24px;
}
.boot-screen[hidden] { display:none!important; }
.boot-screen-inner { width:min(720px,96vw); border:1px solid #435046; padding:26px; background:#07100c; box-shadow:0 0 70px #000; }
.boot-screen pre { min-height:250px; white-space:pre-wrap; font:inherit; line-height:1.55; }
.boot-logo img { max-height:110px; width:auto; image-rendering:pixelated; margin-bottom:12px; }

.terminal-post-row { display:grid; grid-template-columns:110px 1fr; gap:20px; padding:18px 0; border-bottom:1px dotted #344139; }
.terminal-post-row h2 { margin:0 0 8px; }
.post-date { color:var(--cwa-accent); font-weight:700; }
.terminal-button-link { display:inline-block; padding:8px 10px; border:1px solid #59645d; text-decoration:none; }

/* Gutenberg image treatments */
.wp-block-image.is-style-pixel-art img,.is-style-pixel-art img {
  image-rendering:pixelated; image-rendering:crisp-edges; border:2px solid #464f49;
  box-shadow:0 0 0 4px #0a0d0b,0 0 20px rgba(240,215,138,.12);
}
.wp-block-image.is-style-terminal-graphic,.is-style-terminal-graphic {
  padding:10px; border:1px dashed #59655d; background:#050907;
}
.wp-block-image.is-style-terminal-graphic img,.is-style-terminal-graphic img {
  filter:sepia(.65) saturate(.85) contrast(1.2) brightness(.9);
}
.wp-block-image.is-style-crt-photo,.is-style-crt-photo {
  position:relative; display:block; padding:7px; border:1px solid #455049; background:#050807;
}
.wp-block-image.is-style-crt-photo img,.is-style-crt-photo img {
  filter:grayscale(.25) sepia(.45) contrast(1.08) brightness(.86);
}
.wp-block-image.is-style-crt-photo::after,.is-style-crt-photo::after {
  content:""; position:absolute; pointer-events:none; inset:7px;
  background:repeating-linear-gradient(to bottom,rgba(255,255,255,.035) 0,rgba(255,255,255,.035) 1px,transparent 1px,transparent 3px);
}
@keyframes terminalBlink { 0%,49%{opacity:1}50%,100%{opacity:0} }

@media (max-width:760px) {
  body.admin-bar .terminal-rig { padding-top:46px; }
  .terminal-rig { width:100%; padding:0; }
  .terminal-chassis { border-radius:0; padding:10px; min-height:100vh; }
  .terminal-header { align-items:flex-start; }
  .terminal-subtitle { display:none; }
  .sound-toggle { padding:7px 8px; font-size:.7rem; }
  .terminal-layout { grid-template-columns:1fr; }
  .crt-shell { border-width:5px; border-radius:10px; }
  .crt-screen { min-height:70vh; padding:18px 14px; }
  .terminal-brand { font-size:.68rem; }
  .terminal-logo-wrap { width:44px; flex-basis:44px; }
  .terminal-menu-item { padding:11px 8px; }
  .modem-panel {
    min-height:0; display:grid; grid-template-columns:repeat(7,1fr);
    gap:6px; padding:10px; align-items:center;
  }
  .modem-model,.modem-divider,.modem-readout,.modem-link { display:none; }
  .modem-row { flex-direction:column; gap:5px; margin:0; font-size:.62rem; }
  .terminal-footer { display:none; }
  .terminal-post-row { grid-template-columns:1fr; gap:4px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; }
  .scanlines { opacity:.08; }
  .terminal-cursor { opacity:1; }
}
