/* PetrovBit V2 — Direction B: QUIET (responsive) Editorial poster. Huge serif. Lots of breathing room. Adapts to mobile (375), tablet (768), and desktop (1440). Exports: window.PageQuiet */ function PageQuiet({ lang = "en", setLang, mobile = false, tablet = false }) { const C = PB_CONTENT[lang]; const ST = (typeof SUGGEST_COPY !== "undefined" ? SUGGEST_COPY[lang] : { cta: "+ suggest yours" }); const isRu = lang === "ru"; const [suggest, setSuggest] = React.useState("closed"); const openSuggest = () => setSuggest("form"); // — responsive scale tokens — const padX = mobile ? 18 : tablet ? 40 : 80; const sectPadV = mobile ? 56 : tablet ? 80 : 120; const heroSize = mobile ? 50 : tablet ? 88 : 144; const h2Big = mobile ? 36 : tablet ? 52 : 76; const h2Med = mobile ? 30 : tablet ? 46 : 64; const gameH3 = mobile ? 38 : tablet ? 50 : 64; const gameH3b = mobile ? 32 : tablet ? 42 : 56; const ruleNum = mobile ? 30 : tablet ? 38 : 44; const ruleH3 = mobile ? 20 : tablet ? 24 : 28; const numHero = mobile ? 80 : tablet ? 110 : 140; const numStat = mobile ? 30 : tablet ? 40 : 52; const taglineSz = mobile ? 18 : tablet ? 22 : 26; const bodySz = mobile ? 14 : tablet ? 15 : 15.5; const gap = mobile ? 28 : tablet ? 40 : 64; // section with optional ruler / kicker at top const Sect = ({ num, kicker, children, last }) => (
—— {num} {kicker}
{children}
); return (
{/* ─── MASTHEAD ─── */}
{!mobile && (
{isRu ? "выпуск vol. 02" : "issue vol. 02"} · {isRu ? "лето 2026" : "summer 2026"}
)}
{!mobile && !tablet && ( {isRu ? "тираж 1 шт." : "print run · 1"} )}
{/* ─── HERO ─── */}
{/* tiny mono caption top */}
—— cover story {isRu ? "от первого лица" : "first-person"} ——

{isRu ? ( <> Пиксели
для кармана. ) : ( <> Pixels
for pocket screens. )}

{/* video + caption row */}
fig. 01 — tank 1990, big map mode {!mobile && {isRu ? "снято на телефон" : "captured on phone"}}

{C.tagline}

{C.intro}

{C.seeGames} → {C.by}
{/* ─── GAMES — editorial spreads ─── */}

{C.games.heading} {C.games.headingSub}

{/* Game 1 — Tank 1990 */}
{C.games.tank.kicker}

{C.games.tank.title}

{C.games.tank.sub}

{C.games.tank.body}

{C.games.tank.meta.map(([k, v]) => (
{k}
{v}
 ))}
{C.games.tank.store} →
fig. 02 — big map, "1990" in bricks ★ 4.3 · google play
{/* Game 2 — Pixel Tanks */}
fig. 03 — key art, work in progress
{C.games.pix.kicker}

{C.games.pix.title}

{C.games.pix.sub}

{C.games.pix.body}

○ {C.games.pix.when}
{/* Game 3 — Swamp Defense */}
{C.games.swamp.kicker}

{C.games.swamp.title}

{C.games.swamp.sub}

{C.games.swamp.body}

○ {C.games.swamp.when}
fig. 04 — level layout, bronze age settlement
{/* ─── ROADMAP ─── */}

{C.roadmap.heading}

{!mobile && ( )}
{mobile ? ( /* Vertical timeline for mobile */
    {C.roadmap.items.map((it, i) => { const isDone = it.state === "done" || it.state === "готово"; const isBeta = it.state === "beta" || it.state === "тест"; const color = isDone ? "var(--v2-accent-2)" : isBeta ? "var(--v2-accent)" : "var(--v2-ink-3)"; return (
  1. {it.date} · {it.state}
    {it.title}

    {it.note}

    2. ); })} {/* Fourth slot — open suggestion */}
) : (
{C.roadmap.items.map((it, i) => { const isDone = it.state === "done" || it.state === "готово"; const isBeta = it.state === "beta" || it.state === "тест"; const color = isDone ? "var(--v2-accent-2)" : isBeta ? "var(--v2-accent)" : "var(--v2-ink-3)"; return (
{it.date} · {it.state}
{it.title}

{it.note}

); })} {/* Fourth column — open suggestion card */}
)} {/* ─── RULES ─── */}

{C.rules.heading}

{C.rules.items.map(([t, d], i) => (
{String(i+1).padStart(2,"0")}
{t}.

{d}

))}
{/* ─── NUMBERS ─── */}

{C.numbers.heading}

{C.numbers.rating}
★ ★ ★ ★ ★
{C.numbers.ratingNote}
{mobile ? (
{C.numbers.stats.map(([k, v]) => (
{v}
{k}
))}
) : ( C.numbers.stats.slice(0, 3).map(([k, v]) => (
{v}
{k}
)) )}

* {C.numbers.footnote}

{/* ─── FOOTER ─── */} {/* ─── Suggestion modal (overlays the artboard) ─── */}
); } Object.assign(window, { PageQuiet });