:root{color:#2b160c;background:#f5dfb9;font-family:Trebuchet MS,Gill Sans,ui-rounded,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #2b160c;--cream: #fff4d6;--straw: #f2be55;--barn-red: #8d2f1b;--barn-dark: #4b1f14;--grass: #53733a;--mud: #7c4327;--mud-dark: #4e271b;--sky: #9ed7d1}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden;background:radial-gradient(circle at 18% 14%,rgba(255,244,214,.95) 0 10rem,transparent 10.2rem),radial-gradient(circle at 83% 7%,rgba(255,199,95,.55) 0 8rem,transparent 8.3rem),linear-gradient(180deg,#94d4d1 0 38%,#8dab58 38% 47%,#d59a43 47% 100%)}body:before,body:after{position:fixed;inset:auto auto 0 0;z-index:-1;width:100%;height:42vh;content:"";background:radial-gradient(ellipse at 10% 100%,rgba(80,95,43,.5) 0 18%,transparent 18.5%),radial-gradient(ellipse at 35% 100%,rgba(80,95,43,.35) 0 16%,transparent 16.5%),radial-gradient(ellipse at 75% 100%,rgba(80,95,43,.42) 0 20%,transparent 20.5%);pointer-events:none}body:after{inset:0 0 auto auto;width:34rem;height:34rem;border-radius:999px;background:radial-gradient(circle,rgba(255,236,151,.7),transparent 67%);transform:translate(25%,-42%)}button,input{font:inherit}button{cursor:pointer}button:disabled,input:disabled{cursor:not-allowed;opacity:.62}.appShell{width:min(1180px,calc(100% - 2rem));margin:0 auto;padding:2rem 0 3rem}.titleBanner,.controls,.trackCard,.resultsPanel{border:3px solid rgba(43,22,12,.9);box-shadow:0 1.25rem #48271240,0 1.5rem 2rem #411e0c3d}.titleBanner{position:relative;margin-bottom:1.4rem;padding:clamp(1.4rem,3vw,2.2rem);overflow:hidden;border-radius:2rem;background:linear-gradient(135deg,#fff4d6f0,#ffd98ae0),repeating-linear-gradient(45deg,transparent 0 1.6rem,rgba(141,47,27,.08) 1.6rem 3.2rem)}.titleBanner:after{position:absolute;right:-2rem;bottom:-6.5rem;width:28rem;height:12rem;content:"";background:linear-gradient(90deg,#4b1f1452,#4b1f1400),repeating-linear-gradient(90deg,#8d2f1b 0 2.2rem,#b84729 2.2rem 4.4rem);border:3px solid rgba(43,22,12,.5);border-radius:1rem;transform:rotate(-10deg)}.eyebrow{display:inline-flex;align-items:center;gap:.45rem;margin-bottom:.75rem;color:var(--barn-red);font-size:.78rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.eyebrow:before{width:.65rem;height:.65rem;content:"";background:var(--straw);border:2px solid var(--ink);border-radius:50%}h1,h2,p{margin-top:0}h1{position:relative;z-index:1;max-width:100%;margin-bottom:.75rem;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.6rem,6vw,5.6rem);line-height:.9;letter-spacing:-.075em}.titleBanner p{position:relative;z-index:1;max-width:52rem;margin-bottom:0;color:#2b160cc7;font-size:clamp(1rem,2vw,1.22rem);font-weight:700;line-height:1.55}.controls{display:flex;flex-direction:column;justify-content:space-between;padding:1.25rem;border-radius:2rem;background:radial-gradient(circle at 22% 18%,rgba(255,255,255,.45),transparent 22%),linear-gradient(155deg,#ffcf73,#d66d38)}.raceSettings{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;margin-bottom:.7rem}.countField{min-width:0}.controls label{display:block;color:var(--barn-dark);font-size:.7rem;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.countControl{display:grid;grid-template-columns:1fr 2.35rem;gap:.45rem;align-items:center;margin-top:.35rem}.countControl output{display:flex;align-items:center;justify-content:center;height:2.1rem;padding-bottom:.08rem;color:var(--cream);background:var(--barn-dark);border:3px solid var(--ink);border-radius:.7rem;font-family:Georgia,Times New Roman,serif;font-size:1.35rem;font-weight:900;line-height:1;box-shadow:inset 0 -.25rem #0000002e}input[type=range]{width:100%;accent-color:var(--barn-red)}.buttonRow{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.pigRoster{margin-top:1rem;padding:.75rem;background:#4b1f142e;border:2px solid rgba(43,22,12,.45);border-radius:1.25rem}.rosterHeader{display:flex;justify-content:space-between;align-items:center;margin-bottom:.65rem;color:var(--barn-dark);font-size:.75rem;font-weight:950;letter-spacing:.1em;text-transform:uppercase}.rosterHeader strong{display:grid;min-width:2rem;min-height:2rem;place-items:center;color:var(--cream);background:var(--barn-dark);border:2px solid var(--ink);border-radius:999px;letter-spacing:0}.pigRoster.isOfficial .rosterHeader strong{min-width:3.2rem;padding:0 .55rem;font-size:.68rem;text-transform:uppercase}.rosterGrid{display:grid;max-height:23rem;gap:.45rem;overflow:auto;padding-right:.2rem}.rosterPig{display:grid;grid-template-columns:3rem 1fr;gap:.55rem;align-items:center;min-width:0;padding:.38rem .45rem;background:#fff4d68f;border:2px solid rgba(43,22,12,.2);border-radius:.9rem}.pigRoster.isOfficial .rosterPig:first-child{background:linear-gradient(90deg,#ffe07eeb,#fff4d69e);border-color:#2b160c70}.rosterPigIcon{display:grid;height:2.2rem;place-items:center;overflow:hidden}.rosterPigIcon svg{width:3.4rem;height:auto;transform:translateY(.15rem)}.rosterPigIcon .pigShadow,.rosterPigIcon .leg{display:none}.rosterNumber,.rosterName{display:block}.rosterNumber{color:var(--barn-red);font-family:Georgia,Times New Roman,serif;font-size:1.05rem;font-weight:950;letter-spacing:-.03em}.rosterName{min-width:0;overflow:hidden;color:#2b160cd1;font-size:.72rem;font-weight:900;text-overflow:ellipsis;white-space:nowrap}.bettorInput{width:100%;min-width:0;height:1.65rem;margin-top:.2rem;padding:0 .5rem;color:var(--ink);background:#ffffff94;border:2px solid rgba(43,22,12,.28);border-radius:.55rem;font-size:.72rem;font-weight:900;outline:none}.bettorInput::placeholder{color:#2b160c6b}.bettorInput:focus{background:#ffffffd9;border-color:var(--barn-red)}.primaryButton,.ghostButton{min-height:2.65rem;border:3px solid var(--ink);border-radius:.85rem;font-size:.82rem;font-weight:950;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 .32rem #2b160c61;transition:transform .15s ease,box-shadow .15s ease}.primaryButton{color:var(--cream);background:linear-gradient(180deg,#9f351f,#641d13)}.ghostButton{color:var(--ink);background:#fff4d6bf}.primaryButton:not(:disabled):active,.ghostButton:not(:disabled):active{box-shadow:0 .1rem #2b160c61;transform:translateY(.22rem)}.resultsMode{justify-content:start}.resultsHeader{margin-bottom:.85rem}.resultsHeader h2{margin-bottom:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(2rem,4vw,3rem);line-height:.9;letter-spacing:-.06em}.officialResultsList{display:grid;max-height:31rem;gap:.5rem;margin:0;overflow:auto;padding:0 .15rem 0 0;list-style:none}.officialResultsList li{display:grid;grid-template-columns:3.6rem 3.5rem 1fr;gap:.55rem;align-items:center;min-width:0;padding:.5rem;background:#fff4d69e;border:2px solid rgba(43,22,12,.22);border-radius:1rem;font-weight:950}.officialResultsList li:first-child{background:linear-gradient(90deg,#ffe07ef2,#fff4d6b8);border-color:#2b160c80}.resultPigIcon{display:grid;height:2.4rem;place-items:center;overflow:hidden}.resultPigIcon svg{width:3.65rem;height:auto;transform:translateY(.12rem)}.resultPigIcon .pigShadow,.resultPigIcon .leg{display:none}.resultInfo{display:grid;min-width:0}.resultInfo strong{color:var(--barn-red);font-family:Georgia,Times New Roman,serif;font-size:1.05rem}.resultInfo span{min-width:0;overflow:hidden;color:#2b160cd1;font-size:.78rem;text-overflow:ellipsis;white-space:nowrap}.resultsButtons{margin-top:.9rem}.raceLayout{display:grid;grid-template-columns:minmax(0,1fr) minmax(19rem,24rem);gap:1.4rem;align-items:start}.raceSidebar{display:grid;gap:1.4rem;align-items:start}.trackCard{position:relative;overflow:hidden;border-radius:2rem;background:linear-gradient(180deg,#6c8a45,#4f6f35)}.trackHeader{position:relative;z-index:2;padding:1.1rem 1.3rem 0;color:var(--cream);text-shadow:0 2px 0 rgba(0,0,0,.25)}.trackHeader .eyebrow{color:#ffe07e}.trackHeader h2,.resultsPanel h2{margin-bottom:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(1.9rem,4vw,3.15rem);line-height:.9;letter-spacing:-.06em}.track{position:relative;margin:1rem;padding:0;overflow:hidden;background:radial-gradient(circle at 12% 16%,rgba(255,255,255,.14) 0 1.5rem,transparent 1.6rem),linear-gradient(180deg,#5f813d,#3f622d);border:4px solid #32170f;border-radius:1.5rem;box-shadow:inset 0 0 0 .65rem #ffd68429,inset 0 0 4rem #2f150ab3}.ovalTrack{display:block;width:100%;aspect-ratio:1000 / 620;height:auto}.trackGrass{fill:url(#grassGradient)}.outerFence,.innerFence{fill:none;stroke:#d88942;stroke-dasharray:7 13;stroke-linecap:round;stroke-width:16}.outerFence{opacity:.9}.innerFence{opacity:.7;stroke-width:10}.mudOval{fill:none;stroke:url(#mudGradient);stroke-linecap:round;stroke-width:132}.mudSpeckles{fill:none;stroke:url(#mudSpeckles);stroke-linecap:round;stroke-width:124;opacity:.9}.innerGrass{fill:#496d34;stroke:#2b160c8c;stroke-width:5}.laneGuide{fill:none;stroke:#ffe7b747;stroke-dasharray:12 14;stroke-linecap:round;stroke-width:3}.laneGuideTwo{opacity:.58}.laneGuideThree{opacity:.45}.finishMarker rect{fill:url(#finishPattern);stroke:#2b160c;stroke-width:4}.finishMarker rect+text{fill:#fff4d6;font-size:24px;font-weight:950;letter-spacing:.12em;paint-order:stroke;stroke:#2b160c;stroke-width:5px;text-transform:uppercase}.treatHeap path,.treatHeap circle{fill:#ffe07e;stroke:#2b160c;stroke-width:4}.lapBadge rect{fill:#fff4d6eb;stroke:#2b160c;stroke-width:4}.lapBadge text{fill:#8d2f1b;font-size:24px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.hurdle path,.hurdle rect{fill:#ffe07e;stroke:#2b160c;stroke-linecap:round;stroke-linejoin:round;stroke-width:7}.hurdle text{fill:#fff4d6;font-size:18px;font-weight:950;letter-spacing:.08em;paint-order:stroke;stroke:#2b160c;stroke-width:5px;text-transform:uppercase}.ovalRunner{transform-box:fill-box;transform-origin:center;will-change:transform}.ovalRunner.isRacing svg{animation:gallop .36s ease-in-out infinite}.ovalRunner svg{display:block;overflow:visible;filter:drop-shadow(0 .45rem .15rem rgba(43,18,8,.28))}.pigNumberPlate rect{fill:#ffe07e;stroke:#2b160c;stroke-width:4}.pigNumberPlate text{fill:#2b160c;font-size:15px;font-weight:950;pointer-events:none}.pigBody,.pigEar,.pigSnout{fill:var(--pig-color);stroke:#35170d;stroke-width:4;stroke-linejoin:round}.pigPatch{fill:var(--pig-accent);opacity:.72}.nostril,.eye{fill:#2b160c}.smile,.leg,.tail{fill:none;stroke:#35170d;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}.leg{animation:legs .38s ease-in-out infinite alternate}.legTwo{animation-delay:.12s}.legThree{animation-delay:.22s}.tail{stroke-width:4}.pigShadow{fill:#2b12083d}.fence{height:1.35rem;background:linear-gradient(90deg,transparent 0 1rem,rgba(43,22,12,.55) 1rem 1.25rem,transparent 1.25rem 2.5rem),linear-gradient(180deg,#d88942,#a95d2e);background-size:2.5rem 100%,100% 100%;border-top:2px solid rgba(43,22,12,.75);border-bottom:2px solid rgba(43,22,12,.75)}.resultsPanel{position:sticky;top:1rem;padding:1.2rem;border-radius:2rem;background:linear-gradient(#fff4d6e6,#fff4d6e6),repeating-linear-gradient(90deg,#ead091 0 1.2rem,#f7df9b 1.2rem 2.4rem)}.resultsPanel.empty{min-height:16rem}.resultsPanel p{color:#2b160cbf;font-weight:800;line-height:1.45}.resultsList{display:grid;gap:.55rem;margin:1rem 0 0;padding:0;list-style:none}.resultsList li{display:grid;grid-template-columns:4rem 1.15rem 1fr;gap:.55rem;align-items:center;padding:.58rem;background:#ffffff7a;border:2px solid rgba(43,22,12,.22);border-radius:1rem;font-weight:950;animation:resultIn .45s ease both}.resultsList li:nth-child(1){background:linear-gradient(90deg,#ffe07eeb,#ffffff8c)}.place{color:var(--barn-red);font-family:Georgia,Times New Roman,serif;font-size:1.22rem;letter-spacing:-.04em}.swatch{width:1.1rem;height:1.1rem;border:2px solid var(--ink);border-radius:50%}.resultName{min-width:0}@keyframes gallop{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-.45rem) rotate(1.5deg)}}@keyframes legs{0%{transform:translateY(0)}to{transform:translateY(-.45rem)}}@keyframes resultIn{0%{opacity:0;transform:translateY(.65rem) rotate(-1deg)}to{opacity:1;transform:translateY(0) rotate(0)}}@media(max-width:920px){.raceLayout{grid-template-columns:1fr}.resultsPanel{position:static}}@media(max-width:620px){.appShell{width:min(100% - 1rem,1180px);padding-top:.5rem}.titleBanner,.controls,.trackCard,.resultsPanel{border-width:2px;border-radius:1.4rem}.titleBanner:after{opacity:.38}.buttonRow{grid-template-columns:1fr}.countControl output{height:2.1rem}.track{margin:.55rem;border-width:3px}.ovalTrack{min-height:0}.trackHeader{align-items:flex-start;flex-direction:column}.resultsList li{grid-template-columns:3.2rem 1rem 1fr}}
