@font-face{font-family:Megrim;src:url('/art/fonts/Megrim-Regular.ttf') format('truetype');font-display:block}
:root{--ink:#352509;--gold:#ffdc7f;--scene-width:min(100vw,46.758vh,480px)}
@supports(height:100svh){:root{--scene-width:min(100vw,46.758svh,480px)}}
*{box-sizing:border-box}body{margin:0;background:#c0a064 url('/art/environment/oasis_background.png') center/cover fixed no-repeat;color:var(--ink);font-family:system-ui,sans-serif}button,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default}.gameplay{position:relative;width:var(--scene-width);aspect-ratio:1024/2190;margin:auto;isolation:isolate}.gameplay>canvas{display:block;width:100%;height:100%;touch-action:none}.hud{position:absolute;left:2%;top:0;width:42%;height:15%;background:url('/art/ui/hud/score_box_frame_approved_115pct.png') center/contain no-repeat;pointer-events:none}.hud dl{position:absolute;top:39%;left:15%;width:70%;margin:0;font-family:Megrim;font-weight:bold;font-size:clamp(12px,calc(var(--scene-width)*.035),18px)}.hud dl div{display:flex;justify-content:space-between;gap:6px}.hud dd{margin:0;font-family:system-ui;font-size:.9em;font-variant-numeric:tabular-nums}.game-cards{position:absolute;top:84.93%;left:5.86%;width:88.28%;display:flex;gap:2.65%}.game-cards button{flex:1;min-width:0;border:0;padding:0;background:none;line-height:0;border-radius:14%;touch-action:manipulation}.game-cards canvas{display:block;width:100%;height:auto}.game-cards button[aria-pressed=true]{outline:2px solid var(--gold);outline-offset:1px}.game-cards button:disabled{opacity:.5}.game-cards button:focus-visible{outline:2px solid white}.notice{position:absolute;top:16%;left:5%;width:90%;text-align:center;font-size:12px;color:#752312}.notice:empty{display:none}details{max-width:900px;margin:16px auto;background:#fff1cfe8;padding:12px}details canvas{max-width:100%;height:auto}details button,details select{margin:4px;padding:8px}summary{cursor:pointer}#hand-bottle{touch-action:none}.hand-cards{display:flex;gap:8px}.hand-cards button{width:30%}.hand-cards canvas{width:100%}#bottle{touch-action:none}
/* UI states are a separate DOM layer; the approved Pass 9 scene is unchanged. */
[hidden]{display:none!important}
.art-button{background:none;border:0;padding:0;line-height:0;touch-action:manipulation}.art-button img{display:block;width:100%;height:auto}.art-button:focus-visible,.audio-toggle:focus-visible{outline:2px solid white;outline-offset:3px}
.title-screen{position:relative;width:min(100vw,66.667svh,680px);height:min(150vw,100svh,1020px);margin:auto;font-family:Megrim;font-weight:bold;text-align:center}.title-logo{position:absolute;left:5%;top:16%;width:90%}.title-best{position:absolute;top:39%;width:100%;font-size:clamp(18px,3.2vw,30px)}.title-best span{font-family:system-ui;font-size:.85em}.title-new-game{position:absolute;width:64%;left:18%;top:47%}.title-screen footer{position:absolute;bottom:3%;width:100%;font:16px Megrim}.title-screen #title-notice{position:absolute;bottom:10%;width:100%;font:14px system-ui;color:#752312}
.pause-control{position:absolute;right:5%;top:3%;font-family:Megrim;font-weight:bold;font-size:clamp(12px,calc(var(--scene-width)*.045),22px);background:#fff0c8;border:1px solid #a67c27;border-radius:8px;padding:.5em;touch-action:manipulation}
.round-start{position:absolute;left:15%;top:26%;width:70%;height:auto;pointer-events:none;z-index:3}.screen-overlay{position:absolute;inset:0;background:rgb(0 0 0/.48);z-index:5}
.modal-reference{position:absolute;top:0;left:0;width:100%;height:calc(var(--scene-width)*1.5);font-family:Megrim;font-weight:bold;text-align:center;color:var(--ink)}
.modal-art{position:absolute;left:5.074%;top:29.622%;width:89.8516%;height:auto;pointer-events:none}
.modal-heading{position:absolute;left:5%;top:40.104%;transform:translateY(-50%);width:90%;margin:0;font-size:calc(var(--scene-width)*.1015625);line-height:1;color:#fff0c4;font-weight:bold}
.volume-row{position:absolute;left:18%;width:64%;display:flex;align-items:center;justify-content:space-between;transform:translateY(-50%);font-size:calc(var(--scene-width)*.056640625)}.music-row{top:49.805%}.sound-row{top:56.445%}.volume-controls{display:flex;align-items:center;gap:calc(var(--scene-width)*.01171875)}.audio-toggle{width:calc(var(--scene-width)*.037109375);height:calc(var(--scene-width)*.037109375);padding:0;background:none;border:0}.audio-toggle img{width:100%;height:100%}
.volume-controls input{appearance:none;-webkit-appearance:none;width:calc(var(--scene-width)*.21484375);height:calc(var(--scene-width)*.03125);background:url('/art/ui/controls/slider_track.png') center/100% 100% no-repeat;margin:0;cursor:pointer;touch-action:pan-x;border:0;outline-offset:4px}
.volume-controls input::-webkit-slider-thumb{appearance:none;width:calc(var(--scene-width)*.033203125);height:calc(var(--scene-width)*.0442708333);background:url('/art/ui/controls/slider_handle.png') center/contain no-repeat;border:0}
.volume-controls input::-moz-range-thumb{width:calc(var(--scene-width)*.033203125);height:calc(var(--scene-width)*.0442708333);background:url('/art/ui/controls/slider_handle.png') center/contain no-repeat;border:0;border-radius:0}
.modal-button{position:absolute;left:29.98%;width:40.04%}.pause-resume{top:65%}.pause-menu{top:78%}.over-menu{top:80%}.over-retry{top:91%}.clear-next{top:68%}.round-clear-label{position:absolute;top:52%;left:10%;width:80%;font-size:calc(var(--scene-width)*.047)}
.final-statistics{position:absolute;top:49%;left:18%;width:64%;margin:0;font-size:calc(var(--scene-width)*.039);line-height:1.8}.final-statistics div{display:flex;justify-content:space-between;gap:8px}.final-statistics dd{font-family:system-ui;font-size:.9em;margin:0;font-variant-numeric:tabular-nums}.new-best{position:absolute;top:44%;width:100%;margin:0;font-size:calc(var(--scene-width)*.04);color:#7b3508}
.tutorial-hint{position:absolute;transform:translate(-50%,-50%);width:25%;pointer-events:none;z-index:2;text-align:center;color:#fff;font-family:Megrim;font-weight:bold;font-size:clamp(11px,calc(var(--scene-width)*.032),16px);text-shadow:0 1px 3px #352509}.tutorial-hint img{display:block;width:70%;max-height:70px;object-fit:contain;margin:auto}.tutorial-hint span{display:block;white-space:nowrap}
/* Registration against the supplied locked Title/Round Clear/Game Over references.
   Reference screenshots are never runtime images. Pause uses written Core coordinates. */
.title-screen{background:url('/art/environment/oasis_background.png') center/100% 100% no-repeat}.title-logo{left:13%;top:7.8%;width:74%}.title-best{top:28.5%}.title-new-game{width:60%;left:20%;top:64%}.title-screen footer{font-size:clamp(16px,calc(min(100vw,66.667svh,680px)*.0625),42px);color:#005ecd;text-shadow:0 1px #fff1bd}
.pause-control{width:10%;aspect-ratio:1;right:3%;top:1%;border:0;padding:0;background:none;border-radius:50%;line-height:0}.pause-base{display:block;width:100%;height:100%}.pause-icon{position:absolute;left:32%;top:32%;width:36%;height:36%;object-fit:contain}
.round-start{left:32%;top:13.8%;width:36%}
.modal-heading{color:#005ecd;-webkit-text-stroke:calc(var(--scene-width)*.0015) #00366f}
.volume-row{left:0;width:100%;justify-content:center}.volume-row label{position:absolute;left:0;bottom:calc(var(--scene-width)*.03515625);width:100%;font-weight:bold;color:#005ecd;-webkit-text-stroke:calc(var(--scene-width)*.001) #00366f;line-height:1}
#game-over-panel .modal-art,#round-clear-panel .modal-art{width:72.3164%;left:13.8418%;top:16.276%}
#game-over-panel .modal-heading,#round-clear-panel .modal-heading{top:31.9%;font-size:calc(var(--scene-width)*.078125)}
#game-over-panel .modal-heading{font-size:calc(var(--scene-width)*.09765625)}
.final-statistics{top:37%;left:26%;width:48%;font-size:calc(var(--scene-width)*.03125);line-height:1.16}.new-best{top:34%;font-size:calc(var(--scene-width)*.03125)}
.over-menu{top:51%}.over-retry{top:62%}.clear-menu{top:46.875%}.clear-next{top:58.594%}.round-clear-label{top:38%;font-size:calc(var(--scene-width)*.04)}
.title-screen{height:100svh;max-height:none;background-size:cover}
/* Preserve the approved slider track's source aspect ratio at the mandated 220px width. */
.volume-controls input{height:calc(var(--scene-width)*.0358072917)}
/* Title Best uses the unchanged approved blank HUD frame; the value remains live. */
.title-best{left:50%;top:calc(28.5% + clamp(27px,4.8vw,45px));transform:translate(-50%,-50%);width:56%;max-width:230px;font-size:clamp(16px,3.2vw,24px);aspect-ratio:1665/1249;margin:0;display:flex;align-items:center;justify-content:center;gap:.35em;background:url('/art/ui/hud/score_box_frame_approved_115pct.png') center/contain no-repeat}
/* Live-phone correction: actual content box follows the unchanged frame aspect ratio. */
.hud{height:auto;aspect-ratio:1665/1249;color:#005ecd}
.hud dl{top:37%;left:18%;width:64%;font-family:Megrim;font-weight:bold;font-size:calc(var(--scene-width)*.032);line-height:1.25;-webkit-text-stroke:calc(var(--scene-width)*.0007) #00366f}
.hud dl div{display:grid;grid-template-columns:1fr 1.45fr;gap:3%;align-items:center}
.hud dt,.hud dd{font-family:Megrim;font-size:inherit;font-weight:bold;white-space:nowrap;min-width:0}
.hud dd{text-align:right}
