/* WOLF.LOG // 001 - Main Stylesheet */

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --cyan:    #00bfff;
  --green:   #00ffaa;
  --orange:  #ff6a00;
  --bg:      #0a0a0f;
  --bg2:     #0f0f1a;
  --bg3:     #12121f;
  --text:    #c4c8d8;
  --text-dim:#7a7a90;
  --white:   #f0f0f5;
  --border:  #1e1e35;
}

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('fonts/oswald-300.ttf') format('truetype');
}
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/oswald-400.ttf') format('truetype');
}
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/oswald-600.ttf') format('truetype');
}
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/oswald-700.ttf') format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('fonts/roboto-300.ttf') format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/roboto-400.ttf') format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/roboto-700.ttf') format('truetype');
}
@font-face {
  font-family: 'Share Tech Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/share-tech-mono-400.ttf') format('truetype');
}

html {
  background: #1a1a2e;
}

body {
  font-family: 'Roboto', Arial, sans-serif;
  background: #1a1a2e;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 0 60px;
  gap: 20px;
}

/* ─── A4 PAGE ─────────────────────────────────────────── */

.page {
  width: 210mm;
  height: 297mm;
  background: var(--bg);
  position: relative;
  overflow: hidden;
  page-break-after: always;
  break-after: page;
  flex-shrink: 0;

  /* noise grain overlay */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E"),
    linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%);
}

/* shadow between pages in browser preview */
.page + .page {
  box-shadow: 0 -1px 0 rgba(0,191,255,0.08);
}

/* ─── COMMON INNER LAYOUT ─────────────────────────────── */

.page-inner {
  position: absolute;
  inset: 12mm;
  display: flex;
  flex-direction: column;
}

/* ─── HEADER / FOOTER (inner pages) ──────────────────── */

.pg-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 4mm;
  border-bottom: 1px solid var(--border);
  margin-bottom: 6mm;
  flex-shrink: 0;
}

.pg-header .logo-small {
  font-family: 'Oswald', Impact, sans-serif;
  font-size: 11pt;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: var(--cyan);
}

.pg-header .section-label {
  font-family: 'Share Tech Mono', 'Courier New', monospace;
  font-size: 7.5pt;
  color: var(--text-dim);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.pg-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 3mm;
  border-top: 1px solid var(--border);
  margin-top: auto;
  flex-shrink: 0;
}

.pg-footer .byline {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7pt;
  color: var(--text-dim);
  letter-spacing: 0.08em;
}

.pg-footer .pg-num {
  font-family: 'Oswald', sans-serif;
  font-size: 9pt;
  font-weight: 600;
  color: var(--cyan);
}

/* cyber accent line top */
.page::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity: 0.5;
}

/* left vertical accent bar */
.page .v-bar {
  position: absolute;
  left: 8mm;
  top: 18mm;
  bottom: 18mm;
  width: 2px;
  background: linear-gradient(180deg, transparent, var(--cyan) 20%, var(--cyan) 80%, transparent);
  opacity: 0.25;
}

/* ─── CONTENT AREA ────────────────────────────────────── */

.content {
  flex: 1;
  overflow: hidden;
  display: flex;
  gap: 6mm;
}

.col-main {
  flex: 1;
  min-width: 0;
}

.col-side {
  width: 48mm;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 4mm;
}

/* ─── TYPOGRAPHY ──────────────────────────────────────── */

.art-title {
  font-family: 'Oswald', Impact, Arial Black, sans-serif;
  font-size: 22pt;
  font-weight: 700;
  line-height: 1.1;
  color: var(--white);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-bottom: 3mm;
}

.art-title span.accent {
  color: var(--cyan);
}

.art-subtitle {
  font-family: 'Roboto', sans-serif;
  font-size: 9pt;
  color: var(--text-dim);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 5mm;
  padding-bottom: 3mm;
  border-bottom: 1px solid var(--border);
}

.art-lead {
  font-family: 'Roboto', sans-serif;
  font-size: 11pt;
  line-height: 1.68;
  color: #caced8;
  margin-bottom: 3.5mm;
  font-weight: 300;
}

.art-lead strong {
  color: var(--white);
  font-weight: 700;
}

p {
  font-family: 'Roboto', sans-serif;
  font-size: 9.5pt;
  line-height: 1.72;
  color: var(--text);
  margin-bottom: 2.5mm;
}

p strong, p b {
  color: var(--white);
  font-weight: 700;
}

h2 {
  font-family: 'Oswald', Impact, sans-serif;
  font-size: 12pt;
  font-weight: 600;
  color: var(--cyan);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 3mm 0 1.5mm;
  padding-bottom: 1mm;
  border-bottom: 1px solid rgba(0,191,255,0.2);
}

h3 {
  font-family: 'Oswald', sans-serif;
  font-size: 10pt;
  font-weight: 600;
  color: var(--white);
  letter-spacing: 0.06em;
  margin: 3mm 0 1.5mm;
}

ul, ol {
  padding-left: 5mm;
  margin-bottom: 3mm;
}

ul li, ol li {
  font-size: 9.5pt;
  line-height: 1.65;
  color: var(--text);
  margin-bottom: 0.5mm;
}

ul li::marker {
  color: var(--cyan);
}

/* ─── TERMINAL BOX ────────────────────────────────────── */

.terminal-box {
  background: #000;
  border: 1px solid var(--cyan);
  border-radius: 2px;
  padding: 3.5mm 4.5mm;
  font-family: 'Share Tech Mono', 'Courier New', monospace;
  font-size: 8pt;
  color: var(--green);
  line-height: 1.65;
  box-shadow:
    0 0 6px rgba(0,191,255,0.2),
    inset 0 0 20px rgba(0,0,0,0.8);
  position: relative;
  margin-bottom: 3mm;
}

.terminal-box::before {
  content: '● ● ●';
  position: absolute;
  top: 2mm;
  right: 3mm;
  font-size: 6pt;
  color: rgba(0,191,255,0.35);
  letter-spacing: 0.2em;
}

.terminal-box .prompt {
  color: var(--cyan);
}

.terminal-box .comment {
  color: var(--text-dim);
}

/* ─── QUOTE BLOCK ─────────────────────────────────────── */

.wolf-quote {
  border-left: 3px solid var(--cyan);
  padding: 2.5mm 4mm;
  margin: 2.5mm 0;
  background: rgba(0,191,255,0.04);
}

.wolf-quote p {
  font-family: 'Oswald', sans-serif;
  font-size: 11pt;
  font-weight: 400;
  color: var(--white);
  line-height: 1.5;
  font-style: italic;
  letter-spacing: 0.02em;
  margin: 0;
}

.wolf-quote .q-attr {
  font-size: 7.5pt;
  color: var(--cyan);
  font-family: 'Share Tech Mono', monospace;
  margin-top: 1.5mm;
  display: block;
  letter-spacing: 0.08em;
}

/* ─── COVER PAGE ──────────────────────────────────────── */

#page-cover {
  background-color: var(--bg);
}

#page-cover .cover-bg {
  position: absolute;
  inset: 0;
  background-image: url('images/cover.png');
  background-size: cover;
  background-position: center;
}

#page-cover .cover-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(0,0,0,0.45) 0%,
    rgba(10,10,30,0.20) 50%,
    rgba(0,0,0,0.55) 100%
  );
}

#page-cover .cover-content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  padding: 14mm 14mm 12mm;
}

#page-cover .cover-top-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 4mm;
  border-bottom: 1px solid rgba(0,191,255,0.3);
  margin-bottom: 0;
}

#page-cover .cover-issue-tag {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7.5pt;
  color: var(--cyan);
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

#page-cover .cover-date {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7.5pt;
  color: var(--text-dim);
  letter-spacing: 0.1em;
}

#page-cover .cover-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: 8mm;
}

#page-cover .cover-wolf-log {
  font-family: 'Oswald', Impact, sans-serif;
  font-size: 72pt;
  font-weight: 700;
  line-height: 0.9;
  color: var(--white);
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

#page-cover .cover-wolf-log span {
  color: var(--cyan);
  display: block;
}

#page-cover .cover-slash {
  font-family: 'Share Tech Mono', monospace;
  font-size: 18pt;
  color: rgba(0,191,255,0.6);
  letter-spacing: 0.3em;
  margin-top: 2mm;
  margin-bottom: 6mm;
}

#page-cover .cover-tagline {
  font-family: 'Roboto', sans-serif;
  font-size: 10pt;
  color: var(--text);
  font-weight: 300;
  line-height: 1.6;
  max-width: 120mm;
  font-style: italic;
}

#page-cover .cover-topics {
  display: flex;
  flex-direction: column;
  gap: 2mm;
  margin-top: 8mm;
}

#page-cover .cover-topic-item {
  display: flex;
  align-items: center;
  gap: 3mm;
}

#page-cover .cover-topic-item::before {
  content: '//';
  font-family: 'Share Tech Mono', monospace;
  font-size: 8pt;
  color: var(--cyan);
  opacity: 0.7;
}

#page-cover .cover-topic-item span {
  font-family: 'Roboto', sans-serif;
  font-size: 8.5pt;
  color: var(--text);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

#page-cover .cover-terminal {
  margin-top: auto;
  background: rgba(0,0,0,0.8);
  border: 1px solid rgba(0,191,255,0.4);
  padding: 4mm 5mm;
  font-family: 'Share Tech Mono', monospace;
  font-size: 8.5pt;
  color: var(--green);
  line-height: 1.8;
  box-shadow: 0 0 15px rgba(0,191,255,0.15);
}

#page-cover .cover-terminal .t-prompt { color: var(--cyan); }
#page-cover .cover-terminal .t-dim    { color: var(--text-dim); }

#page-cover .cover-footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-top: 4mm;
  margin-top: 4mm;
  border-top: 1px solid rgba(0,191,255,0.2);
}

#page-cover .cover-footer .cf-brand {
  font-family: 'Oswald', sans-serif;
  font-size: 8pt;
  color: var(--text-dim);
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

#page-cover .cover-footer .cf-free {
  font-family: 'Share Tech Mono', monospace;
  font-size: 8pt;
  color: var(--cyan);
  letter-spacing: 0.1em;
}

/* ─── EDITORIAL PAGE ──────────────────────────────────── */

.editorial-drop {
  font-family: 'Oswald', Impact, sans-serif;
  font-size: 80pt;
  font-weight: 700;
  color: var(--cyan);
  opacity: 0.08;
  line-height: 1;
  position: absolute;
  right: 10mm;
  top: 25mm;
  letter-spacing: -0.02em;
  z-index: 0;
  pointer-events: none;
}

.editorial-content {
  position: relative;
  z-index: 1;
}

/* ─── ARTICLE HEADER BAND ─────────────────────────────── */

.art-header-band {
  background: linear-gradient(90deg, rgba(0,191,255,0.12) 0%, transparent 100%);
  border-left: 4px solid var(--cyan);
  padding: 4mm 5mm;
  margin-bottom: 5mm;
}

.art-header-band .art-num {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7.5pt;
  color: var(--cyan);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 1mm;
}

.art-header-band .art-title {
  margin-bottom: 0;
}

/* ─── SIDEBAR ELEMENTS ────────────────────────────────── */

.side-stat {
  background: var(--bg3);
  border: 1px solid var(--border);
  border-top: 2px solid var(--cyan);
  padding: 3mm 4mm;
}

.side-stat .stat-num {
  font-family: 'Oswald', sans-serif;
  font-size: 22pt;
  font-weight: 700;
  color: var(--cyan);
  line-height: 1;
  display: block;
}

.side-stat .stat-label {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7pt;
  color: var(--text-dim);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  display: block;
  margin-top: 1mm;
}

.side-box {
  background: var(--bg3);
  border: 1px solid var(--border);
  padding: 3mm 4mm;
}

.side-box .sb-title {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7.5pt;
  color: var(--cyan);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 2mm;
  padding-bottom: 1.5mm;
  border-bottom: 1px solid var(--border);
}

.side-box p {
  font-size: 8pt;
  line-height: 1.6;
  color: var(--text-dim);
}

/* ─── KODEКС LIST ─────────────────────────────────────── */

.codex-list {
  list-style: none;
  padding: 0;
  margin: 3mm 0;
}

.codex-list li {
  display: flex;
  align-items: flex-start;
  gap: 3mm;
  padding: 1.3mm 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 9.5pt;
  line-height: 1.5;
  color: var(--text);
}

.codex-list li::before {
  content: '→';
  font-family: 'Share Tech Mono', monospace;
  color: var(--cyan);
  font-size: 9pt;
  flex-shrink: 0;
  margin-top: 0.5mm;
}

/* ─── SPEC TABLE (XE9680) ─────────────────────────────── */

.spec-table {
  width: 100%;
  border-collapse: collapse;
  margin: 3mm 0;
  font-size: 8.5pt;
}

.spec-table th {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7.5pt;
  color: var(--cyan);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  text-align: left;
  padding: 2mm 3mm;
  border-bottom: 1px solid rgba(0,191,255,0.3);
  background: rgba(0,191,255,0.06);
}

.spec-table td {
  padding: 2mm 3mm;
  color: var(--text);
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  line-height: 1.5;
}

.spec-table tr:last-child td {
  border-bottom: none;
}

.spec-table td:first-child {
  color: var(--text-dim);
  font-family: 'Share Tech Mono', monospace;
  font-size: 8pt;
  white-space: nowrap;
}

/* ─── RULES LIST (numbered) ───────────────────────────── */

.rules-list {
  list-style: none;
  padding: 0;
  counter-reset: rules;
}

.rules-list li {
  counter-increment: rules;
  display: flex;
  gap: 4mm;
  align-items: flex-start;
  padding: 2.5mm 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 9pt;
  line-height: 1.6;
  color: var(--text);
}

.rules-list li::before {
  content: counter(rules, decimal-leading-zero);
  font-family: 'Oswald', sans-serif;
  font-size: 16pt;
  font-weight: 700;
  color: rgba(0,191,255,0.2);
  line-height: 1;
  flex-shrink: 0;
  width: 9mm;
}

/* ─── TWO COLUMN TEXT ─────────────────────────────────── */

.two-col {
  column-count: 2;
  column-gap: 6mm;
  column-rule: 1px solid var(--border);
}

.two-col p {
  font-size: 8.5pt;
  line-height: 1.7;
}

/* ─── IMAGE FULL ──────────────────────────────────────── */

.img-full {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.img-caption {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7.5pt;
  color: var(--text-dim);
  letter-spacing: 0.08em;
  margin-top: 2mm;
  text-align: center;
}

/* ─── GALLERY PAGE ────────────────────────────────────── */

#page-gallery {
  background: #000;
}

#page-gallery .gallery-bg {
  position: absolute;
  inset: 0;
  background-image: url('images/wolf-art.png');
  background-size: cover;
  background-position: center top;
}

#page-gallery .gallery-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    transparent 50%,
    rgba(0,0,0,0.95) 100%
  );
}

#page-gallery .gallery-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 8mm 14mm;
}

#page-gallery .gc-title {
  font-family: 'Oswald', Impact, sans-serif;
  font-size: 24pt;
  font-weight: 700;
  color: var(--white);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 2mm;
}

#page-gallery .gc-sub {
  font-family: 'Share Tech Mono', monospace;
  font-size: 9pt;
  color: var(--cyan);
  letter-spacing: 0.15em;
}

#page-gallery .gc-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 4mm;
  padding-top: 3mm;
  border-top: 1px solid rgba(0,191,255,0.3);
}

#page-gallery .gc-footer span {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7.5pt;
  color: var(--text-dim);
}

/* ─── FINAL TERMINAL PAGE ─────────────────────────────── */

#page-final {
  background: #000;
}

#page-final .final-scan {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0,191,255,0.015) 2px,
    rgba(0,191,255,0.015) 4px
  );
  pointer-events: none;
}

#page-final .final-content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 14mm;
  gap: 6mm;
}

#page-final .final-logo {
  font-family: 'Oswald', Impact, sans-serif;
  font-size: 42pt;
  font-weight: 700;
  color: var(--cyan);
  letter-spacing: 0.1em;
  text-align: center;
  text-shadow: 0 0 20px rgba(0,191,255,0.5);
}

#page-final .final-issue {
  font-family: 'Share Tech Mono', monospace;
  font-size: 10pt;
  color: var(--text-dim);
  letter-spacing: 0.3em;
  text-align: center;
}

#page-final .final-terminal {
  width: 100%;
  max-width: 150mm;
  background: rgba(0,0,0,0.9);
  border: 1px solid var(--cyan);
  padding: 6mm 7mm;
  font-family: 'Share Tech Mono', monospace;
  font-size: 9pt;
  color: var(--green);
  line-height: 2;
  box-shadow: 0 0 30px rgba(0,191,255,0.2);
}

#page-final .final-terminal .t-prompt { color: var(--cyan); }
#page-final .final-terminal .t-dim    { color: var(--text-dim); }
#page-final .final-terminal .t-output { color: var(--green); }

#page-final .final-divider {
  width: 80mm;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity: 0.4;
}

#page-final .final-footer-text {
  font-family: 'Share Tech Mono', monospace;
  font-size: 8pt;
  color: var(--text-dim);
  letter-spacing: 0.15em;
  text-align: center;
  line-height: 1.8;
}

#page-final .final-footer-text span {
  color: var(--cyan);
}

/* ─── WATERMARK ───────────────────────────────────────── */

.watermark {
  position: absolute;
  bottom: 15mm;
  right: 12mm;
  width: 22mm;
  opacity: 0.2;
  pointer-events: none;
  z-index: 10;
}

/* ─── OSINT PAGE SPECIFICS ────────────────────────────── */

.scan-line {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7pt;
  color: rgba(0,191,255,0.15);
  letter-spacing: 0.05em;
  line-height: 1.3;
  overflow: hidden;
  max-height: 8mm;
  margin-bottom: 3mm;
}

/* ─── WOLF CODE PAGE ──────────────────────────────────── */

.code-section {
  background: #000;
  border: 1px solid rgba(0,255,170,0.3);
  padding: 5mm 6mm;
  margin-bottom: 4mm;
}

.code-section .cs-header {
  font-family: 'Share Tech Mono', monospace;
  font-size: 8pt;
  color: var(--green);
  letter-spacing: 0.15em;
  display: block;
  padding-bottom: 2mm;
  margin-bottom: 3mm;
  border-bottom: 1px solid rgba(0,255,170,0.2);
}

.code-section pre {
  font-family: 'Share Tech Mono', monospace;
  font-size: 8pt;
  color: var(--green);
  line-height: 1.8;
  white-space: pre-wrap;
  word-break: break-all;
}

.code-section pre .kw  { color: var(--cyan); }
.code-section pre .cm  { color: var(--text-dim); font-style: italic; }
.code-section pre .st  { color: #ffd700; }
.code-section pre .nm  { color: var(--orange); }

/* ─── DIVIDER ─────────────────────────────────────────── */

.cyber-divider {
  display: flex;
  align-items: center;
  gap: 3mm;
  margin: 4mm 0;
}

.cyber-divider::before,
.cyber-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--border));
}

.cyber-divider::before {
  background: linear-gradient(90deg, var(--border), transparent);
}

.cyber-divider span {
  font-family: 'Share Tech Mono', monospace;
  font-size: 7pt;
  color: rgba(0,191,255,0.4);
  letter-spacing: 0.2em;
}

/* ─── MOBILE ──────────────────────────────────────────── */

@media screen and (max-width: 820px) {
  body {
    padding: 8px 0;
    gap: 8px;
    align-items: stretch;
    overflow-x: hidden;
  }

  .page {
    width: 100vw;
    height: auto;
    min-height: 141vw;
  }

  .page::before {
    height: 3px;
  }

  .page .v-bar {
    display: none;
  }

  .page-inner {
    position: static;
    padding: 14px 14px 10px;
    min-height: 141vw;
    display: flex;
    flex-direction: column;
  }

  .pg-header {
    padding-bottom: 8px;
    margin-bottom: 10px;
  }

  .pg-header .logo-small {
    font-size: 9pt;
  }

  .content {
    flex-direction: column;
    overflow: visible;
    gap: 12px;
  }

  .col-side {
    width: 100%;
  }

  /* Cover */
  #page-cover .cover-content {
    padding: 14px;
  }

  #page-cover .cover-top-bar {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  #page-cover .cover-issue-tag {
    font-size: 2.5vw;
  }

  #page-cover .cover-main {
    flex: 1;
  }

  #page-cover .cover-footer {
    flex-direction: column;
    gap: 4px;
  }

  /* Typography */
  .art-title {
    font-size: 9vw;
  }

  .art-lead {
    font-size: 4vw;
    line-height: 1.6;
  }

  h2 {
    font-size: 4.5vw;
    margin: 8px 0 4px;
  }

  p, ul li, ol li {
    font-size: 3.8vw;
    line-height: 1.65;
  }

  .art-subtitle {
    font-size: 3vw;
  }

  .art-header-band {
    padding: 3vw;
    margin-bottom: 4vw;
  }

  .art-header-band .art-num {
    font-size: 2.5vw;
  }

  /* Terminal */
  .terminal-box {
    font-size: 3vw;
    padding: 3vw;
  }

  /* Sidebar stats */
  .side-stat {
    padding: 8px 10px;
  }

  .side-stat .stat-num {
    font-size: 9vw;
  }

  .side-stat .stat-label {
    font-size: 2.8vw;
  }

  .side-box p {
    font-size: 3.5vw;
  }

  .side-box .sb-title {
    font-size: 3vw;
  }

  /* Quote */
  .wolf-quote p {
    font-size: 4vw;
  }

  .wolf-quote .q-attr {
    font-size: 3vw;
  }

  /* Code */
  .code-section pre {
    font-size: 3vw;
    white-space: pre-wrap;
  }

  .code-section .cs-header {
    font-size: 3vw;
  }

  /* Spec table */
  .spec-table {
    font-size: 3.5vw;
  }

  .spec-table th, .spec-table td {
    padding: 2vw;
    font-size: 3vw;
  }

  /* Gallery */
  #page-gallery {
    min-height: 141vw;
  }

  #page-gallery .gc-title {
    font-size: 8vw;
  }

  #page-gallery .gc-sub {
    font-size: 3.5vw;
  }

  #page-gallery .gc-footer {
    flex-direction: column;
    gap: 4px;
  }

  #page-gallery .gc-footer span {
    font-size: 3vw;
  }

  /* Final page */
  #page-final .final-content {
    position: static;
    min-height: 141vw;
    padding: 14px;
    gap: 14px;
  }

  #page-final .final-logo {
    font-size: 11vw;
  }

  #page-final .final-issue {
    font-size: 3.5vw;
    letter-spacing: 0.15em;
  }

  #page-final .final-terminal {
    max-width: 100%;
    font-size: 3.5vw;
    padding: 4vw;
    line-height: 1.8;
  }

  #page-final .final-footer-text {
    font-size: 3vw;
    letter-spacing: 0.08em;
  }

  /* Watermark */
  .watermark {
    width: 12vw;
    bottom: 10px;
    right: 10px;
  }

  /* Scan line OSINT */
  .scan-line {
    font-size: 2.5vw;
    max-height: none;
  }

  /* Codex list */
  .codex-list li {
    font-size: 3.8vw;
  }

  /* Editorial drop letter */
  .editorial-drop {
    font-size: 25vw;
    right: 0;
    top: 10vw;
  }
}