/* Supplied artwork, positioned in the reference's 1536 × 1024 coordinate space. */
#playMode.online-overlay{position:absolute;inset:0;display:grid;place-items:center;padding:0;overflow:hidden;background:#450b0b url('assets/play-mode-background-v123.jpeg') center/cover no-repeat;color:white;container-type:size}
#playMode .mode-artboard{position:relative;width:min(100cqw,150cqh);height:auto;aspect-ratio:3/2;max-width:100%;max-height:100%;isolation:isolate;flex:none}
#playMode .mode-title{position:absolute;left:23.30729167%;top:1.46484375%;width:54.55729167%;height:9.765625%;margin:0;z-index:4;pointer-events:none;mix-blend-mode:lighten}
#playMode .mode-title img{display:block;width:100%;height:100%}
#playMode .mode-title span,#playMode .mode-hint{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
#playMode .mode-choices{position:absolute;inset:0}
#playMode .mode-choice{position:absolute;top:0;left:0;width:50%;height:100%;min-width:0;min-height:0;margin:0;padding:0;overflow:visible;border:0;background:none;color:inherit;pointer-events:none;touch-action:manipulation;outline:none}
#playMode .mode-choice::after{content:"";position:absolute;inset:12% 0 10%;z-index:5;pointer-events:auto;cursor:pointer}
#playMode .mode-multi{left:50%}
#playMode .mode-visual{position:absolute;left:0;top:0;width:200%;height:100%;pointer-events:none}
#playMode .mode-multi .mode-visual{left:-100%}
#playMode .mode-frame{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
#playMode .mode-frame-line{stroke:#bca1a5;stroke-width:4;stroke-opacity:.6;transition:stroke .15s,filter .15s,stroke-opacity .15s}
#playMode .mode-frame-fill{opacity:.3;transition:opacity .15s}
#playMode .mode-choice[aria-pressed="true"] .mode-frame-line{stroke:#fffaf2;stroke-opacity:1;stroke-width:5;filter:drop-shadow(0 0 4px white) drop-shadow(0 0 12px #ff5949) drop-shadow(0 0 22px #ff413e)}
#playMode .mode-choice[aria-pressed="true"] .mode-frame-fill{opacity:1}
#playMode .mode-driver,#playMode .mode-label{position:absolute;display:block;max-width:none;height:auto;pointer-events:none;transition:filter .15s}
#playMode .mode-driver{z-index:1;filter:brightness(.94)}
#playMode .mode-choice[aria-pressed="true"] .mode-driver{filter:brightness(1)}
#playMode .mode-single .mode-driver{left:5.98958333%;top:11.71875%;width:40.88541667%}
#playMode .mode-multi .mode-driver{left:42.578125%;top:15.13671875%;width:55.859375%}
#playMode .mode-label{z-index:2}
#playMode .mode-single .mode-label{left:2.08333333%;top:71.6796875%;width:42.3828125%;filter:brightness(.62) saturate(.8)}
#playMode .mode-multi .mode-label{left:46.74479167%;top:73.33984375%;width:45.703125%}
#playMode .mode-single[aria-pressed="true"] .mode-label{filter:brightness(1.05) drop-shadow(0 0 4px #fff) drop-shadow(0 0 14px #ff574d)}
#playMode .mode-multi[aria-pressed="true"] .mode-label{filter:brightness(1.75) saturate(1.5) drop-shadow(0 0 4px #fff) drop-shadow(0 0 14px #ff574d)}
#playMode .mode-choice:focus-visible .mode-frame-line{stroke:#fff;stroke-opacity:1;filter:drop-shadow(0 0 7px #ffdaae)}
#playMode .mode-back{position:absolute;left:max(12px,env(safe-area-inset-left));top:max(10px,env(safe-area-inset-top));z-index:8;min-height:36px;padding:7px 12px;border:1px solid #ffffffa8;border-radius:8px;background:#501111c9;color:white;font-size:14px;font-weight:900;text-shadow:0 2px 4px #000;cursor:pointer}
#playMode .mode-back:focus-visible{outline:3px solid white;outline-offset:3px}
@media(prefers-reduced-motion:reduce){#playMode .mode-driver,#playMode .mode-label,#playMode .mode-frame-line,#playMode .mode-frame-fill{transition:none}}
