/* The cover uses the game's paper, ink and warm orange Play control. */
.launch-screen{position:fixed;inset:0;z-index:10000;overflow:auto;overscroll-behavior:contain;background:#f2e9d2;color:#193d35;padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));display:grid;place-items:center}
.launch-shell{width:min(1140px,100%);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);align-items:center;gap:48px}
.launch-copy{grid-column:1;grid-row:1;min-width:0;padding:20px 0}
.launch-art{grid-column:2;grid-row:1;min-width:0;margin:0;border:6px double #365d4e;border-radius:20px;overflow:hidden;background:#dfd8bd}
.launch-art img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}
.launch-art figcaption{padding:40px 24px;text-align:center;font-weight:700;font-size:24px}
.launch-edition{margin:0 0 12px;font-size:18px;font-weight:700}
.launch-copy h1{font-size:clamp(52px,6.5vw,84px);line-height:.95;letter-spacing:-3px;margin:0;font-weight:700}
.launch-copy h1 span{display:block;font-size:clamp(15px,1.8vw,22px);line-height:1.4;letter-spacing:0;margin-top:16px}
.launch-copy h2{font-size:clamp(30px,4vw,48px);line-height:1.08;letter-spacing:-1.5px;margin:0}
.launch-intro{font-size:15px;line-height:1.7;margin:20px 0 24px}
.launch-play{display:block;width:100%;max-width:300px;min-height:62px;padding:12px 24px;background:#ed9f3d;color:#26362e;border:2px solid #734018;border-radius:12px;box-shadow:0 5px 0 #915020;font-size:23px;font-weight:700;transition:transform .15s,box-shadow .15s}
.launch-play:active{transform:translateY(4px);box-shadow:0 1px 0 #915020}
.launch-modes{display:grid;gap:12px}
.launch-mode{display:block;width:100%;min-height:80px;padding:16px 18px;text-align:left;background:#fffaec;border:2px solid #547560;border-radius:12px;color:#193d35}
.launch-mode strong{display:block;font-size:17px;line-height:1.4}
.launch-mode span{display:block;font-size:12px;line-height:1.6;margin-top:4px}
.launch-mode:hover{background:#e1ead7;border-color:#193d35}
.launch-resume{width:100%;min-height:48px;margin-top:16px;padding:10px 14px;border:0;border-radius:8px;background:#285643;color:#fff9e9;font-size:14px;font-weight:700}
.launch-back{display:block;min-height:44px;padding:8px 0;border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;color:#335343;font-size:13px}
.launch-save-note{font-size:11px;line-height:1.6;color:#526047;margin:10px 0 0}
.launch-footnote{margin:30px 0 0;font-size:11px;line-height:1.7;color:#526047}
@media(max-width:760px){
 .launch-screen{padding:20px max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));align-items:start}
 .launch-shell{max-width:460px;grid-template-columns:minmax(0,1fr);gap:20px}
 .launch-art{grid-column:1;grid-row:1;width:min(100%,380px);justify-self:center;border-radius:14px}
 .launch-copy{grid-column:1;grid-row:2;padding:0 6px;text-align:center}
 .launch-edition{font-size:14px;margin-bottom:10px}
 .launch-copy h1{font-size:clamp(43px,12vw,60px);line-height:.92;letter-spacing:-2px}
 .launch-copy h1 br{display:none}
 .launch-copy h1 span{font-size:15px;margin-top:12px}
 .launch-copy h2{font-size:32px}
 .launch-copy h2 br{display:none}
 .launch-intro{font-size:13px;line-height:1.6;margin:14px 0 18px}
 .launch-play{max-width:none;min-height:56px;font-size:21px}
 .launch-footnote{margin-top:22px;font-size:10px}
 .launch-back{margin:auto}
 .launch-screen[data-view="mode"] .launch-art{width:170px}
}
@media(max-height:650px) and (max-width:760px){.launch-art{width:min(75%,280px)}.launch-shell{gap:16px}.launch-copy h1{font-size:42px}.launch-footnote{margin-top:18px}}
@media(prefers-reduced-motion:reduce){.launch-play{transition:none}}
.launch-screen[data-view="online"] .launch-art{align-self:start;margin-top:30px}
#onlineForm label,#onlineLobby label{display:block;text-align:left;font-size:13px;font-weight:700;margin:16px 0 7px}
#onlineView input{width:100%;min-width:0;min-height:48px;border:2px solid #547560;border-radius:8px;background:#fffaec;color:#193d35;padding:10px 12px;font-size:16px}
.online-players{list-style:none;margin:0;padding:0;display:grid;gap:10px;text-align:left}
.online-players li{padding:12px 14px;border:1px solid #8d9d83;border-radius:8px;background:#fffaec;font-size:14px;overflow-wrap:anywhere}
.online-players small{display:block;font-size:11px;color:#526047;margin-top:4px}
.online-share{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.online-share a{display:block;text-decoration:none;text-align:center;width:auto;flex:1}
.online-share .launch-back{margin-top:12px;white-space:nowrap}
.online-error{padding:10px 12px;border:1px solid #98421d;border-radius:8px;background:#ffead8;color:#763515;font-size:12px;line-height:1.6}
.online-notice{position:absolute;top:76px;left:16px;right:16px;z-index:35;margin:0;padding:9px 12px;border:1px solid #8b5028;border-radius:8px;background:#fff3d7;color:#633514;font-size:11px;text-align:center}
.online-room-button{position:absolute;right:12px;top:81px;z-index:34;min-height:44px;padding:8px 14px;border:2px solid #547560;border-radius:9px;background:#fff8e8;color:#193d35;font-size:12px;font-weight:700}
.online-notice:not([hidden])~.online-room-button{top:130px}
@media(max-width:760px){.launch-screen[data-view="online"] .launch-art{width:150px;margin-top:0}.online-share .launch-back{margin:12px 0 0}.launch-screen[data-view="online"] .launch-copy{text-align:left}.launch-screen[data-view="online"] .launch-back{margin-left:0}.launch-screen[data-view="online"] .launch-footnote{text-align:left}}

/* A full-screen game poster: the cast dodges the same bills found on the board. */
.launch-art{position:relative;isolation:isolate}
.launch-art .cover-world{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover}
.cover-cast{position:absolute;inset:0;pointer-events:none}
.cover-avatar{position:absolute;bottom:2%;width:49%;height:91%;transform-origin:50% 90%}
.cover-avatar img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:contain;filter:drop-shadow(0 12px 6px #102b3c33)}
.cover-man{left:0;z-index:2}.cover-woman{right:0;z-index:1}
.cover-speech{position:absolute;top:4%;left:14%;padding:9px 13px;border:3px solid #15323b;border-radius:15px 15px 3px 15px;background:#fff3d5;color:#15323b;font-size:clamp(10px,1.3vw,19px);font-weight:800;white-space:nowrap;transform:rotate(-6deg);box-shadow:3px 4px #15323b}
.cover-woman .cover-speech{left:auto;right:2%;top:35%;transform:rotate(6deg)}
.cover-bill{position:absolute;z-index:3;padding:14px 10px 22px;background:#fff0cd;border:2px solid #9e482c;color:#6f321e;font-size:13px;font-weight:800;box-shadow:3px 5px #17323b55;transform:rotate(14deg)}
.cover-bill:after{content:'';position:absolute;bottom:8px;left:10px;right:10px;height:5px;border-top:1px dashed currentColor;border-bottom:1px solid currentColor}
.bill-kpr{top:24%;left:0}.bill-motor{right:0;top:60%;transform:rotate(-19deg)}.bill-bpjs{bottom:10%;left:40%;transform:rotate(-12deg)}
.launch-screen:not([data-view="cover"]) .cover-speech,.launch-screen:not([data-view="cover"]) .cover-bill{display:none}
.launch-screen[data-view="cover"]{padding:0;display:block;background:#b2602d;color:#fff2d4}
.launch-screen[data-view="cover"] .launch-shell{display:block;position:relative;isolation:isolate;width:100%;max-width:none;min-height:650px;height:100svh;overflow:hidden}
.launch-screen[data-view="cover"] .launch-art{position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;border-radius:0;z-index:-1;background:#b2602d}
.launch-screen[data-view="cover"] .cover-world{position:absolute;inset:0;aspect-ratio:auto;object-position:50% 50%}
.launch-screen[data-view="cover"] .launch-art:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,#102d37e8 0%,#102d37c9 28%,#102d3733 54%,transparent 80%)}
.launch-screen[data-view="cover"] .cover-cast{z-index:1;left:43%;right:1%;top:9%;bottom:7%}
.launch-screen[data-view="cover"] .cover-man{animation:cover-dodge 1.8s ease-in-out infinite}
.launch-screen[data-view="cover"] .cover-woman{animation:cover-hop 2.4s ease-in-out -.6s infinite}
.launch-screen[data-view="cover"] .cover-bill{animation:cover-receipt 4s ease-in-out infinite}
.launch-screen[data-view="cover"] .bill-motor{animation-delay:-1.8s}.launch-screen[data-view="cover"] .bill-bpjs{animation-delay:-2.9s}
.launch-screen[data-view="cover"] .launch-copy{padding:0}
.launch-screen[data-view="cover"] .cover-heading{position:absolute;top:10%;left:6%;width:40%;max-width:650px}
.launch-screen[data-view="cover"] .launch-edition{font-size:14px;letter-spacing:2px;color:#ffd399;margin:0 0 15px}
.launch-screen[data-view="cover"] h1{font-family:Impact,'Arial Black',sans-serif;font-weight:900;font-size:clamp(82px,9vw,154px);line-height:.89;letter-spacing:-2px;color:#fff0c9;text-shadow:3px 3px 0 #163540,6px 6px 0 #163540,9px 10px 0 #bd532e;transform:rotate(-3deg)}
.launch-screen[data-view="cover"] h1 span{font-family:inherit;font-size:clamp(17px,1.8vw,25px);font-weight:400;line-height:1.3;letter-spacing:.3px;margin-top:24px;text-shadow:1px 2px #163540;transform:rotate(3deg)}
.cover-start{position:absolute;left:6%;bottom:12%;width:34%;max-width:380px}
.launch-screen[data-view="cover"] .launch-intro{font-size:20px;font-weight:600;line-height:1.4;margin:0 0 20px;color:#fff1d2;text-shadow:0 2px 3px #102d37}
.launch-screen[data-view="cover"] .launch-play{max-width:100%;min-height:68px;border:3px solid #14333b;background:#f9a438;color:#18333b;border-radius:14px;box-shadow:0 6px 0 #a74b28,0 9px 0 #14333b;font-size:27px;font-weight:800}
.cover-play-note{margin:14px 0 0;font-size:12px;text-align:center;color:#fff1d2}
.launch-screen[data-view="cover"] .launch-footnote{position:absolute;left:6%;bottom:3%;margin:0;color:#fff0cf;font-size:11px}
.cover-motion{position:absolute;z-index:5;top:max(15px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));min-width:52px;min-height:44px;padding:8px;border:1px solid #ffe7bd;border-radius:8px;background:#15343b;color:#fff0cf;font-size:12px}
.launch-screen button:focus-visible{outline:3px solid #fff2cf;outline-offset:5px;box-shadow:0 0 0 7px #17343b}
.launch-screen[data-view="cover"] #coverFallback{position:absolute;right:5%;top:45%;width:45%;color:#fff2d4;text-shadow:0 2px 2px #14333b}
.launch-screen[data-paused="true"] .cover-cast *,.launch-screen[hidden] .cover-cast *{animation-play-state:paused!important}
@keyframes cover-dodge{0%,100%{transform:translate(0,0) rotate(-4deg)}35%{transform:translate(-10px,-20px) rotate(3deg)}65%{transform:translate(5px,-5px) rotate(-5deg)}}
@keyframes cover-hop{0%,100%{transform:translateY(0) rotate(4deg)}45%{transform:translateY(-25px) rotate(-3deg)}70%{transform:translateY(-6px) rotate(6deg)}}
@keyframes cover-receipt{0%,100%{translate:0 0;rotate:-7deg}50%{translate:8px -30px;rotate:12deg}}
@media(min-width:761px) and (max-height:740px){.launch-screen[data-view="cover"] .launch-shell{min-height:540px}.launch-screen[data-view="cover"] .cover-heading{top:8%}.launch-screen[data-view="cover"] h1{font-size:clamp(72px,8vw,112px)}.cover-start{bottom:10%}.launch-screen[data-view="cover"] h1 span{margin-top:16px}.launch-screen[data-view="cover"] .launch-intro{font-size:16px;margin-bottom:12px}}
@media(max-width:760px){
 .launch-screen[data-view="cover"] .launch-shell{height:100svh;min-height:540px}
 .launch-screen[data-view="cover"] .cover-world{object-position:61% 50%}
 .launch-screen[data-view="cover"] .launch-art:after{background:linear-gradient(180deg,#12343be8 0%,#12343b73 27%,transparent 44%,#12343b33 65%,#12343bf5 89%)}
 .launch-screen[data-view="cover"] .cover-heading{top:max(24px,env(safe-area-inset-top));left:8%;width:84%;max-width:none;text-align:center}
 .launch-screen[data-view="cover"] .launch-edition{font-size:11px;letter-spacing:1.5px;margin-bottom:12px}
 .launch-screen[data-view="cover"] h1{font-size:clamp(58px,17.5vw,104px);line-height:.87;letter-spacing:-1px;text-shadow:2px 2px #163540,4px 4px #163540,6px 7px #bd532e}
 .launch-screen[data-view="cover"] h1 br{display:block}
 .launch-screen[data-view="cover"] h1 span{font-size:17px;margin-top:16px}
 .launch-screen[data-view="cover"] .cover-cast{top:auto;left:1%;right:1%;bottom:calc(171px + env(safe-area-inset-bottom));height:48svh;max-height:560px;min-height:238px}
 .cover-avatar{height:94%;width:55%}.cover-man{left:-2%}.cover-woman{right:-1%}
 .cover-speech{font-size:11px;padding:7px 9px;top:5%;left:14%;border-width:2px;box-shadow:2px 3px #15323b}.cover-woman .cover-speech{right:5%;top:35%}
 .cover-bill{font-size:10px;padding:10px 8px 18px}.bill-kpr{left:5%;top:36%}.bill-motor{right:1%;top:60%}.bill-bpjs{left:43%;bottom:5%}
 .cover-start{left:9%;bottom:calc(35px + env(safe-area-inset-bottom));width:82%;max-width:none;text-align:center}
 .launch-screen[data-view="cover"] .launch-intro{font-size:16px;line-height:1.25;margin:0 0 12px}
 .launch-screen[data-view="cover"] .launch-play{min-height:58px;font-size:24px}
 .cover-play-note{font-size:11px;margin-top:12px}
 .launch-screen[data-view="cover"] .launch-footnote{left:3%;right:3%;bottom:calc(9px + env(safe-area-inset-bottom));font-size:8px;text-align:center}
 .cover-motion{top:max(8px,env(safe-area-inset-top));right:max(7px,env(safe-area-inset-right));font-size:10px;min-width:44px;padding:5px}
 .launch-screen[data-view="cover"] #coverFallback{top:45%;right:10%;width:80%;font-size:18px}
}
@media(max-width:760px) and (max-height:680px){.launch-screen[data-view="cover"] .cover-heading{top:max(15px,env(safe-area-inset-top))}.launch-screen[data-view="cover"] h1{font-size:clamp(52px,15vw,76px)}.launch-screen[data-view="cover"] h1 span{font-size:14px;margin-top:12px}.launch-screen[data-view="cover"] .launch-edition{margin-bottom:9px}.launch-screen[data-view="cover"] .cover-cast{height:43svh;min-height:220px;bottom:150px}.cover-start{bottom:31px}.launch-screen[data-view="cover"] .launch-intro{font-size:14px;margin-bottom:9px}.launch-screen[data-view="cover"] .launch-play{min-height:52px}.cover-play-note{font-size:10px;margin-top:11px}}
@media(prefers-reduced-motion:reduce){.launch-screen .cover-cast *{animation:none!important}.cover-avatar img{filter:none}}
@media(min-width:761px) and (max-height:500px){.launch-screen[data-view="cover"] .launch-shell{min-height:340px}.launch-screen[data-view="cover"] h1{font-size:64px}.launch-screen[data-view="cover"] .cover-heading{top:7%}.launch-screen[data-view="cover"] .cover-start{bottom:8%}.launch-screen[data-view="cover"] .launch-intro{font-size:13px;margin-bottom:8px}.launch-screen[data-view="cover"] .launch-play{min-height:48px;font-size:22px}.cover-play-note{margin-top:11px;font-size:10px}.launch-screen[data-view="cover"] .launch-footnote{font-size:9px;bottom:2%}}
/* Light Ramadan ornaments preserve the approved cover art and cast. */
.ramadan-ornaments{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.ramadan-moon{position:absolute;right:17%;top:8%;width:48px;height:48px;border-radius:50%;box-shadow:-12px 6px 0 0 #ffe5a0;transform:rotate(-20deg);opacity:.8}
.ramadan-lamp{position:absolute;top:0;width:24px;height:62px;border-bottom:26px solid #efbd60;border-radius:0 0 10px 10px;transform-origin:50% 0;animation:ramadan-lamp-sway 5s ease-in-out infinite alternate;filter:drop-shadow(0 0 7px #ffd47c66)}
.ramadan-lamp:before{content:'';position:absolute;left:11px;top:0;width:2px;height:36px;background:#ffe6a0}
.ramadan-lamp:after{content:'';position:absolute;left:5px;bottom:-21px;width:14px;height:17px;border:2px solid #8c692b;border-radius:4px;background:#ffe6a0}
.lamp-one{left:4%}.lamp-two{right:5%;height:84px;animation-delay:-2s}.lamp-two:before{height:58px}
.launch-screen[data-paused="true"] .ramadan-ornaments *, .launch-screen[hidden] .ramadan-ornaments *{animation-play-state:paused!important}
@keyframes ramadan-lamp-sway{from{transform:rotate(-5deg)}to{transform:rotate(5deg)}}
@media(max-width:760px){.ramadan-moon{right:14%;top:7%;width:30px;height:30px;box-shadow:-8px 4px 0 #ffe5a0}.launch-screen[data-view="cover"] .launch-edition{font-size:clamp(17px,5vw,25px);margin-bottom:9px}.launch-screen[data-view="cover"] h1 span{font-size:13px;margin-top:13px}.ramadan-lamp{width:19px;opacity:.8}.lamp-one{left:3%}.lamp-two{right:3%}}
@media(prefers-reduced-motion:reduce){.ramadan-ornaments *{animation:none!important}}
