.play-guide{box-sizing:border-box;max-width:var(--pg-max, 1100px);margin:0 auto;padding:34px max(16px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));color:var(--pg-on-ground);font:var(--pg-text);line-height:1.45;text-align:left}.play-guide *{box-sizing:border-box}.play-guide>h2{margin:0;font:var(--pg-title);color:var(--pg-title-ink)}.pg-lead{max-width:62ch;margin:14px 0 0;font:var(--pg-lead)}.pg-lead p{margin:0}.pg-cards{columns:3 300px;column-gap:16px;margin-top:20px}.pg-card,.pg-shot{break-inside:avoid;margin:0 0 16px}.pg-card{padding:14px 16px 15px;border-radius:var(--pg-radius, 10px);background:var(--pg-card);color:var(--pg-ink);box-shadow:var(--pg-card-shadow, none)}.pg-card h3{margin:0 0 8px;font:var(--pg-head);color:var(--pg-head-ink, inherit)}.pg-card p{margin:0 0 8px}.pg-card>:last-child{margin-bottom:0}.pg-card ul{margin:0;padding:0;list-style:none}.pg-card li{position:relative;margin:0;padding:6px 0 6px 18px;border-top:var(--pg-rule)}.pg-card li:first-child{border-top:0;padding-top:0}.pg-card li:before{content:"";position:absolute;left:2px;top:calc(6px + .5em);width:8px;height:8px;border-radius:50%;background:var(--pg-dot);box-shadow:var(--pg-dot-shadow, none)}.pg-card li:first-child:before{top:.5em}.pg-table{margin:0 0 8px}.pg-card table{width:100%;border-collapse:collapse;font-size:.93em;line-height:1.3}.pg-card th,.pg-card td{padding:6px 10px 6px 0;border-top:var(--pg-rule);text-align:left;vertical-align:top}.pg-card th:last-child,.pg-card td:last-child{padding-right:0}.pg-card thead th{padding-top:0;border-top:0;font:var(--pg-label);color:var(--pg-dim);white-space:nowrap}.pg-card tbody th{font:var(--pg-name)}.pg-shot img{display:block;width:100%;height:auto}.pg-td{--pg-on-ground: var(--cream, #fbf4e4);--pg-text: 500 15px/1.45 "Instrument Sans", system-ui, sans-serif;--pg-lead: 600 17px/1.45 "Instrument Sans", system-ui, sans-serif;--pg-title: 900 clamp(24px, 6.2vw, 32px)/1.05 Fraunces, serif;--pg-title-ink: #fff3cf;--pg-card: var(--tag, #fbf4e4);--pg-ink: var(--ink, #2b1d12);--pg-radius: 8px;--pg-card-shadow: inset 0 -3px 0 rgba(120, 80, 30, .16), 0 3px 0 rgba(30, 12, 0, .35);--pg-head: 900 20px/1.1 Fraunces, serif;--pg-head-ink: var(--dear, #a5321f);--pg-rule: 1px solid rgba(94, 59, 32, .2);--pg-dot: var(--gold, #f2be3a);--pg-dot-shadow: inset 0 -2px 0 rgba(0, 0, 0, .18), 0 0 0 1px #b88a1a;--pg-label: 700 12px/1.2 "Instrument Sans", system-ui, sans-serif;--pg-dim: #7a5a36;--pg-name: 800 15px/1.2 Fraunces, serif;font-variant-numeric:lining-nums}.pg-td>h2{padding:0 2px 9px;letter-spacing:-.01em;text-shadow:0 2px 0 rgba(60,30,10,.55);border-bottom:7px solid #7a4f2a;border-radius:0 0 4px 4px;box-shadow:0 3px #5a3a1e,0 9px 10px -4px #28120480}.pg-td .pg-lead{text-shadow:0 1px 0 rgba(40,18,4,.45)}.pg-td .pg-shot{padding:7px;border-radius:16px;background:#6e4426;box-shadow:inset 0 2px #ffdcaa59,inset 0 -3px #0000004d,0 4px #4b2e18,0 8px 18px #1e0c0059}.pg-td .pg-shot img{border-radius:10px}.pg-td .pg-card td{font-variant-numeric:lining-nums tabular-nums}body.upright.on-maps{overflow:auto}body:not(.on-maps)>#how-to-play.pg-td{display:none}body.upright>#how-to-play.pg-td{position:relative;z-index:1001;visibility:visible;max-width:none;background-color:#9b6a40;background-image:repeating-linear-gradient(0deg,rgba(60,30,10,.22) 0 2px,transparent 2px 58px),linear-gradient(90deg,#a2703f,#94643a 40%,#a06c3e)}.pg-pow2,.pg-cube,.pg-flip,.pg-hanoi,.pg-nono,.pg-mines,.pg-four{position:relative;max-width:none;padding-right:max(16px,env(safe-area-inset-right),calc((100% - 1068px)/2));padding-bottom:6px;padding-left:max(16px,env(safe-area-inset-left),calc((100% - 1068px)/2));background:var(--pg-ground)}:is(.pg-pow2,.pg-cube,.pg-flip,.pg-hanoi,.pg-nono,.pg-mines,.pg-four) .pg-shot{overflow:hidden;border-radius:var(--pg-radius);box-shadow:var(--pg-shot-shadow, none)}:is(.pg-pow2,.pg-cube,.pg-flip,.pg-hanoi,.pg-nono,.pg-mines,.pg-four)+.site-foot{position:relative;margin:0;padding:4px 16px max(14px,env(safe-area-inset-bottom))}body:has(>#how-to-play.pg-pow2):not(:has(:is(.fg-home,.fg-app.over)))>:is(#how-to-play,.site-foot){display:none}body:has(>#how-to-play.pg-cube):not(:has(:is(.page.home,.card.done)))>:is(#how-to-play,.site-foot){display:none}body:has(>#how-to-play.pg-flip):not(:has(:is(.room.home,.room.game.over)))>:is(#how-to-play,.site-foot){display:none}body:has(>#how-to-play.pg-hanoi):not(:has(:is(.ob[data-screen=towers],.ob-game.won,.room.home,.room.game.solved)))>:is(#how-to-play,.site-foot){display:none}body:has(>#how-to-play.pg-nono):not(:has(:is(.app .path,main.done)))>:is(#how-to-play,.site-foot){display:none}body:has(>#how-to-play.pg-mines):not(:has(:is(.app.home,.app.round.done)))>:is(#how-to-play,.site-foot){display:none}body:has(>#how-to-play.pg-four):not(:has(:is(main.play[hidden],main.play.over)))>:is(#how-to-play,.site-foot){display:none}html body:has(>#how-to-play.pg-pow2):has(:is(.fg-home,.fg-app.over)),html body:has(>#how-to-play.pg-flip):has(:is(.room.home,.room.game.over)),html body:has(>#how-to-play.pg-nono):has(:is(.app .path,main.done)),html body:has(>#how-to-play.pg-mines):has(:is(.app.home,.app.round.done)),html body:has(>#how-to-play.pg-four):has(:is(main.play[hidden],main.play.over)){overflow-x:hidden;overflow-y:auto}body:has(>#how-to-play.pg-hanoi):has(:is(.ob[data-screen=towers],.ob-game.won)) #root>.ob,body:has(>#how-to-play.pg-mines) #root>.app:is(.home,.round.done),body:has(>#how-to-play.pg-four):has(:is(main.play[hidden],main.play.over)) #root>.fg{position:relative;height:100vh;height:100dvh}body:has(>#how-to-play.pg-cube) .rotate-hint{position:absolute}.pg-pow2{--pg-ground: #fff3f7;--pg-on-ground: #1d1a2e;--pg-text: 500 15px/1.45 "Bricolage Grotesque", system-ui, sans-serif;--pg-lead: 600 17px/1.45 "Bricolage Grotesque", system-ui, sans-serif;--pg-title: 400 clamp(26px, 7vw, 36px)/1.05 "Bagel Fat One", "Arial Rounded MT Bold", system-ui, sans-serif;--pg-title-ink: #46309e;--pg-card: #fff;--pg-ink: #1d1a2e;--pg-radius: 18px;--pg-card-shadow: inset 0 0 0 2.5px #1d1a2e, 0 4px 0 #1d1a2e;--pg-shot-shadow: 0 0 0 2.5px #1d1a2e, 0 6px 0 #1d1a2e;--pg-head: 400 21px/1.1 "Bagel Fat One", "Arial Rounded MT Bold", system-ui, sans-serif;--pg-head-ink: #f2415a;--pg-rule: 1.5px dashed rgba(29, 26, 46, .22);--pg-dot: #ffcf3f;--pg-dot-shadow: 0 0 0 2px #1d1a2e;--pg-label: 800 12px/1.2 "Bricolage Grotesque", system-ui, sans-serif;--pg-dim: #5a5470;--pg-name: 800 15px/1.2 "Bricolage Grotesque", system-ui, sans-serif}.pg-pow2+.site-foot{background:#fff3f7}.pg-pow2+.site-foot a{color:#5a5470}.pg-cube{--pg-ground: linear-gradient(rgba(255, 255, 255, .14) 1px, transparent 1px) 0 0 / 38px 38px, linear-gradient(90deg, rgba(255, 255, 255, .14) 1px, transparent 1px) 0 0 / 38px 38px, #27a08f;--pg-on-ground: #fffdf5;--pg-text: 400 15px/1.45 "Atkinson Hyperlegible", "Segoe UI", system-ui, sans-serif;--pg-lead: 400 17px/1.45 "Atkinson Hyperlegible", "Segoe UI", system-ui, sans-serif;--pg-title: 400 clamp(24px, 6.6vw, 32px)/1.1 "Mochiy Pop One", "Arial Rounded MT Bold", system-ui, sans-serif;--pg-title-ink: #fffdf5;--pg-card: #fffdf5;--pg-ink: #22302d;--pg-radius: 6px;--pg-card-shadow: 0 2px 0 #d9d1be, 0 8px 16px rgba(20, 60, 54, .28);--pg-shot-shadow: 0 0 0 6px #fffdf5, 0 8px 18px rgba(20, 60, 54, .35);--pg-head: 400 18px/1.2 "Mochiy Pop One", "Arial Rounded MT Bold", system-ui, sans-serif;--pg-head-ink: #22302d;--pg-rule: 1px solid rgba(60, 120, 220, .18);--pg-dot: #ffd43b;--pg-dot-shadow: 0 0 0 1.5px #d3a512;--pg-label: 700 12px/1.2 "Atkinson Hyperlegible", "Segoe UI", system-ui, sans-serif;--pg-dim: #5a6662;--pg-name: 700 15px/1.2 "Atkinson Hyperlegible", "Segoe UI", system-ui, sans-serif}.pg-cube>h2{text-shadow:0 2px 0 #1f8577}.pg-cube .pg-card{border-left:3px solid rgba(232,70,58,.55)}.pg-cube .pg-shot{margin-left:6px;margin-right:6px}.pg-cube+.site-foot{background:#27a08f}.pg-cube+.site-foot a{color:#fffdf5}.pg-flip{--pg-ground: repeating-linear-gradient(0deg, #0000 0 3px, #b98a4a0d 3px 4px), repeating-linear-gradient(90deg, #0000 0 3px, #b98a4a0d 3px 4px), linear-gradient(#f6e3c3, #fdf1dc 240px);--pg-on-ground: #3b2314;--pg-text: 400 15px/1.45 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-lead: 400 17px/1.45 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-title: 400 clamp(24px, 6.6vw, 32px)/1.1 "Rammetto One", Georgia, serif;--pg-title-ink: #d9344a;--pg-card: #fff8ea;--pg-ink: #3b2314;--pg-radius: 18px;--pg-card-shadow: 0 0 0 2px #3b2314, 0 3px 0 2px #3b2314;--pg-shot-shadow: 0 0 0 2px #3b2314, 0 3px 0 2px #3b2314;--pg-head: 400 18px/1.2 "Rammetto One", Georgia, serif;--pg-head-ink: #a81f35;--pg-rule: 1.5px solid rgba(59, 35, 20, .14);--pg-dot: #4a2a1b;--pg-dot-shadow: inset 0 -2px 0 #7a4a31, 0 0 0 2px #f2cb8c;--pg-label: 700 12px/1.2 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-dim: #7a5a44;--pg-name: 700 15px/1.2 "Atkinson Hyperlegible", system-ui, sans-serif}.pg-flip+.site-foot{background:#fdf1dc}.pg-flip+.site-foot a{color:#7a5a44}.pg-hanoi{--pg-ground: linear-gradient(#4c9fae, #3f8d9c 600px);--pg-on-ground: #f7eed6;--pg-text: 400 15px/1.45 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-lead: 400 17px/1.45 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-title: 800 clamp(26px, 7vw, 34px)/1.05 "Bricolage Grotesque", system-ui, sans-serif;--pg-title-ink: #f7eed6;--pg-card: #f7eed6;--pg-ink: #1f3a2c;--pg-radius: 19px 23px 20px 16px / 21px 16px 23px 18px;--pg-card-shadow: 3px 5px 0 rgba(31, 58, 44, .4);--pg-shot-shadow: 3px 5px 0 rgba(31, 58, 44, .4);--pg-head: 800 20px/1.1 "Bricolage Grotesque", system-ui, sans-serif;--pg-head-ink: #dd5a2e;--pg-rule: 1.5px solid rgba(31, 58, 44, .14);--pg-dot: #a5cf74;--pg-dot-shadow: inset 0 -2px 0 #6f9a46;--pg-label: 700 12px/1.2 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-dim: #3c5a48;--pg-name: 800 15px/1.2 "Bricolage Grotesque", system-ui, sans-serif}.pg-hanoi>h2{text-shadow:2px 3px 0 rgba(31,58,44,.35)}.pg-hanoi+.site-foot{background:#3f8d9c}.pg-hanoi+.site-foot a{color:#f7eed6}.pg-nono{--pg-ground: radial-gradient(90% 320px at 50% 0%, #2b2437, #131018 72%), #131018;--pg-on-ground: #f1ecfa;--pg-text: 500 15px/1.45 "Archivo", system-ui, sans-serif;--pg-lead: 600 17px/1.45 "Archivo", system-ui, sans-serif;--pg-title: 800 semi-expanded clamp(24px, 6.6vw, 32px)/1.05 "Archivo", system-ui, sans-serif;--pg-title-ink: #ff9f1c;--pg-card: linear-gradient(#342d42, #231d2e);--pg-ink: #f1ecfa;--pg-radius: 16px;--pg-card-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 8px 20px rgba(0, 0, 0, .5);--pg-shot-shadow: 0 0 0 3px #322b3f, 0 0 0 4px #0b090e, 0 0 34px -6px #ff9f1c;--pg-head: 800 semi-expanded 18px/1.15 "Archivo", system-ui, sans-serif;--pg-head-ink: #ff9f1c;--pg-rule: 1px solid rgba(255, 255, 255, .1);--pg-dot: radial-gradient(circle at 40% 34%, #fff 0 10%, rgba(255, 255, 255, 0) 32%), #ff9f1c;--pg-dot-shadow: 0 0 7px #ff9f1c;--pg-label: 700 11px/1.2 "Archivo", system-ui, sans-serif;--pg-dim: #a79fb8;--pg-name: 700 15px/1.2 "Archivo", system-ui, sans-serif}.pg-nono>h2{text-shadow:0 0 14px rgba(255,159,28,.55)}.pg-nono+.site-foot{background:#131018}.pg-nono+.site-foot a{color:#a79fb8}.pg-mines{--pg-ground: radial-gradient(circle, rgba(255, 255, 255, .09) 0 2px, transparent 2.6px) 0 0 / 20px 20px, #2a1262;--pg-on-ground: #fff;--pg-text: 500 15px/1.45 "Fredoka", "Trebuchet MS", sans-serif;--pg-lead: 600 17px/1.45 "Fredoka", "Trebuchet MS", sans-serif;--pg-title: 400 clamp(26px, 7vw, 36px)/1.05 "Bagel Fat One", "Fredoka", sans-serif;--pg-title-ink: #fff;--pg-card: #5b33b8;--pg-ink: #fff;--pg-radius: 22px;--pg-card-shadow: inset 0 2px 0 rgba(255, 255, 255, .28), 0 5px 0 #1c0b47;--pg-shot-shadow: 0 0 0 4px #12b5a8, 0 7px 0 4px #0a6f69;--pg-head: 400 20px/1.1 "Bagel Fat One", "Fredoka", sans-serif;--pg-head-ink: #ffd84d;--pg-rule: 1.5px solid rgba(255, 255, 255, .16);--pg-dot: radial-gradient(circle at 34% 26%, #d5fffa 0%, #6ff3e6 18%, #29d6c7 50%, #10ab9f 82%);--pg-dot-shadow: 0 1.5px 2px rgba(0, 60, 56, .55);--pg-label: 700 12px/1.2 "Fredoka", "Trebuchet MS", sans-serif;--pg-dim: #d7c4ff;--pg-name: 700 15px/1.2 "Fredoka", "Trebuchet MS", sans-serif}.pg-mines>h2{text-shadow:0 5px 0 #1c0b47}.pg-mines+.site-foot{background:#2a1262}.pg-mines+.site-foot a{color:#d7c4ff}.pg-four{--pg-ground: linear-gradient(#ffc56e, #e2706a 16px, #7d4186 44px, #33287a 96px, #17154a 180px);--pg-on-ground: #fff4d6;--pg-text: 400 15px/1.45 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-lead: 400 17px/1.45 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-title: 600 clamp(26px, 7vw, 36px)/1.05 "Fraunces", Georgia, serif;--pg-title-ink: #fff4d6;--pg-card: linear-gradient(rgba(44, 36, 120, .96), rgba(26, 20, 84, .97));--pg-ink: #fff4d6;--pg-radius: 22px;--pg-card-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .3), inset 0 2px 0 rgba(255, 255, 255, .2), 0 16px 30px rgba(8, 6, 30, .45);--pg-shot-shadow: 0 0 0 2px rgba(255, 220, 150, .55), 0 16px 30px rgba(8, 6, 30, .5);--pg-head: 600 21px/1.1 "Fraunces", Georgia, serif;--pg-head-ink: #ffcf5a;--pg-rule: 1px solid rgba(255, 255, 255, .16);--pg-dot: #ffcf5a;--pg-dot-shadow: 0 0 8px #ffb52e;--pg-label: 700 12px/1.2 "Atkinson Hyperlegible", system-ui, sans-serif;--pg-dim: rgba(255, 244, 214, .72);--pg-name: 700 15px/1.2 "Atkinson Hyperlegible", system-ui, sans-serif}.pg-four+.site-foot{background:#17154a}.pg-four+.site-foot a{color:#fff4d6b8}