@font-face{font-family:Anton;src:url('assets/anton.ttf') format('truetype');font-display:swap;font-weight:400}
:root{--sc-canvas:#eae5da;--sc-surface:#f2eee3;--sc-ink:#202721;--sc-ink-soft:#526053;--sc-accent:#c53c20;--sc-accent-ink:#fff8ed;--sc-font-display:Anton,Impact,sans-serif;--sc-font-text:Arial,Helvetica,sans-serif;--sc-z-stage:0;--sc-z-copy:2;--sc-z-chrome:10;font-family:Arial,Helvetica,sans-serif;color:#202721;background:#eae5da;font-synthesis:none}
*{box-sizing:border-box}html{overflow-anchor:none}body{margin:0}h1,h2,p{margin:0}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid currentColor;outline-offset:5px}::selection{background:#c53c20;color:#fff8ed}
.world{position:absolute;inset:0;overflow:hidden;background:#eae5da}
.photograph{position:absolute;inset:-4%;background:url('assets/dock.png') 50% 50%/cover no-repeat;will-change:transform}
.paper-light{position:absolute;inset:0;background:linear-gradient(90deg,rgba(242,238,227,.99),rgba(242,238,227,.95) 28%,rgba(242,238,227,.45) 53%,transparent 72%)}
.game{position:absolute;left:0;top:0;width:1000px;transform-origin:50% 50%;will-change:transform}
.board{position:relative;width:1000px;height:570.02457px}
.board>svg,.detail>svg{display:block;width:100%;height:100%;font-family:Arial,Helvetica,sans-serif}
.overview .blk{transform-box:fill-box;transform-origin:50% 50%;will-change:transform,opacity}
.detail{position:absolute;inset:0;transform-origin:0 0;opacity:0;will-change:transform,opacity}
.detail rect{vector-effect:non-scaling-stroke}
.game-heading{position:absolute;left:8px;right:8px;bottom:calc(100% + 18px);display:flex;justify-content:space-between;align-items:center;font:700 14px/1.3 Arial,Helvetica,sans-serif;letter-spacing:1.8px;color:#202721}
.game-heading>span,.game-heading>b{background:#f2eee3;padding:8px 11px}
.detail-label{position:absolute;left:0;opacity:0}
.game-heading>b{margin-left:auto;font-size:16px}
.game-controls{position:absolute;top:calc(100% + 20px);left:8px;right:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;will-change:opacity,transform;color:#202721}
.game-controls>span,.game-controls>strong{background:#f2eee3;padding:10px 12px;font-size:14px;letter-spacing:1.5px;font-weight:700}
.detail-source{position:absolute;left:10px;right:10px;top:calc(100% + 18px);font:14px/1.5 Arial,sans-serif;opacity:0;color:#202721;background:#f2eee3;padding:8px 11px;width:max-content;max-width:100%}
.copy{position:absolute;left:4.4vw;top:26%;color:#202721;max-width:40vw}
.copy h1,.copy h2{font:400 clamp(60px,6.25vw,98px)/1.08 Anton,Impact,sans-serif;letter-spacing:-1.3px}
.copy p{font-size:18px;line-height:1.6;margin:25px 0 28px;letter-spacing:-.2px}
.play{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;min-height:57px;padding:0 22px;background:#c53c20;color:#fff8ed;font-size:15px;font-weight:700}
.play>span{font-size:23px;font-weight:400}.play:hover{background:#b2381f}
.copy.inside{top:12%;max-width:90vw}
.copy.inside h2{font-size:clamp(46px,4.25vw,70px)}
.copy.inside p{margin:13px 0 0;font-size:17px}
.copy.close h2{font-size:clamp(56px,5.25vw,84px)}
.copy.close small{display:block;margin-top:25px;font-size:11px;font-weight:600;line-height:1.6}
.masthead{position:fixed;z-index:10;left:4.4vw;right:4.4vw;top:26px;display:flex;align-items:center;gap:28px}
.wordmark{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;font-size:36px;font-weight:800;letter-spacing:-2px;min-height:44px;line-height:44px}
.brand-mark{display:block;flex:none;width:36px;height:36px}.wordmark-text>span{color:#c53c20}.edition{font-size:9px;font-weight:700;letter-spacing:1.4px}
.header-play{margin-left:auto;background:#f2eee3;padding:0 15px;display:flex;align-items:center;gap:24px;min-height:44px;font-size:12px;font-weight:700}
.header-play>span{font-size:20px}
.film-note{position:fixed;bottom:26px;left:4.4vw;right:4.4vw;z-index:5;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;font-weight:700;pointer-events:none}
.film-note span{background:#f2eee3;padding:8px 10px}
.film-note a{pointer-events:auto}
.film-note a:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.progress{position:fixed;z-index:12;left:0;right:0;bottom:0;height:3px;background:rgba(32,39,33,.15)}.progress>span{display:block;width:100%;height:100%;background:#c53c20;transform-origin:left;transform:scaleX(0)}
.fallback{position:fixed;inset:100px 20px auto;z-index:20;background:#f2eee3;padding:40px;font-size:24px}
@media(max-width:700px){
  .photograph{inset:-4%;background-position:64% 50%}
  .paper-light{background:linear-gradient(180deg,#f2eee3 0%,rgba(242,238,227,.99) 32%,rgba(242,238,227,.65) 47%,transparent 64%)}
  .masthead{left:24px;right:24px;top:20px;gap:12px}.wordmark{font-size:29px;gap:7px}.brand-mark{width:29px;height:29px}.edition{display:none}.header-play{font-size:11px;gap:13px;padding:0 12px}
  .copy{left:24px;right:24px;max-width:none;top:13.3%}.copy h1,.copy h2{font-size:54px;letter-spacing:-.8px;line-height:1.08}.copy p{font-size:15px;line-height:1.5;margin:17px 0 20px}.play{min-height:48px;padding:0 16px;font-size:13px;gap:32px}
  .copy.inside{top:16%;max-width:none}.copy.inside h2{font-size:51px;max-width:330px}.copy.inside p{font-size:15px;max-width:280px;line-height:1.5;margin-top:16px}
  .copy.close{top:14%}.copy.close h2{font-size:52px}.copy.close small{font-size:10px;margin-top:16px;max-width:300px}
  .game-heading{font-size:25px;letter-spacing:1px;bottom:calc(100% + 20px)}.game-heading>b{font-size:27px}.game-heading>span,.game-heading>b{padding:10px 12px}
  .game-controls>span,.game-controls>strong{font-size:26px;padding:12px;letter-spacing:1.2px}.game-controls{gap:18px;top:calc(100% + 25px)}
  .detail-source{font-size:25px;line-height:1.4;white-space:normal;max-width:960px;width:auto;padding:12px}
  .film-note{left:24px;right:24px;bottom:24px;font-size:7px;letter-spacing:.8px}.film-note span{padding:8px}
}
@media(prefers-reduced-motion:reduce){.photograph,.game,.overview .blk,.detail{will-change:auto}}
.phone-break{display:none}
.rules h2{font-size:clamp(48px,4.6vw,74px)}
.rules p{max-width:470px}
.clue-list{display:flex;gap:18px;border-top:1px solid #747a6e;padding-top:16px;font-size:12px;font-weight:700;max-width:420px}
.chart-nav{position:absolute;top:0;left:0;display:flex;align-items:center;gap:4px;background:#f2eee3;white-space:nowrap;will-change:transform,opacity}
.chart-nav button{font:700 12px/1 Arial,sans-serif;color:#526053;border:0;background:none;min-height:44px;padding:0 14px;cursor:pointer}
.chart-nav button[aria-current]{color:#202721;text-decoration:underline;text-underline-offset:5px}
.chart-nav button:hover{background:#e4dfd4;color:#202721}
.chart-nav button:focus-visible{outline:2px solid #c53c20;outline-offset:-4px}
.chart-nav>span{font-size:12px;color:#71766c}
.header-play:hover{background:#e4dfd4}.play:active{background:#9c2d18}
.skip-link{position:fixed;z-index:30;left:24px;top:0;padding:16px;background:#202721;color:white;transform:translateY(-120%)}.skip-link:focus{transform:translateY(0)}
.unavailable{position:absolute;inset:0;background:#EFEAE0;border-radius:24px;padding:100px 70px;font:400 70px/1.2 Anton,Impact,sans-serif}
.copy.close small{font-size:12px;font-weight:400}
.copy{opacity:var(--copy-opacity,0)!important;transform:translate3d(0,var(--copy-y,0px),0)!important;pointer-events:var(--copy-events,none)!important}
@media(max-width:700px){
 .phone-break{display:block}.desktop-break{display:none}
 .copy.inside.assembly h2{font-size:47px}
 .copy.inside p{max-width:320px}
 .rules{top:14%}.rules h2{font-size:44px}.rules p{max-width:330px}
 .clue-list{font-size:11px;gap:18px;padding-top:12px}
 .copy.close small{font-size:10px;line-height:1.6}
 .chart-nav button{font-size:11px;padding:0 12px}
}
@media(max-width:700px) and (max-height:740px){
 .copy{top:16%}.copy h1{font-size:45px}.copy p{font-size:14px;margin:12px 0 14px}
 .copy.close{top:16%}.copy.close h2{font-size:42px}.copy.close small{margin-top:10px;font-size:9px}
 .copy.inside h2{font-size:43px}.copy.inside.assembly h2{font-size:42px}.rules h2{font-size:39px}
 .film-note{bottom:14px;font-size:6px}
}
.issue-line{display:flex;align-items:center;justify-content:space-between;width:min(100%,480px);border-top:2px solid currentColor;padding-top:12px;font-size:11px;font-weight:700;letter-spacing:1.7px;line-height:1.2;text-transform:uppercase}
.issue-line b{color:#872818;font-size:14px;letter-spacing:.7px}
.copy.hero{top:19.5%;max-width:42vw}
.copy.hero h1,.copy.close h2{margin-top:18px}
.copy.hero p{margin:21px 0 27px}
.copy.hero .mix-tease{margin:18px 0 0;color:#a9381e;font-size:13px;font-weight:800;line-height:1.4;letter-spacing:1px;text-transform:uppercase}
.copy.hero .mix-tease+p{margin:14px 0 25px;max-width:520px}
.copy.hero .play{min-width:280px;min-height:64px;font-size:16px}
.copy.reading-note{top:12%;max-width:170px}
.copy.reading-note h2{font-size:clamp(48px,4.2vw,64px)}
.copy.reading-note p{max-width:170px;margin:14px 0 0;font-size:16px;line-height:1.45}
.scroll-cue{display:flex;align-items:center;gap:13px;margin-top:33px;font-size:10px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase}
.scroll-cue span:last-child{font-size:20px;font-weight:400;line-height:1}
.copy.close{top:20%;max-width:41vw}
.copy.close p{max-width:480px}
.copy.close .play{min-width:360px;min-height:72px;font-size:18px}
.copy.close small{margin-top:19px}
@media(max-width:700px){
 .copy.hero{top:11.4%;max-width:none}
 .issue-line{width:100%;padding-top:9px;font-size:9px;letter-spacing:1.3px}
 .issue-line b{font-size:12px}
 .copy.hero h1,.copy.close h2{margin-top:15px}
 .copy.hero p{margin:15px 0 18px}
 .copy.hero .mix-tease{margin-top:13px;font-size:10px;line-height:1.45;letter-spacing:.5px}
 .copy.hero .mix-tease+p{margin:10px 0 16px;max-width:340px}
 .copy.hero .play{min-width:0;width:280px;max-width:100%;min-height:56px;font-size:14px}
 .copy.reading-note{top:13%;max-width:none}
 .copy.reading-note h2{font-size:39px;max-width:340px}
 .copy.reading-note p{font-size:14px;max-width:330px;margin-top:12px}
 .scroll-cue{display:none}
 .copy.close{top:11%;max-width:none}
 .copy.close h2{font-size:50px}
 .copy.close p{max-width:330px;margin:14px 0 18px}
 .copy.close .play{min-width:0;width:286px;max-width:100%;min-height:60px;font-size:15px}
 .copy.close small{margin-top:15px}
}
@media(max-width:700px) and (max-height:740px){
 .copy.hero{top:10%}
 .copy.hero h1{font-size:43px}
 .copy.hero p{margin:10px 0 14px}
 .copy.hero .mix-tease{margin-top:9px;font-size:9px}
 .copy.hero .mix-tease+p{margin:8px 0 12px}
 .scroll-cue{margin-top:13px}
 .copy.reading-note{top:11%}
 .copy.reading-note h2{font-size:34px}
 .copy.reading-note p{font-size:13px;margin-top:8px}
 .copy.close{top:13%}
 .copy.close h2{font-size:42px}
 .copy.close p{margin:10px 0 13px}
 .copy.close .play{min-height:52px}
 .copy.close small{display:none}
}

/* The trade lens adds context without changing the game's treemap identity. */
.copy.hero h1{font-size:clamp(58px,5.1vw,78px);line-height:1.04}
.copy.hero p{max-width:500px;margin:23px 0 26px}
.copy.trade{top:13%;max-width:360px}
.past-label{display:inline-block;margin-bottom:15px;border-top:2px solid currentColor;padding-top:10px;font-size:11px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase}
.copy.trade h2{font-size:clamp(48px,4.1vw,64px);line-height:1.05}
.copy.trade p{margin:18px 0 0;max-width:360px;font-size:17px;line-height:1.5}
.border-mark{display:flex;align-items:center;gap:14px;margin-top:22px;font-size:11px;font-weight:800;letter-spacing:1.8px;white-space:nowrap}
.border-mark i{position:relative;display:block;flex:none;width:78px;height:1px;background:#202721}
.border-mark i::after{content:"";position:absolute;top:-4px;left:0;width:9px;height:9px;background:#c53c20;transform:translateX(calc(var(--border-progress,0) * 69px))}
.rules h2{font-size:clamp(50px,4.3vw,66px);line-height:1.05}
.rules p{max-width:470px;margin:17px 0 22px}
.copy.close h2{font-size:clamp(58px,5.25vw,84px)}
.copy.close small{display:table;background:#f2eee3;padding:5px 7px;margin-left:-7px}
@media(max-width:700px){
 .copy.hero h1{font-size:clamp(40px,10.8vw,47px);line-height:1.06}
 .copy.hero p{max-width:340px;margin:14px 0 18px}
 .copy.trade{top:12%;max-width:none}
 .past-label{margin-bottom:10px;padding-top:8px;font-size:9px;letter-spacing:1.2px}
 .copy.trade h2{font-size:40px;max-width:340px}
 .copy.trade p{font-size:14px;max-width:330px;margin-top:12px;line-height:1.45}
 .border-mark{font-size:9px;gap:11px;margin-top:15px}
 .border-mark i{width:60px}
 .border-mark i::after{transform:translateX(calc(var(--border-progress,0) * 51px))}
 .rules h2{font-size:40px}
 .rules p{margin:12px 0 15px}
 .copy.close h2{font-size:49px}
}
@media(max-width:700px) and (max-height:740px){
 .copy.hero h1{font-size:39px}
 .copy.trade{top:11%}
 .copy.trade h2{font-size:34px}
 .copy.trade p{font-size:13px;line-height:1.4}
 .border-mark{margin-top:9px}
 .rules h2{font-size:35px}
 .copy.close h2{font-size:42px}
}
.daily-beat{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.daily-beat span{display:inline-flex;align-items:center;min-height:27px;padding:4px 8px;background:#f2eee3;border-top:2px solid #202721;font-size:10px;line-height:1.25;letter-spacing:1.1px;font-weight:700;text-transform:uppercase}
@media(max-width:700px){
 .daily-beat{gap:6px;margin-top:12px}
 .daily-beat span{min-height:25px;padding:4px 6px;font-size:9px;letter-spacing:.45px}
}