/* ================================================================
   FIGHT CLUB — styles.css  (consolidated, deduplicated)
   ================================================================ */

/* ── CSS Variables ───────────────────────────────────────────────── */
:root {
  --bg: #050E0C;
  --surface: #091512;
  --surface2: #0D1E1A;
  --surface3: #112620;
  --red: #00BFA5;
  --red-bright: #1DE9D4;
  --red-glow: rgba(0,191,165,0.25);
  --red-dim: #007A6E;
  --green: #00ff41;
  --green-dim: rgba(0,255,65,0.6);
  --magenta: #D4256B;
  --magenta-bright: #F02D7D;
  --magenta-dim: #8B1545;
  --teal-bg: #00897B;
  --text: #b2e0db;
  --text-dim: #4a7a73;
  --text-bright: #e0f5f3;
  --border: rgba(0,191,165,0.18);
  --border-bright: rgba(0,191,165,0.45);
  --font-mono: 'Share Tech Mono', monospace;
  --font-display: 'VT323', monospace;
  --font-head: 'Bebas Neue', sans-serif;
  --font-logo: 'Rubik Dirt', sans-serif;
  --font-script: 'Kaushan Script', cursive;
}

/* ── Reset ───────────────────────────────────────────────────────── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
img, svg { max-width: 100%; }
html { overflow-x: hidden; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-mono);
  overflow-x: hidden;
  min-height: 100vh;
  max-width: 100vw;
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Ccircle cx='8' cy='8' r='3' fill='none' stroke='%2300BFA5' stroke-width='1.5'/%3E%3Cline x1='8' y1='0' x2='8' y2='5' stroke='%2300BFA5' stroke-width='1'/%3E%3Cline x1='8' y1='11' x2='8' y2='16' stroke='%2300BFA5' stroke-width='1'/%3E%3Cline x1='0' y1='8' x2='5' y2='8' stroke='%2300BFA5' stroke-width='1'/%3E%3Cline x1='11' y1='8' x2='16' y2='8' stroke='%2300BFA5' stroke-width='1'/%3E%3C/svg%3E") 8 8, crosshair;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Touch devices */
@media (hover: none) and (pointer: coarse) { body { cursor: auto; } }
button, input, textarea, select { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }

/* ── Scrollbar ───────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 3px; height: 3px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(0,191,165,0.3); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: var(--red-dim); }

/* ── Focus ───────────────────────────────────────────────────────── */
:focus-visible { outline: 2px solid var(--red-bright); outline-offset: 2px; }
:focus:not(:focus-visible) { outline: none; }

/* ── Animations ──────────────────────────────────────────────────── */
@keyframes blink       { 0%,100%{opacity:1} 50%{opacity:0} }
@keyframes fadeIn      { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
@keyframes card-in     { from{opacity:0;transform:translateY(20px) scale(0.97)} to{opacity:1;transform:translateY(0) scale(1)} }
@keyframes shake       { 0%,100%{transform:translate(0)} 20%{transform:translate(-3px,1px)} 40%{transform:translate(3px,-1px)} 60%{transform:translate(-2px,2px)} 80%{transform:translate(2px,-1px)} }
@keyframes flicker     { 0%,96%,100%{opacity:1} 97%{opacity:0.4} 98%{opacity:1} 99%{opacity:0.2} }
@keyframes unlockFlash { 0%{opacity:1} 30%{opacity:0.8} 100%{opacity:0;pointer-events:none} }
@keyframes progress-fill { from{width:0} }
@keyframes pulse-red   { 0%,100%{box-shadow:0 0 0 0 rgba(192,57,43,0)} 50%{box-shadow:0 0 12px 2px rgba(0,191,165,0.38)} }
@keyframes pulse-special { 0%,100%{opacity:1} 50%{opacity:0.6} }
@keyframes glitch-shift { 0%,90%,100%{transform:translate(0,0);opacity:0} 91%{transform:translate(-4px,1px);opacity:0.8} 92%{transform:translate(4px,-1px);opacity:0.8} 93%{transform:translate(-2px,2px);opacity:0.6} 94%{transform:translate(3px,-2px);opacity:0.8} 95%{transform:translate(0,0);opacity:0} }
@keyframes glitch-main  { 0%,88%,100%{transform:translate(0)} 89%{transform:translate(-3px,1px)} 90%{transform:translate(3px,-1px)} 91%{transform:translate(-1px,2px)} }
@keyframes scanline    { 0%{transform:translateY(-100%)} 100%{transform:translateY(100vh)} }

/* ── Accessibility — reduced motion ─────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:0.01ms!important; animation-iteration-count:1!important; transition-duration:0.1ms!important; }
  .scanlines-fixed { display: none; }
}

/* ================================================================
   ENTRY GATE
   ================================================================ */
.entry-gate {
  position: fixed; inset: 0;
  background: var(--bg);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  z-index: 9000; overflow: hidden;
  padding: 1rem;
}
.noise-canvas { position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0.6; }
.scanline-overlay { position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,0.06) 3px,rgba(0,0,0,0.06) 4px);pointer-events:none;z-index:2; }
.entry-content { position:relative;z-index:10;width:min(700px,100%);padding:clamp(1rem,4vw,2rem); }
.terminal-block { background:rgba(0,0,0,0.8);border:1px solid rgba(212,37,107,0.12);padding:clamp(1rem,4vw,2.5rem);font-family:var(--font-mono);font-size:clamp(0.65rem,2vw,0.9rem);line-height:2; }
.term-line { color:var(--green-dim);display:block;min-height:1.8em; }
.term-line.red { color:var(--red); }
.term-line.white { color:var(--text-bright);font-size:1rem; }
.term-line.dim { color:var(--text-dim);font-size:0.78rem; }
.term-cursor { display:inline-block;width:9px;height:1.1em;background:var(--red);animation:blink 1s infinite;vertical-align:text-bottom;margin-left:2px; }
.entry-welcome {
  font-family: var(--font-head);
  font-size: clamp(2rem, 8vw, 3.5rem);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-bright);
  line-height: 0.95;
  display: block;
  margin-top: 1rem;
  text-shadow: 4px 4px 0 var(--magenta-dim), -2px -2px 0 rgba(0,191,165,0.25);
  -webkit-text-stroke: 1.5px var(--text-bright);
  paint-order: stroke fill;
  animation: fadeIn 0.6s ease;
}
.entry-input-wrap { margin-top:1.5rem;display:flex;gap:0.6rem;align-items:stretch; }
.entry-input-row { display:flex;align-items:center;gap:0.5rem;flex:1;min-width:0; }
.entry-prompt { color:var(--red);font-size:clamp(0.75rem,2.5vw,1.1rem);white-space:nowrap;flex-shrink:0; }
.entry-input { flex:1;min-width:0;background:transparent;border:none;border-bottom:1px solid var(--red-dim);color:var(--red-bright);font-family:var(--font-mono);font-size:clamp(0.8rem,2.5vw,1rem);outline:none;padding:0.5rem 0.6rem;letter-spacing:0.1em;min-height:40px; }
.entry-input::placeholder { color:rgba(212,37,107,0.15); }
.entry-enter-btn { flex-shrink:0;background:var(--magenta-dim);border:1px solid var(--magenta);color:white;font-family:var(--font-mono);font-size:clamp(0.6rem,1.8vw,0.72rem);letter-spacing:0.15em;padding:0.4rem 1rem;cursor:pointer;transition:background 0.2s;white-space:nowrap;align-self:stretch;min-height:40px; }
.entry-enter-btn:hover { background:var(--magenta); }
.entry-error { color:var(--red);font-size:0.75rem;margin-top:0.8rem;animation:shake 0.4s; }
.entry-hint  { color:var(--text-dim);font-size:0.7rem;margin-top:0.8rem; }
.unlock-flash { position:fixed;inset:0;background:white;z-index:9999;animation:unlockFlash 0.6s forwards; }

/* ================================================================
   MAIN LAYOUT
   ================================================================ */
.app-wrap { min-height:100vh;position:relative;animation:fadeIn 0.6s ease;display:flex;flex-direction:column;overflow-x:hidden; }
.scanlines-fixed { position:fixed;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,0.04) 3px,rgba(0,0,0,0.04) 4px);pointer-events:none;z-index:1000; }

/* ================================================================
   NAVIGATION
   ================================================================ */
.main-nav {
  position: sticky; top: 0; z-index: 500;
  background: rgba(5,14,12,0.98);
  border-bottom: 1px solid var(--border);
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.5rem;
  padding: 0 clamp(0.75rem,3vw,2rem);
  min-height: 60px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  overflow: visible;
}
.nav-logo {
  font-family: var(--font-head);
  font-size: clamp(1.4rem,3.5vw,2rem);
  letter-spacing: clamp(0.2em,0.6vw,0.4em);
  color: var(--text-bright);
  text-transform: uppercase;
  position: relative; cursor: default; user-select: none;
  animation: flicker 8s infinite;
  white-space: nowrap; flex-shrink: 0;
  text-shadow: 2px 2px 0 var(--magenta-dim), -1px -1px 0 rgba(0,191,165,0.2);
  -webkit-text-stroke: 1px var(--text-bright);
  paint-order: stroke fill;
  line-height: 1;
}
.nav-logo::before,.nav-logo::after { content:attr(data-text);position:absolute;top:0;left:0;font-family:inherit;font-size:inherit;letter-spacing:inherit; }
.nav-logo::before { color:var(--magenta);animation:glitch-shift 6s infinite;clip-path:polygon(0 0,100% 0,100% 40%,0 40%); }
.nav-logo::after  { color:var(--teal-bg);animation:glitch-shift 6s infinite 0.1s;clip-path:polygon(0 60%,100% 60%,100% 100%,0 100%);opacity:0.5; }

.nav-tabs { display:flex;gap:0.2rem;justify-content:center;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch; }
.nav-tabs::-webkit-scrollbar { display:none; }

.nav-tab {
  font-family: var(--font-mono);
  font-size: clamp(0.52rem,1.4vw,0.7rem);
  letter-spacing: clamp(0.05em,0.3vw,0.25em);
  text-transform: uppercase;
  padding: 0.3rem clamp(0.5rem,2vw,1.2rem);
  background: transparent;
  border: 1px solid transparent;
  color: var(--text-dim);
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  flex-shrink: 0;
  min-height: 36px;
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.nav-tab:hover { color:var(--text);border-color:var(--border); }
.nav-tab.active { color:var(--red-bright);border-color:var(--red-dim);background:rgba(0,191,165,0.06); }
.nav-tab.active::after { content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--red-bright); }
.nav-tab-full  { display: inline; }
.nav-tab-short { display: none; }

.nav-right { flex-shrink:0;display:flex;align-items:center;position:relative; }
.nav-user { display:flex;align-items:center;gap:0.5rem;cursor:pointer;padding:0.3rem 0.6rem;border:1px solid var(--border);background:var(--surface);transition:border-color 0.2s,background 0.2s;max-width:220px;min-height:40px; }
.nav-user:hover { border-color:var(--border-bright);background:var(--surface2); }
.nav-avatar-wrap { position:relative;flex-shrink:0; }
.nav-avatar { width:30px;height:30px;background:var(--red-dim);border:1px solid var(--red-bright);color:var(--red-bright);font-family:var(--font-mono);font-size:0.78rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.nav-lvl-dot { position:absolute;bottom:-4px;right:-4px;font-family:var(--font-mono);font-size:0.5rem;font-weight:700;min-width:14px;height:14px;display:flex;align-items:center;justify-content:center;border-radius:2px;color:#000;line-height:1;padding:0 2px; }
.nav-user-info { display:flex;flex-direction:column;gap:0.1rem;min-width:0;overflow:hidden; }
.nav-username { font-family:var(--font-mono);font-size:0.62rem;letter-spacing:0.1em;color:var(--text-bright);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px; }
.nav-rank-inline { font-family:var(--font-mono);font-size:0.52rem;letter-spacing:0.12em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px; }
.nav-chevron { font-size:0.5rem;color:var(--text-dim);flex-shrink:0;margin-left:0.2rem; }

.nav-rank { display:flex;flex-direction:column;align-items:flex-end;gap:0.15rem;min-width:0;flex-shrink:0; }
.nav-rank-main { display:flex;align-items:center;gap:0.4rem; }
.nav-level-badge { font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.1em;padding:0.12rem 0.4rem;border:1px solid;line-height:1.4;white-space:nowrap; }
.nav-rank-name { font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.15em;text-transform:uppercase;white-space:nowrap; }
.rank-bar-wrap { width:80px;height:2px;background:rgba(255,255,255,0.08);position:relative;overflow:hidden; }
.rank-bar-fill { height:100%;transition:width 0.6s ease; }

.user-menu { position:fixed;right:clamp(0.5rem,2vw,1rem);top:58px;background:var(--surface2);border:1px solid var(--border-bright);min-width:min(260px,calc(100vw - 1rem));max-width:min(320px,calc(100vw - 1rem));z-index:9990;animation:fadeIn 0.15s;box-shadow:0 12px 40px rgba(0,0,0,0.8); }
.user-menu-header { display:flex;align-items:center;gap:0.8rem;padding:0.9rem 1rem;border-bottom:1px solid var(--border); }
.user-menu-avatar { width:36px;height:36px;flex-shrink:0;background:var(--red-dim);border:1px solid var(--red-bright);color:var(--red-bright);font-family:var(--font-mono);font-size:0.9rem;font-weight:700;display:flex;align-items:center;justify-content:center; }
.user-menu-name  { font-family:var(--font-mono);font-size:0.72rem;color:var(--text-bright);letter-spacing:0.08em;text-transform:uppercase;word-break:break-all; }
.user-menu-email { font-family:var(--font-mono);font-size:0.56rem;color:var(--text-dim);margin-top:0.1rem;word-break:break-all; }
.user-menu-rank  { display:flex;flex-direction:column;gap:0.3rem;padding:0.8rem 1rem;border-bottom:1px solid var(--border);border-left:2px solid; }
.user-menu-rank-label { font-family:var(--font-mono);font-size:0.55rem;letter-spacing:0.3em;color:var(--text-dim);text-transform:uppercase; }
.user-menu-rank-name  { font-family:var(--font-head);font-size:1rem;letter-spacing:0.08em;text-transform:uppercase;line-height:1.1; }
.user-menu-bar  { height:2px;background:rgba(255,255,255,0.06);width:100%; }
.user-menu-bar-fill { height:100%;transition:width 0.5s ease; }
.user-menu-rank-xp { font-family:var(--font-mono);font-size:0.55rem;color:var(--text-dim);letter-spacing:0.1em; }
.user-menu-logout { display:block;width:100%;background:transparent;border:none;border-top:1px solid var(--border);color:#EF5350;font-family:var(--font-mono);font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;padding:0.7rem 1rem;cursor:pointer;transition:background 0.2s;text-align:left; }
.user-menu-logout:hover { background:rgba(239,83,80,0.1); }

/* ================================================================
   SECTIONS
   ================================================================ */
.section { max-width:1200px;margin:0 auto;width:100%;padding:clamp(1.5rem,4vw,3rem) clamp(1rem,4vw,2rem);min-height:calc(100vh - 52px); }
.section-header { margin-bottom:clamp(1.5rem,4vw,2.5rem); }
.section-eyebrow { font-size:0.65rem;letter-spacing:0.5em;color:var(--red);text-transform:uppercase;font-family:var(--font-mono);display:flex;align-items:center;gap:0.8rem;margin-bottom:0.6rem; }
.section-eyebrow::before { content:'▶';font-size:0.5rem; }
.section-title { font-family:var(--font-head);font-weight:700;font-size:clamp(2rem,8vw,4rem);text-transform:uppercase;color:var(--text-bright);letter-spacing:-0.01em;line-height:0.9;text-shadow:3px 3px 0 var(--magenta-dim),-1px -1px 0 rgba(0,191,165,0.2); }

.divider { border:none;border-top:1px solid var(--border);margin:2.5rem 0; }
.empty-state { text-align:center;padding:4rem 2rem;color:var(--text-dim);font-size:0.8rem;letter-spacing:0.2em;line-height:2.5; }
.empty-state .big { font-family:var(--font-display);font-size:3rem;color:var(--red);opacity:0.3;display:block; }

/* ================================================================
   RANK PANEL
   ================================================================ */
.rank-panel { display:grid;grid-template-columns:1fr auto;gap:1.5rem;padding:clamp(1rem,3vw,1.8rem);background:var(--surface);border:1px solid var(--border);margin-bottom:2rem;position:relative;overflow:hidden; }
.rank-panel::before { content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--red-bright); }
.rank-panel-info { display:flex;flex-direction:column;gap:0.55rem;min-width:0; }
.rank-stage-label { font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.35em;text-transform:uppercase;opacity:0.8; }
.rank-level-row  { display:flex;align-items:baseline;gap:0.6rem;flex-wrap:wrap; }
.rank-level-num  { font-family:var(--font-display);font-size:clamp(1.8rem,5vw,2.6rem);line-height:1;letter-spacing:-0.02em; }
.rank-separator  { color:var(--text-dim);font-size:1.2rem; }
.rank-current-name { font-family:var(--font-head);font-size:clamp(1.1rem,3.5vw,1.7rem);letter-spacing:0.08em;text-transform:uppercase;line-height:1; }
.rank-next-row   { display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap; }
.rank-next-label { font-family:var(--font-mono);font-size:0.62rem;letter-spacing:0.25em;color:var(--text-dim);text-transform:uppercase; }
.rank-next-name  { font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.15em;font-weight:600;text-transform:uppercase; }
.rank-next-xp    { font-family:var(--font-mono);font-size:0.58rem;color:var(--text-dim);letter-spacing:0.1em; }
.rank-progress-bar { height:3px;background:rgba(255,255,255,0.06);position:relative;overflow:hidden;margin-top:0.2rem; }
.rank-progress-fill { height:100%;transition:width 0.8s cubic-bezier(0.4,0,0.2,1);position:relative; }
.rank-progress-fill::after { content:'';position:absolute;right:0;top:50%;transform:translateY(-50%);width:4px;height:4px;border-radius:50%;background:white;opacity:0.8; }
.rank-xp-text { font-family:var(--font-mono);font-size:0.62rem;color:var(--text-dim);letter-spacing:0.15em; }
.rank-stage-track { display:flex;flex-direction:column;gap:0.45rem;min-width:120px;max-width:160px; }
.stage-chip { display:flex;align-items:center;gap:0.5rem;padding:0.3rem 0.6rem;border:1px solid var(--border);background:transparent;transition:all 0.2s;cursor:default; }
.stage-chip.active { background:rgba(255,255,255,0.03); }
.stage-chip.done { opacity:0.6; }
.stage-num { font-family:var(--font-display);font-size:0.9rem;line-height:1;color:var(--text-dim);min-width:14px; }
.stage-chip.active .stage-num { color:inherit; }
.stage-name { font-family:var(--font-mono);font-size:0.55rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-dim);flex:1;white-space:nowrap; }
.stage-chip.active .stage-name { color:inherit; }
.stage-pips { display:flex;gap:2px;align-items:center; }
.stage-pip  { width:5px;height:5px;border-radius:50%;background:var(--surface3);border:1px solid var(--border);transition:background 0.3s;display:inline-block; }
.stage-pip.lit { border-color:transparent;box-shadow:0 0 3px currentColor; }

/* ================================================================
   GENDER TOGGLE
   ================================================================ */
.gender-toggle-wrap { margin-bottom:2rem; }
.gender-toggle { display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--border);margin-bottom:1rem;overflow:hidden; }
.gender-btn { display:flex;flex-direction:column;align-items:center;gap:0.3rem;padding:clamp(0.8rem,2.5vw,1.2rem) clamp(0.5rem,2vw,1rem);background:var(--surface);border:none;cursor:pointer;transition:all 0.25s;position:relative;min-height:70px; }
.gender-btn:first-child { border-right:1px solid var(--border); }
.gender-icon  { font-size:1.5rem;line-height:1;transition:all 0.2s; }
.gender-label { font-family:var(--font-head);font-size:clamp(0.85rem,2.5vw,1.1rem);letter-spacing:0.15em;text-transform:uppercase;color:var(--text-dim);transition:color 0.2s; }
.gender-sub   { font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.2em;color:var(--text-dim);text-transform:uppercase;opacity:0.6; }
.man-btn:hover { background:rgba(0,191,165,0.05); }
.woman-btn:hover { background:rgba(212,37,107,0.05); }
.man-btn.active   { background:rgba(0,191,165,0.08);border-bottom:2px solid var(--red-bright); }
.man-btn.active .gender-label { color:var(--red-bright); }
.man-btn.active .gender-icon  { filter:drop-shadow(0 0 6px var(--red-bright)); }
.woman-btn.active { background:rgba(212,37,107,0.08);border-bottom:2px solid var(--magenta); }
.woman-btn.active .gender-label { color:var(--magenta); }
.woman-btn.active .gender-icon  { filter:drop-shadow(0 0 6px var(--magenta)); }
.path-manifesto { font-family:var(--font-mono);font-size:0.75rem;line-height:1.8;color:var(--text-dim);padding:1rem 1.2rem;border-left:2px solid var(--border-bright);background:rgba(0,0,0,0.25);font-style:italic; }

/* ================================================================
   CATEGORY FILTER
   ================================================================ */
.cat-filter-row { display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:1.8rem; }
.cat-filter-btn { font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.3em;text-transform:uppercase;padding:0.35rem 0.9rem;background:transparent;border:1px solid var(--border);color:var(--text-dim);cursor:pointer;transition:all 0.2s;white-space:nowrap; }
.cat-filter-btn:hover { border-color:var(--border-bright);color:var(--text); }
.cat-filter-btn.active { border-color:var(--red-bright);color:var(--red-bright);background:rgba(0,191,165,0.07); }

/* ================================================================
   CHARACTER GUIDES
   ================================================================ */
.char-guides-row { display:grid;grid-template-columns:1fr 1fr;gap:clamp(0.8rem,2vw,1.2rem);margin-bottom:2rem; }
.char-guides-row.compact { margin-bottom:1.5rem; }
.char-guide { display:flex;align-items:flex-start;gap:clamp(0.6rem,1.5vw,1rem);padding:clamp(0.8rem,2.5vw,1.4rem);border:1px solid var(--border);background:var(--surface);position:relative;overflow:hidden;transition:border-color 0.3s; }
.char-guide::before { content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,191,165,0.04) 0%,transparent 60%);pointer-events:none; }
.char-tyler::before { background:linear-gradient(135deg,rgba(212,37,107,0.05) 0%,transparent 60%); }
.char-guide.align-right { flex-direction:row-reverse; }
.char-guide:hover { border-color:var(--border-bright); }
.char-tyler:hover { border-color:rgba(212,37,107,0.35); }
.char-narrator:hover { border-color:rgba(0,191,165,0.35); }
.char-avatar { width:clamp(44px,7vw,72px);min-width:clamp(44px,7vw,72px);height:clamp(66px,10vw,108px);position:relative;filter:drop-shadow(0 4px 12px rgba(0,0,0,0.6));flex-shrink:0; }
.char-tyler .char-avatar { filter:drop-shadow(0 4px 16px rgba(212,37,107,0.25)); }
.char-narrator .char-avatar { filter:drop-shadow(0 4px 16px rgba(0,191,165,0.15)); }
.char-content { flex:1;display:flex;flex-direction:column;gap:0.6rem;min-width:0; }
.char-guide.align-right .char-content { align-items:flex-end;text-align:right; }
.char-name-tag { font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.4em;text-transform:uppercase;color:var(--text-dim);display:flex;align-items:center;gap:0.5rem; }
.char-guide.align-right .char-name-tag { flex-direction:row-reverse; }
.char-dot { width:5px;height:5px;border-radius:50%;display:inline-block;flex-shrink:0; }
.char-bubble { position:relative;background:rgba(0,0,0,0.35);border-left:2px solid var(--red-bright);padding:0.7rem 0.9rem;min-height:52px;display:flex;align-items:center; }
.char-tyler .char-bubble { border-left-color:var(--magenta); }
.char-guide.align-right .char-bubble { border-left:none;border-right:2px solid var(--magenta); }
.char-guide.align-right.char-narrator .char-bubble { border-right-color:var(--red-bright); }
.char-speech { font-family:var(--font-mono);font-size:0.78rem;line-height:1.7;color:var(--text);font-style:italic; }
.char-refresh-btn { font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.3em;text-transform:uppercase;background:transparent;border:1px solid var(--border);color:var(--text-dim);padding:0.25rem 0.7rem;cursor:pointer;transition:all 0.2s;align-self:flex-start; }
.char-guide.align-right .char-refresh-btn { align-self:flex-end; }
.char-tyler .char-refresh-btn:hover { border-color:var(--magenta);color:var(--magenta); }
.char-narrator .char-refresh-btn:hover { border-color:var(--red-bright);color:var(--red-bright); }
.char-refresh-btn:disabled { opacity:0.4;cursor:not-allowed; }

/* ================================================================
   WEEK HEADER
   ================================================================ */
.week-header { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0.8rem;padding:clamp(0.7rem,2.5vw,0.9rem) clamp(0.9rem,3vw,1.2rem);background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--red-bright);margin-bottom:1.5rem;position:relative;overflow:hidden; }
.week-header::after { content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,191,165,0.04) 0%,transparent 60%);pointer-events:none; }
.week-info { display:flex;align-items:center;gap:0.8rem;flex-wrap:wrap; }
.week-badge { font-family:var(--font-display);font-size:0.85rem;color:var(--red-bright);letter-spacing:0.15em;padding:0.15rem 0.6rem;border:1px solid rgba(0,191,165,0.3);background:rgba(0,191,165,0.06);white-space:nowrap; }
.week-title { font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.25em;color:var(--text-bright);text-transform:uppercase; }
.week-count { font-family:var(--font-mono);font-size:0.6rem;color:var(--text-dim);letter-spacing:0.2em; }
.week-countdown { display:flex;flex-direction:column;align-items:flex-end;gap:0.1rem; }
.countdown-label { font-family:var(--font-mono);font-size:0.55rem;letter-spacing:0.25em;color:var(--text-dim);text-transform:uppercase; }
.countdown-timer { font-family:var(--font-display);font-size:1.1rem;color:var(--magenta);letter-spacing:0.1em;line-height:1;min-width:80px;text-align:right; }
.week-loading { display:flex;align-items:center;gap:0.2rem;width:100%;padding-top:0.3rem;border-top:1px solid var(--border);margin-top:0.2rem; }

/* ================================================================
   CHALLENGES GRID
   ================================================================ */
.challenges-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:clamp(1rem,2.5vw,1.5rem); }

.challenge-card {
  background:var(--surface);border:1px solid var(--border);
  padding:clamp(1rem,3vw,1.8rem);position:relative;overflow:hidden;
  transition:border-color 0.3s,background 0.3s;animation:card-in 0.4s ease both;
  display:flex;flex-direction:column;
}
.challenge-card:hover { border-color:var(--border-bright);background:var(--surface2); }
.challenge-card.completed { border-color:rgba(212,37,107,0.12);background:rgba(0,255,65,0.02); }
.challenge-card::before { content:'';position:absolute;top:0;left:0;width:3px;height:0;background:var(--red);transition:height 0.4s; }
.challenge-card:hover::before { height:48px; }
.challenge-card.completed::before { background:var(--red);height:100%; }
.man-card::before    { background:var(--red-bright) !important; }
.woman-card::before  { background:var(--magenta) !important; }
.woman-card:hover::before { height:48px; }
.woman-card.completed::before { height:100%; }
.special-card { border-color:rgba(212,37,107,0.22);background:linear-gradient(135deg,rgba(212,37,107,0.04) 0%,var(--surface) 40%); }
.special-card::before { background:var(--magenta) !important; }
.special-card .ch-mission { color:var(--magenta-bright); }
.ch-special-badge { font-family:var(--font-mono);font-size:0.5rem;letter-spacing:0.25em;text-transform:uppercase;padding:0.12rem 0.45rem;background:rgba(212,37,107,0.12);border:1px solid rgba(212,37,107,0.35);color:var(--magenta);white-space:nowrap;animation:pulse-special 2.5s infinite; }

.ch-top { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:0.8rem; }
.ch-category { font-size:0.6rem;letter-spacing:0.4em;color:var(--red);text-transform:uppercase;background:rgba(0,191,165,0.08);padding:0.25rem 0.6rem;border:1px solid var(--border); }
.ch-badges-right { display:flex;align-items:center;gap:0.4rem; }
.ch-xp { font-family:var(--font-display);font-size:1.6rem;color:var(--red-bright);line-height:1; }
.ch-xp span { font-size:0.7rem;color:var(--text-dim);font-family:var(--font-mono); }
.ch-title { font-family:var(--font-head);font-size:clamp(0.9rem,2.5vw,1.15rem);text-transform:uppercase;color:var(--text-bright);margin-bottom:0.6rem;letter-spacing:0.08em; }
.ch-mission { font-size:0.7rem;color:var(--red);font-style:italic;margin-bottom:0.8rem;line-height:1.5; }
.ch-desc { font-size:0.78rem;color:var(--text-dim);line-height:1.7;margin-bottom:1.2rem; }
.ch-difficulty { font-size:0.6rem;letter-spacing:0.3em;text-transform:uppercase;padding:0.2rem 0.5rem;border:1px solid;display:inline-block;margin-bottom:1rem;width:fit-content;max-width:fit-content;align-self:flex-start; }
.ch-difficulty.EASY     { color:var(--green);  border-color:rgba(0,255,65,0.2); }
.ch-difficulty.MODERATE { color:#ffab00;        border-color:rgba(255,171,0,0.3); }
.ch-difficulty.HARD     { color:#FF7043;        border-color:rgba(255,112,67,0.3); }
.ch-actions { display:flex;gap:0.5rem;flex-wrap:wrap;margin-top:auto;padding-top:0.8rem; }
.ch-completed-badge { display:inline-flex;align-items:center;gap:0.4rem;color:var(--red-bright);font-family:var(--font-mono);font-size:0.65rem;letter-spacing:0.25em;text-transform:uppercase;padding:0.3rem 0.7rem;border:1px solid rgba(0,191,165,0.25);background:rgba(0,191,165,0.06); }
.ch-completed-badge::before { content:'▶';font-size:0.5rem; }

.woman-card .ch-category { color:var(--magenta);border-color:rgba(212,37,107,0.25);background:rgba(212,37,107,0.06); }
.woman-card .ch-mission  { color:var(--magenta); }

/* ── Buttons ─────────────────────────────────────────────────────── */
.btn-primary {
  font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;
  background:transparent;border:1px solid var(--red-dim);color:var(--red-bright);
  padding:0.5rem 1rem;min-height:38px;cursor:pointer;transition:all 0.2s;
  display:inline-flex;align-items:center;justify-content:center;
}
.btn-primary:hover { background:rgba(0,191,165,0.1);border-color:var(--red-bright); }
.btn-secondary {
  font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;
  background:transparent;border:1px solid var(--border);color:var(--text-dim);
  padding:0.5rem 1rem;min-height:38px;cursor:pointer;transition:all 0.2s;
  display:inline-flex;align-items:center;justify-content:center;
}
.btn-secondary:hover { color:var(--text);border-color:var(--border-bright); }
.btn-green {
  font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;
  background:transparent;border:1px solid rgba(0,255,65,0.2);color:var(--green);
  padding:0.5rem 1rem;min-height:38px;cursor:pointer;transition:all 0.2s;
  display:inline-flex;align-items:center;justify-content:center;
}
.btn-green:hover { background:rgba(0,255,65,0.06);border-color:rgba(0,255,65,0.4); }

/* ── Reflection + Tyler response ─────────────────────────────────── */
.reflection-area { margin-top:0.8rem;width:100%;background:rgba(0,0,0,0.35);border:1px solid var(--border);border-top:2px solid var(--border);color:var(--text);font-family:var(--font-mono);font-size:0.76rem;padding:0.7rem 0.8rem;resize:vertical;min-height:68px;max-height:160px;outline:none;line-height:1.6;transition:border-color 0.2s;box-sizing:border-box; }
.reflection-area::placeholder { color:var(--text-dim);opacity:0.55; }
.reflection-area:focus { border-color:var(--red-dim);background:rgba(0,0,0,0.5); }

.tyler-response { margin-top:0.9rem;padding:0.85rem 1rem;background:rgba(0,191,165,0.04);border:1px solid rgba(0,191,165,0.12);border-left:2px solid var(--red);animation:fadeIn 0.4s ease;overflow:visible; }
.tyler-response-label { font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.4em;color:var(--red);text-transform:uppercase;margin-bottom:0.5rem;display:flex;align-items:center;gap:0.4rem; }
.tyler-response-label::before { content:'▶';font-size:0.45rem; }
.tyler-response-text { font-family:var(--font-mono);font-size:0.76rem;color:var(--text-dim);line-height:1.65;font-style:italic; }
.tyler-response-text em { opacity:0.55;font-size:0.9em; }
.tyler-thinking { display:flex;gap:0.35rem;align-items:center;color:var(--text-dim);font-size:0.72rem;font-family:var(--font-mono);letter-spacing:0.15em;padding:0.5rem 0; }
.dot-pulse { animation:blink 1s infinite; }
.dot-pulse:nth-child(2) { animation-delay:0.2s; }
.dot-pulse:nth-child(3) { animation-delay:0.4s; }
.woman-card .tyler-response { border-left-color:var(--magenta);background:rgba(212,37,107,0.04); }
.woman-card .tyler-response-label { color:var(--magenta); }

/* ── Photo upload ────────────────────────────────────────────────── */
.photo-upload-zone { display:flex;flex-direction:column;align-items:flex-start;gap:0.7rem;padding:clamp(0.8rem,2.5vw,1.2rem);border:1px dashed rgba(0,191,165,0.3);background:rgba(0,191,165,0.03);margin-top:0.5rem;animation:fadeIn 0.3s; }
.photo-upload-label { font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.25em;color:var(--red-bright);text-transform:uppercase; }
.photo-upload-sub   { font-family:var(--font-mono);font-size:0.63rem;color:var(--text-dim);letter-spacing:0.1em;margin-top:-0.3rem; }
.photo-upload-btn   { display:inline-flex;align-items:center;gap:0.5rem;background:rgba(0,191,165,0.08);border:1px solid var(--red-dim);color:var(--red-bright);font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.2em;padding:0.55rem 1.1rem;cursor:pointer;transition:all 0.2s;text-transform:uppercase;min-height:40px; }
.photo-upload-btn:hover { background:rgba(0,191,165,0.15);border-color:var(--red-bright); }
.photo-skip-btn { background:transparent;border:none;color:var(--text-dim);font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.1em;cursor:pointer;padding:0.2rem 0;text-decoration:underline;text-underline-offset:3px;transition:color 0.2s; }
.photo-skip-btn:hover { color:var(--text); }
.proof-photo-wrap  { margin-top:0.8rem; }
.proof-photo-label { font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.3em;color:var(--text-dim);text-transform:uppercase;margin-bottom:0.5rem; }
.proof-photo { width:100%;max-height:220px;object-fit:cover;border:1px solid var(--border);display:block;filter:saturate(0.8) contrast(1.05); }

/* ================================================================
   DEBATE ARENA — Live Chat Rooms
   ================================================================ */
.arena-intro-bar { display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.8rem 1.2rem;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--red-bright);margin-bottom:1.5rem;flex-wrap:wrap; }
.arena-intro-text { font-family:var(--font-mono);font-size:0.72rem;color:var(--text-dim);line-height:1.7;flex:1;min-width:200px; }
.arena-intro-text strong { color:var(--text-bright); }
.arena-intro-meta { display:flex;align-items:center;gap:0.5rem;font-family:var(--font-mono);font-size:0.62rem;letter-spacing:0.2em;color:var(--red-bright);white-space:nowrap;flex-shrink:0; }
.arena-live-dot { display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--red-bright);box-shadow:0 0 6px var(--red-bright);animation:pulse-red 1.5s infinite;flex-shrink:0; }

.arena-cat-row { display:flex;flex-wrap:wrap;gap:0.45rem;margin-bottom:1.5rem; }
.arena-cat-btn { font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.2em;text-transform:uppercase;padding:0.3rem 0.8rem;background:transparent;border:1px solid var(--border);color:var(--text-dim);cursor:pointer;transition:all 0.2s;white-space:nowrap; }
.arena-cat-btn:hover { border-color:var(--border-bright);color:var(--text); }
.arena-cat-btn.active { border-color:var(--magenta);color:var(--magenta);background:rgba(212,37,107,0.07); }

.arena-create-wrap { margin-bottom:1.8rem; }
.arena-create-btn { font-family:var(--font-mono);font-size:0.7rem;letter-spacing:0.2em;text-transform:uppercase;padding:0.6rem 1.2rem;background:transparent;border:1px solid var(--red-dim);color:var(--red-bright);cursor:pointer;transition:all 0.2s;width:100%;text-align:left;min-height:42px; }
.arena-create-btn:hover { background:rgba(0,191,165,0.06);border-color:var(--red-bright); }
.arena-create-form { padding:1.2rem;border:1px solid var(--border);border-top:none;background:var(--surface);animation:fadeIn 0.2s; }
.create-form-label { font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.3em;color:var(--text-dim);text-transform:uppercase;margin-bottom:0.6rem;display:block; }
.create-cat-row { display:flex;flex-wrap:wrap;gap:0.4rem;margin-bottom:0.5rem; }
.create-cat-btn { font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.12em;padding:0.28rem 0.65rem;background:transparent;border:1px solid var(--border);color:var(--text-dim);cursor:pointer;transition:all 0.2s;white-space:nowrap; }
.create-cat-btn:hover { border-color:var(--border-bright);color:var(--text); }
.create-cat-btn.active { border-color:var(--red-bright);color:var(--red-bright);background:rgba(0,191,165,0.06); }
.create-topic-input { width:100%;background:var(--surface2);border:1px solid var(--border);color:var(--text-bright);font-family:var(--font-mono);font-size:0.78rem;letter-spacing:0.08em;padding:0.7rem 0.9rem;outline:none;text-transform:uppercase;transition:border-color 0.2s;box-sizing:border-box; }
.create-topic-input:focus { border-color:var(--red-bright); }
.create-error { font-family:var(--font-mono);font-size:0.65rem;color:#EF5350;margin:0.6rem 0;padding:0.5rem 0.8rem;border-left:2px solid #EF5350;background:rgba(239,83,80,0.07); }

.arena-loading { display:flex;align-items:center;gap:1rem;padding:3rem 2rem;color:var(--text-dim);font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.15em; }
.arena-loading-dots { display:flex;gap:0.3rem;font-size:1rem;color:var(--red-bright); }
.arena-loading-dots .dot-pulse { animation:blink 1s infinite;font-size:1rem; }
.arena-loading-dots .dot-pulse:nth-child(2) { animation-delay:0.25s; }
.arena-loading-dots .dot-pulse:nth-child(3) { animation-delay:0.5s; }

.arena-rooms-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:1rem; }

.arena-room-card { background:var(--surface);border:1px solid var(--border);padding:1.2rem 1.4rem;cursor:pointer;transition:border-color 0.2s,background 0.2s,transform 0.15s;position:relative;overflow:hidden;animation:card-in 0.35s ease both;display:flex;flex-direction:column;gap:0.6rem; }
.arena-room-card::before { content:'';position:absolute;top:0;left:0;width:3px;height:0;background:var(--red-bright);transition:height 0.3s; }
.arena-room-card:hover { border-color:var(--border-bright);background:var(--surface2);transform:translateY(-1px); }
.arena-room-card:hover::before { height:100%; }
.arena-room-card.expiring { border-color:rgba(212,37,107,0.3); }
.arena-room-card.expiring::before { background:var(--magenta); }
.arena-room-top { display:flex;align-items:center;justify-content:space-between;gap:0.5rem; }
.arena-room-cat { font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--red-bright);background:rgba(0,191,165,0.08);border:1px solid var(--border);padding:0.18rem 0.55rem; }
.arena-room-timer { font-family:var(--font-mono);font-size:0.6rem;color:var(--text-dim);letter-spacing:0.1em;white-space:nowrap; }
.arena-room-timer.expiring { color:var(--magenta);animation:blink 1s infinite; }
.arena-room-topic { font-family:var(--font-head);font-size:clamp(0.9rem,2.5vw,1.1rem);text-transform:uppercase;color:var(--text-bright);letter-spacing:0.05em;line-height:1.2; }
.arena-room-summary { font-family:var(--font-mono);font-size:0.68rem;color:var(--text-dim);line-height:1.6; }
.arena-room-footer { display:flex;align-items:center;gap:1rem;margin-top:auto;padding-top:0.5rem;border-top:1px solid var(--border); }
.arena-room-stat { font-family:var(--font-mono);font-size:0.62rem;color:var(--text-dim);letter-spacing:0.1em; }
.arena-enter-label { margin-left:auto;font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.25em;color:var(--red-bright);text-transform:uppercase; }

/* Chat view */
.arena-chat-wrap { display:flex;flex-direction:column;height:calc(100vh - 52px);overflow:hidden;background:var(--bg);position:relative; }
.arena-chat-header { display:flex;align-items:center;gap:0.8rem;padding:0.75rem clamp(0.8rem,2vw,1.5rem);background:rgba(5,14,12,0.98);border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:nowrap;min-height:56px;backdrop-filter:blur(8px); }
.arena-back-btn { font-family:var(--font-mono);font-size:0.62rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-dim);background:transparent;border:1px solid var(--border);padding:0.35rem 0.7rem;cursor:pointer;transition:all 0.2s;white-space:nowrap;flex-shrink:0;min-height:34px; }
.arena-back-btn:hover { border-color:var(--border-bright);color:var(--text); }
.arena-chat-header-info { flex:1;min-width:0;overflow:hidden; }
.arena-chat-cat { font-family:var(--font-mono);font-size:0.55rem;letter-spacing:0.25em;color:var(--red-bright);text-transform:uppercase;margin-bottom:0.15rem; }
.arena-chat-topic { font-family:var(--font-head);font-size:clamp(0.75rem,2vw,1rem);text-transform:uppercase;color:var(--text-bright);letter-spacing:0.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.arena-chat-header-meta { display:flex;flex-direction:column;align-items:flex-end;gap:0.2rem;flex-shrink:0; }
.arena-chat-timer { font-family:var(--font-mono);font-size:0.58rem;color:var(--text-dim);letter-spacing:0.1em;white-space:nowrap; }
.arena-chat-timer.expiring { color:var(--magenta);animation:blink 1s infinite; }
.arena-chat-count { display:flex;align-items:center;gap:0.4rem;font-family:var(--font-mono);font-size:0.58rem;color:var(--text-dim);letter-spacing:0.1em;white-space:nowrap; }

.arena-messages { flex:1;overflow-y:auto;padding:clamp(0.8rem,2vw,1.5rem);display:flex;flex-direction:column;gap:0.5rem;scroll-behavior:smooth; }
.arena-messages::-webkit-scrollbar { width:3px; }
.arena-messages::-webkit-scrollbar-thumb { background:var(--red-dim); }
.arena-empty-chat { display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:0.5rem;color:var(--text-dim);font-family:var(--font-mono);font-size:0.75rem;letter-spacing:0.2em;text-align:center;padding:3rem 1rem; }
.arena-empty-icon { font-size:2.5rem;color:var(--red);opacity:0.3;margin-bottom:0.5rem; }

.arena-msg { display:flex;flex-direction:column;gap:0.3rem;max-width:75%;align-self:flex-start;animation:fadeIn 0.25s ease; }
.arena-msg-me { align-self:flex-end; }
.arena-msg-meta { display:flex;align-items:center;gap:0.6rem;padding:0 0.2rem; }
.arena-msg-author { font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.15em;color:var(--text-dim);text-transform:uppercase; }
.arena-msg-time   { font-family:var(--font-mono);font-size:0.52rem;color:var(--text-dim);opacity:0.6; }
.arena-msg-bubble { background:var(--surface);border:1px solid var(--border);padding:0.7rem 0.9rem; }
.arena-msg-bubble.me-bubble { background:rgba(0,191,165,0.08);border-color:rgba(0,191,165,0.2); }
.arena-msg-text { font-family:var(--font-mono);font-size:0.8rem;color:var(--text);line-height:1.65;margin:0;white-space:pre-wrap;word-break:break-word; }
.arena-msg-img  { display:block;max-width:100%;max-height:240px;object-fit:contain;margin-top:0.4rem;border:1px solid var(--border);filter:saturate(0.85); }
.arena-vote-btn { align-self:flex-start;font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.1em;color:var(--text-dim);background:transparent;border:none;cursor:pointer;padding:0.15rem 0.3rem;transition:color 0.15s; }
.arena-vote-btn:hover { color:var(--red-bright); }
.arena-vote-btn.voted { color:var(--red-bright);cursor:default; }
.arena-vote-btn:disabled { cursor:default; }

.arena-input-bar { flex-shrink:0;border-top:1px solid var(--border);background:rgba(5,14,12,0.99);padding:0.6rem clamp(0.7rem,2vw,1.2rem);backdrop-filter:blur(8px); }
.arena-img-preview-strip { display:flex;align-items:center;gap:0.6rem;margin-bottom:0.5rem;padding:0.4rem 0.5rem;background:rgba(0,0,0,0.3);border:1px dashed var(--border); }
.arena-img-thumb  { height:48px;width:auto;max-width:80px;object-fit:cover;border:1px solid var(--border);filter:saturate(0.8); }
.arena-img-remove { background:transparent;border:1px solid rgba(212,37,107,0.3);color:var(--magenta);font-size:0.7rem;padding:0.25rem 0.5rem;cursor:pointer;margin-left:auto;transition:background 0.2s;min-height:28px;min-width:28px; }
.arena-img-remove:hover { background:rgba(212,37,107,0.1); }
.arena-input-row { display:flex;align-items:flex-end;gap:0.5rem; }
.arena-attach-label { font-size:1.1rem;cursor:pointer;padding:0.45rem;color:var(--text-dim);transition:color 0.2s;flex-shrink:0;line-height:1;min-height:40px;display:flex;align-items:center; }
.arena-attach-label:hover { color:var(--text-bright); }
.arena-text-input { flex:1;background:var(--surface2);border:1px solid var(--border);color:var(--text-bright);font-family:var(--font-mono);font-size:0.82rem;padding:0.6rem 0.8rem;outline:none;resize:none;line-height:1.5;min-height:40px;max-height:120px;transition:border-color 0.2s;box-sizing:border-box;overflow-y:auto; }
.arena-text-input:focus { border-color:var(--red-bright); }
.arena-text-input::placeholder { color:var(--text-dim);opacity:0.6; }
.arena-send-btn { flex-shrink:0;background:var(--red-dim);border:1px solid var(--red-bright);color:var(--text-bright);font-family:var(--font-mono);font-size:0.8rem;width:42px;height:40px;cursor:pointer;transition:all 0.2s;display:flex;align-items:center;justify-content:center; }
.arena-send-btn:hover:not(.disabled) { background:var(--red); }
.arena-send-btn.disabled { opacity:0.4;cursor:not-allowed; }
.arena-input-hint { font-family:var(--font-mono);font-size:0.52rem;color:var(--text-dim);letter-spacing:0.1em;margin-top:0.4rem;opacity:0.6;text-align:center; }

/* ================================================================
   CONFESSION WALL
   ================================================================ */
.wall-controls { display:flex;gap:1rem;align-items:center;margin-bottom:2rem;flex-wrap:wrap; }
.wall-toggle-btn { font-family:var(--font-mono);font-size:0.65rem;letter-spacing:0.3em;text-transform:uppercase;padding:0.5rem 1.2rem;background:transparent;border:1px solid var(--border);color:var(--text-dim);cursor:pointer;transition:all 0.2s;min-height:38px; }
.wall-toggle-btn.active { border-color:var(--red);color:var(--red);background:rgba(0,191,165,0.06); }
.confess-form { background:var(--surface);border:1px solid var(--border);padding:clamp(1rem,3vw,1.5rem);margin-bottom:2.5rem; }
.confess-label { font-size:0.65rem;letter-spacing:0.4em;color:var(--text-dim);text-transform:uppercase;margin-bottom:0.8rem;display:block; }
.confess-textarea { width:100%;background:rgba(0,0,0,0.5);border:1px solid var(--border);color:var(--text);font-family:var(--font-mono);font-size:0.88rem;padding:1rem;resize:vertical;min-height:100px;outline:none;line-height:1.7;margin-bottom:0.8rem; }
.confess-textarea:focus { border-color:var(--red-dim); }
.confess-note { font-size:0.65rem;color:var(--text-dim);line-height:1.5;margin-bottom:1rem; }
.confessions-grid { columns:3;column-gap:clamp(1rem,2vw,1.5rem); }
.confession-card { break-inside:avoid;margin-bottom:clamp(1rem,2vw,1.5rem);background:var(--surface);border:1px solid var(--border);padding:clamp(1rem,2.5vw,1.5rem);position:relative;overflow:hidden;animation:card-in 0.4s ease both;transition:border-color 0.3s; }
.confession-card:hover { border-color:rgba(0,191,165,0.3); }
.confession-card.glitch-card { animation:glitch-main 0.3s; }
.confession-card.trending { border-color:rgba(0,191,165,0.38);background:linear-gradient(135deg,rgba(0,191,165,0.05),rgba(0,0,0,0)); }
.conf-trending-badge { position:absolute;top:0;right:0;background:var(--magenta-dim);padding:0.2rem 0.6rem;font-size:0.55rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--text-bright); }
.conf-text  { font-size:0.88rem;line-height:1.8;color:var(--text);margin-bottom:1.2rem; }
.conf-meta  { font-size:0.6rem;color:var(--text-dim);letter-spacing:0.2em;margin-bottom:0.8rem; }
.conf-reactions { display:flex;flex-wrap:wrap;gap:0.5rem; }
.react-btn { font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.15em;padding:0.3rem 0.7rem;border:1px solid var(--border);background:transparent;color:var(--text-dim);cursor:pointer;transition:all 0.15s; }
.react-btn:hover { border-color:var(--red);color:var(--text); }
.react-btn.reacted { border-color:var(--red);color:var(--red);background:rgba(0,191,165,0.08); }
.react-count { color:var(--magenta);margin-left:0.3rem; }

/* ================================================================
   AUTH SCREEN
   ================================================================ */
.auth-gate { position:fixed;inset:0;background:var(--bg);display:flex;align-items:flex-start;justify-content:center;z-index:9000;overflow-y:auto;padding:1.5rem 1rem; }
@media (min-height:700px) { .auth-gate { align-items:center;padding:1rem; } }

.auth-box { position:relative;z-index:10;width:min(440px,calc(100vw - 2rem));background:var(--surface);border:1px solid var(--border);padding:clamp(1.5rem,5vw,2.8rem) clamp(1.2rem,5vw,2.4rem);animation:fadeIn 0.5s ease;box-shadow:0 0 60px rgba(0,191,165,0.06);margin:auto; }
.auth-logo {
  font-family: var(--font-head);
  font-size: clamp(2.2rem, 10vw, 3.5rem);
  letter-spacing: 0.3em;
  color: var(--text-bright);
  text-align: center;
  margin-bottom: 0.4rem;
  text-transform: uppercase;
  text-shadow: 4px 4px 0 var(--magenta-dim), -2px -2px 0 rgba(0,191,165,0.25);
  -webkit-text-stroke: 1.5px var(--text-bright);
  paint-order: stroke fill;
  animation: flicker 8s infinite;
  position: relative;
  display: block;
  line-height: 1;
}
.auth-logo::before, .auth-logo::after {
  content: attr(data-text);
  position: absolute;
  top: 0; left: 0; right: 0;
  font-family: inherit;
  font-size: inherit;
  letter-spacing: inherit;
  text-align: center;
}
.auth-logo::before {
  color: var(--magenta);
  animation: glitch-shift 6s infinite;
  clip-path: polygon(0 0, 100% 0, 100% 40%, 0 40%);
}
.auth-logo::after {
  color: var(--teal-bg);
  animation: glitch-shift 6s infinite 0.1s;
  clip-path: polygon(0 60%, 100% 60%, 100% 100%, 0 100%);
  opacity: 0.5;
}
.auth-tagline { font-family:var(--font-mono);font-size:clamp(0.55rem,1.5vw,0.65rem);letter-spacing:0.15em;color:var(--text-dim);text-align:center;text-transform:uppercase;margin-bottom:2rem;line-height:1.6; }
.auth-welcome-text { font-family:var(--font-mono);font-size:0.72rem;color:var(--text-dim);line-height:1.8;text-align:center;margin-bottom:1.5rem; }
.auth-btn-group { display:flex;flex-direction:column;gap:0.75rem; }
.auth-form { display:flex;flex-direction:column;gap:0; }
.auth-field { margin-bottom:1rem; }
.auth-form-title { font-family:var(--font-head);font-size:clamp(1.05rem,3vw,1.3rem);letter-spacing:0.12em;color:var(--text-bright);text-transform:uppercase;margin-bottom:1.2rem;display:flex;align-items:center;gap:0.5rem; }
.auth-label { display:block;font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.3em;color:var(--text-dim);text-transform:uppercase;margin-bottom:0.4rem; }

.auth-input { width:100%;min-height:44px;background:var(--surface2);border:1px solid var(--border);color:var(--text-bright);font-family:var(--font-mono);font-size:0.85rem;padding:0.65rem 0.9rem;outline:none;transition:border-color 0.2s,background 0.2s;box-sizing:border-box;letter-spacing:0.04em;border-radius:0;-webkit-appearance:none;appearance:none; }
.auth-input:focus { border-color:var(--red-bright);background:rgba(0,191,165,0.04); }

.auth-pw-wrap { display:flex;gap:0;align-items:stretch; }
.auth-pw-wrap .auth-input { flex:1;border-right:none; }
.auth-pw-toggle { flex-shrink:0;min-width:52px;min-height:44px;background:var(--surface2);border:1px solid var(--border);border-left:1px solid rgba(0,191,165,0.15);color:var(--text-dim);font-family:var(--font-mono);font-size:0.56rem;letter-spacing:0.12em;text-transform:uppercase;padding:0 0.7rem;cursor:pointer;white-space:nowrap;transition:all 0.2s; }
.auth-pw-toggle:hover { background:rgba(0,191,165,0.06);border-color:var(--border-bright);color:var(--text-bright); }
.auth-pw-wrap:focus-within .auth-input,
.auth-pw-wrap:focus-within .auth-pw-toggle { border-color:var(--red-bright); }

.auth-btn-primary { width:100%;min-height:48px;background:var(--red-dim);border:1px solid var(--red-bright);color:var(--text-bright);font-family:var(--font-mono);font-size:0.74rem;letter-spacing:0.2em;text-transform:uppercase;padding:0.75rem 1rem;cursor:pointer;transition:all 0.2s;margin-top:0.3rem; }
.auth-btn-primary:hover:not(:disabled) { background:var(--red);border-color:var(--red-bright); }
.auth-btn-primary:disabled { opacity:0.5;cursor:not-allowed; }
.auth-btn-secondary { width:100%;min-height:48px;background:transparent;border:1px solid var(--border);color:var(--text-dim);font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.25em;text-transform:uppercase;padding:0.75rem 1rem;cursor:pointer;transition:all 0.2s; }
.auth-btn-secondary:hover { border-color:var(--border-bright);color:var(--text); }
.auth-btn-google { width:100%;min-height:48px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.14);color:var(--text-bright);font-family:var(--font-mono);font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;padding:0.75rem 1rem;cursor:pointer;transition:all 0.2s;display:flex;align-items:center;justify-content:center;gap:0.7rem;margin-top:0.3rem; }
.auth-btn-google:hover:not(:disabled) { background:rgba(255,255,255,0.09);border-color:rgba(255,255,255,0.28); }

.auth-separator { display:flex;align-items:center;gap:0.8rem;color:var(--text-dim);font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.25em;text-transform:uppercase;margin:0.4rem 0; }
.auth-separator::before,.auth-separator::after { content:'';flex:1;height:1px;background:var(--border); }
.auth-divider { display:flex;align-items:center;gap:0.8rem;color:var(--text-dim);font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.2em; }
.auth-divider::before,.auth-divider::after { content:'';flex:1;height:1px;background:var(--border); }

.auth-google-email-chip { display:flex;align-items:center;gap:0.6rem;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);padding:0.55rem 0.9rem;margin-bottom:1.1rem;font-family:var(--font-mono);font-size:0.72rem;color:var(--text-bright);letter-spacing:0.05em;word-break:break-all; }
.auth-info-box { background:rgba(0,191,165,0.05);border:1px solid rgba(0,191,165,0.2);border-left:3px solid var(--red-bright);padding:0.8rem 1rem;font-family:var(--font-mono);font-size:0.65rem;color:var(--text-dim);line-height:1.9;margin:0.8rem 0 1rem; }
.auth-info-box strong { color:var(--text-bright);font-weight:600; }
.auth-google-note { font-family:var(--font-mono);font-size:0.65rem;color:var(--text-dim);line-height:1.7;margin-bottom:1.2rem; }

.auth-sent-icon  { font-size:2.4rem;text-align:center;display:block;margin-bottom:0.8rem; }
.auth-sent-steps { display:flex;flex-direction:column;gap:0.5rem;margin:1rem 0;padding:0.9rem 1rem;background:rgba(0,0,0,0.25);border:1px solid var(--border); }
.auth-sent-step  { display:flex;align-items:flex-start;gap:0.75rem;font-family:var(--font-mono);font-size:0.68rem;color:var(--text-dim);line-height:1.5; }
.auth-step-num   { display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;min-width:18px;background:var(--red-dim);border:1px solid var(--red-bright);color:var(--red-bright);font-family:var(--font-mono);font-size:0.58rem;font-weight:700;border-radius:2px;flex-shrink:0;margin-top:0.05rem; }

.auth-nav-links { display:flex;flex-direction:column;align-items:center;gap:0.45rem;margin-top:1rem;padding-top:0.8rem;border-top:1px solid var(--border); }
.auth-link { background:transparent;border:none;color:var(--text-dim);font-family:var(--font-mono);font-size:0.62rem;letter-spacing:0.1em;cursor:pointer;padding:0.25rem 0;transition:color 0.2s;text-align:center;min-height:32px;display:flex;align-items:center; }
.auth-link:hover { color:var(--red-bright); }
.auth-back { background:transparent;border:none;color:var(--text-dim);font-family:var(--font-mono);font-size:0.62rem;letter-spacing:0.15em;cursor:pointer;padding:0.3rem 0;text-decoration:underline;text-underline-offset:3px;transition:color 0.2s;margin-top:0.5rem;display:block;min-height:32px; }
.auth-back:hover { color:var(--text-bright); }
.auth-error   { font-family:var(--font-mono);font-size:0.65rem;color:#EF5350;margin:0.5rem 0 0.8rem;padding:0.45rem 0.7rem;border-left:2px solid #EF5350;background:rgba(239,83,80,0.07); }
.auth-success { font-family:var(--font-mono);font-size:0.68rem;color:var(--green);margin:0.5rem 0 0.8rem;padding:0.5rem 0.8rem;border-left:2px solid var(--green);background:rgba(0,255,65,0.05);line-height:1.5; }
.auth-form .auth-btn-primary,.auth-form .auth-btn-google { margin-top:0.5rem; }

.google-icon    { display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;background:linear-gradient(135deg,#4285F4,#EA4335,#FBBC05,#34A853);border-radius:50%;font-size:10px;font-weight:700;color:white;font-style:normal;flex-shrink:0; }
.google-icon-lg { display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:linear-gradient(135deg,#4285F4,#EA4335,#FBBC05,#34A853);border-radius:50%;font-size:13px;font-weight:700;color:white;margin-right:0.5rem; }
.auth-google-email-chip .google-icon { flex-shrink:0; }

/* Auth extra */
.auth-separator { display:flex;align-items:center;gap:0.8rem;color:var(--text-dim);font-family:var(--font-mono);font-size:0.58rem;letter-spacing:0.25em;text-transform:uppercase;margin:0.4rem 0; }
.auth-separator::before,.auth-separator::after { content:'';flex:1;height:1px;background:var(--border); }

/* ================================================================
   ARENA (old debate styles — kept for any leftover markup)
   ================================================================ */
.arena-intro { background:linear-gradient(135deg,rgba(0,191,165,0.06),rgba(0,0,0,0));border:1px solid var(--border);padding:1.5rem 2rem;margin-bottom:2rem;font-size:0.82rem;color:var(--text-dim);line-height:1.8;border-left:3px solid var(--red); }

/* ================================================================
   TERMINAL AUTH LINKS
   ================================================================ */
.terminal-auth-links { margin-top:1.2rem;display:flex;flex-direction:column;gap:0.35rem;padding-top:0.8rem;border-top:1px solid rgba(0,191,165,0.1); }
.terminal-link { background:transparent;border:none;color:var(--text-dim);font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.1em;text-align:left;cursor:pointer;padding:0.2rem 0;transition:color 0.2s; }
.terminal-link:hover { color:var(--red-bright); }

/* ================================================================
   RESPONSIVE — LARGE SCREENS
   ================================================================ */
@media (min-width:1280px) {
  .section { max-width:1280px; }
  .confessions-grid { columns:4; }
  .challenges-grid { grid-template-columns:repeat(3,1fr); }
}
@media (min-width:1600px) {
  .section { max-width:1500px;padding:3.5rem 3rem; }
  .confessions-grid { columns:5; }
  .section-title { font-size:5rem; }
}

/* ================================================================
   RESPONSIVE — TABLET (≤1023px)
   ================================================================ */
@media (max-width:1023px) {
  .confessions-grid { columns:2; }
  .challenges-grid  { grid-template-columns:repeat(2,1fr); }
  .rank-stage-track { flex-direction:row;flex-wrap:wrap;max-width:100%;min-width:0; }
  .stage-name { display:none; }
}
@media (max-width:900px) {
  .char-guides-row { grid-template-columns:1fr; }
  .char-guide.align-right { flex-direction:row; }
  .char-guide.align-right .char-content { align-items:flex-start;text-align:left; }
  .char-guide.align-right .char-bubble { border-left:2px solid var(--magenta);border-right:none; }
  .char-guide.align-right .char-name-tag { flex-direction:row; }
  .char-guide.align-right .char-refresh-btn { align-self:flex-start; }
  .arena-rooms-grid { grid-template-columns:1fr; }
}

/* ================================================================
   RESPONSIVE — TABLET SMALL (≤767px)
   ================================================================ */
@media (max-width:767px) {
  .main-nav { grid-template-columns:auto 1fr auto;min-height:56px;padding:0 1rem;gap:0.5rem; }
  .nav-logo { font-size:1.6rem;letter-spacing:0.2em; }
  .nav-tab  { font-size:0.58rem;padding:0.3rem 0.65rem; }
  .section  { padding:1.5rem 1rem; }
  .section-title { font-size:clamp(1.8rem,7vw,3rem); }
  .rank-panel { grid-template-columns:1fr;gap:1rem; }
  .challenges-grid { grid-template-columns:1fr; }
  .confessions-grid { columns:1; }
  .wall-controls { flex-wrap:wrap;gap:0.5rem; }
  .arena-msg { max-width:88%; }
}

/* ================================================================
   RESPONSIVE — MOBILE (≤479px)
   ================================================================ */
@media (max-width:479px) {
  html { font-size:15px; }
  .main-nav { padding:0 0.8rem;min-height:60px;gap:0.2rem;grid-template-columns:auto 1fr auto; }
  .nav-logo  { font-size:1.8rem;letter-spacing:0.18em; }
  .nav-tabs  { gap:0;justify-content:flex-end; }
  .nav-tab   {
    font-family: var(--font-head);
    font-size: 1rem;
    padding: 0.3rem 0.6rem;
    letter-spacing: 0.12em;
    min-height: 60px;
    border: none !important;
    background: transparent !important;
    color: var(--text-dim);
  }
  .nav-tab:hover { border: none !important; background: transparent !important; color: var(--text); }
  .nav-tab.active {
    border: none !important;
    background: transparent !important;
    color: var(--red-bright);
  }
  .nav-tab.active::after { height: 2px; bottom: 0; }
  .nav-tab-full  { display: none; }
  .nav-tab-short { display: inline; }
  .nav-user-info { display:none; }
  .nav-chevron   { display:none; }
  .nav-user { padding:0.2rem;gap:0;border:none;background:transparent; }
  .nav-user:hover { border:none;background:transparent; }
  .user-menu { right:0.5rem;min-width:200px; }

  .section { padding:1rem 0.75rem; }
  .section-eyebrow { font-size:0.55rem; }
  .section-title { font-size:clamp(1.6rem,9vw,2.2rem); }
  .section-header { margin-bottom:1.2rem; }

  .entry-content { padding:1rem; }
  .terminal-block { padding:1rem;font-size:0.62rem;line-height:1.9; }
  .entry-input-wrap { flex-direction:column;align-items:stretch;margin-top:1rem; }
  .entry-input-row { width:100%;gap:0.5rem; }
  .entry-prompt { font-size:0.8rem; }
  .entry-enter-btn { width:100%;font-size:0.68rem;padding:0.6rem;text-align:center;min-height:44px; }

  .rank-panel { padding:0.9rem;gap:0.8rem; }
  .rank-level-num { font-size:1.8rem; }
  .rank-current-name { font-size:1.05rem; }

  .char-guides-row { gap:0.7rem; }
  .char-guide { padding:0.75rem;gap:0.5rem; }
  .char-avatar { width:40px;min-width:40px;height:60px; }
  .char-speech { font-size:0.72rem; }
  .char-bubble { padding:0.5rem 0.65rem;min-height:44px; }
  .char-refresh-btn { font-size:0.55rem;padding:0.28rem 0.6rem; }

  .gender-btn { padding:0.9rem 0.5rem;min-height:64px; }
  .gender-label { font-size:0.75rem;letter-spacing:0.08em; }
  .gender-icon  { font-size:1.1rem; }
  .gender-sub   { display:none; }
  .path-manifesto { font-size:0.7rem;padding:0.75rem; }

  .cat-filter-row { flex-wrap:nowrap;overflow-x:auto;padding-bottom:0.4rem;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:0.35rem; }
  .cat-filter-row::-webkit-scrollbar { display:none; }
  .cat-filter-btn { flex-shrink:0;font-size:0.48rem;padding:0.28rem 0.6rem;white-space:nowrap; }

  .challenge-card { padding:0.9rem; }
  .ch-title { font-size:0.9rem;letter-spacing:0.05em; }
  .ch-category { font-size:0.5rem; }
  .ch-xp { font-size:1.3rem; }
  .ch-desc { font-size:0.74rem;line-height:1.65; }
  .ch-mission { font-size:0.7rem; }
  .ch-difficulty { font-size:0.55rem; }
  .btn-primary,.btn-secondary,.btn-green { font-size:0.6rem;padding:0.45rem 0.75rem;letter-spacing:0.1em;min-height:36px; }
  .ch-actions { gap:0.4rem; }
  .reflection-area { font-size:0.73rem;min-height:60px; }
  .tyler-response { padding:0.7rem 0.8rem; }
  .tyler-response-text { font-size:0.72rem;line-height:1.6; }

  .week-header { padding:0.7rem 0.8rem;gap:0.5rem; }
  .week-badge  { font-size:0.72rem;padding:0.12rem 0.5rem; }
  .week-title  { font-size:0.58rem; }
  .countdown-timer { font-size:0.9rem;min-width:70px; }
  .week-countdown { align-items:flex-start; }

  .arena-cat-row { flex-wrap:nowrap;overflow-x:auto;padding-bottom:0.3rem;scrollbar-width:none;-webkit-overflow-scrolling:touch; }
  .arena-cat-row::-webkit-scrollbar { display:none; }
  .arena-cat-btn { flex-shrink:0;font-size:0.52rem; }
  .arena-create-form { padding:1rem; }
  .arena-room-card { padding:1rem; }
  .arena-room-topic { font-size:0.88rem; }
  .arena-intro-bar { padding:0.7rem 0.9rem; }
  .arena-intro-text { font-size:0.68rem; }
  .arena-chat-header { padding:0.6rem 0.7rem;gap:0.5rem;min-height:50px; }
  .arena-back-btn { font-size:0.56rem;padding:0.3rem 0.55rem; }
  .arena-chat-topic { font-size:0.72rem; }
  .arena-messages { padding:0.7rem;gap:0.4rem; }
  .arena-msg { max-width:92%; }
  .arena-msg-text { font-size:0.76rem; }
  .arena-input-bar { padding:0.5rem 0.6rem; }
  .arena-text-input { font-size:0.78rem;padding:0.5rem 0.65rem; }
  .arena-send-btn { width:38px;height:38px;font-size:0.72rem; }
  .arena-input-hint { display:none; }

  .confess-form { padding:0.9rem; }
  .confess-textarea { font-size:0.78rem;min-height:80px; }
  .conf-text { font-size:0.82rem;line-height:1.75; }
  .conf-meta { font-size:0.55rem; }
  .wall-toggle-btn { font-size:0.58rem;padding:0.35rem 0.75rem; }
  .conf-reactions { gap:0.35rem; }
  .react-btn { font-size:0.58rem;padding:0.25rem 0.5rem; }

  .auth-gate { padding:1rem 0.75rem; }
  .auth-box  { padding:1.5rem 1.1rem; }
  .auth-form-title { font-size:1rem;margin-bottom:1rem; }
  .auth-input { font-size:0.82rem;min-height:44px; }
  .auth-btn-primary,.auth-btn-google { font-size:0.68rem;min-height:48px;letter-spacing:0.14em; }
  .auth-pw-toggle { min-width:46px;font-size:0.52rem; }
  .auth-info-box { font-size:0.62rem;padding:0.7rem 0.85rem; }
  .auth-google-email-chip { font-size:0.66rem;padding:0.5rem 0.75rem; }
  .auth-google-note { font-size:0.62rem; }
  .auth-sent-step { font-size:0.64rem; }
}

/* ================================================================
   VERY SMALL PHONES (≤360px)
   ================================================================ */
@media (max-width:360px) {
  .main-nav  { padding:0 0.6rem;gap:0.15rem;min-height:56px; }
  .nav-logo  { font-size:1.5rem;letter-spacing:0.12em; }
  .nav-tab   { font-size:0.9rem;padding:0.3rem 0.45rem; }
  .section   { padding:0.9rem 0.65rem; }
  .terminal-block { font-size:0.58rem;padding:0.85rem; }
  .challenge-card { padding:0.75rem; }
  .auth-box  { padding:1.2rem 0.9rem; }
  .section-title { font-size:1.5rem; }
}

/* ================================================================
   LANDSCAPE MOBILE
   ================================================================ */
@media (max-height:500px) and (orientation:landscape) {
  .entry-gate { align-items:flex-start;overflow-y:auto; }
  .entry-content { padding-top:0.8rem;padding-bottom:0.8rem; }
  .terminal-block { font-size:0.6rem;line-height:1.7; }
  .auth-gate { align-items:flex-start;overflow-y:auto; }
  .auth-box  { margin:0.5rem auto; }
  .main-nav  { min-height:42px; }
  .section   { min-height:unset;padding:1rem 0.9rem; }
}

/* ================================================================
   PRINT
   ================================================================ */
@media print {
  .scanlines-fixed,.noise-canvas,.scanline-overlay,.main-nav,.entry-gate { display:none!important; }
  body { background:white;color:black; }
  .section { padding:1rem; }
  .challenge-card { border:1px solid #ccc; }
}
