@import url('./petanca/card.css');
@font-face{font-family:Patrick;src:url('./fonts/patrick-hand.ttf')}*{box-sizing:border-box}:root{--paper:#f7f4e9;--blue:#2539a2;--red:#c44350;--line:rgba(60,105,176,.15);font-family:'Trebuchet MS',sans-serif;color:var(--blue)}body{margin:0;background:var(--paper);background-image:repeating-linear-gradient(0deg,transparent,transparent 31px,var(--line) 31px,var(--line) 32px)}.grain{position:fixed;inset:0;pointer-events:none;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.logo,h1,h2,h3{font-family:Patrick,cursive;font-weight:400}a{color:inherit;text-underline-offset:4px}header{height:90px;padding:20px 5vw;display:flex;align-items:center;gap:28px;border-bottom:1px solid var(--blue);position:relative;z-index:2}.logo{font-size:47px;line-height:1;text-decoration:none;transform:rotate(-7deg);border-bottom:2px solid}.logo span,h2 span,.credit em{color:var(--red)}header p{font-size:11px;font-weight:bold;letter-spacing:2px}header p i{color:var(--red);font-style:normal;padding:0 8px}header>a:last-child{margin-left:auto;font-size:11px;font-weight:bold}.hero{text-align:center;padding:76px 20px 60px}.eyebrow{font-size:11px;letter-spacing:3px;font-weight:bold}.hero h1{font-size:clamp(60px,8vw,122px);line-height:.78;margin:27px 0;transform:rotate(-2deg)}.hero h1 span{font-size:.69em}.lede{font:24px Patrick,cursive}.games{display:grid;grid-template-columns:repeat(2,1fr);border-block:1px solid var(--blue)}.game{min-height:650px;padding:35px 4vw 45px;text-decoration:none;position:relative;border-right:1px solid var(--blue);transition:background .2s}.game:nth-child(2n){border-right:0}.game:nth-child(-n+2){border-bottom:1px solid var(--blue)}.game:hover{background:#2539a208}.number{font:28px Patrick;color:var(--red)}.sketch{height:180px;margin:24px 0;position:relative;border:2px solid;transform:perspective(400px) rotateX(58deg) rotateZ(-8deg);box-shadow:10px 12px 0 #2539a211}.sketch i{position:absolute;display:block;border:1px solid}.sketch i:first-child{left:50%;height:100%}.sketch i:nth-child(2){left:0;top:50%;width:100%}.sketch i:nth-child(3){inset:18%;border-radius:50%}.sketch b{position:absolute;right:16%;top:17%;color:var(--red);line-height:2}.pitch{border-radius:40%}.sketch.pool{border-radius:8px;box-shadow:inset 0 0 0 8px #8db3cf55,10px 12px 0 #2539a211}.sketch.pool i:nth-child(3){inset:35% 42%;border-radius:0}.green{border-radius:50% 35% 45% 30%;transform:perspective(400px) rotateX(58deg) rotateZ(7deg)}.green i:first-child{height:80%;transform:rotate(-5deg)}.game small{font-size:10px;letter-spacing:2px}.game h2{font-size:clamp(49px,5vw,77px);line-height:.79;margin:19px 0}.game p{line-height:1.5;min-height:54px}.game strong{font-size:12px;border-bottom:2px solid;padding-bottom:5px}.credit{text-align:center;padding:100px 20px}.credit>p:first-child{font-size:11px;letter-spacing:4px}.credit h3{font-size:clamp(55px,8vw,110px);line-height:.82;margin:22px}.credit h3 em{font-style:normal}.credit p{font:23px Patrick}.credit small{display:block;color:#68708b;margin-top:25px}footer{border-top:1px solid;padding:30px 5vw;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px}@media(max-width:800px){header p{display:none}.games{grid-template-columns:1fr}.game{min-height:auto;border-right:0;border-bottom:1px solid}.sketch{height:145px}.credit{padding:70px 15px}footer{flex-direction:column;gap:15px;text-align:center}.hero{padding-top:55px}}

/* Complete rows stay separated as the collection grows. */
.game { border-bottom: 1px solid var(--blue); }
.pickle-court { border-radius: 0; }
.pickle-court i:nth-child(3) { inset: 34% 0; border-radius: 0; background: #c94b5918; border-color: var(--red); }
.pickle-court b { color: #a89418; }

/* Menu art comes from each actual game scene, including players and equipment. */
.game-preview{width:calc(100% + 4vw);height:310px;margin:12px -2vw 26px;position:relative;overflow:hidden}
.game-preview img,.game-preview canvas{display:block;width:100%;height:100%;object-fit:contain}
.preview-fallback{position:absolute;inset:0;display:grid;place-items:center;font:20px Patrick,cursive;color:#6475ae}
.game{min-height:740px}.game small{font-size:12px}.game strong{font-size:14px}
@media(max-width:800px){.game-preview{height:300px}.game{min-height:0}}
@media(max-width:420px){.game-preview{height:260px}}
