:root { --ink:#082137; --blue:#087fd5; --cream:#fff9ed; --orange:#ff713b; --yellow:#ffd34f; --aqua:#34c9c8; --navy:#0b3751; font-family:Nunito,system-ui,sans-serif; color:var(--ink); }
* { box-sizing:border-box; } body { margin:0; min-width:320px; background:#072338; overflow-x:hidden; } button { font:inherit; cursor:pointer; } .app-shell { min-height:100vh; max-width:1440px; margin:auto; position:relative; overflow:hidden; background:var(--cream); }
.screen { display:none; min-height:100vh; position:relative; } .screen.is-active { display:flex; animation:screenIn .45s both; } @keyframes screenIn { from{opacity:0;transform:scale(1.015)}to{opacity:1;transform:none} }
.home-screen { flex-direction:column; padding:28px clamp(24px,5vw,72px) 24px; isolation:isolate; background:radial-gradient(circle at 52% 5%,#fff 0 8%,transparent 29%),var(--cream); }.corner-orb{position:absolute;border-radius:50%;z-index:-1;filter:blur(0)}.orb-one{width:420px;height:420px;right:-150px;top:35%;background:#daeffa}.orb-two{width:190px;height:190px;left:-100px;bottom:-55px;background:#ffe59b}
.home-header,.game-header { display:flex; justify-content:space-between; align-items:center; }.brand { display:flex;align-items:center;gap:10px;color:var(--ink);font-size:22px;font-weight:900;letter-spacing:-1px;text-decoration:none }.brand b{color:var(--blue)}.brand-mark{display:flex;align-items:end;gap:2px;height:22px}.brand-mark i{display:block;width:5px;border-radius:4px;background:var(--blue);transform:skew(-11deg)}.brand-mark i:nth-child(1){height:10px}.brand-mark i:nth-child(2){height:17px}.brand-mark i:nth-child(3){height:22px}.sound-toggle{width:42px;height:42px;border:2px solid #bdd3de;border-radius:50%;background:#fff;color:var(--blue);font-size:20px;transition:.2s}.sound-toggle:hover{border-color:var(--blue);transform:rotate(-15deg)}
.home-intro { max-width:720px; margin:clamp(55px,9vh,105px) 0 17px; }.eyebrow{color:var(--orange);letter-spacing:2px;font-size:12px;font-weight:900;margin:0 0 12px}.home-intro h1{font-size:clamp(42px,6vw,78px);line-height:1.08;letter-spacing:-3px;margin:0}.home-intro h1 em{font-style:normal;color:var(--blue);position:relative}.home-intro h1 em:after{content:"";position:absolute;bottom:-5px;left:3%;width:94%;height:8px;border-radius:50%;background:var(--yellow);z-index:-1;transform:rotate(-2deg)}.home-intro>p:last-child{color:#587083;font-size:17px;margin:17px 0 0;font-weight:700}.cpu-picker{display:flex;align-items:center;gap:7px;margin:0 0 20px}.cpu-picker>span{margin-right:5px;color:#628091;font:10px "DM Mono",monospace;letter-spacing:1px}.cpu-picker button{border:1px solid #c7dce4;border-radius:14px;padding:5px 10px;background:#fff;color:#597385;font:10px "DM Mono",monospace;transition:.15s}.cpu-picker button:hover,.cpu-picker button.is-selected{border-color:#0b72b8;background:#087fd5;color:#fff}
.sport-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:14px;max-width:1120px}.sport-card{height:245px;padding:19px;position:relative;border:0;border-radius:24px;color:#fff;text-align:left;overflow:hidden;box-shadow:0 10px 0 rgba(6,43,68,.09);transition:transform .2s,box-shadow .2s}.sport-card:hover,.sport-card:focus-visible{transform:translateY(-7px) rotate(-1deg);box-shadow:0 17px 0 rgba(6,43,68,.08);outline:3px solid var(--ink);outline-offset:3px}.tennis-card{background:linear-gradient(135deg,#05a5d8,#116ab5)}.bowling-card{background:linear-gradient(135deg,#f25a54,#e74270)}.baseball-card{background:linear-gradient(135deg,#eea51e,#ed6d2c)}.golf-card{background:linear-gradient(135deg,#53bf75,#159d87)}.sport-card:after{content:"";position:absolute;width:170px;height:170px;border:22px solid rgba(255,255,255,.18);border-radius:50%;right:-72px;bottom:-70px}.card-number,.sport-ja{display:block;font-family:"DM Mono",monospace;font-size:11px;letter-spacing:1px;opacity:.78}.sport-emoji{position:absolute;right:17px;top:25px;font-size:43px;filter:drop-shadow(0 4px 0 rgba(0,0,0,.08));transition:transform .25s}.sport-card:hover .sport-emoji{transform:scale(1.13) rotate(15deg)}.sport-name{display:block;position:absolute;bottom:39px;font-size:20px;font-weight:900;letter-spacing:-.5px}.sport-ja{position:absolute;bottom:20px}.card-arrow{position:absolute;right:18px;bottom:16px;font-size:25px;font-weight:900}.home-footer{margin-top:auto;padding-top:44px;display:flex;align-items:center;gap:11px;color:#77909e;font-family:"DM Mono",monospace;font-size:11px;letter-spacing:.5px}.pulse-dot{width:8px;height:8px;border-radius:50%;background:#4dcb85;box-shadow:0 0 0 5px rgba(77,203,133,.15);animation:pulse 1.8s infinite}@keyframes pulse{50%{transform:scale(1.4);box-shadow:0 0 0 8px rgba(77,203,133,0)}}
.game-screen{flex-direction:column;background:#e8f8fb;min-height:100vh}.game-header{height:78px;padding:0 clamp(22px,4vw,62px);background:#fffdf6;z-index:3}.back-button,.restart-button{border:0;background:transparent;color:#446476;font-family:"DM Mono",monospace;font-size:12px;font-weight:500;letter-spacing:.4px;transition:.2s}.back-button:hover,.restart-button:hover{color:var(--blue);transform:translateX(-3px)}.restart-button:hover{transform:rotate(-30deg)}.game-title{text-align:center;line-height:1;position:absolute;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:auto auto;column-gap:7px;align-items:center}.game-title>span{grid-row:span 2;font-size:23px}.game-title strong{font-size:15px;letter-spacing:.5px}.game-title small{font-family:"DM Mono",monospace;color:#7390a0;font-size:10px;text-align:left;margin-top:2px}.score-ribbon{height:78px;display:flex;align-items:center;justify-content:center;gap:18px;background:var(--navy);color:white;z-index:2}.score-ribbon>div{text-align:center;min-width:52px}.score-label{display:block;font:10px "DM Mono",monospace;color:#93c7df;letter-spacing:1px}.score-ribbon b{font-size:29px;line-height:27px}.score-divider{font-size:24px;color:#6790a7}.score-ribbon p{margin:0 0 0 13px;border-left:1px solid #52768a;padding-left:23px;color:#b9d5e1;font:10px "DM Mono",monospace;letter-spacing:.8px}
.arena{height:min(52vh,530px);min-height:330px;position:relative;overflow:hidden;background:#81d9e9;isolation:isolate}.game-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;z-index:1}.canvas-3d .game-world,.canvas-3d .ambient-cloud{display:none}.ambient-cloud{position:absolute;width:180px;height:35px;background:rgba(255,255,255,.65);border-radius:50%;top:14%;z-index:-1}.ambient-cloud:before,.ambient-cloud:after{content:"";position:absolute;border-radius:50%;background:inherit}.ambient-cloud:before{width:70px;height:70px;left:33px;bottom:0}.ambient-cloud:after{width:90px;height:90px;right:24px;bottom:0}.cloud-one{left:10%;transform:scale(.75)}.cloud-two{right:9%;top:25%;transform:scale(.45)}.game-world{position:absolute;inset:0;overflow:hidden}.mountain{position:absolute;bottom:42%;width:42%;height:34%;background:#75b3b1;clip-path:polygon(0 100%,45% 6%,72% 55%,100% 100%);opacity:.8}.mountain-left{left:-3%}.mountain-right{right:-2%;transform:scaleX(-1);opacity:.65}.tennis-court{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:min(650px,84vw);height:46%;background:#3387ba;clip-path:polygon(11% 0,89% 0,100% 100%,0 100%);border-top:5px solid rgba(255,255,255,.8)}.court-line{position:absolute;background:#d8f4f6}.court-line.vertical{width:3px;height:100%;left:50%}.court-line.horizontal{height:3px;width:39%;top:47%}.court-line.left{left:0}.court-line.right{right:0}.court-net{position:absolute;left:0;right:0;top:48%;height:4px;background:#efffff;box-shadow:0 3px 0 rgba(4,52,84,.25);z-index:1}.court-net:after{content:"";display:block;width:100%;height:30px;background:repeating-linear-gradient(90deg,transparent 0 12px,rgba(255,255,255,.42) 13px 14px),repeating-linear-gradient(0deg,transparent 0 7px,rgba(255,255,255,.42) 8px 9px);opacity:.8}
.avatar{position:absolute;width:52px;height:100px;z-index:2;filter:drop-shadow(0 5px 0 rgba(0,47,70,.18))}.avatar .head{position:absolute;width:32px;height:32px;border-radius:50%;left:10px;top:0;background:#ffd3ad;border:3px solid #173a52}.avatar .head:after{content:"";position:absolute;width:28px;height:13px;top:-3px;left:-1px;border-radius:60% 60% 25% 25%;background:#203f51}.avatar .body{position:absolute;width:38px;height:52px;border:3px solid #173a52;border-radius:22px 22px 12px 12px;left:7px;top:30px;background:#ff7647}.avatar .body:after{content:"";position:absolute;width:8px;height:30px;bottom:-25px;left:7px;background:#173a52;box-shadow:15px 0 #173a52}.racket{position:absolute;right:-12px;top:34px;color:#faf4e8;font-size:39px;text-shadow:-2px 0 #183e55,0 2px #183e55,2px 0 #183e55,0 -2px #183e55;transform:rotate(-34deg)}.you-avatar{left:27%;bottom:13%;}.rival-avatar{right:28%;bottom:43%;transform:scale(.68);filter:drop-shadow(0 3px 0 rgba(0,47,70,.12))}.rival-avatar .body{background:#ffe16d}.ball{position:absolute;border-radius:50%;z-index:3}.tennis-ball{width:18px;height:18px;background:#e8ff69;border:2px solid #347275;left:56%;bottom:43%;box-shadow:inset -4px -2px 0 rgba(69,167,101,.4),0 3px 0 rgba(0,61,89,.18)}.target-ring{position:absolute;width:63px;height:22px;border:3px solid rgba(255,255,255,.85);border-radius:50%;left:60%;bottom:8%;transform:rotate(-12deg)}
.bowling-world{background:linear-gradient(#a9ebef 0 41%,#5dbaa7 41% 45%,#e0a568 45%);}.bowling-skyline{position:absolute;inset:0 0 auto;height:42%;display:flex;align-items:end;gap:17px;padding:0 9%;opacity:.35}.bowling-skyline i{width:11%;height:40%;background:#287d8b;border-radius:11px 11px 0 0}.bowling-skyline i:nth-child(2){height:70%}.bowling-skyline i:nth-child(3){height:49%}.bowling-skyline i:nth-child(4){height:83%}.bowling-skyline i:nth-child(5){height:58%}.lane{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:min(700px,92vw);height:61%;background:repeating-linear-gradient(90deg,#d99c5f 0 26px,#eab87b 27px 53px);clip-path:polygon(28% 0,72% 0,100% 100%,0 100%);border-top:5px solid #fff5dd}.lane:before,.lane:after{content:"";position:absolute;top:0;width:4px;height:100%;background:#f7e8b7}.lane:before{left:28%}.lane:after{right:28%}.lane-shine{position:absolute;width:17%;height:100%;left:45%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.42),transparent)}.lane-arrows{position:absolute;top:44%;left:50%;transform:translateX(-50%);color:#a16539;letter-spacing:13px;font-size:14px}.pins{position:absolute;left:50%;top:37%;width:105px;height:74px;transform:translateX(-50%);z-index:2}.pins i{position:absolute;width:13px;height:34px;background:linear-gradient(#fff 0 38%,#ee5550 39% 52%,#fff 53%);border:1px solid #b7cbd0;border-radius:50% 50% 35% 35%;transform-origin:bottom}.pins i:nth-child(1){left:45px;top:0}.pins i:nth-child(2){left:30px;top:14px}.pins i:nth-child(3){left:60px;top:14px}.pins i:nth-child(4){left:15px;top:28px}.pins i:nth-child(5){left:45px;top:28px}.pins i:nth-child(6){left:75px;top:28px}.pins i:nth-child(7){left:0;top:40px}.pins i:nth-child(8){left:30px;top:40px}.pins i:nth-child(9){left:60px;top:40px}.pins i:nth-child(10){left:90px;top:40px}.bowling-ball{width:42px;height:42px;bottom:8%;left:38%;background:radial-gradient(circle at 32% 27%,#557a96 0 4%,transparent 5%,#557a96 6% 9%,transparent 10%,#557a96 11% 14%,transparent 15%),#1b4d76;box-shadow:inset -7px -5px #103a61,0 4px 0 rgba(0,0,0,.15)}.lane-target{position:absolute;bottom:11%;left:50%;width:100px;height:15px;border:2px dashed rgba(255,255,255,.7);border-radius:50%;transform:translateX(-50%)}
.baseball-world{background:linear-gradient(#7ed9eb 0 45%,#4fae7a 45%)}.stadium-lights{position:absolute;top:7%;font-size:24px;line-height:18px;color:#fff6a4;text-shadow:0 0 8px #fff;opacity:.8}.left-lights{left:9%}.right-lights{right:9%;text-align:right}.outfield{position:absolute;bottom:0;left:50%;width:min(850px,100vw);height:58%;background:#56b56d;transform:translateX(-50%);clip-path:polygon(50% 0,100% 100%,0 100%)}.field-stripe{position:absolute;top:0;height:100%;width:15%;background:rgba(255,255,255,.08);transform:skew(-32deg)}.s1{left:20%}.s2{left:48%}.s3{left:74%}.diamond{position:absolute;bottom:6%;left:50%;width:170px;height:170px;background:#dca363;transform:translateX(-50%) rotate(45deg);border:5px solid #f3d7a6}.diamond i{position:absolute;width:17px;height:17px;background:#fff7dd;transform:rotate(-45deg)}.diamond i:nth-child(1){left:calc(50% - 8px);top:8px}.diamond i:nth-child(2){right:8px;top:calc(50% - 8px)}.diamond i:nth-child(3){bottom:8px;left:calc(50% - 8px)}.diamond i:nth-child(4){left:8px;top:calc(50% - 8px)}.batter{left:37%;bottom:12%}.batter .body{background:#f15d58}.batter .bat{position:absolute;font-size:52px;right:-38px;top:25px;color:#ad8153;transform:rotate(-50deg)}.pitcher{right:38%;bottom:33%;transform:scale(.7)}.pitcher .body{background:#5f8bd4}.baseball{width:17px;height:17px;right:44%;bottom:44%;background:#fffdf4;border:1px solid #dedad2;box-shadow:inset 3px 0 #e95149}.hit-zone{position:absolute;left:51%;bottom:23%;border:2px dashed rgba(255,255,255,.85);padding:5px 8px;color:#fff;font:9px "DM Mono",monospace;transform:rotate(-9deg);opacity:.75}
.golf-world{background:linear-gradient(#a7e4ee 0 47%,#68b983 47%)}.golf-hills{position:absolute;border-radius:50% 50% 0 0;background:#5ca979}.hill-back{width:110%;height:37%;bottom:31%;left:-5%;opacity:.7}.hill-front{width:90%;height:33%;bottom:0;left:5%;background:#58b56e}.golf-fairway{position:absolute;inset:auto 0 0;height:61%;background:linear-gradient(100deg,#60b978 0 20%,#a4d56f 29% 71%,#5ab273 80%);clip-path:polygon(41% 0,60% 0,100% 100%,0 100%)}.sandtrap{position:absolute;width:100px;height:36px;border-radius:50%;right:25%;top:44%;background:#f2db9e}.hole{position:absolute;top:11%;left:50%;width:4px;height:73px;background:#304e61}.hole:after{content:"";position:absolute;left:4px;top:0;border-top:15px solid #f55155;border-right:31px solid transparent}.hole span{position:absolute;width:24px;height:8px;border-radius:50%;background:#263d4d;bottom:-2px;left:-10px}.golfer{left:31%;bottom:11%}.golfer .body{background:#5875ce}.golfer .club{position:absolute;right:-19px;bottom:5px;font-size:54px;color:#69737b;transform:rotate(9deg)}.golf-ball{width:13px;height:13px;bottom:16%;left:47%;background:#fff;border:1px solid #c1d6d1;box-shadow:0 3px 0 rgba(0,0,0,.13)}.golf-marker{position:absolute;right:14%;top:21%;color:#effff7;font:10px "DM Mono",monospace;text-align:center}.golf-marker b{font:900 24px Nunito}
.result-pop{visibility:hidden;position:absolute;z-index:6;left:50%;top:32%;transform:translate(-50%,-50%) scale(.8);padding:13px 25px 11px;text-align:center;border-radius:16px;background:#fffdf3;color:var(--ink);box-shadow:0 9px 0 rgba(7,72,104,.16);opacity:0}.result-pop.show{visibility:visible;animation:pop 1.2s both}@keyframes pop{0%{opacity:0;transform:translate(-50%,-40%) scale(.5)}22%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}45%{transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-70%) scale(1)}}.result-pop strong{display:block;color:var(--orange);font-size:24px;line-height:1}.result-pop span{font:11px "DM Mono",monospace;color:#5c7889}.control-panel{min-height:202px;padding:13px 25px 11px;background:#fffdf6;text-align:center;z-index:2}.control-panel>p:first-child{margin:0 0 7px;font-size:14px;font-weight:800}.control-guide{display:flex;justify-content:center;align-items:center;gap:9px;margin:0 0 9px;color:#668191;font:10px "DM Mono",monospace}.control-guide b{display:inline-grid;place-items:center;width:16px;height:16px;margin-right:3px;border-radius:50%;background:#dbeaf0;color:#173f55;font-weight:500}.control-guide i{color:#a5bac4;font-style:normal}.control-row{display:flex;gap:15px;justify-content:center;align-items:center}.slider-control{width:min(220px,23vw);text-align:left}.slider-control>span{display:flex;justify-content:space-between;font:10px "DM Mono",monospace;color:#577181;margin-bottom:5px}.slider-control b{color:#0e638e;font-weight:500}.slider-control small{display:flex;justify-content:space-between;margin-top:3px;color:#8ba1ab;font:8px "DM Mono",monospace;letter-spacing:.2px}.slider-control small i{font-style:normal;color:#ff7845}.slider-control input{appearance:none;width:100%;height:10px;margin:0;border-radius:12px;outline:none;background:linear-gradient(90deg,var(--aqua) 0 var(--fill,50%),#e4edf0 var(--fill,50%) 100%);cursor:pointer}.aim-control input{background:linear-gradient(90deg,#5ab4e2 0 var(--fill,50%),#e4edf0 var(--fill,50%) 100%)}.slider-control input::-webkit-slider-thumb{appearance:none;width:20px;height:20px;border:3px solid #fff;border-radius:50%;background:#164b68;box-shadow:0 2px 5px rgba(5,42,65,.24)}.slider-control input::-moz-range-thumb{width:15px;height:15px;border:3px solid #fff;border-radius:50%;background:#164b68;box-shadow:0 2px 5px rgba(5,42,65,.24)}.action-button{min-width:144px;border:0;border-radius:13px;padding:10px 18px;background:var(--orange);color:#fff;box-shadow:0 5px 0 #d84f28;transition:.1s}.action-button:hover{transform:translateY(-2px);box-shadow:0 7px 0 #d84f28}.action-button:active{transform:translateY(3px);box-shadow:0 2px 0 #d84f28}.action-button:disabled{cursor:wait;filter:saturate(.6);transform:translateY(3px);box-shadow:0 2px 0 #d84f28}.action-button span{display:block;font:10px "DM Mono",monospace;opacity:.8}.action-button b{font-size:18px}.keyboard-hint{margin:7px 0 0;color:#79919d;font:10px "DM Mono",monospace}.keyboard-hint kbd{padding:2px 5px;border:1px solid #c9d7dc;border-radius:3px;background:#fff;font:inherit}.toast{position:fixed;bottom:22px;left:50%;z-index:10;transform:translate(-50%,30px);opacity:0;padding:9px 14px;border-radius:20px;background:#082b42;color:#fff;font:12px "DM Mono",monospace;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:680px){.home-screen{padding:20px 20px 17px}.home-intro{margin:44px 0 29px}.home-intro h1{letter-spacing:-2px}.sport-grid{grid-template-columns:repeat(2,1fr);gap:11px}.sport-card{height:172px;border-radius:18px;padding:14px}.sport-emoji{font-size:34px;right:13px;top:18px}.sport-name{font-size:16px;bottom:35px}.home-footer{padding-top:30px}.game-header{height:64px}.score-ribbon{height:67px}.arena{height:calc(100vh - 325px);min-height:286px}.score-ribbon p{display:none}.control-panel{min-height:192px;padding:10px 12px}.control-panel>p:first-child{font-size:12px}.control-guide{gap:4px;font-size:8px}.control-guide i{font-size:8px}.control-row{display:grid;grid-template-columns:1fr 1fr;gap:6px 11px;max-width:360px;margin:auto}.slider-control{width:auto}.action-button{grid-column:span 2;min-width:150px;justify-self:center;padding:6px 17px}.action-button b{font-size:16px}.keyboard-hint{font-size:8px}.game-title{font-size:13px}.back-button span,.restart-button span{display:none}.tennis-court{height:50%;width:98vw}.you-avatar{left:20%}.rival-avatar{right:20%}.batter{left:28%}.pitcher{right:27%}.golfer{left:20%}}
.bowling-scorecard{height:78px;display:flex;align-items:stretch;gap:14px;padding:8px clamp(16px,4vw,58px);background:#0b3751;color:#fff;z-index:2}.bowling-scorecard[hidden]{display:none}.scorecard-label{min-width:58px;display:flex;flex-direction:column;justify-content:center;border-right:1px solid #53778c;padding-right:13px}.scorecard-label span{color:#9bc5d7;font:9px "DM Mono",monospace;letter-spacing:.8px}.scorecard-label b{font-size:25px;line-height:26px}.bowling-frames{flex:1;display:grid;grid-template-columns:repeat(10,minmax(35px,1fr));gap:3px}.bowling-frame{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:17px 1fr;border:1px solid #4f7488;border-radius:3px;overflow:hidden;font:10px "DM Mono",monospace}.bowling-frame>span:first-child{grid-column:span 2;padding:2px 4px;color:#a4cedf;border-bottom:1px solid #4f7488;font-size:8px}.bowling-frame .roll{padding:2px 4px;text-align:right}.bowling-frame .total{grid-column:span 2;border-top:1px solid #4f7488;padding:1px 4px;color:#fff;font-weight:500}.bowling-frame.active{border-color:#ffdc61;background:#164b68}.game-screen.bowling-mode .score-ribbon{display:none}@media (max-width:680px){.home-intro{margin:44px 0 14px}.cpu-picker{margin-bottom:18px}.cpu-picker button{padding:4px 7px;font-size:8px}.bowling-scorecard{height:67px;padding:6px 9px;gap:7px}.scorecard-label{min-width:46px;padding-right:6px}.scorecard-label b{font-size:20px}.bowling-frames{gap:1px}.bowling-frame{grid-template-rows:13px 1fr;font-size:7px}.bowling-frame>span:first-child{padding:1px 2px;font-size:6px}.bowling-frame .roll,.bowling-frame .total{padding:1px 2px}}

.club-strip{display:flex;align-items:center;justify-content:center;gap:6px;margin:-1px 0 8px}.club-strip[hidden]{display:none}.club-strip>span{margin-right:4px;color:#668191;font:10px "DM Mono",monospace;letter-spacing:1px}.club-strip button{border:1px solid #bfd8d8;border-radius:12px;padding:4px 9px;background:#f3fbf8;color:#537181;font:9px "DM Mono",monospace;letter-spacing:.25px;transition:.15s}.club-strip button:hover,.club-strip button.is-selected{border-color:#118a72;background:#159d87;color:#fff;box-shadow:0 2px 0 #0a715d}@media (max-width:680px){.club-strip{gap:3px;margin-bottom:6px}.club-strip>span{font-size:8px}.club-strip button{padding:3px 5px;font-size:7px}}

.baseball-scoreboard{height:96px;display:grid;grid-template-columns:125px 1fr 112px 210px;align-items:center;gap:18px;padding:10px clamp(18px,4vw,58px);background:#241918;color:#fff;z-index:2}.baseball-scoreboard[hidden]{display:none}.game-screen.baseball-mode .score-ribbon{display:none}.baseball-inning{display:grid;grid-template-columns:auto auto;grid-template-rows:1fr auto;column-gap:7px;align-items:center;border-right:2px solid #fff;padding-right:18px}.baseball-inning b{grid-row:span 2;font-size:54px;line-height:.82;letter-spacing:-3px}.baseball-inning span{font-size:25px;font-weight:900;line-height:1}.baseball-inning small{font:9px "DM Mono",monospace;letter-spacing:1px;color:#c9bbb7}.baseball-score-main{display:grid;grid-template-columns:auto auto;grid-template-rows:22px 1fr;column-gap:10px;align-items:end}.baseball-score-main span{grid-column:span 2;color:#d4bfbc;font:10px "DM Mono",monospace;letter-spacing:1px}.baseball-score-main b{font-size:44px;line-height:.75}.baseball-score-main em{padding-bottom:4px;color:#e9d8d4;font:11px "DM Mono",monospace;font-style:normal}.baseball-score-main em i{font-size:18px;font-style:normal;color:#ff625d}.baseball-base-diamond{position:relative;width:86px;height:68px}.baseball-base-diamond i{position:absolute;width:29px;height:21px;background:#9ea0a1;transform:rotate(45deg)}.baseball-base-diamond i:nth-child(1){top:0;left:29px}.baseball-base-diamond i:nth-child(2){top:24px;left:3px}.baseball-base-diamond i:nth-child(3){top:24px;right:3px}.baseball-base-diamond i:nth-child(4){bottom:0;left:29px;background:#ded8d1}.baseball-base-diamond i.is-occupied{background:#ef0622;box-shadow:0 0 0 3px rgba(239,6,34,.17)}.baseball-bso{display:grid;gap:5px;border-left:2px solid #fff;padding-left:19px;font:25px "DM Mono",monospace;font-weight:700}.baseball-bso span{display:flex;align-items:center;gap:8px;line-height:1}.baseball-bso i{width:26px;height:26px;border-radius:50%;background:#858789}.baseball-bso [data-count="ball"].is-on{background:#39ad50}.baseball-bso [data-count="strike"].is-on{background:#ffdf00}.baseball-bso [data-count="out"].is-on{background:#ed1928}@media (max-width:680px){.baseball-scoreboard{height:77px;grid-template-columns:70px 1fr 65px 112px;gap:6px;padding:7px 10px}.baseball-inning{padding-right:6px;column-gap:3px}.baseball-inning b{font-size:37px}.baseball-inning span{font-size:17px}.baseball-inning small{display:none}.baseball-score-main span{font-size:8px}.baseball-score-main b{font-size:34px}.baseball-score-main em{font-size:8px}.baseball-score-main em i{font-size:13px}.baseball-base-diamond{transform:scale(.7);transform-origin:center}.baseball-bso{gap:2px;padding-left:6px;font-size:17px}.baseball-bso span{gap:4px}.baseball-bso i{width:17px;height:17px}}