/* Dedicated raster cabinet; text and controls remain accessible HTML. */
.goldfish-room{margin:0;background:#f3ecd9;color:#173e43;font-family:'Noto Sans JP',sans-serif;min-height:100svh}
.goldfish-machine{position:relative;width:min(100%,780px,calc(100svh * .75));aspect-ratio:3/4;margin:0 auto;background:url('/goldfish/assets/cabinet-v2.webp') center/100% 100% no-repeat;container-type:inline-size}
.goldfish-marquee{position:absolute;top:3%;left:26%;width:48%;height:10%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.goldfish-marquee>span{font-size:clamp(14px,2.5cqw,18px);font-weight:800;color:#174651}
.goldfish-marquee h1{margin:0;color:#bc2824;font-size:clamp(28px,7cqw,62px);font-weight:900;line-height:1.4;letter-spacing:.02em;text-shadow:1px 2px #fff5d4,2px 3px #cb963b;white-space:nowrap}
.goldfish-marquee h1 span{color:#173d72}
.goldfish-display{position:absolute;left:7.3%;top:18.1%;width:85.4%;height:36.25%;overflow:hidden;border-radius:4px;background:#72cace}
#pond{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}
.goldfish-hud{position:absolute;top:6px;left:6px;right:6px;display:flex;justify-content:space-between;pointer-events:none;z-index:2;gap:8px}
.goldfish-hud>span{background:#fff9e8;border:2px solid #b7b98c;border-radius:5px;padding:3px 7px;font-size:16px;font-weight:700;box-shadow:0 2px 3px #164d6350}
.goldfish-hud strong{color:#bf3426;font-size:20px}
.goldfish-cue{position:absolute;left:3%;right:3%;bottom:29px;margin:0;background:#fffaf0ef;border:1px solid #d6c787;border-radius:5px;text-align:center;padding:5px;font-weight:800;font-size:16px;pointer-events:none;line-height:1.5}
.paper-meter{position:absolute;bottom:4px;left:6px;right:6px;background:#f6f8eeeb;border-radius:4px;display:flex;align-items:center;gap:8px;padding:1px 6px;font-size:14px;font-weight:700}
.paper-meter meter{flex:1;min-width:0;height:18px}
.goldfish-deck{position:absolute;left:6%;top:56.6%;width:88%;height:15.8%}
.goldfish-insert{position:absolute;inset:0}
.hardware-label{position:absolute;left:36%;top:2%;width:39%;font-weight:800;text-align:center;font-size:16px}
.goldfish-lamps{position:absolute;left:36%;top:31%;width:39%;display:flex;justify-content:center;gap:7px;padding:5px;background:#18434e;border-radius:5px;box-shadow:inset 0 2px 5px #082c31;box-sizing:border-box}
.goldfish-lamps i{display:block;width:16px;height:16px;border:2px solid #c5b069;border-radius:50%;background:radial-gradient(circle at 35% 25%,#839081,#273a36)}
.goldfish-lamps i.on{background:radial-gradient(circle at 35% 25%,#fff,#fff3a7 25%,#ffbd29 65%);box-shadow:0 0 9px #ffc943}
.goldfish-slot{position:absolute;left:10.5%;top:6%;width:19%;height:73%;border:0;background:transparent;color:#164751;cursor:pointer;font:inherit}
.goldfish-slot>span{display:none}
.goldfish-slot b{position:absolute;left:0;right:0;bottom:-16%;padding:2px;border:1px solid #869995;border-radius:3px;background:#fff9e8;font-size:14px;white-space:nowrap}
.goldfish-slot:active{filter:brightness(.8);transform:translateY(2px)}
.goldfish-return{font:inherit;font-size:14px;border:1px solid #8c9f99;border-bottom:3px solid #80958c;border-radius:4px;background:linear-gradient(#fffdf0,#e2e9db);color:#194952;padding:5px 7px;cursor:pointer}
#cancel{position:absolute;left:36%;bottom:5%;width:39%}
.goldfish-action{position:absolute;left:76%;top:17%;width:16.5%;aspect-ratio:1}
.goldfish-push{display:block;width:100%;height:100%;min-width:44px;background:transparent url('/fishing/assets/button-red-v1.webp') center/contain no-repeat;border:0;font:inherit;font-weight:900;font-size:clamp(14px,3.5cqw,24px);color:white;text-shadow:0 2px 1px #601412;cursor:pointer;transition:transform .08s,filter .08s;touch-action:none}
.goldfish-push:active,.goldfish-push.pressed{transform:translateY(3px) scale(.96);filter:brightness(.8)}
.goldfish-base{position:absolute;left:4%;top:74%;width:92%;height:24%}
.goldfish-tray{position:absolute;left:13.6%;top:26.5%;width:56.6%;height:56%;background:transparent;border:0;border-radius:4px;font:inherit;cursor:pointer;padding:0}
.goldfish-tray>span{background:#19434e;color:#fff;position:absolute;top:-15px;left:50%;transform:translateX(-50%);white-space:nowrap;padding:3px 8px;border:1px solid #fff3c5;border-radius:3px;font-weight:800;font-size:16px}
#tray-coins{display:flex;justify-content:center;gap:0;position:absolute;left:0;right:0;bottom:20%}
#tray-coins img{width:clamp(22px,4vw,34px);height:auto;margin-left:-9px;animation:medal-arrive .35s ease-out both}
.goldfish-tray.ready{box-shadow:0 0 0 3px #fff4aa,0 0 16px #ffe970}
.goldfish-base>div{position:absolute;right:4%;bottom:0;display:flex;flex-direction:column;align-items:center;font-size:14px;gap:1px}
.goldfish-base strong{font-size:20px}
#sound{position:absolute;bottom:240%;right:0;white-space:nowrap}
.goldfish-instructions{max-width:740px;margin:30px auto;padding:22px;background:#fffdf3;border:1px solid #c7c3a6;line-height:1.9;font-size:16px}
.goldfish-instructions h2{font-size:22px}
.goldfish-room button:disabled{cursor:default;opacity:.65}
.goldfish-room .goldfish-tray:disabled{opacity:1}
.goldfish-room button:focus-visible,.goldfish-room canvas:focus-visible{outline:3px solid #146eac;outline-offset:3px}
@keyframes medal-arrive{from{transform:translateY(-14px) rotate(-20deg);opacity:0}to{transform:none;opacity:1}}
@media(max-width:480px){.goldfish-hud>span{font-size:14px;padding:2px 5px}.goldfish-hud strong{font-size:18px}.goldfish-cue{padding:3px;line-height:1.35}.goldfish-instructions{margin-inline:10px}.goldfish-lamps{gap:4px;padding:3px}.goldfish-lamps i{width:14px;height:14px}.hardware-label{font-size:14px}#cancel{font-size:14px;padding:2px 4px}.goldfish-tray>span{font-size:14px}.goldfish-base strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){#tray-coins img{animation:none}.goldfish-push{transition:none}}

.inserted-coin{position:absolute;left:35%;top:15%;width:28px;height:28px;background:url('/images/medal-m1.png') center/contain no-repeat;pointer-events:none;animation:coin-slot .6s ease-in forwards}
@keyframes coin-slot{0%{transform:translateY(-28px) scale(1);opacity:1}65%{transform:translateY(4px) scale(.65);opacity:1}100%{transform:translateY(8px) scale(.1,.65);opacity:0}}
@media(prefers-reduced-motion:reduce){.inserted-coin{animation:none;display:none}}

.goldfish-marquee>span{line-height:1.2}
.goldfish-return{line-height:1.15}
.goldfish-base>div{position:static}
.goldfish-base>div>span{position:absolute;right:3%;width:26%;bottom:36%;line-height:1.1;text-align:center;font-weight:800;white-space:nowrap;background:#fff4cf;border-radius:3px;padding:2px 0;box-sizing:border-box}
.goldfish-base>div>strong{position:absolute;right:3%;width:22%;bottom:8%;line-height:1.1;text-align:center;box-sizing:border-box;background:#173e43;color:#fff9d0;border:2px solid #b4af83;border-radius:3px;box-shadow:inset 0 2px 4px #09282d;padding:2px 0}
#sound{top:0;bottom:auto;right:4%}
.goldfish-room .goldfish-return:disabled{opacity:1;color:#68736f;background:#eee9d7}

#cancel{bottom:-10%}
.goldfish-push{padding:0;white-space:nowrap}
@container(max-width:480px){.goldfish-hud>span{font-size:14px;padding:2px 5px}.goldfish-hud strong{font-size:18px}.goldfish-cue{padding:3px;line-height:1.35}.goldfish-lamps{gap:4px;padding:3px}.goldfish-lamps i{width:14px;height:14px}.hardware-label{font-size:14px}#cancel{font-size:14px;padding:2px 4px}.goldfish-tray>span{font-size:14px}.goldfish-base strong{font-size:18px}}
@container(max-width:360px){#cancel{bottom:-27%}}
.goldfish-collection{position:absolute;top:45px;left:7px;display:flex;gap:3px;padding:3px;background:#fff9e8eb;border:1px solid #b7b98c;border-radius:5px;pointer-events:none}
.goldfish-collection[hidden]{display:none}
.goldfish-collection i{width:30px;height:21px;background:url('/goldfish/assets/fish.png') 0 0/200% 200%;opacity:.28;filter:grayscale(1);border-radius:3px}
.goldfish-collection i:nth-child(2){background-position:100% 0}
.goldfish-collection i:nth-child(3){background-position:0 100%}
.goldfish-collection i:nth-child(4){background-position:100% 100%}
.goldfish-collection i.found{opacity:1;filter:none;box-shadow:0 0 0 1px #b59a50}

.goldfish-steps{padding-left:1.4em}.goldfish-steps li{margin:1em 0}.goldfish-steps strong{display:block}.goldfish-species{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:24px 0}.goldfish-species>div{padding:14px;background:#fff8de;border:1px solid #d5b566;border-radius:6px}.goldfish-species h3{font-size:16px;margin:8px 0}.goldfish-species h3 span{color:#b32820;white-space:nowrap}.goldfish-species p{font-size:16px;margin:0}.species-art{display:block;width:90px;height:64px;margin:auto;background:url(/goldfish/assets/fish.png) 0 0/200% 200%}.species-1{background-position:100% 0}.species-2{background-position:0 100%}.species-3{background-position:100% 100%}@media(max-width:360px){.goldfish-species{grid-template-columns:1fr}}
