@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=IBM+Plex+Mono:wght@500;600;700&family=Rye&display=swap');

:root { --oak:#4b2717;--oak-hi:#8a4e27;--brass:#cf9f4e;--brass-hi:#efd086;--ink:#110c09;--ivory:#f0dfb8;--green:#55e6c1; }
* { box-sizing:border-box; }
html { color-scheme:dark;background:#100b08; }
body { margin:0;min-width:320px;color:var(--ivory);background:radial-gradient(ellipse at 27% 12%,#76503240 0,transparent 40%),radial-gradient(ellipse at 90% 30%,#1e493b33,transparent 34%),repeating-linear-gradient(90deg,#16100c 0 94px,#21140e 95px 98px);font-family:"Barlow Condensed",sans-serif; }
.preview-room { min-height:calc(100vh - 88px);padding:clamp(30px,5vw,72px) clamp(14px,4vw,58px) clamp(68px,8vw,108px); }
.preview-room::before { content:"UNDER CONSTRUCTION · PREVIEW ONLY · GAMEPLAY AND PENNYWIRE PAYMENTS ARE NOT AVAILABLE YET";width:min(1280px,100%);margin:0 auto clamp(28px,4vw,48px);padding:11px clamp(14px,3vw,34px);display:block;color:#f6e5b4;border:1px solid #e8c16c;background:repeating-linear-gradient(135deg,#38210f 0 14px,#533118 14px 28px);box-shadow:inset 0 0 0 2px #130b06,0 8px 22px #0008;font:700 10px/1.45 "IBM Plex Mono",monospace;letter-spacing:.12em;text-align:center;text-transform:uppercase; }
.preview-layout { width:min(1280px,100%);margin:auto;display:grid;grid-template-columns:minmax(360px,680px) minmax(280px,1fr);gap:clamp(42px,7vw,96px);align-items:start; }
.preview-stage { min-width:0;min-height:min(72vw,780px);display:grid;place-items:center;position:relative;isolation:isolate; }
.preview-stage::before { content:"";position:absolute;inset:7% 1% 4%;z-index:-2;border:1px solid #a8753d55;background:radial-gradient(ellipse at 50% 35%,#6a422947 0,transparent 58%),repeating-linear-gradient(0deg,#2d190f 0 87px,#1d100b 88px 92px);box-shadow:inset 0 0 80px #000c,0 38px 70px #0008;clip-path:polygon(7% 0,93% 0,100% 8%,100% 92%,93% 100%,7% 100%,0 92%,0 8%); }
.preview-stage::after { content:attr(data-plate);position:absolute;left:50%;bottom:1%;padding:9px 18px 8px;color:#29180d;border:1px solid #f0d38a;background:linear-gradient(#ddb96e,#9a682f);box-shadow:0 5px 12px #0009,inset 0 0 0 2px #755022;font:700 8px/1 "IBM Plex Mono",monospace;letter-spacing:.15em;text-transform:uppercase;transform:translateX(-50%);white-space:nowrap; }
.preview-art { width:100%;height:min(78vh,790px);display:block;object-fit:contain;filter:drop-shadow(0 34px 25px #000c); }
.preview-stage--wide { min-height:min(60vw,680px); }
.preview-stage--wide .preview-art { height:auto;max-height:600px; }
.preview-copy { min-width:0; }
.preview-copy .eyebrow { margin:0;color:var(--brass-hi);font:700 9px/1 "IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase; }
.preview-copy h1 { margin:18px 0 22px;color:#f4e4bd;text-shadow:0 4px 0 #30180f;font:400 clamp(50px,6vw,82px)/.84 "Rye",serif;letter-spacing:-.045em; }
.preview-copy h1 em { display:block;margin-top:9px;color:#c98c4d;font:900 .62em/.9 "Barlow Condensed",sans-serif;letter-spacing:.01em;text-transform:uppercase; }
.preview-copy .lead { margin:0;color:#d5c8ae;font-size:clamp(20px,2vw,25px);line-height:1.3; }
.workshop-state { margin:28px 0 25px;padding:16px 18px;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;border:1px solid #9b6d37;background:#0c1814;box-shadow:inset 0 0 18px #0009;font-family:"IBM Plex Mono",monospace; }
.workshop-state::before { content:"";width:9px;height:9px;grid-row:1/3;align-self:center;border-radius:50%;background:var(--brass);box-shadow:0 0 13px #d9a84f; }
.workshop-state span { color:#9aa89f;font-size:8px;letter-spacing:.14em;text-transform:uppercase; }
.workshop-state strong { color:#eedba7;font-size:15px; }
.facts { margin:0;border-block:1px solid #9d713c66; }
.facts div { padding:11px 0;display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #9d713c33; }
.facts div:last-child { border:0; }
.facts dt { color:#9f9076;font:700 9px/1.2 "IBM Plex Mono",monospace;letter-spacing:.08em;text-transform:uppercase; }
.facts dd { margin:0;color:#ead4a4;font-weight:700;text-align:right; }
.mechanism { margin:24px 0 0;padding-left:17px;border-left:3px solid var(--brass);color:#bcae94;font-size:16px;line-height:1.42; }
.source { margin:18px 0 0;color:#837764;font-size:12px;line-height:1.45; }
.source a { color:#be9b61; }
@media(max-width:850px){.preview-layout{grid-template-columns:1fr;max-width:680px}.preview-copy{order:-1}.preview-stage{min-height:600px}.preview-stage--wide{min-height:470px}.preview-copy h1{font-size:clamp(48px,12vw,72px)}}
@media(max-width:500px){.preview-room{padding-inline:10px}.preview-stage{min-height:480px}.preview-stage--wide{min-height:360px}.preview-art{height:500px}.preview-stage::after{font-size:6px}.preview-copy .lead{font-size:19px}}