*{box-sizing:border-box}
:root{--night:#243126;--forest:#36523c;--forest2:#52704f;--cream:#fff6df;--paper:#fffaf0;--kraft:#ead2a5;--mustard:#e5aa37;--brick:#b94f3d;--brick2:#87392f;--blue:#367b7a;--ink:#33291f;--muted:#786952;--line:#d9bd85;--shadow:rgba(60,37,20,.22)}
html{background:var(--night)} body{margin:0;min-height:100vh;color:var(--ink);font-family:Trebuchet MS,Arial,sans-serif;background:radial-gradient(circle at 15% 12%,rgba(229,170,55,.18),transparent 18%),radial-gradient(circle at 86% 8%,rgba(185,79,61,.18),transparent 20%),linear-gradient(180deg,#28372c 0 175px,#f0d9aa 175px 205px,#fff5de 205px 100%);background-attachment:fixed}
body:before{content:"";position:fixed;z-index:0;top:0;left:0;right:0;height:88px;background:linear-gradient(155deg,transparent 48%,#e5aa37 49% 70%,transparent 71%) 0 0/86px 58px repeat-x,linear-gradient(205deg,transparent 48%,#b94f3d 49% 70%,transparent 71%) 42px 0/86px 58px repeat-x;opacity:.95;pointer-events:none}
body:after{content:"";position:fixed;z-index:0;inset:88px 0 auto;height:4px;background:repeating-linear-gradient(90deg,#d9a545 0 24px,#b74d3b 24px 48px,#3b7d78 48px 72px,#55744f 72px 96px);box-shadow:0 4px 12px #0005;pointer-events:none}
.shell,.wrap,.box{position:relative;z-index:1}.shell{width:min(100%,760px);margin:auto;padding:20px 14px 50px}.wrap{width:min(1120px,95%);margin:26px auto 60px}.hero{text-align:center;padding:82px 8px 20px;color:#fff}.logo{font-size:58px;filter:drop-shadow(0 5px 0 #0003)}.kicker{font-weight:900;letter-spacing:.18em;font-size:11px;color:#f8d278}.hero h1{font-size:clamp(44px,11vw,72px);line-height:.92;margin:8px 0;color:#fff;text-shadow:0 4px 0 #78382f,0 8px 18px #0008}.subtitle{font:800 18px Georgia,serif;color:#f7e5bc}.ribbon{display:inline-block;margin-top:12px;padding:7px 16px;background:var(--mustard);color:#4f3518;font-weight:900;border-radius:5px;transform:rotate(-1.5deg);box-shadow:4px 5px 0 #0003}
h1,h2,h3{font-family:Georgia,serif}h1,h2{color:var(--brick2)}h2{font-size:27px}.card,.box{position:relative;background:linear-gradient(180deg,#fffaf0,#fff5dd);border:2px solid var(--line);border-radius:18px 28px 17px 25px;padding:22px;box-shadow:7px 9px 0 rgba(96,61,30,.12),0 20px 45px var(--shadow);margin-top:16px}.card:before,.box:before{content:"";position:absolute;top:-7px;left:8%;width:72px;height:16px;background:rgba(229,194,123,.72);transform:rotate(-2deg);border-radius:2px}.card:nth-of-type(even):before{left:auto;right:9%;transform:rotate(3deg)}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:14px}.choice button{min-height:116px;font-size:19px}.choice button:first-child:before{content:"🎪";display:block;font-size:31px;margin-bottom:6px}.choice button:nth-child(2):before{content:"🎟️";display:block;font-size:31px;margin-bottom:6px}
label{display:block;font-weight:900;font-size:13px;margin:13px 0 7px 3px;color:#5c4a34;text-transform:uppercase;letter-spacing:.04em}input,select{width:100%;border:2px solid var(--line);background:#fffdf7;padding:14px 15px;border-radius:10px 15px;font-size:16px;color:var(--ink);outline:none;box-shadow:inset 0 2px 0 #00000008}input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(54,123,122,.12)}
button{border:0;padding:14px 16px;border-radius:10px 16px;font-weight:900;font-size:15px;cursor:pointer;margin-top:10px;box-shadow:4px 5px 0 rgba(51,40,36,.14);transition:.15s transform,.15s filter}button:hover{filter:brightness(1.04);transform:translateY(-1px)}button:active{transform:translate(2px,2px);box-shadow:2px 3px 0 rgba(51,40,36,.14)}button:disabled{opacity:.5;cursor:not-allowed;filter:none;transform:none}.primary{background:var(--brick);color:#fff}.success,.green{background:var(--forest2)!important;color:#fff}.secondary,.soft{background:#efd59b!important;color:#62451e!important;border:1px solid #d4ae62}.red{background:#a63f36!important;color:#fff}.hidden{display:none!important}.error,.err{color:#a13b31;font-size:14px;font-weight:800;min-height:18px;margin-top:9px}.linkbtn{background:transparent!important;color:var(--muted)!important;box-shadow:none!important;text-decoration:underline}.small,.meta{font-size:12px;color:var(--muted)}
.codebox{font-size:34px!important;letter-spacing:.16em;text-transform:uppercase;text-align:center;font-weight:900;color:var(--forest)}.game-head{text-align:center}.game-code,.code{display:inline-block;padding:7px 13px;border-radius:999px;background:#e7d7aa;font-weight:900;color:#3d5a43;letter-spacing:.11em}.created{background:#edf1d8;border:2px dashed #73895e;padding:17px;border-radius:16px;text-align:center}.created strong{font-size:34px;letter-spacing:.14em;color:var(--forest)}
.scorebar{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:14px 0}.stat{background:#fffdf7;border:2px solid var(--line);padding:13px 6px;border-radius:13px 19px;text-align:center;box-shadow:3px 4px 0 #0001}.stat strong{display:block;font-size:29px;color:var(--brick2)}.stat span{font-size:10px;font-weight:900;color:var(--muted)}.challenge{position:relative;background:#fffdf6;border:2px solid var(--line);border-radius:17px 24px;padding:22px;text-align:center;overflow:hidden}.challenge:before{content:"✦";position:absolute;right:12px;top:8px;color:var(--mustard);font-size:26px}.badges{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}.badge,.pill{display:inline-block;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:900;background:#dde6cb;color:#466044}.challenge-text{font-family:Georgia,serif;font-size:21px;line-height:1.48;font-weight:800}.actions{display:flex;gap:9px;flex-wrap:wrap}.actions>*{flex:1}.leader{display:grid;grid-template-columns:48px 1fr auto;gap:9px;padding:11px 4px;border-bottom:1px dashed #c9aa75}.leader:first-child{background:linear-gradient(90deg,#f7dda1,transparent);border-radius:10px}.leader .pts,.score{font-weight:900;color:var(--forest)}.pause,.paused{padding:14px;text-align:center;background:#fff0bd!important;color:#805d1d!important;border:2px solid #dfbd68;border-radius:14px;font-weight:900;margin-bottom:12px}.top{display:flex;justify-content:space-between;align-items:center;gap:12px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}.game{border:2px solid var(--line);padding:16px;border-radius:15px 22px;background:#fffaf0;box-shadow:3px 4px 0 #0001}.inline{display:flex;gap:8px;flex-wrap:wrap;align-items:end}.inline>*{flex:1}.player{border-top:1px dashed #c9aa75;padding:15px 0}.player:first-of-type{border-top:0}.player-head{display:flex;justify-content:space-between;gap:10px}.edit{display:grid;grid-template-columns:2fr repeat(3,1fr) auto;gap:8px;margin-top:8px}.share{font-size:13px;background:#f4e6c6;padding:12px;border-radius:12px;word-break:break-all}.danger{border-color:#d89484}.qr-wrap{display:flex;gap:16px;align-items:center;justify-content:center;flex-wrap:wrap;margin:14px 0}.qr-wrap img{width:170px;height:170px;background:#fff;padding:8px;border:2px solid var(--line);border-radius:12px;box-shadow:4px 5px 0 #0001}.festoon{display:flex;justify-content:center;gap:8px;margin:8px 0 4px}.festoon span{font-size:20px;animation:sway 2.7s ease-in-out infinite}.festoon span:nth-child(2n){animation-delay:.4s}@keyframes sway{50%{transform:translateY(3px) rotate(5deg)}}
.confetti{position:fixed;z-index:9999;top:-20px;width:10px;height:16px;border-radius:2px;pointer-events:none;animation:fall 1.7s linear forwards}@keyframes fall{to{transform:translate(var(--drift),110vh) rotate(760deg);opacity:.9}}
a{color:var(--brick2)}
@media(max-width:700px){body{background:linear-gradient(180deg,#28372c 0 150px,#f0d9aa 150px 180px,#fff5de 180px 100%)}.hero{padding-top:74px}.choice{grid-template-columns:1fr}.choice button{min-height:88px}.scorebar{gap:6px}.edit{grid-template-columns:1fr 1fr}.edit button{grid-column:1/-1}.top{align-items:flex-start;flex-direction:column}.actions{flex-direction:column}.wrap{width:min(96%,1120px)}.card{padding:17px}}
.box{width:min(92%,460px);margin:12vh auto;padding:28px;text-align:center}.box input,.box button{width:100%}
