:root {
  --arc-paper: #f5f0df;
  --arc-paper-2: #ebe5d2;
  --arc-ink: #152626;
  --arc-teal: #18766f;
  --arc-teal-dark: #0d4f4b;
  --arc-mint: #9ecfb8;
  --arc-lime: #d7ef67;
  --arc-orange: #ff8a45;
  --arc-blue: #68c8d3;
  --arc-pink: #f05c87;
  --arc-white: #fffdf3;
  --arc-line: rgba(21, 38, 38, .24);
  --arc-hard-shadow: 5px 6px 0 var(--arc-ink);
  --arc-soft-shadow: 0 20px 50px rgba(14, 45, 43, .14);
}

html { background: var(--arc-paper); scroll-padding-top: 145px; }
body.arcade-v2 { background: var(--arc-paper); color: var(--arc-ink); font-family: var(--body); }
.arcade-v2 .page-noise { opacity: .045; mix-blend-mode: multiply; }
.arcade-v2 .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.arcade-v2 :focus-visible { outline: 3px solid var(--arc-orange); outline-offset: 3px; }

/* Header and HUD */
.arcade-v2 .site-header { background: var(--arc-ink); border-bottom: 3px solid var(--arc-ink); }
.arcade-v2 .site-nav { width: min(100%, 1500px); min-height: 74px; padding: 10px clamp(18px, 3.4vw, 52px); gap: 20px; }
.arcade-v2 .arcade-brand { align-items: center; gap: 8px; color: var(--arc-white); }
.arcade-v2 .brand-mark { display: grid; place-items: center; width: 38px; height: 38px; margin-right: 3px; color: var(--arc-ink); background: var(--arc-lime); border: 2px solid var(--arc-ink); border-radius: 11px 8px 10px 7px; box-shadow: 2px 3px 0 var(--arc-orange); font-size: 21px; transform: rotate(-4deg); }
.arcade-v2 .site-brand > span:nth-child(2) { font-size: clamp(13px, 1.25vw, 18px); }
.arcade-v2 .site-brand small { color: var(--arc-blue); opacity: 1; }
.arcade-v2 .arcade-nav-links { gap: clamp(10px, 2vw, 27px); }
.arcade-v2 .arcade-nav-links a { display: flex; align-items: center; gap: 6px; color: rgba(255,253,243,.74); font-family: var(--cn); font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.arcade-v2 .arcade-nav-links a > span { color: var(--arc-blue); font: 800 8px/1 ui-monospace, monospace; }
.arcade-v2 .arcade-nav-links a > b { font-weight: 800; }
.arcade-v2 .arcade-nav-links a::after { bottom: -10px; background: var(--arc-lime); }
.arcade-v2 .arcade-nav-links a:hover,
.arcade-v2 .arcade-nav-links a.nav-hovered,
.arcade-v2 .arcade-nav-links a.active { color: var(--arc-lime); }
.arcade-hud { display: flex; align-items: center; gap: 10px; }
.wallet-pill { min-width: 94px; height: 46px; padding: 4px 12px 4px 6px; display: flex; align-items: center; gap: 8px; color: var(--arc-ink); background: var(--arc-lime); border: 2px solid var(--arc-white); border-radius: 14px 10px 13px 9px; box-shadow: 3px 3px 0 var(--arc-orange); }
.wallet-pill:hover { transform: translateY(-2px); }
.wallet-spark { display: grid; place-items: center; width: 31px; height: 31px; color: var(--arc-lime); background: var(--arc-ink); border-radius: 50%; font-size: 17px; }
.wallet-pill > span:last-child { display: grid; grid-template-columns: auto; text-align: left; line-height: 1; }
.wallet-pill b { font: 900 17px/1 var(--body); }
.wallet-pill small { margin-top: 3px; font: 900 8px/1 ui-monospace, monospace; letter-spacing: .09em; }
.arcade-v2 .locale-switch { display: flex; overflow: hidden; border: 2px solid rgba(255,255,255,.65); border-radius: 10px 7px 9px 6px; }
.arcade-v2 .locale-switch button { min-width: 31px; height: 34px; padding: 0; color: rgba(255,255,255,.6); background: transparent; border: 0; font-size: 10px; font-weight: 900; }
.arcade-v2 .locale-switch button.active { color: var(--arc-ink); background: var(--arc-blue); }

.wallet-panel { position: fixed; z-index: 110; top: 84px; right: clamp(16px, 3vw, 48px); width: min(390px, calc(100vw - 32px)); max-height: calc(100dvh - 106px); overflow: auto; overscroll-behavior: contain; padding: 22px; color: var(--arc-ink); background: var(--arc-white); border: 3px solid var(--arc-ink); border-radius: 18px 10px 20px 12px; box-shadow: 9px 10px 0 var(--arc-teal-dark), var(--arc-soft-shadow); }
.wallet-panel > header { display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 15px; border-bottom: 2px dashed var(--arc-line); }
.wallet-panel header small, .wallet-panel header h2 { margin: 0; }
.wallet-panel header small { color: var(--arc-teal); font: 900 9px/1 ui-monospace, monospace; letter-spacing: .14em; }
.wallet-panel header h2 { margin-top: 6px; font-family: var(--cn); font-size: 24px; font-weight: 900; }
.wallet-panel header button { width: 34px; height: 34px; color: var(--arc-white); background: var(--arc-ink); border: 0; border-radius: 50%; font-size: 22px; }
.wallet-total { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; }
.wallet-total > span { font-size: 12px; font-weight: 800; }
.wallet-total strong { display: flex; align-items: center; gap: 8px; font-size: 32px; }
.wallet-total i { color: var(--arc-teal); font-style: normal; }
.wallet-ledger { display: grid; gap: 7px; }
.ledger-row { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 11px 12px; color: var(--arc-ink); background: var(--arc-white); border: 1px solid rgba(23,23,23,.24); border-radius: 9px 6px 8px 5px; }
.ledger-row strong { color: var(--arc-ink); font-size: 12px; overflow-wrap: anywhere; }
.ledger-row b { grid-row: 1 / 3; grid-column: 2; align-self: center; color: var(--arc-teal); font: 900 14px/1 ui-monospace, monospace; }
.ledger-row.spent b { color: var(--arc-pink); }
.ledger-row time { color: rgba(23,23,23,.68); font: 700 9px/1.2 ui-monospace, monospace; }
.device-note { display: flex; gap: 8px; margin: 16px 0 0; padding: 10px 11px; color: rgba(21,38,38,.7); background: rgba(104,200,211,.16); border: 1px solid rgba(21,38,38,.18); font-size: 10px; line-height: 1.55; }
.device-note > span:first-child { color: var(--arc-teal); }

/* Hero */
.arcade-v2 .identity-hero { background: var(--arc-paper); border-bottom-color: var(--arc-ink); }
.arcade-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 15% 18%, rgba(215,239,103,.7), transparent 19%), linear-gradient(rgba(24,118,111,.065) 1px, transparent 1px), linear-gradient(90deg, rgba(24,118,111,.065) 1px, transparent 1px); background-size: auto, 33px 33px, 33px 33px; mask-image: linear-gradient(to bottom, #000, transparent 85%); }
.arcade-hero-grid { position: relative; width: min(100%, 1400px); min-height: 620px; margin: 0 auto; padding: clamp(54px, 7vw, 100px) clamp(20px, 4vw, 60px) clamp(60px, 7vw, 100px); display: grid; grid-template-columns: minmax(360px, 1.05fr) minmax(330px, .9fr) minmax(250px, .55fr); align-items: center; gap: clamp(26px, 4vw, 68px); }
.arcade-hero-copy { position: relative; z-index: 2; }
.arcade-v2 .eyebrow { color: var(--arc-teal); font-size: 11px; }
.arcade-v2 .arcade-hero-copy h1 { margin: 0; color: var(--arc-ink); font-family: var(--cn); font-size: clamp(48px, 5.8vw, 86px); font-weight: 900; line-height: 1.02; letter-spacing: -.07em; text-transform: none; }
.arcade-v2 .arcade-hero-copy h1 span,
.arcade-v2 .arcade-hero-copy h1 em { display: block; padding: 0; margin: 0; font-size: 1em; font-style: normal; }
.arcade-v2 .arcade-hero-copy h1 span::before { display: none; }
.arcade-v2 .arcade-hero-copy h1 em { position: relative; width: fit-content; margin-top: 4px; }
.arcade-v2 .arcade-hero-copy h1 em::after { content: ""; position: absolute; left: -3%; right: -5%; bottom: 3px; z-index: -1; height: .28em; background: var(--arc-orange); clip-path: polygon(0 35%, 100% 0, 97% 85%, 3% 100%); opacity: .9; }
.arcade-v2.locale-en .arcade-hero-copy h1 { font-size: clamp(46px, 4.7vw, 68px); letter-spacing: -.06em; }
.arcade-v2 .identity-lede { max-width: 620px; margin-top: 25px; color: rgba(21,38,38,.72); font-family: var(--cn); font-size: clamp(15px, 1.35vw, 18px); font-weight: 600; line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 29px; }
.arcade-primary, .arcade-secondary { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 16px; padding: 0 18px; border: 3px solid var(--arc-ink); border-radius: 12px 7px 11px 6px; font-family: var(--cn); font-size: 13px; font-weight: 900; }
.arcade-primary { color: var(--arc-white); background: var(--arc-teal); box-shadow: 5px 5px 0 var(--arc-ink); }
.arcade-primary:hover { color: var(--arc-ink); background: var(--arc-lime); transform: translate(-2px,-2px); box-shadow: 7px 7px 0 var(--arc-ink); }
.arcade-primary b { font-size: 20px; }
.arcade-secondary { color: var(--arc-ink); background: transparent; box-shadow: none; }
.arcade-secondary:hover { background: var(--arc-white); transform: translateY(-2px); }
.arcade-secondary b { min-width: 21px; height: 21px; display: grid; place-items: center; color: var(--arc-white); background: var(--arc-pink); border-radius: 50%; font-size: 9px; }
.arcade-v2 .signal-chips span { color: var(--arc-ink); border-color: var(--arc-ink); background: rgba(255,253,243,.54); }
.arcade-v2 .signal-chips span:nth-child(2n) { color: var(--arc-teal-dark); border-color: var(--arc-teal); background: rgba(104,200,211,.16); }

.hero-machine { position: relative; height: 420px; border: 4px solid var(--arc-ink); border-radius: 92px 22px 55px 24px; background: var(--arc-teal); box-shadow: 12px 14px 0 var(--arc-ink), inset 0 0 0 8px rgba(255,255,255,.06); overflow: hidden; transform: rotate(-1deg); }
.hero-machine::before { content: ""; position: absolute; inset: 0; opacity: .25; background-image: radial-gradient(var(--arc-lime) 1px, transparent 1.2px); background-size: 7px 7px; }
.machine-light { position: absolute; width: 180px; height: 180px; right: -40px; top: -45px; background: var(--arc-lime); border: 3px solid var(--arc-ink); border-radius: 50%; opacity: .75; }
.machine-sign { position: absolute; z-index: 2; left: 22px; top: 25px; width: 116px; height: 88px; padding: 14px; color: var(--arc-ink); background: var(--arc-lime); border: 3px solid var(--arc-ink); border-radius: 13px 7px 14px 8px; box-shadow: 5px 5px 0 var(--arc-orange); transform: rotate(3deg); }
.machine-sign small, .machine-sign strong { display: block; font-family: var(--display); line-height: 1; }
.machine-sign small { font-size: 10px; }.machine-sign strong { margin-top: 4px; font-size: 22px; }.machine-sign i { position: absolute; right: 8px; top: 8px; font: 900 14px/1 ui-monospace, monospace; }
.hero-cases { position: absolute; z-index: 2; left: 9%; right: 7%; bottom: 78px; height: 245px; display: flex; align-items: flex-end; justify-content: center; gap: 10px; perspective: 800px; }
.hero-case { position: relative; width: 30%; max-width: 108px; height: 200px; overflow: hidden; color: var(--arc-white); background: var(--arc-orange); border: 4px solid var(--arc-ink); border-radius: 9px 9px 4px 4px; box-shadow: 5px 5px 0 rgba(21,38,38,.65); transform-origin: bottom center; }
.hero-case::before { content: ""; position: absolute; inset: 18px 8px 10px 21px; background: linear-gradient(135deg, rgba(255,255,255,.9), transparent 35%), repeating-linear-gradient(-35deg, transparent 0 12px, rgba(21,38,38,.18) 13px 17px); border: 2px solid var(--arc-ink); }
.hero-case span { position: absolute; z-index: 2; left: 3px; top: 4px; writing-mode: vertical-rl; font: 900 8px/1 ui-monospace, monospace; letter-spacing: .12em; }
.hero-case b { position: absolute; z-index: 2; right: 10px; bottom: 14px; font-family: var(--display); font-size: 30px; text-shadow: 2px 2px 0 var(--arc-ink); }
.hero-case.case-one { height: 224px; background: var(--arc-orange); transform: rotateY(8deg) rotate(-2deg); }.hero-case.case-two { height: 190px; background: var(--arc-blue); transform: translateY(-2px); }.hero-case.case-three { height: 210px; background: var(--arc-pink); transform: rotateY(-8deg) rotate(2deg); }
.machine-shelf { position: absolute; z-index: 3; left: 3%; right: 3%; bottom: 64px; height: 20px; background: var(--arc-lime); border: 4px solid var(--arc-ink); border-radius: 4px 4px 12px 12px; box-shadow: 0 8px 0 var(--arc-teal-dark); }
.machine-controls { position: absolute; z-index: 3; left: 24px; right: 24px; bottom: 14px; height: 34px; display: flex; align-items: center; gap: 8px; padding: 0 10px; background: var(--arc-teal-dark); border: 3px solid var(--arc-ink); border-radius: 9px; }
.machine-controls i { width: 10px; height: 10px; border-radius: 50%; background: var(--arc-orange); }.machine-controls i:nth-child(2) { background: var(--arc-lime); }.machine-controls i:nth-child(3) { background: var(--arc-blue); }.machine-controls b { margin-left: auto; color: var(--arc-lime); font: 900 8px/1 ui-monospace, monospace; letter-spacing: .1em; }

.daily-ticket { position: relative; align-self: center; padding: 24px 20px 20px; color: var(--arc-ink); background: var(--arc-white); border: 3px solid var(--arc-ink); box-shadow: 8px 9px 0 var(--arc-orange); transform: rotate(1.3deg); transition: border-color .2s ease, box-shadow .25s ease; }
.daily-ticket.is-ticket-hovered { border-color: var(--arc-pink); box-shadow: 11px 13px 0 var(--arc-pink), 0 22px 42px rgba(0,0,0,.2); will-change: transform; }
.daily-ticket::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .16; background-image: radial-gradient(var(--arc-ink) .7px, transparent .8px); background-size: 4px 4px; }
.daily-ticket > * { position: relative; }
.daily-ticket header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding-bottom: 14px; border-bottom: 2px dashed var(--arc-line); }
.daily-ticket header > span { font-family: var(--cn); font-size: 17px; font-weight: 900; }.daily-ticket header > b { font: 800 8px/1.2 ui-monospace, monospace; }.daily-ticket header i { font-style: normal; }
.ticket-date { display: flex; justify-content: space-between; gap: 10px; padding: 15px 0 11px; font: 800 9px/1 ui-monospace, monospace; }.ticket-date span { color: var(--arc-teal); }
.ticket-progress-row { display: flex; justify-content: space-between; align-items: center; font-size: 11px; font-weight: 800; }.ticket-progress-row strong { font: 900 18px/1 var(--body); }.ticket-progress-row i { font-style: normal; color: rgba(21,38,38,.4); }
.ticket-meter { height: 9px; margin-top: 8px; padding: 2px; background: var(--arc-paper-2); border: 2px solid var(--arc-ink); }.ticket-meter span { display: block; width: 0; height: 100%; background: var(--arc-pink); transition: width .45s cubic-bezier(.16,1,.3,1); }
.daily-ticket ul { list-style: none; margin: 16px 0; padding: 0; border-top: 1px solid var(--arc-line); }.daily-ticket li { display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px dashed var(--arc-line); font-size: 10px; font-weight: 700; }.daily-ticket li b { color: var(--arc-teal); font: 900 10px/1 ui-monospace, monospace; }
.daily-ticket footer { display: flex; justify-content: space-between; gap: 10px; padding-top: 4px; font-size: 9px; font-weight: 900; }.daily-ticket footer strong { color: var(--arc-pink); font-family: ui-monospace, monospace; }
.ticket-cut { position: absolute; z-index: 2; left: -3px; right: -3px; height: 8px; background: repeating-linear-gradient(90deg, transparent 0 8px, var(--arc-ink) 9px 11px, transparent 12px 18px); }.ticket-cut-top { top: -6px; }.ticket-cut-bottom { bottom: -6px; }
.arcade-v2 .signal-ticker { color: var(--arc-ink); background: var(--arc-lime); border-color: var(--arc-ink); }

/* Controls */
.arcade-v2 .control-deck { top: 74px; color: var(--arc-white); background: rgba(21,38,38,.96); border-bottom-color: var(--arc-orange); }
.arcade-v2 .control-inner { width: min(100%, 1320px); }
.arcade-v2 .control-label { color: var(--arc-lime); }
.arcade-v2 .date-select { color: var(--arc-white); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.2); }
.arcade-v2 .date-nav-btn:hover:not(:disabled) { background: var(--arc-lime); }
.arcade-v2 .archive-toggle { color: var(--arc-ink); background: var(--arc-blue); border-color: var(--arc-white); border-radius: 7px; }
.arcade-v2 .filter-btn.active { color: var(--arc-lime); border-bottom-color: var(--arc-lime); }
.arcade-v2 .search-input:focus { border-color: var(--arc-lime); }
.arcade-v2 #readingProgressBar { background: var(--arc-orange); }

/* Main and daily shelves */
.arcade-v2 .site-main { color: var(--arc-ink); background: var(--arc-paper); }
.arcade-v2 .main-grid { width: min(100%, 1320px); display: block; padding: clamp(45px, 6vw, 78px) clamp(18px, 4vw, 54px) clamp(80px, 8vw, 120px); }
.arcade-summary { position: relative; display: grid; grid-template-columns: 180px 1fr auto; align-items: center; gap: clamp(18px, 3vw, 42px); padding: 21px 24px; color: var(--arc-ink); background: var(--arc-white); border: 3px solid var(--arc-ink); border-radius: 13px 7px 14px 8px; box-shadow: 6px 7px 0 var(--arc-teal); }
.arcade-v2 .summary-banner::before { display: none; }.arcade-v2 .summary-meta { color: var(--arc-teal-dark); font-weight: 900; white-space: nowrap; }.arcade-v2 .summary-text { margin: 0; color: rgba(21,38,38,.76); font-family: var(--cn); font-size: 13px; font-weight: 600; line-height: 1.7; }
.summary-stamp { padding: 8px 10px; text-align: center; color: var(--arc-ink); background: var(--arc-lime); border: 2px solid var(--arc-ink); transform: rotate(2deg); }.summary-stamp span { display: block; font: 900 7px/1 ui-monospace, monospace; letter-spacing: .08em; }.summary-stamp b { display: block; margin-top: 3px; font: 900 18px/1 var(--body); }
.arcade-shelf-section { margin-top: clamp(66px, 8vw, 105px); }
.arcade-block-head { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 20px; margin-bottom: 26px; padding: 0 0 15px; border-bottom: 0; }
.arcade-v2 .block-kicker { color: var(--arc-teal); font-size: 9px; }.arcade-v2 .block-title { margin-top: 8px; color: var(--arc-ink); font-family: var(--cn); font-size: clamp(33px, 4vw, 54px); font-weight: 900; letter-spacing: -.05em; }.arcade-v2 .block-description { color: rgba(21,38,38,.66); font-family: var(--cn); font-weight: 600; }.arcade-v2 .block-count { color: var(--arc-ink); background: var(--arc-blue); border: 2px solid var(--arc-ink); border-radius: 7px 5px 6px 4px; font-weight: 900; }.arcade-v2 .section-rule { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--arc-ink); }
.shelf-track-wrap { position: relative; padding: 24px 24px 54px; background: rgba(24,118,111,.09); border: 3px solid var(--arc-ink); border-bottom: 0; border-radius: 22px 22px 0 0; overflow: hidden; }
.shelf-track-wrap::before { content: ""; position: absolute; inset: 0; opacity: .3; background-image: linear-gradient(rgba(24,118,111,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(24,118,111,.15) 1px, transparent 1px); background-size: 30px 30px; }
.cassette-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(12px, 1.7vw, 24px); align-items: end; }
.ai-shelf-wrap .cassette-grid { grid-template-columns: minmax(230px, 310px); }
.shelf-plank { position: absolute; z-index: 4; left: -4px; right: -4px; bottom: 0; height: 38px; background: var(--arc-teal); border: 4px solid var(--arc-ink); box-shadow: 0 9px 0 var(--arc-teal-dark), 0 14px 0 var(--arc-ink); }.shelf-plank span { position: absolute; left: 20px; top: 8px; width: 72px; height: 12px; background: var(--arc-lime); border: 2px solid var(--arc-ink); border-radius: 2px; }

.cassette-card { position: relative; min-width: 0; display: flex; flex-direction: column; color: var(--arc-ink); background: var(--arc-white); border: 3px solid var(--arc-ink); border-radius: 10px 10px 5px 5px; box-shadow: 5px 6px 0 rgba(21,38,38,.72); overflow: hidden; transform-origin: 50% 100%; will-change: transform; }
.cassette-card[data-card-read] { cursor: pointer; }
.cassette-card::before { content: attr(data-index); position: absolute; z-index: 5; left: 7px; top: 7px; width: 27px; height: 27px; display: grid; place-items: center; color: var(--arc-white); background: var(--arc-ink); border: 2px solid var(--arc-white); border-radius: 50%; font: 900 9px/1 ui-monospace, monospace; }
.cassette-card::after { content: "GAME"; position: absolute; z-index: 4; left: 0; top: 0; bottom: 0; width: 14px; padding-top: 42px; color: var(--arc-white); background: var(--arc-orange); border-right: 2px solid var(--arc-ink); writing-mode: vertical-rl; font: 900 7px/1 ui-monospace, monospace; letter-spacing: .14em; text-align: left; }
.cassette-card.type-ai::after { content: "AI SIGNAL"; background: var(--arc-blue); color: var(--arc-ink); }
.cassette-card.is-collected::after { content: "COLLECTED"; background: var(--arc-pink); }
.cassette-media { position: relative; aspect-ratio: 4 / 5; margin-left: 14px; overflow: hidden; border-bottom: 3px solid var(--arc-ink); background: var(--arc-teal); }
.cassette-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(125deg, rgba(255,255,255,.36), transparent 28%), linear-gradient(to top, rgba(21,38,38,.45), transparent 45%); }
.cassette-media .content-image, .cassette-media .image-fallback { width: 100%; height: 100%; object-fit: cover; display: block; }
.cassette-media-label { position: absolute; z-index: 3; left: 10px; right: 8px; bottom: 8px; display: flex; align-items: flex-end; justify-content: space-between; gap: 5px; color: var(--arc-white); font: 800 7px/1.2 ui-monospace, monospace; text-shadow: 1px 1px 0 var(--arc-ink); }
.cassette-media-label b { padding: 5px; color: var(--arc-ink); background: var(--arc-lime); border: 1px solid var(--arc-ink); text-shadow: none; }
.cassette-body { flex: 1; display: flex; flex-direction: column; padding: 12px 11px 11px 23px; }
.cassette-tags { display: flex; flex-wrap: wrap; gap: 5px; color: var(--arc-teal-dark); font: 900 7px/1 ui-monospace, monospace; letter-spacing: .06em; text-transform: uppercase; }
.cassette-card h3 { min-height: 4.35em; margin: 8px 0 7px; display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; font-family: var(--cn); font-size: clamp(13px, 1.15vw, 16px); font-weight: 900; line-height: 1.45; letter-spacing: -.015em; }
.cassette-card p { display: none; }
.cassette-actions { margin-top: auto; display: grid; grid-template-columns: 1fr auto; gap: 6px; padding-top: 9px; border-top: 1px dashed var(--arc-line); }
.cassette-open, .collect-button { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--arc-ink); border-radius: 7px 5px 6px 4px; font-size: 9px; font-weight: 900; }
.cassette-open { color: var(--arc-white); background: var(--arc-teal-dark); }.cassette-open:hover { color: var(--arc-ink); background: var(--arc-lime); }
.collect-button { min-width: 54px; padding: 0 6px; color: var(--arc-ink); background: var(--arc-white); font-size: 8px; letter-spacing: .02em; }.collect-button:hover, .collect-button.is-collected { color: var(--arc-white); background: var(--arc-pink); }
.cassette-reward { position: absolute; z-index: 5; right: 7px; top: 7px; padding: 5px 6px; color: var(--arc-ink); background: var(--arc-lime); border: 2px solid var(--arc-ink); border-radius: 5px; font: 900 8px/1 ui-monospace, monospace; }

/* Unlock modules */
.unlock-zone { margin-top: clamp(90px, 11vw, 155px); padding: clamp(40px, 6vw, 76px); color: var(--arc-white); background: var(--arc-ink); border: 4px solid var(--arc-ink); border-radius: 36px 12px 42px 14px; box-shadow: 13px 15px 0 var(--arc-teal); }
.unlock-zone-head { max-width: 760px; margin-bottom: 42px; }.unlock-zone-head > span { color: var(--arc-lime); font: 900 9px/1 ui-monospace, monospace; letter-spacing: .14em; }.unlock-zone-head h2 { margin: 10px 0 10px; font-family: var(--cn); font-size: clamp(38px, 5vw, 66px); font-weight: 900; letter-spacing: -.05em; }.unlock-zone-head p { margin: 0; color: rgba(255,253,243,.65); font-family: var(--cn); font-size: 13px; font-weight: 600; line-height: 1.7; }
.unlock-modules { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }.unlock-module { position: relative; min-width: 0; margin: 0; padding: 0 0 20px; color: var(--arc-ink); background: var(--arc-paper); border: 3px solid var(--arc-white); border-radius: 18px 9px 20px 10px; overflow: hidden; box-shadow: 6px 7px 0 var(--arc-orange); }.video-module { box-shadow: 6px 7px 0 var(--arc-blue); }
.module-ticket { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: end; padding: 24px; background: var(--arc-white); border-bottom: 2px dashed var(--arc-line); }.module-ticket span { color: var(--arc-teal); font: 900 8px/1 ui-monospace, monospace; letter-spacing: .12em; }.module-ticket h2 { margin: 7px 0 5px; font-family: var(--cn); font-size: 29px; font-weight: 900; }.module-ticket p { max-width: 390px; margin: 0; color: rgba(21,38,38,.62); font-size: 11px; font-weight: 600; line-height: 1.55; }
.module-unlock { min-width: 102px; padding: 10px 12px; color: var(--arc-white); background: var(--arc-teal); border: 2px solid var(--arc-ink); border-radius: 8px 5px 8px 4px; box-shadow: 3px 3px 0 var(--arc-ink); }.module-unlock span, .module-unlock b { display: block; color: inherit; }.module-unlock span { font-family: var(--cn); font-size: 9px; letter-spacing: 0; }.module-unlock b { margin-top: 4px; font: 900 13px/1 ui-monospace, monospace; }.module-unlock:hover { color: var(--arc-ink); background: var(--arc-lime); transform: translate(-1px,-1px); }.module-unlock.is-unlocked { color: var(--arc-ink); background: var(--arc-lime); box-shadow: none; cursor: default; }
.unlock-module .longreads-list, .unlock-module .videos-grid { display: grid; grid-template-columns: 1fr; gap: 8px; padding: 16px 18px 0; }
.unlock-module .longread-card, .unlock-module .video-card { position: relative; min-height: 92px; display: grid; grid-template-columns: 112px 1fr; color: var(--arc-ink); background: var(--arc-white); border: 2px solid var(--arc-ink); box-shadow: none; overflow: hidden; }.unlock-module .video-card { grid-template-columns: 145px 1fr; }
.unlock-module .longread-image, .unlock-module .video-thumb { min-height: 100%; height: 100%; aspect-ratio: auto; border-right: 2px solid var(--arc-ink); overflow: hidden; }.unlock-module .longread-image .content-image, .unlock-module .video-thumb .content-image { width: 100%; height: 100%; object-fit: cover; }.unlock-module .longread-body, .unlock-module .video-body { padding: 12px; }.unlock-module .longread-title, .unlock-module .video-title { margin: 0; font-family: var(--cn); font-size: 12px; font-weight: 900; line-height: 1.45; }.unlock-module .longread-summary, .unlock-module .video-summary, .unlock-module .longread-meta, .unlock-module .video-meta { display: none; }.unlock-module .video-play { width: 32px; height: 32px; }.unlock-module .video-duration { font-size: 7px; }
.premium-actions { display: flex; gap: 5px; margin-top: 9px; }.premium-actions a, .premium-actions button { min-height: 31px; display: grid; place-items: center; padding: 0 9px; color: var(--arc-white); background: var(--arc-teal-dark); border: 2px solid var(--arc-ink); border-radius: 5px; font-size: 8px; font-weight: 900; }.premium-actions button { width: 32px; padding: 0; color: var(--arc-ink); background: var(--arc-lime); font-size: 14px; }
.unlock-module:not(.is-unlocked) .longread-card, .unlock-module:not(.is-unlocked) .video-card { pointer-events: none; filter: grayscale(.8); }
.unlock-module:not(.is-unlocked) .longread-card::after, .unlock-module:not(.is-unlocked) .video-card::after { content: "LOCKED"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--arc-white); background: rgba(21,38,38,.72); backdrop-filter: blur(3px); font: 900 10px/1 ui-monospace, monospace; letter-spacing: .14em; }
.module-count { position: absolute; right: 14px; bottom: 10px; margin: 0; font-size: 8px; }

/* Personal library */
.inspiration-library { margin-top: clamp(100px, 12vw, 170px); padding: clamp(28px, 5vw, 62px); background: var(--arc-teal); border: 4px solid var(--arc-ink); border-radius: 18px 50px 18px 55px; box-shadow: 13px 15px 0 var(--arc-ink); }
.library-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-bottom: 25px; color: var(--arc-white); border-bottom: 2px solid rgba(255,255,255,.34); }.library-head span { color: var(--arc-lime); font: 900 9px/1 ui-monospace, monospace; letter-spacing: .13em; }.library-head h2 { margin: 9px 0 5px; font-family: var(--cn); font-size: clamp(40px, 5vw, 65px); font-weight: 900; letter-spacing: -.055em; }.library-head p { margin: 0; color: rgba(255,255,255,.72); font-size: 13px; font-weight: 600; }.library-device-status { flex: 0 0 auto; display: flex; align-items: center; gap: 7px; padding: 8px 10px; color: var(--arc-ink); background: rgba(21,38,38,.35); border: 1px solid rgba(255,255,255,.45); border-radius: 99px; font-family: inherit; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }.library-device-status:hover { transform: translateY(-2px); box-shadow: 3px 4px 0 var(--arc-ink); }.library-device-status i { width: 7px; height: 7px; background: var(--arc-lime); border-radius: 50%; }.library-device-status.is-connected i { background: var(--arc-lime); box-shadow: 0 0 0 3px rgba(131,248,240,.25); }.library-device-status.is-offline i { background: var(--arc-white); }.library-device-status strong { font: 900 10px/1 ui-monospace, monospace; }.library-device-status span { color: var(--arc-white); font-family: var(--cn); font-size: 9px; letter-spacing: 0; }
.library-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 22px 0; }.library-search { flex: 1 1 280px; }.library-search input { width: 100%; height: 44px; padding: 0 14px; color: var(--arc-ink); background: var(--arc-white); border: 2px solid var(--arc-ink); border-radius: 9px 6px 8px 5px; outline: none; font-family: var(--cn); font-size: 12px; }.library-tags { display: flex; gap: 6px; flex-wrap: wrap; }.library-tag, .clear-library-filters { min-height: 35px; padding: 0 10px; color: var(--arc-white); background: rgba(21,38,38,.26); border: 1px solid rgba(255,255,255,.5); border-radius: 99px; font-size: 9px; font-weight: 800; }.library-tag.active { color: var(--arc-ink); background: var(--arc-lime); border-color: var(--arc-ink); }.clear-library-filters { color: var(--arc-ink); background: var(--arc-orange); border: 2px solid var(--arc-ink); border-radius: 6px; }
.library-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }.library-card { min-width: 0; padding: 10px; background: var(--arc-white); border: 3px solid var(--arc-ink); border-radius: 11px 7px 10px 6px; box-shadow: 5px 6px 0 var(--arc-teal-dark); }.library-card-image { position: relative; aspect-ratio: 16 / 10; overflow: hidden; border: 2px solid var(--arc-ink); }.library-card-image img { width: 100%; height: 100%; object-fit: cover; }.library-card-type { position: absolute; left: 6px; top: 6px; padding: 4px 6px; color: var(--arc-white); background: var(--arc-ink); font: 900 7px/1 ui-monospace, monospace; }.library-card h3 { min-height: 3em; margin: 10px 1px 7px; display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-family: var(--cn); font-size: 13px; font-weight: 900; line-height: 1.45; }.library-card-tags { display: flex; gap: 4px; flex-wrap: wrap; min-height: 20px; }.library-card-tags span { padding: 4px 6px; color: var(--arc-teal-dark); background: rgba(104,200,211,.18); border: 1px solid rgba(21,38,38,.24); border-radius: 99px; font-size: 8px; font-weight: 800; }.library-card-note { min-height: 3em; margin: 8px 1px; color: rgba(21,38,38,.65); font-size: 9px; line-height: 1.5; }.library-card-actions { display: grid; grid-template-columns: 1fr auto auto; gap: 5px; margin-top: 9px; }.library-card-actions a, .library-card-actions button { min-height: 34px; display: grid; place-items: center; padding: 0 9px; color: var(--arc-white); background: var(--arc-teal-dark); border: 2px solid var(--arc-ink); border-radius: 6px 4px 6px 3px; font-size: 9px; font-weight: 900; }.library-card-actions button { color: var(--arc-ink); background: var(--arc-paper); }.library-card-actions .remove-library { color: var(--arc-white); background: var(--arc-pink); }
.library-empty { padding: clamp(50px, 7vw, 90px) 20px; color: var(--arc-white); text-align: center; border: 2px dashed rgba(255,255,255,.45); }.library-empty > span { display: block; color: var(--arc-lime); font-size: 48px; }.library-empty h3 { margin: 10px 0 6px; font-family: var(--cn); font-size: 25px; font-weight: 900; }.library-empty p { margin: 0 0 20px; color: rgba(255,255,255,.68); font-size: 12px; }.library-empty-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }.library-empty a, .library-empty button { display: inline-flex; align-items: center; min-height: 41px; padding: 10px 14px; color: var(--arc-ink); background: var(--arc-lime); border: 2px solid var(--arc-ink); font-family: var(--cn); font-size: 11px; font-weight: 900; }.library-empty button { background: var(--arc-white); }.library-empty button.hidden { display: none; }

/* Archive, subscription, dialogs */
.arcade-v2 .archive-panel { color: var(--arc-ink); background: var(--arc-paper); border-bottom: 4px solid var(--arc-ink); box-shadow: 0 13px 0 var(--arc-teal); }.arcade-v2 .archive-eyebrow { color: var(--arc-teal); }.arcade-v2 .archive-result { color: var(--arc-ink); background: var(--arc-white); border-color: var(--arc-ink); }.arcade-v2 .archive-result.active { background: var(--arc-lime); }.arcade-v2 .archive-close { color: var(--arc-white); background: var(--arc-ink); }
.arcade-v2 .subscribe-zone { color: var(--arc-white); background-color: var(--arc-ink); border-top-color: var(--arc-lime); }.arcade-v2 .subscribe-zone::before { color: rgba(215,239,103,.09); }.arcade-v2 .subscribe-kicker { color: var(--arc-lime); }.arcade-v2 .subscribe-card { background: var(--arc-teal-dark); border-color: var(--arc-white); box-shadow: 10px 10px 0 var(--arc-orange); }.arcade-v2 .subscribe-card::before { background: var(--arc-lime); }.arcade-v2 .subscribe-row button { background: var(--arc-orange); }.arcade-v2 .subscribe-row button:hover:not(:disabled) { background: var(--arc-lime); }.arcade-v2 .timezone-line strong, .arcade-v2 .subscribe-status.success { color: var(--arc-lime); }
.arcade-v2 .site-footer { color: var(--arc-white); background: var(--arc-teal-dark); border-top-color: var(--arc-ink); }.arcade-v2 .site-footer p { color: var(--arc-lime); }.arcade-v2 .site-footer div span { color: var(--arc-orange); }
.collect-dialog { width: min(560px, calc(100vw - 28px)); padding: 0; color: var(--arc-ink); background: transparent; border: 0; overflow: visible; }.collect-dialog::backdrop { background: rgba(13,35,34,.72); backdrop-filter: blur(5px); }.collect-dialog-card { position: relative; padding: clamp(24px, 4vw, 38px); background: var(--arc-white); border: 4px solid var(--arc-ink); border-radius: 20px 10px 22px 12px; box-shadow: 10px 12px 0 var(--arc-orange); }.collect-dialog-close { position: absolute; right: 14px; top: 14px; width: 36px; height: 36px; color: var(--arc-white); background: var(--arc-ink); border: 0; border-radius: 50%; font-size: 23px; }.collect-dialog-kicker { color: var(--arc-teal); font: 900 9px/1 ui-monospace, monospace; letter-spacing: .13em; }.collect-dialog h2 { margin: 8px 0 6px; font-family: var(--cn); font-size: 31px; font-weight: 900; }.collect-dialog-title { max-width: 90%; margin: 0 0 22px; color: rgba(21,38,38,.66); font-size: 12px; line-height: 1.5; }.collect-dialog label { display: block; margin-top: 15px; }.collect-dialog label span { display: block; margin-bottom: 7px; font-size: 10px; font-weight: 900; }.collect-dialog input, .collect-dialog textarea { width: 100%; padding: 11px 12px; color: var(--arc-ink); background: var(--arc-paper); border: 2px solid var(--arc-ink); border-radius: 7px 5px 6px 4px; outline: none; resize: vertical; font-family: var(--cn); font-size: 12px; }.collect-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; }.collect-dialog-actions button { min-height: 42px; padding: 0 16px; border: 2px solid var(--arc-ink); font-size: 11px; font-weight: 900; }.dialog-cancel { color: var(--arc-ink); background: transparent; }.dialog-save { color: var(--arc-white); background: var(--arc-teal); box-shadow: 3px 3px 0 var(--arc-ink); }
.collect-cost-note { margin: 16px 0 0; padding: 10px 11px; color: var(--arc-ink); background: rgba(215,239,103,.34); border: 1px dashed var(--arc-ink); font-size: 10px; font-weight: 750; line-height: 1.55; }
.cloud-auth-dialog .collect-dialog-card { box-shadow: 10px 12px 0 var(--arc-teal); }
.cloud-auth-dialog .collect-dialog-title { max-width: 94%; font-size: 13px; line-height: 1.65; }
.auth-mode-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; padding: 5px; background: rgba(21,38,38,.08); border: 2px solid var(--arc-ink); border-radius: 9px 6px 8px 5px; }
.auth-mode-switch button { min-height: 38px; color: rgba(21,38,38,.62); background: transparent; border: 0; border-radius: 5px; font-family: var(--cn); font-size: 11px; font-weight: 900; }
.auth-mode-switch button.active { color: var(--arc-white); background: var(--arc-ink); box-shadow: 2px 2px 0 var(--arc-orange); }
.cloud-auth-primary { width: 100%; min-height: 48px; margin-top: 13px; color: var(--arc-ink); background: var(--arc-blue); border: 2px solid var(--arc-ink); border-radius: 7px 5px 6px 4px; box-shadow: 3px 3px 0 var(--arc-ink); font-family: var(--cn); font-size: 12px; font-weight: 900; }
.cloud-auth-primary:hover:not(:disabled) { background: var(--arc-teal); transform: translate(-1px,-1px); }
.cloud-auth-primary:disabled { opacity: .58; cursor: wait; }
.auth-text-button { width: 100%; margin-top: 12px; padding: 4px; color: var(--arc-teal-dark); background: transparent; border: 0; text-decoration: underline; text-underline-offset: 3px; font-family: var(--cn); font-size: 10px; font-weight: 850; }
.auth-text-button:hover { color: var(--arc-pink); }
.cloud-auth-help { margin: 10px 0 0; color: rgba(23,23,23,.68); font-size: 10px; line-height: 1.55; }
.cloud-auth-status { min-height: 1.5em; margin: 14px 0 0; color: #a60058; font-size: 11px; font-weight: 800; line-height: 1.55; }
.cloud-auth-status.success { color: #16655f; }
.cloud-account-card { padding: 17px; background: rgba(131,248,240,.22); border: 2px solid var(--arc-ink); }
.cloud-account-card > span { display: block; color: rgba(23,23,23,.68); font-size: 10px; font-weight: 800; }
.cloud-account-card > strong { display: block; margin-top: 6px; overflow-wrap: anywhere; font-size: 15px; }
.cloud-account-card > div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.cloud-account-card button { min-height: 39px; padding: 0 13px; color: var(--arc-ink); background: var(--arc-white); border: 2px solid var(--arc-ink); font-family: var(--cn); font-size: 10px; font-weight: 900; }
.cloud-account-card button:first-child { background: var(--arc-blue); }
.arcade-toast { position: fixed; z-index: 160; left: 50%; bottom: 28px; max-width: min(440px, calc(100vw - 28px)); padding: 12px 16px; color: var(--arc-white); background: var(--arc-ink); border: 2px solid var(--arc-white); border-radius: 9px 6px 8px 5px; box-shadow: 5px 6px 0 var(--arc-orange); font-size: 11px; font-weight: 800; opacity: 0; visibility: hidden; transform: translate(-50%, 18px); }
.arcade-toast button { margin-left: 12px; padding: 4px 8px; color: var(--arc-ink); background: var(--arc-lime); border: 1px solid var(--arc-white); border-radius: 4px; font-size: 9px; font-weight: 900; }
.mobile-tabbar { display: none; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .arcade-v2 *, .arcade-v2 *::before, .arcade-v2 *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}

/* Tablet */
@media (max-width: 1120px) {
  .arcade-v2 .arcade-nav-links { display: none; }
  .arcade-hero-grid { grid-template-columns: minmax(360px, 1fr) minmax(300px, .72fr); }
  .daily-ticket { grid-column: 1 / -1; width: min(100%, 680px); justify-self: center; display: grid; grid-template-columns: 1fr 1fr; gap: 0 25px; }
  .daily-ticket header, .daily-ticket footer { grid-column: 1 / -1; }.daily-ticket ul { margin: 6px 0; }.ticket-date { padding-top: 9px; }
  .cassette-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .library-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 980px) and (min-width: 801px) {
  .arcade-v2 .unlock-modules { grid-template-columns: 1fr; }
  .arcade-v2 .unlock-module .longread-card,
  .arcade-v2 .unlock-module .video-card { grid-template-columns: 150px 1fr; }
}

@media (max-width: 900px) and (min-width: 701px) {
  .arcade-v2 .ai-channel { margin-inline: 0; padding-inline: 0; }
}

@media (max-width: 800px) {
  html { scroll-padding-top: 118px; scrollbar-gutter: auto; }
  body.arcade-v2 { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  .arcade-v2 .site-nav { min-height: 64px; padding: 8px 14px; }
  .arcade-v2 .site-brand small { display: none; }.arcade-v2 .brand-mark { width: 34px; height: 34px; }.arcade-v2 .site-brand > span:nth-child(2) { font-size: 12px; }
  .arcade-v2 .locale-switch { display: none; }.wallet-pill { min-width: 76px; height: 40px; padding-right: 9px; }.wallet-spark { width: 27px; height: 27px; }.wallet-pill b { font-size: 14px; }
  .arcade-hero-grid { min-height: 0; padding: 44px 20px 54px; grid-template-columns: 1fr; gap: 34px; }
  .arcade-v2 .arcade-hero-copy h1 { font-size: clamp(43px, 13vw, 65px); letter-spacing: -.075em; }.arcade-v2 .identity-lede { font-size: 14px; }.hero-actions { align-items: stretch; }.arcade-primary, .arcade-secondary { flex: 1 1 210px; }
  .hero-machine { width: min(100%, 480px); height: 390px; justify-self: center; }.hero-cases { height: 225px; }.hero-case { height: 190px; }.hero-case.case-one { height: 210px; }.hero-case.case-two { height: 180px; }.hero-case.case-three { height: 198px; }
  .daily-ticket { width: min(100%, 480px); display: block; }
  .arcade-v2 .control-deck { top: 64px; }.arcade-v2 .control-inner { padding-inline: 12px; }.arcade-v2 .date-row { gap: 7px; }.arcade-v2 .control-label { display: none; }.arcade-v2 .date-tabs-wrap { flex: 1; }.arcade-v2 .archive-toggle b { display: none; }.arcade-v2 .archive-toggle { width: 38px; height: 34px; padding: 0; display: grid; place-items: center; }.arcade-v2 .filter-bar { flex-wrap: nowrap; overflow-x: auto; }.arcade-v2 .filter-group { flex: 0 0 auto; }.arcade-v2 .search-wrap { flex: 0 0 170px; }
  .arcade-v2 .main-grid { padding: 40px 16px 90px; }.arcade-summary { grid-template-columns: 1fr auto; padding: 17px; }.arcade-v2 .summary-text { grid-column: 1 / -1; grid-row: 2; }.summary-stamp { grid-column: 2; grid-row: 1; }
  .shelf-track-wrap { padding-inline: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }.shelf-track-wrap::-webkit-scrollbar { display: none; }.cassette-grid { width: max-content; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: min(78vw, 310px); gap: 14px; }.cassette-card { scroll-snap-align: start; }.ai-shelf-wrap .cassette-grid { grid-template-columns: none; grid-auto-columns: min(78vw, 310px); }
  .cassette-card h3 { font-size: 16px; }.cassette-card p { display: -webkit-box; margin: 0 0 10px; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; color: rgba(21,38,38,.64); font-size: 10px; line-height: 1.55; }
  .unlock-zone { margin-inline: -4px; padding: 34px 18px; border-radius: 24px 9px 28px 10px; box-shadow: 8px 9px 0 var(--arc-teal); }.unlock-modules { grid-template-columns: 1fr; }.module-ticket { grid-template-columns: 1fr; }.module-unlock { width: 100%; }.unlock-module .longread-card, .unlock-module .video-card { grid-template-columns: 94px 1fr; }
  .inspiration-library { margin-inline: -3px; padding: 30px 17px; border-radius: 14px 28px 14px 30px; box-shadow: 8px 9px 0 var(--arc-ink); }.library-head { align-items: flex-start; flex-direction: column; }.library-device-status { display: flex; align-self: flex-start; }.library-grid { grid-template-columns: 1fr 1fr; }.library-card h3 { font-size: 12px; }.library-card-note { display: none; }
  .arcade-v2 .subscribe-zone { padding-bottom: 90px; }
  .mobile-tabbar { position: fixed; z-index: 100; left: 10px; right: 10px; bottom: max(8px, env(safe-area-inset-bottom)); height: 60px; display: grid; grid-template-columns: repeat(4, 1fr); padding: 5px; color: var(--arc-white); background: var(--arc-ink); border: 2px solid var(--arc-white); border-radius: 15px 10px 15px 10px; box-shadow: 4px 5px 0 var(--arc-orange); }.mobile-tabbar a, .mobile-tabbar button { position: relative; display: grid; place-items: center; align-content: center; gap: 3px; color: rgba(255,255,255,.9); background: transparent; border: 0; font-size: 17px; }.mobile-tabbar b { font-family: var(--cn); font-size: 10px; font-weight: 800; }.mobile-tabbar i { position: absolute; right: 16%; top: 3px; min-width: 16px; height: 16px; display: grid; place-items: center; color: var(--arc-ink); background: var(--arc-lime); border-radius: 50%; font: 900 7px/1 ui-monospace, monospace; }.mobile-tabbar a:active, .mobile-tabbar button:active { color: var(--arc-lime); transform: scale(.94); }
  .wallet-panel { top: 72px; left: 12px; right: 12px; width: auto; max-height: calc(100dvh - 92px); }.arcade-toast { bottom: 84px; }
}

@media (max-width: 520px) {
  .arcade-v2 .arcade-hero-copy h1 { font-size: clamp(40px, 13vw, 56px); }
  .arcade-v2 .identity-lede { display: block; margin-top: 18px; font-size: 14px; line-height: 1.72; }
  .hero-actions { display: grid; }.arcade-primary, .arcade-secondary { flex-basis: auto; width: 100%; }
  .hero-machine { height: 345px; border-radius: 65px 17px 42px 18px; }.hero-cases { bottom: 72px; height: 194px; }.hero-case { border-width: 3px; }.hero-case.case-one { height: 180px; }.hero-case.case-two { height: 156px; }.hero-case.case-three { height: 170px; }.machine-sign { transform: scale(.82) rotate(3deg); transform-origin: left top; }
  .arcade-v2 .signal-chips { gap: 5px; }.arcade-v2 .signal-chips span { padding: 6px 7px; font-size: 8px; }
  .arcade-v2 .block-title { font-size: 36px; }.arcade-v2 .block-description { font-size: 11px; }.arcade-block-head { grid-template-columns: 1fr; }.arcade-v2 .block-count { width: fit-content; }
  .cassette-grid { grid-auto-columns: 82vw; }
  .library-grid { grid-template-columns: 1fr; }.library-card { display: grid; grid-template-columns: 115px 1fr; gap: 10px; }.library-card-image { grid-row: 1 / 5; aspect-ratio: 4 / 5; }.library-card h3, .library-card-tags, .library-card-note, .library-card-actions { grid-column: 2; margin-top: 0; }.library-card h3 { min-height: auto; }.library-card-actions { grid-template-columns: 1fr auto auto; align-self: end; }.library-card-note { display: block; min-height: 0; }
  .arcade-v2 .subscribe-zone-inner { display: block; }.arcade-v2 .subscribe-card { margin-top: 38px; }
}

/* V2 color continuity — reuse the original personal-site palette. */
body.arcade-v2 {
  --arc-paper: #252525;
  --arc-paper-2: #303030;
  --arc-ink: #171717;
  --arc-teal: #fe0990;
  --arc-teal-dark: #151515;
  --arc-mint: #fb64b7;
  --arc-lime: #83f8f0;
  --arc-orange: #fe0990;
  --arc-blue: #83f8f0;
  --arc-pink: #fe0990;
  --arc-white: #fff8fb;
  --arc-line: rgba(32, 32, 32, .24);
  color: var(--arc-white);
  background: var(--arc-paper);
}
html { background: #252525; }
.arcade-v2 .site-header { background: var(--arc-pink); }
.arcade-v2 .brand-mark { background: var(--arc-blue); box-shadow: 2px 3px 0 var(--arc-orange); }
.arcade-v2 .arcade-nav-links a > span { color: var(--arc-orange); }
.arcade-v2 .arcade-nav-links a::after { background: var(--arc-blue); }
.arcade-v2 .arcade-nav-links a:hover,
.arcade-v2 .arcade-nav-links a.nav-hovered,
.arcade-v2 .arcade-nav-links a.active { color: var(--arc-blue); }
.arcade-v2 .identity-hero { background: var(--arc-paper); }
.arcade-v2 .arcade-hero::before {
  background:
    radial-gradient(circle at 15% 18%, rgba(254,9,144,.17), transparent 23%),
    radial-gradient(circle at 76% 58%, rgba(131,248,240,.08), transparent 26%),
    linear-gradient(rgba(131,248,240,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(131,248,240,.045) 1px, transparent 1px);
  background-size: auto, auto, 33px 33px, 33px 33px;
}
.arcade-v2 .eyebrow { color: var(--arc-blue); }
.arcade-v2 .arcade-hero-copy h1 { color: var(--arc-white); }
.arcade-v2 .identity-lede { color: rgba(255,255,255,.74); }
.arcade-v2 .arcade-secondary { color: var(--arc-white); border-color: var(--arc-white); }
.arcade-v2 .signal-chips span { color: var(--arc-white); border-color: rgba(255,255,255,.75); background: rgba(255,255,255,.04); }
.arcade-v2 .signal-chips span:nth-child(2n) { color: var(--arc-blue); border-color: var(--arc-blue); background: rgba(131,248,240,.06); }
.arcade-v2 .signal-chips span.is-chip-hovered {
  color: var(--arc-ink);
  background: var(--arc-blue);
  border-color: var(--arc-white);
  box-shadow: 4px 5px 0 var(--arc-pink);
}
.arcade-v2 .site-main { width: 100%; max-width: none; margin: 0; padding: 0; color: var(--arc-white); background: var(--arc-paper); }
.arcade-v2 .block-kicker { color: var(--arc-blue); }
.arcade-v2 .block-title { color: var(--arc-white); }
.arcade-v2 .block-description { color: rgba(255,255,255,.66); }
.arcade-v2 .section-rule { background: var(--arc-pink); }
.arcade-v2 .shelf-track-wrap { background: var(--surface); }
.arcade-v2 .shelf-track-wrap::before {
  background-image:
    linear-gradient(rgba(131,248,240,.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(131,248,240,.12) 1px, transparent 1px);
}
.arcade-v2 .shelf-plank { background: var(--arc-pink); }
.arcade-v2 .shelf-plank span { background: var(--arc-blue); }
.arcade-v2 .shelf-track-wrap {
  padding: 22px 22px 52px;
  background: #2d2d2d;
  border-width: 1px;
  border-color: rgba(255,255,255,.2);
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
}
.arcade-v2 .shelf-track-wrap::before { opacity: .16; }
.arcade-v2 .cassette-grid { align-items: stretch; }
.arcade-v2 .cassette-card {
  background: var(--arc-white);
  border-width: 2px;
  border-radius: 14px 14px 7px 7px;
  box-shadow: 4px 5px 0 #111, 0 16px 28px rgba(0,0,0,.2);
  transition: box-shadow .24s ease, border-color .24s ease;
}
.arcade-v2 .cassette-card:hover {
  border-color: var(--arc-pink);
  box-shadow: 5px 7px 0 #111, 0 20px 34px rgba(0,0,0,.26);
}
.arcade-v2 .cassette-card::before {
  left: 10px;
  top: 10px;
  width: 25px;
  height: 25px;
  background: rgba(32,32,32,.94);
  border: 1px solid rgba(255,255,255,.82);
  box-shadow: 0 2px 7px rgba(0,0,0,.24);
}
.arcade-v2 .cassette-card::after {
  width: 11px;
  padding-top: 44px;
  background: var(--arc-pink);
  border-right-width: 1px;
  letter-spacing: .11em;
}
.arcade-v2 .cassette-card.type-ai::after { background: var(--arc-blue); }
.arcade-v2 .cassette-media {
  margin: 10px 10px 0 20px;
  border: 2px solid var(--arc-ink);
  border-radius: 8px 8px 4px 4px;
}
.arcade-v2 .cassette-media::after {
  background: linear-gradient(130deg, rgba(255,255,255,.22), transparent 27%), linear-gradient(to top, rgba(20,20,20,.5), transparent 48%);
}
.arcade-v2 .cassette-media-label { left: 8px; right: 8px; bottom: 8px; }
.arcade-v2 .cassette-media-label > span {
  max-width: 68%;
  overflow: hidden;
  padding: 4px 6px;
  background: rgba(20,20,20,.78);
  border-radius: 3px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.arcade-v2 .cassette-media-label b {
  padding: 4px 6px;
  background: var(--arc-blue);
  border: 0;
  border-radius: 999px;
}
.arcade-v2 .cassette-body { padding: 14px 12px 12px 20px; }
.arcade-v2 .cassette-tags { color: rgba(32,32,32,.56); letter-spacing: .045em; }
.arcade-v2 .cassette-tags span:first-child { color: var(--arc-pink); }
.arcade-v2 .cassette-actions { border-top-style: solid; border-top-color: rgba(32,32,32,.14); }
.arcade-v2 .cassette-open { border-radius: 5px; }
.arcade-v2 .cassette-open:hover { color: var(--arc-white); background: var(--arc-pink); }
.arcade-v2 .cassette-reward {
  right: 10px;
  top: 10px;
  color: var(--arc-white);
  background: rgba(32,32,32,.94);
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 999px;
  box-shadow: 0 2px 7px rgba(0,0,0,.24);
}
.arcade-v2 .cassette-card h3,
.arcade-v2 .library-card h3 {
  min-height: 0;
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
  overflow-wrap: anywhere;
}
.arcade-v2 .cassette-card h3 { margin-bottom: 10px; }
.arcade-v2 .game-channel .cassette-card,
.arcade-v2 .ai-channel .cassette-card {
  display: flex;
  grid-template-columns: none;
  min-height: 0;
  color: var(--arc-ink);
  background: var(--arc-white);
  border: 2px solid var(--arc-ink);
  border-radius: 14px 14px 7px 7px;
}
.arcade-v2 .game-channel .cassette-media,
.arcade-v2 .ai-channel .cassette-media {
  width: auto;
  min-height: 0;
  aspect-ratio: 4 / 5;
}
.arcade-v2 .game-channel .cassette-body,
.arcade-v2 .ai-channel .cassette-body {
  width: auto;
  min-width: 0;
  padding: 14px 12px 12px 20px;
  gap: 0;
}
.arcade-v2 .game-channel .cassette-card .news-title,
.arcade-v2 .ai-channel .cassette-card .news-title { color: var(--arc-ink); }
.arcade-v2 .unlock-module .longread-title,
.arcade-v2 .unlock-module .video-title { color: var(--arc-ink); }
.arcade-v2 .game-channel .cassette-card .news-summary,
.arcade-v2 .ai-channel .cassette-card .news-summary { display: none; }
.arcade-v2 .game-channel .cassette-card:hover,
.arcade-v2 .ai-channel .cassette-card:hover { color: var(--arc-ink); background: var(--arc-white); border-color: var(--arc-pink); }
.arcade-v2 .inspiration-library { background: var(--surface-raised); border-color: var(--arc-pink); box-shadow: 13px 15px 0 var(--arc-pink); }
.arcade-v2 .library-head { border-bottom-color: rgba(255,255,255,.22); }
.arcade-v2 .library-device-status { background: var(--arc-pink); }
.arcade-v2 .subscribe-intro h2 { font-weight: 900; }
.arcade-v2:not(.locale-en) .subscribe-intro h2 {
  font-family: var(--cn);
  font-weight: 900;
  letter-spacing: -.055em;
  line-height: 1.08;
  text-transform: none;
}

/* The 801–1120px range previously lost both desktop and mobile navigation. */
@media (max-width: 1120px) {
  body.arcade-v2 { padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
  .arcade-v2 .mobile-tabbar {
    position: fixed;
    z-index: 100;
    left: 12px;
    right: 12px;
    bottom: max(9px, env(safe-area-inset-bottom));
    height: 61px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding: 5px;
    color: var(--arc-white);
    background: var(--arc-teal-dark);
    border: 2px solid var(--arc-white);
    border-radius: 15px 10px 15px 10px;
    box-shadow: 4px 5px 0 var(--arc-pink);
  }
  .arcade-v2 .mobile-tabbar a,
  .arcade-v2 .mobile-tabbar button {
    position: relative;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 3px;
    color: rgba(255,255,255,.72);
    background: transparent;
    border: 0;
    font-size: 17px;
  }
  .arcade-v2 .mobile-tabbar b { color: rgba(255,255,255,.9); font-family: var(--cn); font-size: 10px; font-weight: 800; }
  .arcade-v2 .mobile-tabbar i { position: absolute; right: 24%; top: 3px; min-width: 16px; height: 16px; display: grid; place-items: center; color: var(--arc-ink); background: var(--arc-blue); border-radius: 50%; font: 900 7px/1 ui-monospace, monospace; }
}

@media (max-width: 800px) {
  .arcade-v2 .site-brand { display: flex; }
  .arcade-v2.locale-en .arcade-hero-copy h1 { font-size: clamp(39px, 11.7vw, 55px); line-height: 1.03; }
  .arcade-v2 .hero-machine { max-width: 100%; }
  .arcade-v2 .daily-ticket { max-width: 100%; }
  .arcade-v2 .shelf-track-wrap { padding: 16px 16px 50px; }
  .arcade-v2 .cassette-card h3 { font-size: 15px; }
}

@media (max-width: 390px) {
  .arcade-v2 .site-nav { gap: 8px; }
  .arcade-v2 .arcade-brand > span:nth-child(2) { max-width: 76px; white-space: normal; line-height: 1.05; }
  .arcade-v2 .wallet-pill { min-width: 70px; padding-inline: 5px 7px; }
  .arcade-v2 .wallet-panel { top: 68px; left: 8px; right: 8px; max-height: calc(100dvh - 84px); padding: 18px; border-width: 2px; box-shadow: 5px 6px 0 var(--arc-pink); }
  .arcade-v2 .hero-machine { height: 310px; }
  .arcade-v2 .hero-cases { height: 170px; }
  .arcade-v2 .hero-case.case-one { height: 160px; }
  .arcade-v2 .hero-case.case-two { height: 140px; }
  .arcade-v2 .hero-case.case-three { height: 150px; }
  .arcade-v2 .cassette-grid { grid-auto-columns: 84vw; }
  .arcade-v2 .module-ticket { padding: 20px 16px; }
  .arcade-v2 .library-card { grid-template-columns: 92px 1fr; }
}

/* Internal reading desk + English learning mode */
.arcade-v2 .cassette-actions { grid-template-columns: minmax(0, 1fr) auto auto; }
.arcade-v2 .cassette-open { width: 100%; padding: 0 8px; font: 900 9px/1 var(--cn); }
.learn-button,
.premium-learn {
  width: 38px;
  min-height: 36px;
  display: grid;
  place-items: center;
  padding: 0;
  color: var(--arc-ink);
  background: var(--arc-blue);
  border: 2px solid var(--arc-ink);
  border-radius: 7px 5px 6px 4px;
  font: 900 9px/1 ui-monospace, monospace;
}
.learn-button:hover,
.premium-learn:hover { color: var(--arc-white); background: var(--arc-pink); }
.premium-actions .premium-read { width: auto; min-width: 0; flex: 1; }
.premium-actions .premium-learn { width: 32px; min-height: 31px; }
.library-card-actions [data-read-content] { color: var(--arc-white); background: var(--arc-teal-dark); }

.language-lab-dialog,
.article-reader-dialog {
  width: min(900px, calc(100vw - 30px));
  max-height: min(92vh, 920px);
  padding: 0;
  color: var(--arc-ink);
  background: transparent;
  border: 0;
  overflow: visible;
}
.language-lab-dialog::backdrop,
.article-reader-dialog::backdrop { background: rgba(10,10,10,.82); backdrop-filter: blur(7px); }
.language-lab-card,
.article-reader-card {
  max-height: min(92vh, 920px);
  overflow: auto;
  color: var(--arc-ink);
  background: var(--arc-white);
  border: 4px solid var(--arc-ink);
  border-radius: 22px 11px 24px 12px;
  box-shadow: 11px 13px 0 var(--arc-pink);
}
.language-lab-head,
.article-reader-head {
  position: sticky;
  z-index: 8;
  top: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 28px 20px;
  background: var(--arc-white);
  border-bottom: 3px solid var(--arc-ink);
}
.language-lab-kicker,
.article-reader-kicker { color: var(--arc-pink); font: 900 9px/1 ui-monospace, monospace; letter-spacing: .13em; }
.language-lab-head h2 { margin: 7px 0 4px; font-family: var(--cn); font-size: clamp(28px, 4vw, 42px); font-weight: 900; letter-spacing: -.04em; }
.language-lab-head p,
.article-reader-head p { margin: 6px 0 0; color: rgba(32,32,32,.6); font-size: 10px; font-weight: 700; }
.language-lab-close,
.article-reader-close { flex: 0 0 auto; width: 39px; height: 39px; color: var(--arc-white); background: var(--arc-ink); border: 0; border-radius: 50%; font-size: 24px; }
.language-lab-guide { display: grid; grid-template-columns: 52px 1fr; gap: 14px; align-items: center; margin: 24px 28px 0; padding: 14px; background: rgba(131,248,240,.2); border: 2px solid var(--arc-ink); }
.language-lab-guide > span { width: 48px; height: 42px; display: grid; place-items: center; color: var(--arc-white); background: var(--arc-pink); border: 2px solid var(--arc-ink); font: 900 14px/1 var(--display); transform: rotate(-2deg); }
.language-lab-guide p { margin: 0; font-size: 11px; font-weight: 700; line-height: 1.6; }
.language-lab-body { display: grid; gap: 16px; padding: 22px 28px 28px; }
.language-lab-loading { padding: 50px 20px; text-align: center; color: rgba(32,32,32,.65); font-size: 12px; font-weight: 800; }
.learning-passage { padding: 21px; background: #fff; border: 2px solid var(--arc-ink); border-radius: 10px 6px 11px 7px; box-shadow: 5px 6px 0 var(--arc-blue); }
.learning-passage > header { display: flex; align-items: center; gap: 9px; padding-bottom: 12px; border-bottom: 1px dashed rgba(32,32,32,.3); }
.learning-passage > header span { width: 28px; height: 28px; display: grid; place-items: center; color: var(--arc-white); background: var(--arc-ink); border-radius: 50%; font: 900 8px/1 ui-monospace, monospace; }
.learning-passage > header h3 { margin: 0; font-family: var(--cn); font-size: 13px; font-weight: 900; }
.learning-passage > header small { margin-left: auto; color: var(--arc-pink); font: 900 8px/1 ui-monospace, monospace; }
.english-passage { margin: 18px 0; color: var(--arc-ink); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(18px, 2.2vw, 24px); line-height: 1.75; }
.professional-term { position: relative; display: inline; padding: 0 2px; color: inherit; background: linear-gradient(transparent 68%, rgba(254,9,144,.25) 68%); border: 0; border-bottom: 2px dotted var(--arc-pink); border-radius: 0; font: inherit; line-height: inherit; cursor: help; }
.professional-term::after { content: attr(data-meaning); position: absolute; z-index: 20; left: 50%; bottom: calc(100% + 9px); width: max-content; max-width: 220px; padding: 8px 10px; color: var(--arc-white); background: var(--arc-ink); border: 2px solid var(--arc-white); box-shadow: 3px 4px 0 var(--arc-pink); font: 800 11px/1.4 var(--cn); opacity: 0; visibility: hidden; transform: translate(-50%, 5px); transition: opacity .16s ease, transform .16s ease, visibility .16s ease; pointer-events: none; }
.professional-term:hover::after,
.professional-term:focus::after,
.professional-term:focus-visible::after { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.passage-translate { width: 100%; min-height: 43px; display: flex; align-items: center; justify-content: space-between; padding: 0 13px; color: var(--arc-ink); background: var(--arc-orange); border: 2px solid var(--arc-ink); border-radius: 7px 4px 7px 4px; font-size: 10px; font-weight: 900; }
.passage-translate b { font-size: 18px; }
.translation-panel { margin-top: 10px; padding: 15px; background: var(--arc-paper); border: 2px solid var(--arc-ink); color: var(--arc-white); }
.translation-panel > span { color: var(--arc-blue); font: 900 8px/1 ui-monospace, monospace; letter-spacing: .12em; }
.translation-panel p { margin: 9px 0 0; font-family: var(--cn); font-size: 14px; font-weight: 600; line-height: 1.8; }
.language-lab-footer,
.article-reader-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 28px 24px; background: #eee9e4; border-top: 2px dashed rgba(32,32,32,.35); }
.language-lab-footer p,
.article-reader-footer p { max-width: 560px; margin: 0; color: rgba(32,32,32,.62); font-size: 9px; line-height: 1.5; }
.language-lab-footer a,
.article-reader-footer a { flex: 0 0 auto; padding: 10px 12px; color: var(--arc-white); background: var(--arc-ink); border: 2px solid var(--arc-ink); font-size: 10px; font-weight: 900; }

.article-reader-body { background: var(--arc-white); }
.reader-image { max-height: 410px; overflow: hidden; background: var(--arc-ink); border-bottom: 4px solid var(--arc-ink); }
.reader-image img { width: 100%; height: 100%; min-height: 300px; max-height: 410px; display: block; object-fit: cover; }
.reader-video { position: relative; aspect-ratio: 16 / 9; background: #000; border-bottom: 4px solid var(--arc-ink); }
.reader-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.reader-copy { width: min(100%, 760px); margin: 0 auto; padding: clamp(26px, 5vw, 54px) clamp(20px, 5vw, 58px); }
.reader-category { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--arc-pink); font: 900 9px/1 ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; }
.reader-category b { color: rgba(32,32,32,.48); }
.reader-copy > h1 { margin: 14px 0 30px; color: var(--arc-ink); font-family: var(--cn); font-size: clamp(30px, 5vw, 54px); font-weight: 900; line-height: 1.18; letter-spacing: -.045em; overflow-wrap: anywhere; }
.reader-summary,
.reader-facts { padding-top: 22px; border-top: 3px solid var(--arc-ink); }
.reader-facts { margin-top: 34px; }
.reader-summary h2,
.reader-facts h2 { display: flex; align-items: center; gap: 9px; margin: 0 0 16px; font-family: var(--cn); font-size: 15px; font-weight: 900; }
.reader-summary h2 span,
.reader-facts h2 span { color: var(--arc-pink); font: 900 9px/1 ui-monospace, monospace; }
.reader-summary p { margin: 0; color: rgba(32,32,32,.8); font-family: var(--cn); font-size: clamp(15px, 1.8vw, 18px); font-weight: 600; line-height: 1.9; }
.reader-facts dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.reader-facts dl > div { padding: 11px 12px; background: #eee9e4; border: 1px solid rgba(32,32,32,.25); }
.reader-facts dt { margin-bottom: 5px; color: rgba(32,32,32,.52); font-size: 8px; font-weight: 900; text-transform: uppercase; }
.reader-facts dd { margin: 0; font-size: 11px; font-weight: 800; line-height: 1.4; }
.article-reader-footer > div { display: flex; gap: 7px; align-items: center; }
.article-reader-learn { min-height: 39px; display: inline-flex; align-items: center; gap: 7px; padding: 0 10px; color: var(--arc-ink); background: var(--arc-blue); border: 2px solid var(--arc-ink); font-size: 9px; font-weight: 900; }
.article-reader-learn span { font: 900 9px/1 ui-monospace, monospace; }

@media (max-width: 700px) {
  .language-lab-dialog,
  .article-reader-dialog { width: calc(100vw - 16px); max-height: 94vh; }
  .language-lab-card,
  .article-reader-card { max-height: 94vh; border-width: 3px; border-radius: 15px 7px 16px 8px; box-shadow: 6px 7px 0 var(--arc-pink); }
  .language-lab-head,
  .article-reader-head { padding: 18px 17px 15px; }
  .language-lab-guide { grid-template-columns: 42px 1fr; margin: 16px 16px 0; padding: 11px; }
  .language-lab-guide > span { width: 38px; height: 35px; font-size: 11px; }
  .language-lab-body { padding: 15px 16px 20px; }
  .learning-passage { padding: 16px; }
  .english-passage { font-size: 18px; line-height: 1.72; }
  .professional-term::after { position: fixed; left: 16px; right: 16px; bottom: 82px; width: auto; max-width: none; transform: translateY(5px); text-align: center; }
  .professional-term:hover::after,
  .professional-term:focus::after,
  .professional-term:focus-visible::after { transform: translateY(0); }
  .language-lab-footer,
  .article-reader-footer { align-items: stretch; flex-direction: column; padding: 15px 17px 19px; }
  .language-lab-footer a,
  .article-reader-footer a { text-align: center; }
  .article-reader-footer > div { display: grid; grid-template-columns: 1fr 1fr; }
  .reader-image img { min-height: 210px; max-height: 280px; }
  .reader-copy { padding: 28px 20px 36px; }
  .reader-copy > h1 { font-size: clamp(28px, 8.5vw, 40px); }
  .reader-facts dl { grid-template-columns: 1fr; }
}

/* Readability pass — every bright surface uses dark ink; every dark surface uses light text. */
.arcade-v2 .site-header,
.arcade-v2 .arcade-brand,
.arcade-v2 .site-brand small,
.arcade-v2 .arcade-nav-links a,
.arcade-v2 .arcade-nav-links a:hover,
.arcade-v2 .arcade-nav-links a.nav-hovered,
.arcade-v2 .arcade-nav-links a.active { color: var(--arc-ink); }
.arcade-v2 .site-brand small { opacity: .72; }
.arcade-v2 .arcade-nav-links a > span { color: rgba(32,32,32,.68); }
.arcade-v2 .locale-switch { border-color: var(--arc-ink); }
.arcade-v2 .locale-switch button { color: var(--arc-ink); }
.arcade-v2 .locale-switch button:not(.active) { background: rgba(255,248,251,.78); }

.arcade-v2 .arcade-primary,
.arcade-v2 .arcade-secondary b,
.arcade-v2 .collect-button:hover,
.arcade-v2 .collect-button.is-collected,
.arcade-v2 .module-unlock,
.arcade-v2 .dialog-save,
.arcade-v2 .subscribe-row button,
.arcade-v2 .premium-learn:hover,
.arcade-v2 .learn-button:hover,
.arcade-v2 .language-lab-guide > span { color: var(--arc-ink); }
.arcade-v2 .cassette-open:hover { color: var(--arc-ink); }
.arcade-v2 .hero-case { color: var(--arc-ink); }
.arcade-v2 .hero-case b { text-shadow: none; }
.arcade-v2 .cassette-card::after { color: var(--arc-ink); font-size: 8px; }
.arcade-v2 .cassette-media-label { font-size: 9px; }
.arcade-v2 .cassette-media-label b { font-size: 8px; }
.arcade-v2 .cassette-tags { color: rgba(23,23,23,.78); font-size: 9px; }
.arcade-v2 .cassette-tags span:first-child { color: #a60058; }
.arcade-v2 .cassette-reward { font-size: 9px; }
.arcade-v2 .cassette-card h3 { font-size: clamp(14px, 1.15vw, 16px); }
.arcade-v2 .ticket-progress-row i { color: rgba(32,32,32,.68); }
.arcade-v2 .ticket-date span,
.arcade-v2 .daily-ticket li b,
.arcade-v2 .daily-ticket footer strong { color: #a60058; }
.arcade-v2 .filter-name { color: rgba(255,255,255,.78); }
.arcade-v2 .filter-dot { color: rgba(255,255,255,.72); }
.arcade-v2 .unlock-zone-head p { color: rgba(255,255,255,.76); }

/* Embedded Xiaohongshu mini-app mode: native tabs own global navigation. */
html.xhs-container .arcade-header:not(.intel-header),
html.xhs-container .mobile-tabbar,
html.xhs-container .subscribe-zone,
html.xhs-container .arcade-footer { display: none !important; }
html.xhs-container .intel-header .site-brand,
html.xhs-container .intel-header .intel-primary-nav,
html.xhs-container .intel-header .intel-account-entry,
html.xhs-container .intel-header .intel-spark { display: none !important; }
html.xhs-container .intel-header .site-nav { justify-content: center; min-height: 58px; }
html.xhs-container .intel-header .intel-date-nav { margin-inline: auto; }
html.xhs-container body { padding-bottom: env(safe-area-inset-bottom, 0); }
.arcade-v2 .module-ticket p { color: rgba(32,32,32,.74); }

.arcade-v2 .library-card { color: var(--arc-ink); }
.arcade-v2 .library-card h3 { color: var(--arc-ink); font-size: 14px; }
.arcade-v2 .library-card-note { color: rgba(32,32,32,.74); font-size: 10px; }
.arcade-v2 .library-card-tags span { color: var(--arc-ink); font-size: 9px; }
.arcade-v2 .library-card-type { font-size: 8px; }
.arcade-v2 .library-card-actions a,
.arcade-v2 .library-card-actions button { font-size: 10px; }
.arcade-v2 .library-card-actions [data-edit-library] { color: var(--arc-ink); background: #eee9e4; }
.arcade-v2 .library-card-actions .remove-library { color: var(--arc-ink); background: var(--arc-pink); }
.arcade-v2 .library-device-status span { color: var(--arc-ink); }
.arcade-v2 .library-device-status i { background: var(--arc-ink); }

.arcade-v2 .archive-panel {
  color: var(--arc-white);
  background: #1b1b1b;
  border: 1px solid rgba(131,248,240,.55);
  border-bottom: 4px solid var(--arc-pink);
  box-shadow: 12px 12px 0 rgba(254,9,144,.82);
}
.arcade-v2 .archive-panel h2 { color: var(--arc-white); }
.arcade-v2 .archive-eyebrow { color: var(--arc-pink); }
.arcade-v2 .archive-panel-head p { color: rgba(255,255,255,.76); font-size: 13px; }
.arcade-v2 .archive-tools label { color: rgba(255,255,255,.72); font-size: 10px; }
.arcade-v2 .archive-tools select,
.arcade-v2 .archive-tools input { color: var(--arc-white); background: #252525; border-color: rgba(255,255,255,.32); font-size: 13px; }
.arcade-v2 .archive-tools input::placeholder { color: rgba(255,255,255,.58); }
.arcade-v2 .archive-result,
.arcade-v2 .archive-result.active {
  color: var(--arc-white);
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.2);
}
.arcade-v2 .archive-result:hover { color: var(--arc-white); background: rgba(131,248,240,.11); border-color: var(--arc-blue); }
.arcade-v2 .archive-result.active { background: rgba(254,9,144,.14); border-color: var(--arc-pink); }
.arcade-v2 .archive-result strong { color: rgba(255,255,255,.84); font-size: 13px; }
.arcade-v2 .archive-result-meta time { color: var(--arc-blue); font-size: 11px; }
.arcade-v2 .archive-result-meta em { color: var(--arc-ink); }
.arcade-v2 .archive-close { color: var(--arc-white); background: transparent; border-color: rgba(255,255,255,.32); }
.arcade-v2 .archive-close:hover { color: var(--arc-ink); background: var(--arc-pink); }

.arcade-v2 .subscribe-row button { font-weight: 900; }
.arcade-v2 .site-footer div span { color: var(--arc-blue); }
.arcade-v2 .site-footer small { color: rgba(255,255,255,.72); font-size: 10px; }

/* Contrast guardrails — keep labels and typed text legible in every state. */
.arcade-v2 .arcade-secondary:hover,
.arcade-v2 .arcade-secondary:focus-visible {
  color: var(--arc-ink);
  background: var(--arc-white);
}
.arcade-v2 .arcade-secondary:hover > span,
.arcade-v2 .arcade-secondary:focus-visible > span { color: inherit; }

.arcade-v2 input,
.arcade-v2 textarea { caret-color: var(--arc-pink); }

.arcade-v2 .collect-dialog input:not([type="hidden"]),
.arcade-v2 .collect-dialog textarea {
  color: #171717;
  background: #ffffff;
  border-color: #171717;
  caret-color: #a60058;
}
.arcade-v2 .collect-dialog input::placeholder,
.arcade-v2 .collect-dialog textarea::placeholder,
.arcade-v2 .library-search input::placeholder {
  color: rgba(23,23,23,.62);
  opacity: 1;
}
.arcade-v2 .collect-dialog input:not([type="hidden"]):focus,
.arcade-v2 .collect-dialog textarea:focus,
.arcade-v2 .library-search input:focus {
  border-color: var(--arc-pink);
  box-shadow: 0 0 0 3px rgba(254,9,144,.2);
}

.arcade-v2 .subscribe-row input,
.arcade-v2 .search-input,
.arcade-v2 .archive-tools input {
  caret-color: var(--arc-blue);
}
.arcade-v2 .subscribe-row input:-webkit-autofill,
.arcade-v2 .subscribe-row input:-webkit-autofill:hover,
.arcade-v2 .subscribe-row input:-webkit-autofill:focus {
  -webkit-text-fill-color: #ffffff;
  caret-color: #83f8f0;
  -webkit-box-shadow: 0 0 0 1000px #151515 inset;
  box-shadow: 0 0 0 1000px #151515 inset;
}
.arcade-v2 .collect-dialog input:-webkit-autofill,
.arcade-v2 .collect-dialog input:-webkit-autofill:hover,
.arcade-v2 .collect-dialog input:-webkit-autofill:focus {
  -webkit-text-fill-color: #171717;
  caret-color: #a60058;
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset;
  box-shadow: 0 0 0 1000px #ffffff inset;
}

/* Shared account entry and personal history */
.account-pill {
  min-width: 88px;
  height: 46px;
  padding: 4px 10px 4px 5px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--arc-white);
  background: #252525;
  border: 2px solid rgba(255,255,255,.68);
  border-radius: 10px 14px 9px 12px;
  box-shadow: 3px 3px 0 var(--arc-blue);
  font-family: var(--cn);
}
.account-pill:hover { transform: translateY(-2px); box-shadow: 4px 5px 0 var(--arc-pink); }
.account-pill.is-connected { color: var(--arc-ink); background: var(--arc-blue); border-color: var(--arc-white); }
.account-monogram {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: var(--arc-ink);
  background: var(--arc-pink);
  border: 2px solid var(--arc-white);
  border-radius: 8px 5px 8px 5px;
  font: 900 8px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.account-pill.is-connected .account-monogram { background: var(--arc-white); border-color: var(--arc-ink); }
.account-copy { display: grid; text-align: left; line-height: 1; }
.account-copy b { max-width: 54px; overflow: hidden; text-overflow: ellipsis; font-size: 11px; white-space: nowrap; }
.account-copy small { margin-top: 4px; font: 900 7px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; }

.library-view-switch {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(118px, 1fr));
  gap: 7px;
  margin-top: 22px;
  padding: 5px;
  background: rgba(0,0,0,.22);
  border: 2px solid rgba(255,255,255,.34);
  border-radius: 11px 7px 10px 6px;
}
.library-view-switch button {
  min-height: 39px;
  padding: 0 11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: rgba(255,255,255,.76);
  background: transparent;
  border: 0;
  border-radius: 7px 4px 7px 4px;
  font-family: var(--cn);
  font-size: 12px;
  font-weight: 900;
}
.library-view-switch button b {
  min-width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  color: var(--arc-white);
  background: rgba(255,255,255,.16);
  border-radius: 50%;
  font: 900 8px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.library-view-switch button.active { color: var(--arc-ink); background: var(--arc-blue); box-shadow: 2px 3px 0 var(--arc-ink); }
.library-view-switch button.active b { color: var(--arc-white); background: var(--arc-ink); }
.history-clear { margin-left: auto; background: var(--arc-pink); }
.history-card .library-card-note { min-height: 2.9em; }
.history-card .library-card-actions { grid-template-columns: minmax(0,1fr) auto auto; }
.history-card .library-card-actions [data-collect-content] { color: var(--arc-ink); background: var(--arc-blue); }

@media (max-width: 1120px) {
  .account-pill { min-width: 42px; width: 42px; height: 40px; padding: 3px; justify-content: center; }
  .account-monogram { width: 29px; height: 29px; }
  .account-copy { display: none; }
}

@media (max-width: 520px) {
  .arcade-v2 .arcade-hud { gap: 6px; }
  .library-view-switch { width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .history-clear { width: 100%; margin-left: 0; }
}

@media (max-width: 390px) {
  .account-pill { width: 38px; min-width: 38px; }
  .account-monogram { width: 27px; height: 27px; }
}
