/* Bandeja interactive sections — court, racket lab, sweetspot game */
.int-court{--lime:#c9f04d;background:radial-gradient(120% 90% at 20% 0%,#16335c 0%,var(--dark) 60%)}
.int-court .sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:28px}
.int-court .sec-head h2{margin:0}.int-court .muted{color:#a9b6c9}
.court-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:32px;align-items:start}
.court-box{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);padding:18px}
.court-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.court-tabs button{font:600 .88rem var(--sans);color:#dfe7f3;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:.6em 1.1em;cursor:pointer;min-height:40px;transition:background .2s,color .2s,border-color .2s}
.court-tabs button:hover{border-color:var(--lime)}
.court-tabs button[aria-selected=true]{background:var(--lime);color:var(--dark);border-color:var(--lime)}
.court-svg{width:100%;height:auto;display:block;touch-action:manipulation}
.c-turf{fill:#1f5fbf}
.c-wall{fill:none;stroke:#9fb4d6;stroke-width:3;stroke-dasharray:3 3;opacity:.55}
.c-glass{fill:none;stroke:#d9ecff;stroke-width:5;opacity:.85}
.c-line{fill:none;stroke:#fff;stroke-width:1.6;opacity:.9}
.c-net{stroke:#fff;stroke-width:3;stroke-dasharray:2 2}
.c-lbl{fill:#a9b6c9;font:600 9px var(--sans);text-anchor:middle;letter-spacing:.08em;text-transform:uppercase}
.c-opp circle{fill:#0f1b2d;stroke:#fff;stroke-width:1.5}
.c-you circle{fill:var(--lime);stroke:#0f1b2d;stroke-width:1.5}
.c-path{fill:none;stroke:var(--lime);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:5 6;opacity:0;transition:opacity .3s}
.c-path.on{opacity:.95}
.c-hot{cursor:pointer}
.c-hot .c-ring{fill:rgba(201,240,77,.18);stroke:var(--lime);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:cpulse 1.8s ease-out infinite}
.c-hot .c-dot{fill:var(--lime)}
.c-hot.on .c-ring{fill:rgba(201,240,77,.45)}
.c-ball{fill:#e9ff7a;stroke:#6f8f00;stroke-width:1}
.c-shadow{fill:rgba(0,0,0,.35)}
@keyframes cpulse{0%{transform:scale(.8);opacity:1}100%{transform:scale(1.6);opacity:0}}
.court-info{min-height:100%}
.shot-card{background:#fff;color:var(--fg);border-radius:var(--r);padding:26px;animation:cardin .35s ease both}
.shot-card h3{font-size:1.9rem;margin:6px 0 10px}
.shot-type{font:700 .72rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.shot-tip{display:flex;gap:10px;align-items:flex-start;background:#f3f8e1;border-radius:12px;padding:12px 14px;font-size:.92rem}
.shot-tip .ic{flex:0 0 18px;width:18px;height:18px;color:#5b7a00;margin-top:2px}
.shot-card h4{margin:20px 0 10px;font-size:.95rem}
.int-cards{display:grid;gap:10px}
.int-card{display:flex;gap:12px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:14px;color:inherit;text-decoration:none;transition:border-color .2s,transform .2s;background:#fff}
.int-card:hover{border-color:var(--accent);transform:translateX(3px)}
.int-card img{width:58px;height:58px;object-fit:contain;border-radius:10px;background:#f6f8fb;flex:0 0 58px}
.int-card>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.int-card b{font-size:.9rem;line-height:1.25}
.int-card em{font-style:normal;font-size:.88rem;color:var(--accent);font-weight:700}
.int-card em del{color:var(--muted);font-weight:400;margin-right:4px}
.int-card em .screen-reader-text{position:absolute;left:-9999px}
@keyframes cardin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* racket lab */
.int-lab{background:linear-gradient(180deg,#fff,#f1f5fb)}
.lab-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center}
.lab-stage{display:flex;justify-content:center;background:radial-gradient(60% 60% at 50% 40%,#dfeafb,transparent 70%);border-radius:var(--r)}
.lab-svg{width:min(320px,80%);height:auto;filter:drop-shadow(0 24px 30px rgba(15,27,45,.18))}
.lab-head{fill:#0f1b2d;stroke:#c9f04d;stroke-width:4}
.lab-svg pattern circle{fill:#2b4a78}
.lab-handle{fill:#0f1b2d}.lab-grip{fill:#e8edf5}.lab-strap{fill:none;stroke:#0f1b2d;stroke-width:3}
.lab-sweet{fill:rgba(201,240,77,.35);stroke:#c9f04d;stroke-width:2}
.lab-sweet-t{fill:#c9f04d;font:700 9px var(--sans);text-anchor:middle;letter-spacing:.06em}
.lab-ctl h2{margin:0 0 6px}
.lab-seg{display:inline-flex;background:#e6ecf5;border-radius:999px;padding:4px;margin:18px 0 10px}
.lab-seg button{border:0;background:none;font:600 .95rem var(--sans);padding:.65em 1.3em;border-radius:999px;cursor:pointer;color:var(--fg);min-height:42px}
.lab-seg button[aria-checked=true]{background:var(--dark);color:#fff}
.lab-range{width:100%;accent-color:var(--accent);margin:6px 0 18px;height:28px}
.lab-bars{display:grid;gap:12px}
.lab-bar{display:grid;grid-template-columns:100px 1fr;align-items:center;gap:12px;font-size:.92rem;font-weight:600}
.lab-bar i{display:block;height:10px;background:#e1e6ee;border-radius:99px;overflow:hidden}
.lab-bar b{display:block;height:100%;width:50%;background:linear-gradient(90deg,var(--accent),#c9f04d);border-radius:99px;transition:width .35s cubic-bezier(.2,.7,.2,1)}
.lab-bal strong{font-weight:700}
.lab-txt{margin:18px 0;min-height:4.5em;color:var(--muted)}
.lab-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.lab-picks{margin-top:18px;max-width:380px}
.lab-picks>div:not([hidden]){display:grid;gap:6px}

/* sweetspot game */
.game-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:center}
.game-score{display:flex;gap:12px;margin:18px 0}
.game-score div{flex:1;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:12px 14px;text-align:center}
.game-score b{display:block;font:700 1.8rem var(--serif);color:var(--dark)}
.game-score span{font-size:.8rem;color:var(--muted)}
.game-msg{font-weight:600;min-height:1.6em}
.game-msg.ok{color:#3f7a00}.game-msg.miss{color:#c81e4a}
.game-cta{margin-top:10px;padding:16px;background:var(--dark);color:#fff;border-radius:16px}
.game-cta p{margin:0 0 10px}
.game-stage{display:flex;justify-content:center}
.game-hit{position:relative;border:0;padding:24px;background:radial-gradient(60% 60% at 50% 40%,#1f5fbf,#0f1b2d);border-radius:28px;cursor:pointer;width:min(340px,100%);touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.game-hit svg{width:100%;height:auto;display:block}
.game-hit:focus-visible{outline:3px solid #c9f04d;outline-offset:4px}
.g-head{fill:#0b1220;stroke:#c9f04d;stroke-width:5}
.g-handle{fill:#e8edf5}
.g-sweet{fill:rgba(201,240,77,.22);stroke:#c9f04d;stroke-width:2;stroke-dasharray:4 4}
.g-ball{fill:#e9ff7a;stroke:#6f8f00;stroke-width:1.5}
.game-hit.hit .g-sweet{fill:rgba(201,240,77,.7)}
.game-hit.miss .g-head{stroke:#ff4d6d}
.game-start{position:absolute;inset:auto 0 42%;margin:auto;width:max-content;background:#c9f04d;color:#0b1220;font:700 1.05rem var(--sans);padding:.8em 1.8em;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.game-hit.playing .game-start{display:none}

@media(max-width:1000px){.court-grid,.lab-grid,.game-grid{grid-template-columns:minmax(0,1fr);gap:24px}.lab-stage{order:-1}.game-hit{width:min(270px,100%)}}
@media(max-width:560px){.court-box{padding:12px}.court-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -12px 12px;padding:0 12px}.court-tabs::-webkit-scrollbar{display:none}.court-tabs button{flex:0 0 auto}.shot-card{padding:20px}.shot-card h3{font-size:1.5rem}.lab-seg{display:flex}.lab-seg button{flex:1;padding:.65em .6em}.lab-svg{width:min(220px,70%)}.game-score b{font-size:1.4rem}.lab-bar{grid-template-columns:84px 1fr}}
@media(prefers-reduced-motion:reduce){.c-hot .c-ring{animation:none}.shot-card{animation:none}.lab-bar b{transition:none}}
.int-card em ins{text-decoration:none}