/*
Theme Name: MV-WP MAX
Theme URI: https://example.invalid/mv-wp-max
Author: MicroMeta
Description: The v0.1 WordPress host for the MicroMeta MAX runtime and cartridge system.
Version: 0.1.0
Requires at least: 6.4
Requires PHP: 8.1
Text Domain: mv-wp-max
License: All rights reserved
*/

:root {
  --max-field: #030806;
  --max-surface: #07110c;
  --max-signal: #7dffba;
  --max-text: #e9fff2;
  --max-muted: #a2baab;
  --max-line: #28533b;
  --max-question: #ffd479;
  --max-error: #ff9a9a;
  color-scheme: dark;
  font-family: Roboto, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html { background: var(--max-field); }

body {
  margin: 0;
  background: var(--max-field);
  color: var(--max-text);
  font-size: 1rem;
  line-height: 1.6;
}

a { color: var(--max-signal); }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--max-signal);
  outline-offset: 3px;
}

.max-skip-link {
  position: fixed;
  z-index: 100000;
  top: .75rem;
  left: .75rem;
  padding: .65rem .85rem;
  border: 2px solid var(--max-signal);
  background: var(--max-field);
  color: var(--max-text);
  transform: translateY(-200%);
}

.max-skip-link:focus { transform: translateY(0); }

.max-shell { min-height: 100vh; }

.max-header,
.max-footer,
.max-region {
  padding: clamp(1rem, 3vw, 2rem);
}

.max-header,
.max-footer { border-color: var(--max-line); }
.max-header { border-bottom: 1px solid var(--max-line); }
.max-footer { border-top: 1px solid var(--max-line); color: var(--max-muted); }
.max-runtime-inspector { margin-top: .75rem; }
.max-runtime-inspector summary { cursor: pointer; color: var(--max-signal); }
.max-runtime-inspector dt { margin-top: .5rem; color: var(--max-muted); font-size: .8rem; text-transform: uppercase; }
.max-runtime-inspector dd { margin-left: 0; }

.max-refresh-notice {
  max-width: 48rem;
  margin-top: 1rem;
  padding: .75rem 1rem;
  border: 1px solid var(--max-line);
  color: var(--max-text);
}

.max-refresh-notice p { margin: .25rem 0; }

.max-refresh-check {
  min-width: 3rem;
  min-height: 2.75rem;
  margin-right: .75rem;
  padding: .45rem .7rem;
  border: 1px solid var(--max-line);
  border-radius: 0;
  background: var(--max-surface);
  color: var(--max-signal);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.max-brand {
  margin: 0;
  font-size: clamp(1.3rem, 4vw, 2rem);
  letter-spacing: .08em;
}

.max-status { margin: .25rem 0 0; color: var(--max-muted); }

.max-audio-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem 1rem;
  margin-top: .75rem;
  color: var(--max-muted);
}

.max-haptic-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem 1rem;
  margin-top: .5rem;
  color: var(--max-muted);
}

.max-audio-controls button {
  min-width: 3rem;
  min-height: 2.75rem;
  padding: .45rem .7rem;
  border: 1px solid var(--max-line);
  border-radius: 0;
  background: var(--max-surface);
  color: var(--max-signal);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.max-haptic-controls button {
  min-width: 3rem;
  min-height: 2.75rem;
  padding: .45rem .7rem;
  border: 1px solid var(--max-line);
  border-radius: 0;
  background: var(--max-surface);
  color: var(--max-signal);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.max-semantic-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem 1rem;
  margin-top: .75rem;
  padding-top: .75rem;
  border-top: 1px solid var(--max-line);
}

.max-semantic-controls p { flex: 1 0 100%; margin: 0; color: var(--max-muted); }

.max-semantic-controls button {
  min-width: 3rem;
  min-height: 2.75rem;
  padding: .45rem .7rem;
  border: 1px solid var(--max-line);
  border-radius: 0;
  background: var(--max-surface);
  color: var(--max-signal);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.max-semantic-controls button[aria-pressed="true"] { border-width: 2px; }

.max-audio-controls label { display: inline-flex; align-items: center; gap: .5rem; }
.max-audio-controls input[type="range"] { min-width: 8rem; min-height: 2.75rem; }

.max-terminal {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.max-region { min-width: 0; border-right: 1px solid var(--max-line); }
.max-region:last-child { border-right: 0; }
.max-region h2 { margin-top: 0; color: var(--max-signal); font-size: 1rem; letter-spacing: .08em; }
.max-region h3 { font-size: clamp(1.5rem, 4vw, 2.5rem); line-height: 1.08; }
.max-region blockquote { margin-inline: 0; padding-left: 1rem; border-left: 2px solid var(--max-signal); }
.max-classification { color: var(--max-muted); font-size: .8rem; letter-spacing: .12em; }
.max-region dt { margin-top: .75rem; color: var(--max-muted); font-size: .8rem; text-transform: uppercase; }
.max-region dd { margin-left: 0; overflow-wrap: anywhere; }
.max-region summary { cursor: pointer; color: var(--max-signal); }

.max-reader-controls {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  align-items: flex-start;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--max-line);
}

.max-reader-control,
.max-reader-control-panel > summary {
  display: inline-block;
  min-width: 3rem;
  min-height: 2.75rem;
  padding: .45rem .7rem;
  border: 1px solid var(--max-line);
  color: var(--max-signal);
  font-weight: 700;
  letter-spacing: .08em;
  text-decoration: none;
}

.max-reader-control-panel { flex-basis: auto; }
.max-reader-control-panel[open] { flex-basis: 100%; }
.max-reader-control-panel[open] > summary { margin-bottom: .75rem; }

/* Cartridge 001 journey profile. Copy remains in journey/story data; these
   rules only express the terminal state and interaction hierarchy. */
.salemscroll-main { min-height: 60vh; }
.salemscroll-wire,
.salemscroll-story-header,
.salemscroll-scripture > header,
.salemscroll-provenance,
.salemscroll-hold { padding: clamp(1rem, 3vw, 2rem); }
.salemscroll-wire { max-width: 76rem; margin-inline: auto; }
.salemscroll-wire > header { border-bottom: 1px solid var(--max-line); }
.salemscroll-headlines { margin: 0; padding: 0; list-style: none; }
.salemscroll-headline {
  position: relative;
  display: grid;
  grid-template-columns: 1.5rem minmax(0, 1fr);
  gap: 0 1rem;
  padding: 1.25rem;
  border: 1px solid transparent;
  border-left: .4rem solid transparent;
}
.salemscroll-headline > *:not(.salemscroll-selection-marker) { grid-column: 2; }
.salemscroll-headline h2 { margin-block: .25rem; font-size: clamp(1.25rem, 3vw, 2.2rem); line-height: 1.15; }
.salemscroll-headline.is-active {
  border-color: var(--max-line);
  border-left-color: var(--max-signal);
  background: var(--max-surface);
}
.salemscroll-selection-marker { grid-column: 1; grid-row: 1 / span 5; font-weight: 900; color: var(--max-signal); }
.salemscroll-selected-label { font-size: .75rem; font-weight: 800; letter-spacing: .12em; }
.salemscroll-headline:not(.is-active) .salemscroll-selection-marker,
.salemscroll-headline:not(.is-active) .salemscroll-selected-label { visibility: hidden; }
.salemscroll-story { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.salemscroll-story-header { grid-column: 1 / -1; border-bottom: 1px solid var(--max-line); }
.salemscroll-story-header h1 { max-width: 24ch; font-size: clamp(1.8rem, 5vw, 4rem); line-height: 1.02; }
.salemscroll-dispatch { border-right: 1px solid var(--max-line); }
.salemscroll-dateline { letter-spacing: .08em; }
.salemscroll-provenance { margin: 1rem 0 0; border: 1px solid var(--max-line); background: var(--max-surface); }
.salemscroll-provenance dt,
.salemscroll-max-panel dt { color: var(--max-muted); font-size: .75rem; text-transform: uppercase; }
.salemscroll-provenance dd,
.salemscroll-max-panel dd { margin: 0 0 .6rem; }
.salemscroll-command-grid { display: grid; gap: .65rem; }
.salemscroll-max-panel { border: 1px solid var(--max-line); background: var(--max-surface); }
.salemscroll-max-panel > summary,
.salemscroll-help > summary {
  min-height: 2.75rem;
  padding: .7rem;
  cursor: pointer;
  color: var(--max-signal);
  font-weight: 800;
}
.salemscroll-max-panel[open] { border-left: .35rem solid var(--max-signal); }
.salemscroll-max-panel > :not(summary),
.salemscroll-help > :not(summary) { margin-inline: 1rem; }
.salemscroll-terminal-controls { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
.salemscroll-terminal-controls .max-reader-control,
.salemscroll-terminal-controls .salemscroll-help { background: var(--max-surface); font: inherit; }
.salemscroll-terminal-controls button { cursor: pointer; }
kbd {
  display: inline-block;
  min-width: 1.65rem;
  padding: .05rem .3rem;
  border: 1px solid currentColor;
  background: var(--max-field);
  color: var(--max-text);
  font: inherit;
  text-align: center;
}
.salemscroll-scripture { max-width: 58rem; margin-inline: auto; padding-bottom: 2rem; }
.salemscroll-scripture .max-region { border: 0; border-top: 1px solid var(--max-line); }
.salemscroll-scripture sup { color: var(--max-signal); font-weight: 800; }

/* SC1.4 is a visual projection over complete server HTML. The source node
   remains intact for assistive technology while the aria-hidden overlay runs. */
.salemscroll-teletype-skip {
  min-width: 3rem;
  min-height: 2.75rem;
  margin: .75rem clamp(1rem, 3vw, 2rem) 0;
  padding: .45rem .7rem;
  border: 1px solid var(--max-line);
  border-radius: 0;
  background: var(--max-surface);
  color: var(--max-signal);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

[data-salem-reveal].is-salem-revealing {
  position: relative;
  color: transparent !important;
  text-shadow: none !important;
}

[data-salem-reveal].is-salem-revealing > *:not(.salemscroll-teletype-overlay) {
  color: transparent !important;
}

.salemscroll-teletype-overlay {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  overflow: hidden;
  color: var(--max-text) !important;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  pointer-events: none;
  white-space: pre-wrap;
}

.max-status > .salemscroll-teletype-overlay,
.salemscroll-dateline > .salemscroll-teletype-overlay { color: var(--max-muted) !important; }

.salemscroll-shell[data-salem-terminal-state="SELECTED_HEADLINE"] .salemscroll-headline.is-active,
.salemscroll-shell[data-salem-terminal-state="MAX"] .salemscroll-max-panel[open] {
  box-shadow: inset .2rem 0 0 var(--max-signal);
}

.salemscroll-shell[data-salem-terminal-state="DISPATCH"] .salemscroll-dispatch,
.salemscroll-shell[data-salem-terminal-state="SCRIPTURE"] .salemscroll-scripture,
.salemscroll-shell[data-salem-terminal-state="RETURN"] .salemscroll-wire {
  outline: 1px solid var(--max-line);
  outline-offset: -1px;
}

@media (max-width: 54rem) {
  .salemscroll-story { grid-template-columns: 1fr; }
  .salemscroll-dispatch { border-right: 0; border-bottom: 1px solid var(--max-line); }
}

@media (forced-colors: active) {
  .salemscroll-headline.is-active,
  .salemscroll-max-panel[open] { border: 3px solid CanvasText; }

  [data-salem-reveal].is-salem-revealing,
  [data-salem-reveal].is-salem-revealing > * { color: CanvasText !important; }
  .salemscroll-teletype-overlay { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .salemscroll-shell *,
  .salemscroll-shell *::before,
  .salemscroll-shell *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation: none !important; }

  [data-salem-reveal].is-salem-revealing,
  [data-salem-reveal].is-salem-revealing > * { color: inherit !important; }
  .salemscroll-teletype-overlay { display: none !important; }
}

.max-field-surface {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  min-height: 16rem;
  padding: clamp(1rem, 3vw, 2rem);
  border-top: 1px solid var(--max-line);
  background: radial-gradient(circle at 82% 50%, rgba(125, 255, 186, .06), transparent 24rem);
  cursor: crosshair;
  transition: background-color .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.max-field-surface > *:not(.max-victor-field):not(.max-victor-pixel-stage) { position: relative; z-index: 1; }
.max-victor-field { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; pointer-events: none; color: var(--max-signal); transition: opacity .24s ease; }
.max-victor-pixel-stage {
  position: relative;
  z-index: 0;
  flex: 0 0 auto;
  max-width: 100%;
  margin-inline: auto;
  overflow: hidden;
  background: #05070a;
  pointer-events: none;
}
.max-victor-pixel {
  display: block;
  max-width: none;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}
.max-victor-ambient circle { fill: none; stroke: currentColor; stroke-width: 1; opacity: .22; }
.max-victor-primitive { fill: none; stroke: currentColor; vector-effect: non-scaling-stroke; }
.max-victor-signal { stroke-width: 1.8; opacity: .95; }
.max-victor-vector { stroke-width: 1.2; stroke-dasharray: 6 8; opacity: .55; }

.max-field-surface h2 { margin: 0; color: var(--max-signal); font-size: 1rem; letter-spacing: .08em; }
.max-field-surface p { margin: .25rem 0 0; }
.max-field-surface > div,
.max-field-state,
.max-visual-status { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.max-field-surface:focus-visible { outline: 3px solid var(--max-signal); outline-offset: -6px; }
.max-field-state { flex: 0 0 auto; color: var(--max-muted); }
.max-field-state [aria-hidden="true"] { color: var(--max-signal); font-size: 1.5rem; }
.max-field-state strong { color: var(--max-text); }
.max-visual-status { flex: 1 0 100%; color: var(--max-muted); font-size: .9rem; }
.max-field-evidence { display: grid; grid-template-columns: max-content 1fr; gap: .2rem .75rem; margin: .75rem 0; font-size: .85rem; }
.max-field-evidence dt { color: var(--max-muted); text-transform: uppercase; }
.max-field-evidence dd { margin: 0; }
.max-field-evidence code { overflow-wrap: anywhere; word-break: break-word; }

.max-field-surface[data-max-victor-cue="RESOLUTION"] {
  border-color: var(--max-signal);
  box-shadow: inset 0 3px 0 rgba(125, 255, 186, .7);
}

.max-field-surface[data-max-victor-cue="RESOLUTION"] .max-victor-signal { stroke-width: 2.6; opacity: 1; }

.max-field-surface[data-max-victor-cue="UNRESOLVED_INTERVAL"] {
  border-color: var(--max-question);
  box-shadow: inset 0 3px 0 rgba(255, 212, 121, .72);
}

.max-field-surface[data-max-victor-cue="UNRESOLVED_INTERVAL"] .max-victor-vector {
  stroke: var(--max-question);
  stroke-dasharray: 2 10;
  opacity: .82;
}

.max-field-surface[data-max-victor-cue="DECAY"] .max-victor-field { opacity: .32; }

.max-field-surface[data-max-victor-cue="CONVERGENCE"] {
  box-shadow: inset 0 0 0 2px rgba(125, 255, 186, .45);
}

.max-field-surface[data-max-victor-cue="RESTRAINED_DISSONANCE"] {
  border-color: var(--max-error);
  box-shadow: inset 0 3px 0 rgba(255, 154, 154, .68);
}

.max-shell[data-max-centipede-state="FOCUS"] #max-active-headline {
  outline: 2px solid var(--max-signal);
  outline-offset: .35rem;
}

.max-shell[data-max-centipede-state="ERROR"] .max-victor-field { display: none; }
.max-shell[data-max-centipede-state="ERROR"] .max-victor-pixel-stage { display: none; }

@media (max-width: 48rem) {
  .max-terminal { grid-template-columns: 1fr; }
  .max-region { border-right: 0; border-bottom: 1px solid var(--max-line); }
  .max-region:last-child { border-bottom: 0; }
  .max-field-surface { align-items: flex-start; flex-direction: column; }
  .max-field-evidence { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

@media (prefers-contrast: more) {
  :root {
    --max-field: #000;
    --max-surface: #000;
    --max-signal: #8fffc2;
    --max-text: #fff;
    --max-muted: #d8e6dd;
    --max-line: #8aa997;
  }

  .max-header,
  .max-footer,
  .max-region,
  .max-field-surface,
  .max-reader-controls { border-width: 2px; }
}

@media (forced-colors: active) {
  .max-victor-field { display: none; }
  .max-victor-pixel-stage { display: none; }
  .max-field-surface { box-shadow: none !important; }

  .max-reader-control,
  .max-reader-control-panel > summary,
  .max-refresh-check,
  .max-refresh-notice,
  .max-audio-controls button,
  .max-haptic-controls button,
  .max-semantic-controls button,
  .max-skip-link { border-color: CanvasText; }
}
