:root{
  --green:#2e8b57; --green-dark:#1d5c3a; --white:#fbfffa;
  --ink:#17251c; --gold:#c9a227; --red:#c0392b; --card:rgba(255,255,255,.93);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,'Segoe UI',sans-serif;color:var(--ink);min-height:100vh;background:var(--white);overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-2;
  background:repeating-linear-gradient(90deg,#f2faf2 0 80px,#e8f5e8 80px 160px);
  animation:mow 40s linear infinite}
@keyframes mow{to{background-position:160px 0}}
body::after{content:"";position:fixed;inset:-20%;z-index:-1;pointer-events:none;
  background:conic-gradient(from 200deg at 15% -5%,rgba(255,255,200,.25),transparent 25%),
             conic-gradient(from 160deg at 85% -5%,rgba(255,255,200,.2),transparent 25%);
  animation:flood 18s ease-in-out infinite alternate}
@keyframes flood{to{transform:translateX(4%) skewX(-2deg)}}
header{background:linear-gradient(90deg,var(--green-dark),var(--green));color:#fff;padding:.7rem 1rem;display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;box-shadow:0 2px 8px rgba(0,0,0,.2);position:sticky;top:0;z-index:10}
header h1{font-size:1.05rem;letter-spacing:.5px;font-weight:700}
header nav{margin-left:auto;display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
header a,header button{color:#fff;text-decoration:none;background:rgba(255,255,255,.14);padding:.35rem .65rem;border-radius:6px;border:none;cursor:pointer;font-size:.88rem}
header a.active{background:rgba(255,255,255,.34);font-weight:700}
#jackpot{background:rgba(0,0,0,.28);padding:.3rem .8rem;border-radius:99px;font-size:.85rem}
#jackpot b{color:#ffe9a8}
main{max-width:1000px;margin:1.2rem auto;padding:0 1rem}
.card{background:var(--card);border-radius:12px;padding:1.2rem;margin-bottom:1rem;box-shadow:0 2px 10px rgba(29,92,58,.12);border:1px solid #dceadc}
h2{color:var(--green-dark);margin-bottom:.8rem;font-size:1.15rem}
h3{color:var(--green-dark);margin:.8rem 0 .4rem;font-size:1rem}
label{display:block;font-size:.85rem;margin:.5rem 0 .2rem;color:#3c5a49}
input,select,textarea{width:100%;padding:.5rem;border:1px solid #bcd4bf;border-radius:6px;font-size:1rem;background:#fff}
textarea{font-family:ui-monospace,monospace;font-size:.8rem;min-height:110px}
.btn{display:inline-block;background:var(--green);color:#fff;border:none;padding:.55rem 1.1rem;border-radius:8px;cursor:pointer;font-size:1rem;margin-top:.7rem}
.btn:hover{background:var(--green-dark)}
.btn.small{padding:.25rem .6rem;font-size:.83rem;margin:.15rem}
.btn.gold{background:var(--gold)}.btn.red{background:var(--red)}.btn.grey{background:#6c7a70}
.msg{padding:.5rem .8rem;border-radius:6px;margin:.6rem 0;font-size:.9rem}
.msg.err{background:#fdecea;color:#943126}.msg.ok{background:#e8f6ec;color:#1d5c3a}.msg.info{background:#eef3ff;color:#2b4a8a}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{padding:.45rem .5rem;text-align:left;border-bottom:1px solid #e2eee2;vertical-align:middle}
th{color:var(--green-dark)}
.match{display:flex;align-items:center;gap:.6rem;padding:.55rem .3rem;border-bottom:1px solid #e2eee2;flex-wrap:wrap}
.match .teams{flex:1;min-width:230px;font-weight:600}
.match input[type=number]{width:56px;text-align:center;padding:.35rem}
.match .meta{font-size:.75rem;color:#6b8574;width:100%}
.joker{background:var(--gold);color:#fff;border-radius:99px;padding:.15rem .55rem;font-size:.75rem;cursor:pointer;user-select:none}
.joker.on{outline:3px solid #7a5f00}
.joker.disabled{opacity:.4;cursor:not-allowed}
.live{background:var(--red);color:#fff;padding:.15rem .5rem;border-radius:4px;font-size:.75rem;animation:blink 1s step-start infinite}
@keyframes blink{50%{opacity:.4}}
.badge{font-size:.7rem;padding:.1rem .45rem;border-radius:99px;background:#e2eee2;color:#2e5c40}
.badge.admin{background:#333;color:#fff}.badge.kid{background:#ffe9a8;color:#7a5f00}
.badge.lock{background:#eee;color:#777}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
@media(max-width:760px){.grid2,.grid4{grid-template-columns:1fr}}
#pitch{width:100%;max-width:640px;margin:0 auto;display:block}
.pulse-green{animation:pg 1.6s ease-out infinite;transform-origin:center;transform-box:fill-box}
.pulse-red{animation:pr 1.2s ease-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes pg{0%{opacity:.9;transform:scale(.6)}100%{opacity:0;transform:scale(2.2)}}
@keyframes pr{0%{opacity:.9;transform:scale(.6)}100%{opacity:0;transform:scale(2)}}
.rank1{color:var(--gold);font-weight:800}
.tabs{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.8rem}
.tabs button{background:#dceadc;border:none;padding:.4rem .8rem;border-radius:8px 8px 0 0;cursor:pointer;font-size:.88rem;color:var(--green-dark)}
.tabs button.active{background:var(--green);color:#fff;font-weight:700}
footer{text-align:center;color:#7a9482;font-size:.8rem;padding:1.5rem}
.rules{font-size:.8rem;color:#5c7566;line-height:1.5}
.duel{display:flex;gap:.8rem;align-items:center;padding:.6rem;border-bottom:1px solid #e2eee2;flex-wrap:wrap}
.duel .vs{color:var(--gold);font-weight:800}
