.arcade-overlay{position:fixed;inset:0;z-index:30;overflow:auto;background:radial-gradient(ellipse at top,#4a7e6b,#183f39 80%);color:#264c40;padding:22px;overscroll-behavior:contain}.arcade-shell{width:min(1100px,100%);margin:0 auto}.arcade-top{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#fff5d8}.arcade-top small{font-size:10px;letter-spacing:3px;color:#d3dcb8}.arcade-top h1{font-size:26px;letter-spacing:-.8px;margin:8px 0 18px}.arcade-top button{font-size:11px;white-space:nowrap;background:#fff8e6}.arcade-tabs{display:flex;gap:8px;margin:4px 0 20px}.arcade-tabs button{border:1px solid #ffffff55;background:#ffffff14;color:#f7f0d9;font-size:13px;padding:13px 22px}.arcade-tabs button[aria-pressed=true]{background:#f6dfa4;color:#365448;box-shadow:0 4px #1f4a3f}.four-layout,.bowling-layout{display:grid;grid-template-columns:290px 1fr;gap:25px;padding:28px;background:#fffbed;border:1px solid #fff9;border-radius:28px;box-shadow:0 16px 60px #0a2d3c45}.game-intro .game-tag{font-size:8px;letter-spacing:2px;color:#8a9e7c;font-weight:800}.game-intro h2{font-size:30px;letter-spacing:-1px;margin:10px 0}.game-intro p{font-size:12px;color:#6a7d66;line-height:1.7}.game-intro label{display:block;text-align:left;font-size:11px;color:#638066;margin:16px 0 8px}.game-intro select{display:block;width:100%;padding:12px;border:1px solid #d8e2c8;border-radius:12px;background:#fffef7;color:#345e4a;margin-top:8px;font:inherit}.player-key{display:flex;gap:16px;font-size:10px;margin:20px 0}.player-key span:first-child{color:#d58843}.player-key span:last-child{color:#3d8a70}.game-intro #fourStatus,.game-intro #bowlStatus{min-height:48px;font-weight:800;font-size:14px;color:#3c634d}.game-intro button{margin:5px 0;width:100%;font-size:12px}.arcade-primary{background:#357b5f;color:#fff9df;box-shadow:0 4px #24543e}.arcade-primary:hover{background:#28644a}.game-intro small{display:block;font-size:10px;color:#89977d;margin-top:15px}.game-intro .game-note{font-size:10px;margin-top:18px;color:#90a081}.four-table{align-self:center;perspective:900px;padding:5px 15px 25px}.drop-columns{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:0 15px 12px}.drop-columns button{font-size:20px;background:#f0e3b9;padding:9px 0;border-radius:12px;box-shadow:0 3px #d2bc84}.drop-columns button:disabled{opacity:.35;cursor:default;transform:none}:is(#fourBoard,#onlineFourBoard){display:grid;grid-template-columns:repeat(7,1fr);gap:8px;padding:18px;background:linear-gradient(135deg,#4c9b85,#2f6c5b);border:5px solid #65aa92;border-radius:20px;box-shadow:0 10px #1c5144,0 18px 24px #1b4a4525;transform:rotateX(4deg);aspect-ratio:7/6}.disc-slot{display:block;border-radius:50%;background:#d0d9be;box-shadow:inset 0 5px 7px #163e4d55,inset 0 -2px #eeefd5;aspect-ratio:1}.disc-slot.p1{background:radial-gradient(circle at 35% 25%,#ffd57d,#dc9147 75%);box-shadow:inset 0 0 0 4px #f4b661,0 2px #74432e}.disc-slot.p2{background:radial-gradient(circle at 35% 25%,#93c6a8,#366e58 75%);box-shadow:inset 0 0 0 4px #7bb18b,0 2px #244b3c}.disc-slot.winner{outline:3px solid #fff9bf;outline-offset:2px}.board-feet{height:16px;width:94%;margin:13px auto 0;background:#25634f;border-radius:8px;box-shadow:0 5px #1e4c3e}.bowling-view{position:relative;min-height:490px;border-radius:20px;overflow:hidden;background:#284e48}.bowling-view #bowlingCanvas{position:absolute;width:100%;height:100%;inset:0;touch-action:auto}.lane-caption{position:absolute;bottom:14px;width:100%;text-align:center;color:#fff2ca;font-size:9px;letter-spacing:3px;pointer-events:none}.bowling-score{background:#e8edda;border-radius:14px;padding:13px;text-align:center}.bowling-score span{display:block;font-size:9px;letter-spacing:1px}.bowling-score>b{display:block;font-size:34px;margin:3px}.bowling-score small{margin:0}.frame-scores{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:10px}.frame-scores span{font-size:9px;text-align:center;background:#eef0e2;border:1px solid #dfe4d1;border-radius:8px;padding:7px}.frame-scores b{display:block;font-size:16px;margin-top:5px}.frame-scores .active{border:2px solid #80a27b;background:#dfe8cf}.game-intro input[type=range]{display:block;width:100%;accent-color:#498366;margin-top:8px;cursor:pointer}.game-intro output{float:right;color:#8c9e7b}.game-intro button:disabled{opacity:.5;transform:none;cursor:default}@media(max-width:800px){.arcade-overlay{padding:14px}.four-layout,.bowling-layout{grid-template-columns:230px 1fr;padding:20px;gap:15px}.four-table{padding:0}.arcade-top h1{font-size:22px}.drop-columns{gap:4px;padding:0 10px 10px}:is(#fourBoard,#onlineFourBoard){gap:5px;padding:10px;border-width:4px}.game-intro h2{font-size:25px}.bowling-view{min-height:460px}}@media(max-width:600px){.arcade-top{align-items:flex-start;gap:8px}.arcade-top h1{font-size:19px;margin:8px 0 14px}.arcade-top button{padding:10px;font-size:9px}.arcade-tabs{gap:6px}.arcade-tabs button{font-size:11px;padding:12px;flex:1}.four-layout,.bowling-layout{display:flex;flex-direction:column;padding:18px;border-radius:20px}.four-table{width:100%;max-width:430px;order:-1;padding-bottom:5px}.game-intro h2{font-size:23px}.game-intro .game-tag{display:none}.game-intro p{margin:8px 0}.game-intro #fourStatus{min-height:24px}.game-intro label{margin-top:10px}.game-intro .game-note{margin-top:12px}.bowling-view{order:-1;min-height:300px;height:42svh}.bowling-score{padding:9px}.bowling-score>b{font-size:26px}.game-intro #bowlStatus{min-height:30px}.arcade-overlay{padding-bottom:30px}.player-key{margin:12px 0}.four-table :is(#fourBoard,#onlineFourBoard){max-height:42svh;max-width:49svh;margin:auto}.drop-columns{max-width:49svh;margin:auto}.board-feet{max-width:46svh}}
@media(min-width:601px){.four-table{width:min(100%,calc((100svh - 280px)*1.1667));min-width:300px;justify-self:center}.bowling-layout .game-intro label{margin:10px 0 6px}.bowling-layout .game-intro .game-note{margin-bottom:0}.bowling-layout .game-intro h2{font-size:26px}.bowling-layout .game-intro p{margin:8px 0}}
@media(max-width:850px){.actions{gap:4px}.actions button{min-width:48px;padding:10px 9px}}@media(max-width:600px){.actions button{min-width:37px;padding:9px 6px}.actions span{font-size:7px}.actions{right:10px}.actions #wardrobe{display:none}}
:is(#fourBoard,#onlineFourBoard){cursor:pointer;touch-action:manipulation}:is(#fourBoard,#onlineFourBoard).board-locked,:is(#fourBoard,#onlineFourBoard).column-blocked{cursor:not-allowed}:is(#fourBoard,#onlineFourBoard) .disc-slot.hover-column{outline:2px solid #fff3baaa;outline-offset:1px;filter:brightness(1.08)}
.bowling-view #bowlingCanvas{cursor:crosshair}.bowling-view #bowlingCanvas.is-rolling{cursor:wait}.bowling-view #bowlingCanvas:focus-visible{outline:3px solid #f5d18a;outline-offset:-5px}.bowling-view .lane-caption{background:#214d41cc;border:1px solid #ffffff33;border-radius:20px;padding:9px 14px;width:max-content;max-width:94%;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:1.5px}
.bowling-stage{display:grid;grid-template-rows:minmax(0,1fr) auto;height:clamp(460px,calc(100svh - 225px),620px);min-width:0;align-self:start;border-radius:21px;overflow:hidden;background:#244d43;box-shadow:0 5px 18px #244b3415}.bowling-stage .bowling-view{min-height:0;height:auto;border-radius:20px 20px 0 0}.bowling-dock{display:flex;align-items:center;gap:18px;padding:16px 18px;background:linear-gradient(135deg,#eff3dfed,#d5e5cbe8);border-top:1px solid #ffffffb0;backdrop-filter:blur(14px);color:#315d49}.bowling-dock label{display:block;flex:1;min-width:0;font-size:11px;font-weight:800}.bowling-dock output{float:right;font-size:10px;color:#738970}.bowling-dock input[type=range]{display:block;width:100%;margin:13px 0 3px;height:12px;accent-color:#357b5f;cursor:ew-resize;touch-action:pan-y}.bowling-dock button{flex:0 0 145px;padding:15px 13px;font-size:12px;border-radius:13px;margin:0;white-space:nowrap}.bowling-dock button:disabled{opacity:.6;cursor:wait;transform:none}.bowling-dock input:disabled{opacity:.45;cursor:wait}.bowling-dock input:focus-visible{outline:2px solid #cd9e55;outline-offset:6px;border-radius:6px}.bowling-stage .lane-caption{font-size:8px;padding:7px 11px;bottom:10px}
@media(max-width:800px){.bowling-dock{gap:12px;padding:14px}.bowling-dock button{flex-basis:112px;font-size:11px}.bowling-stage{height:clamp(440px,calc(100svh - 225px),620px)}}
@media(max-width:600px){.bowling-stage{order:-1;width:100%;height:clamp(340px,55svh,500px)}.bowling-stage .bowling-view{order:0;min-height:0;height:auto}.bowling-dock{padding:13px 12px;gap:13px}.bowling-dock button{flex-basis:105px;padding:14px 9px;font-size:11px}.bowling-dock label{font-size:10px}.bowling-dock input[type=range]{height:16px;margin-top:10px}}
.arcade-tabs{flex-wrap:wrap}.online-four .game-intro h2{font-size:30px}.online-four .game-intro>p{font-size:12px;line-height:1.7}#fourFriendList{max-height:300px;overflow:auto;margin:15px 0}.online-four-friend{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:12px 0;border-top:1px solid #dbe3ce}.online-four-friend.selected{background:#e9efda;border-radius:12px;padding:12px 8px}.online-four-friend b{font-size:13px;display:block;overflow-wrap:anywhere}.online-four-friend small{display:block;font-size:9px;margin-top:5px;color:#869777}.online-four-friend>div:last-child{display:flex;flex-direction:column;gap:5px}.online-four-friend button{font-size:10px;padding:8px 12px;white-space:nowrap;background:#327d60;color:#fffbea}.online-four-friend button+button{background:#edf0dd;color:#56764e}.online-four button:disabled{opacity:.55;cursor:wait}.online-four-error{color:#ae694d!important}.online-four-actions{display:flex;justify-content:flex-end;margin-top:13px}.online-four-actions button,#fourRefresh{font-size:11px;padding:10px 14px}.online-four-note{display:block;font-size:10px;color:#80936f;text-align:center;margin-top:12px}.online-four .player-key{flex-wrap:wrap;justify-content:center;margin:0 0 15px}#onlineFourStatus{font-weight:bold;padding:12px;border-radius:12px;background:#e8eed8}#onlineFourBoard{touch-action:manipulation;cursor:pointer}.online-four .board-locked{cursor:default}@media(max-width:700px){.online-four .game-intro h2{font-size:25px}.online-four .four-table{min-width:0}.arcade-tabs button{font-size:11px;padding:12px}.online-four-friend button{font-size:10px}}
@media(min-width:601px){.online-four .four-table{width:min(100%,calc((100svh - 330px)*1.1667));min-width:280px;margin:auto}}
