.cup-page{--cup-violet:#7c3cff;--cup-cyan:#1adad1;--cup-gold:#ffd43b;--cup-pink:#ff4f9a}.cup-shell{border:3px solid #111;border-radius:28px;padding:clamp(1rem,3vw,2rem);background:linear-gradient(145deg,#fff 0 34%,#f4edff 34% 68%,#e9fffd 68%);box-shadow:10px 10px 0 #111}.cup-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap}.cup-head h2{margin:0}.cup-head label{font-weight:800}.cup-head select{display:block;margin-top:.35rem;min-height:44px;border:2px solid #111;border-radius:10px;padding:.45rem .7rem;background:#fff;font:inherit}.cup-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.6rem;margin:1rem 0}.cup-stats div{border:2px solid #111;border-radius:14px;background:#fff;padding:.65rem;text-align:center}.cup-stats small{display:block;font-weight:800;letter-spacing:.08em}.cup-stats strong{font-size:clamp(1rem,3vw,1.35rem)}.cup-arena{position:relative;overflow:hidden;border:3px solid #111;border-radius:22px;padding:1rem;background:linear-gradient(#4f21a8 0 24%,#ff5da8 24% 29%,#32d98b 29% 100%)}.cup-arena:before{content:"CANOPY CUP";display:block;margin:0 auto .8rem;width:max-content;max-width:100%;padding:.35rem .8rem;border:2px solid #111;background:var(--cup-gold);font-weight:900;letter-spacing:.12em}.cup-phase{width:max-content;margin:0 auto .65rem;border:2px solid #111;border-radius:999px;padding:.35rem .8rem;background:#fff;font-weight:900}.cup-goal{display:grid;grid-template-columns:repeat(3,minmax(64px,1fr));gap:.45rem;max-width:620px;margin:auto;padding:.75rem;border:8px solid #fff;border-bottom-width:12px;background:rgba(0,0,0,.28)}.cup-goal button{position:relative;min-height:86px;border:3px solid #111;border-radius:12px;background:linear-gradient(135deg,#fff,#eee);color:#111;font:900 1rem/1 monospace;cursor:pointer;transition:transform .12s,background .12s}.cup-goal button:hover,.cup-goal button:focus-visible{transform:translateY(-2px);outline:4px solid var(--cup-gold);outline-offset:1px}.cup-goal .reach-row{background:linear-gradient(135deg,#ffd6e8,var(--cup-pink))}.cup-goal .reach-column{background:linear-gradient(135deg,#d9cbff,var(--cup-violet));color:#fff}.cup-goal .reach-row.reach-column{background:linear-gradient(135deg,var(--cup-pink),var(--cup-violet))}.cup-goal .keeper:after{content:"🦍";position:absolute;inset:0;display:grid;place-items:center;font-size:2.2rem}.cup-goal .shot-cue{background:var(--cup-gold);box-shadow:inset 0 0 0 7px var(--cup-cyan)}.cup-goal .scored,.cup-goal .saved{background:var(--cup-cyan)}.cup-goal .blocked,.cup-goal .missed{background:var(--cup-pink);color:#fff}.cup-status{min-height:3.2rem;margin:.8rem 0 0;border:2px solid #111;border-radius:12px;padding:.7rem;background:#fff;font-weight:800;text-align:center}.cup-actions{display:flex;flex-wrap:wrap;gap:.65rem;justify-content:center;margin:1rem 0}.cup-actions button{min-height:46px;border:2px solid #111;border-radius:12px;padding:.65rem 1rem;background:#fff;font:800 1rem/1.1 inherit;box-shadow:3px 3px 0 #111}.cup-actions .primary,.cup-actions .next{background:var(--cup-violet);color:#fff}.cup-note{max-width:75ch;margin:.65rem auto;line-height:1.55}.cup-guide .guide-grid article:nth-child(1){border-top-color:var(--cup-pink)}.cup-guide .guide-grid article:nth-child(2){border-top-color:var(--cup-cyan)}.cup-guide .guide-grid article:nth-child(3){border-top-color:var(--cup-gold)}@media(max-width:640px){.cup-stats{grid-template-columns:repeat(2,1fr)}.cup-stats div:last-child{grid-column:1/-1}.cup-arena{padding:.65rem}.cup-goal{gap:.3rem;padding:.45rem}.cup-goal button{min-height:68px}.cup-shell{border-radius:20px;box-shadow:6px 6px 0 #111}}
