:root{--bg:#563ac9;--accent:#b7ff52;--button-ink:#2c2055;--cup-hue:0deg;font-family:ui-rounded,'Trebuchet MS',Arial,sans-serif;color:#fff;color-scheme:light}*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.55;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #13aeb6;outline-offset:4px}[hidden]{display:none!important}button{border:0}h1,h2,h3,p{margin:0}button,input,select{min-width:0}.app-shell{height:100dvh;min-height:300px;display:grid;grid-template-rows:68px minmax(0,1fr) 38px;overflow:hidden;position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% 30%,#ffffff27,transparent 65%),linear-gradient(160deg,transparent,#09052d66),var(--bg);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}header{display:flex;justify-content:space-between;align-items:center;padding:0 28px;gap:15px}.wordmark{display:flex;align-items:center;gap:5px;font-size:21px;letter-spacing:-.7px}.wordmark>span{display:grid;place-items:center;background:#ffdc68;color:#633cb5;width:36px;height:36px;border-radius:12px;rotate:-7deg;margin-right:7px;box-shadow:0 4px 0 #0002}.utilities{display:flex;gap:9px}.icon{width:42px;height:42px;border:2px solid #fff4;border-radius:15px;background:#ffffff1a;color:white;font-size:23px;display:grid;place-items:center;transition:.2s}.icon:hover{background:#fff3;rotate:-5deg}.icon.small{height:32px;width:36px;font-size:20px;border:0}.ambient{position:absolute;inset:0;pointer-events:none;z-index:-1;overflow:hidden;background-image:radial-gradient(#fff2 1px,transparent 2px);background-size:38px 38px}.ambient:before,.ambient:after{content:'';position:absolute;width:65vw;height:65vw;border-radius:50%;background:#ff68c7;filter:blur(90px);opacity:.2;right:-35vw;top:5%;animation:drift 13s infinite alternate}.ambient:after{background:#49dbff;left:-35vw;top:50%;animation-delay:-7s}.ambient i{position:absolute;top:18%;left:12%;width:9px;height:14px;border-radius:3px;background:#ffdc6b;animation:float 6s infinite alternate}.ambient i:nth-child(2){left:85%;top:30%;background:#51e1ed;animation-delay:-3s}.ambient i:nth-child(3){left:20%;top:75%;background:#ffa4db;animation-delay:-1s}.ambient i:nth-child(4){left:78%;top:83%;animation-delay:-5s}.ambient i:nth-child(5){left:92%;top:65%;background:#ffa4db}.ambient i:nth-child(6){left:6%;top:45%;background:#51e1ed}.ambient i:nth-child(7){left:48%;top:13%;animation-delay:-3s}.ambient i:nth-child(8){left:52%;top:85%;background:#51e1ed}.screen{min-height:0;height:100%;width:100%;max-width:1100px;margin:auto;animation:enter .45s ease-out}.lobby{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto auto;gap:10px;text-align:center;padding:2px 22px 6px;align-items:center}.brand{display:flex;flex-direction:column;align-items:center;gap:6px}.brand strong{max-width:100%;font-size:14px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.avatar{width:54px;height:54px;border-radius:50%;overflow:hidden;background:#fff;box-shadow:0 6px 0 #2e197641,0 0 0 7px #ffffff10;border:3px solid #fff;display:grid;place-items:center;color:#6241ad;text-align:center;font-size:12px;font-weight:900;flex-shrink:0}.avatar.large{width:clamp(54px,10dvh,90px);height:clamp(54px,10dvh,90px);border-width:4px;font-size:16px;animation:bob 5s ease-in-out infinite}.avatar img{width:100%;height:100%;object-fit:cover}.lobby h1{font-size:clamp(34px,6.9dvh,68px);font-weight:950;line-height:1.02;letter-spacing:-2px;text-shadow:0 4px 0 #25145b80,0 7px 15px #30176b40;transform:rotate(-2deg)}h1 em{font-style:normal;color:#ffdf6b}.showcase,.play-area{height:100%;min-height:0;display:flex;align-items:center;justify-content:center;container-type:size}.stage{position:relative;flex:none;aspect-ratio:2.1;width:min(100%,850px,calc(100cqh * 2.1));max-height:100%}.lobby-stage{aspect-ratio:1.9;width:min(100%,700px,calc(100cqh * 1.9))}.floor{position:absolute;bottom:6%;left:2%;width:96%;height:28%;border-radius:50%;background:radial-gradient(ellipse at 50% 25%,#dda6ff,#a567e9 62%,#f3d1ff 64%,#a45ce6 67%,#593ac1 73%);box-shadow:0 9px 0 #25165a80,0 16px 0 #261a6922,0 22px 30px #28106130}.toy{position:absolute;bottom:12%;width:33.33%;filter:hue-rotate(var(--cup-hue)) drop-shadow(0 10px 7px #2d166655);user-select:none;pointer-events:none}.t0{left:0;rotate:-9deg}.t1{left:33.33%;bottom:28%;animation:bob 5s ease-in-out infinite}.t2{left:66.66%;rotate:9deg}.ball{position:absolute;width:clamp(20px,3.4vw,42px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 33% 25%,#fff8c6,#ffd45e 48%,#d99c30 80%);box-shadow:0 0 24px #ffd951aa;bottom:15%;left:50%;transform:translateX(-50%)}.lobby-stage .ball{bottom:20%}.primary,.secondary,.secondary-light{display:flex;justify-content:center;align-items:center;min-height:52px;padding:12px 22px;border-radius:18px;font-weight:850;gap:10px;transition:transform .15s,box-shadow .15s}.primary{background:var(--accent);color:var(--button-ink);border:3px solid #ffffff80;box-shadow:0 6px 0 #25146766,0 12px 20px #27125522;font-size:20px;position:relative;overflow:hidden}.primary:before{content:'';position:absolute;inset:-80%;background:linear-gradient(110deg,transparent 40%,#fff7 50%,transparent 60%);transform:translateX(-100%);animation:shine 7s infinite;pointer-events:none}.primary:hover:not(:disabled){transform:translateY(-3px) rotate(-1deg)}.primary:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px 0 #25146766}.lobby>.primary{width:280px;max-width:100%;margin:auto;font-size:23px;min-height:60px}.lobby>p{font-size:15px}.text-light{background:none;color:#fff;font-size:13px;text-decoration:underline;padding:5px}.game{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:15px;align-items:center;padding:5px 24px 16px}.game>.avatar{margin:auto}.heading{text-align:center}.heading h1{font-size:clamp(27px,5dvh,48px);color:#ffdf6b;text-shadow:0 3px 0 #25145b80;line-height:1.12}.heading p{font-size:13px;min-height:18px;margin-top:6px}.pill{display:inline-block;padding:6px 12px;border-radius:20px;background:#ffffff26;font-size:11px;font-weight:800;letter-spacing:.8px;margin-bottom:10px}.cup{position:absolute;left:0;bottom:6%;width:33.333%;height:auto;padding:0;background:none;opacity:1!important;transition-property:left,transform;transition-timing-function:cubic-bezier(.45,.05,.25,1);filter:hue-rotate(var(--cup-hue)) drop-shadow(0 10px 7px #2d166655)}.cup img{width:100%;display:block;pointer-events:none;user-select:none;-webkit-user-drag:none}.cup:not(:disabled):hover img{filter:brightness(1.2)}.cup:not(:disabled):hover{translate:0 -6px}.cup:focus-visible{outline:3px solid #fff;outline-offset:-14px;border-radius:30px}.secondary-light{margin:auto;background:#fff2;color:white;border:2px solid #fff4;min-height:42px;font-size:15px}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 22px 5px;font-size:11px;color:#fffc}#event-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80%}dialog{border:0;padding:0;box-shadow:0 25px 100px #1f124666;max-height:calc(100dvh - 28px);width:calc(100% - 28px);overscroll-behavior:contain}dialog::backdrop{background:#170b3a99;backdrop-filter:blur(7px)}dialog[open]{animation:pop .3s ease-out}.result-dialog{max-width:460px;background:linear-gradient(155deg,#8660ed,#5733bd);color:white;border:4px solid #d1b8ff;border-radius:30px;padding:clamp(18px,3dvh,30px);text-align:center;overflow:auto}.result-dialog h2{font-size:clamp(30px,5dvh,44px);color:#ffdf6b;text-shadow:0 3px 0 #3b237e;position:relative}.result-dialog>p{margin:9px 0;font-size:15px}.prize-visual{height:clamp(64px,15dvh,125px);width:clamp(64px,15dvh,125px);margin:14px auto;display:grid;place-items:center;font-size:64px;position:relative}.prize-visual img{height:100%;width:100%;object-fit:contain;filter:drop-shadow(0 5px 6px #28106144);animation:bob 3s infinite}.ticket{background:#fff;color:#542c8e;border-radius:20px;padding:16px;position:relative}.ticket>span{font-size:11px;letter-spacing:2px}.ticket h3{font-size:24px;margin:8px 0;overflow-wrap:anywhere}.ticket strong{font-family:monospace;font-size:18px;letter-spacing:.8px}.ticket p{font-size:13px;margin-top:10px}.result-dialog>.primary{width:100%;background:#ffdb66;color:#482378;margin:15px 0 12px;position:relative}.result-dialog>small{font-size:12px;position:relative}#confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}#confetti i{position:absolute;top:-20px;width:7px;height:12px;background:#ffdc68;animation:confetti 3s linear infinite}.light-dialog{max-width:760px;background:#fff;color:#302845;border-radius:26px;padding:28px;overflow:auto;font-family:'Trebuchet MS',Arial,sans-serif}.compact{max-width:450px}.compact p{line-height:1.6;margin:15px 0}.compact>.primary,.compact>.secondary{width:100%;margin-top:12px}.light-dialog h2{font-size:26px;letter-spacing:-.7px}.light-dialog h3{font-size:20px;margin:18px 0 14px}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.eyebrow{font-size:11px;letter-spacing:2px;color:#8068a8;font-weight:bold}.close{background:#f1edf8;color:#503d71;width:42px;height:42px;border-radius:13px;font-size:20px;flex-shrink:0}.light-dialog label{display:flex;flex-direction:column;gap:8px;font-size:16px;font-weight:700;margin-bottom:18px}.light-dialog input:not([type=checkbox]):not([type=range]),.light-dialog select{width:100%;border:1px solid #d7cfe3;background:#fcfbfe;color:#302845;border-radius:12px;min-height:48px;padding:11px 12px;font-size:16px}.light-dialog input[type=color]{height:52px;padding:5px!important}.light-dialog input[type=file]{font-size:13px!important;padding:10px!important}.light-dialog input[type=range]{accent-color:#7048cb;width:100%}.light-dialog input[type=checkbox]{width:21px;height:21px;accent-color:#7048cb}.light-dialog .primary{background:#7048cb;color:#fff;border-color:transparent;font-size:17px;min-height:50px;box-shadow:0 4px 0 #4a2a94;margin:8px 0}.light-dialog .primary:before{display:none}.light-dialog .secondary{background:#f3effb;border:1px solid #dfd6ed;color:#604092;font-size:15px;min-height:46px;border-radius:13px;box-shadow:none}.full{width:100%}.two{display:grid;grid-template-columns:1fr 1fr;gap:15px}.two>label{min-width:0}.hint{font-size:14px;line-height:1.6;color:#716580;margin:12px 0 18px}.callout{background:#fff7df;color:#79632f;border-radius:13px;padding:14px;font-size:14px;line-height:1.55;margin:20px 0}.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;background:#f3eff9;border-radius:14px;padding:5px;position:sticky;top:-28px;z-index:2;margin:0 0 22px}.tabs button{background:none;color:#74658a;font-weight:700;border-radius:10px;padding:12px 4px;font-size:15px}.tabs button.active{background:#fff;color:#623ab3;box-shadow:0 2px 8px #38215b12}.section-title{display:flex;align-items:center;justify-content:space-between;gap:15px}.link{background:none;color:#7247c5;text-decoration:underline;padding:8px 0;font-size:14px;display:block;margin-bottom:12px}.logo-editor{display:flex;align-items:center;flex-direction:column}.logo-editor canvas{width:120px;height:120px;border-radius:50%;background:#f1edf8;box-shadow:0 0 0 5px #f1edf8;margin:10px 0 22px}.logo-editor .upload{width:100%}.colors{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.image-preview{height:100px;width:100px;object-fit:contain;border:1px solid #eee;border-radius:12px}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}.metric{padding:15px 12px;border-radius:15px;background:#f5f1fc;border:1px solid #e9e0f7}.metric span{font-size:12px;color:#756285;display:block}.metric b{font-size:26px;color:#623cb0;display:block;margin-top:5px}.inline{flex-direction:row!important;align-items:center;font-size:14px!important}.records{margin:15px 0}.record{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid #eee8f5;padding:14px 0}.record>div{min-width:0}.record strong{font-family:monospace;font-size:15px;color:#493966;overflow-wrap:anywhere}.record small{font-size:12px;color:#877692;display:block;margin-top:5px;overflow-wrap:anywhere}.record b{font-size:12px;color:#6c5583}.record button{min-height:44px;padding:10px 13px;border-radius:12px;background:#7048cb;color:#fff;white-space:nowrap;font-size:14px}.empty{padding:25px;text-align:center;color:#887995;border:1px dashed #d9cee5;border-radius:15px;font-size:15px}.panel-footer{border-top:1px solid #eee;padding-top:18px;font-size:12px;color:#8b7a9a;margin-top:25px}.light-dialog details{margin-top:22px}.light-dialog summary{cursor:pointer;font-size:15px;color:#6c488f;padding:12px 0}.light-dialog form{margin-top:14px}#admin-error{color:#b3294e;font-size:14px;line-height:1.5;margin-top:15px}#notice{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);max-width:min(500px,90vw);background:#fff;color:#43305a;box-shadow:0 10px 40px #1d11474d;padding:15px 22px;border-radius:16px;z-index:10000;font-size:15px;text-align:center;line-height:1.4}
@keyframes enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes pop{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes float{to{transform:translate(10px,-30px) rotate(70deg)}}@keyframes drift{to{transform:translate(-70px,60px) scale(1.2)}}@keyframes bob{50%{translate:0 -9px}}@keyframes shine{0%,75%{transform:translateX(-100%)}100%{transform:translateX(100%)}}@keyframes confetti{to{transform:translateY(650px) rotate(500deg)}}
@media(max-width:700px){.app-shell{grid-template-rows:58px minmax(0,1fr) 32px}header{padding:0 16px}.wordmark{font-size:17px}.wordmark>span{width:30px;height:30px}.icon{height:38px;width:38px}.lobby{gap:8px;padding:4px 16px 8px}.lobby h1{font-size:clamp(33px,6.4dvh,52px);letter-spacing:-1.5px}.lobby>.primary{width:245px;min-height:55px}.lobby>p{font-size:14px}.avatar.large{width:68px;height:68px}.game{padding:6px 12px 10px;gap:13px}.game h1{font-size:clamp(26px,4.8dvh,38px)}.game>.avatar{width:50px;height:50px}footer{padding:0 16px 4px}.light-dialog{padding:22px 18px;border-radius:22px}.light-dialog h2{font-size:24px}.tabs{top:-22px}.tabs button{font-size:14px}.two{grid-template-columns:1fr}.compact .two{grid-template-columns:1fr 1fr}.metrics{gap:6px}.metric{padding:12px 8px}.metric span{font-size:11px}.metric b{font-size:23px}.record{flex-wrap:wrap}.colors{gap:8px}.colors label{font-size:14px}.result-dialog{padding:22px}.result-dialog h2{font-size:36px}.ticket h3{font-size:22px}}
@media(max-height:650px) and (orientation:portrait){.lobby{gap:5px}.avatar.large{width:50px;height:50px;font-size:12px}.lobby h1{font-size:32px}.lobby>.primary{min-height:46px;font-size:20px}.lobby>p{font-size:12px}.text-light{font-size:12px;padding:2px}.brand strong{font-size:12px}.game{gap:8px}.result-dialog{padding:16px}.result-dialog h2{font-size:30px}.result-dialog>p{font-size:13px;margin:5px 0}.prize-visual{margin:8px auto;height:65px;width:65px;font-size:48px}.ticket{padding:10px}.ticket h3{margin:5px 0;font-size:20px}.result-dialog>.primary{min-height:45px;margin:10px 0}}
@media(max-height:520px) and (orientation:landscape){.app-shell{grid-template-rows:48px minmax(0,1fr) 28px}.lobby{grid-template-columns:.8fr 1.2fr;grid-template-rows:auto auto auto auto auto;gap:7px 20px;padding:0 28px 8px}.brand{grid-area:1/1}.avatar.large{height:48px;width:48px}.brand strong{display:none}.lobby h1{grid-area:2/1;font-size:31px}.showcase{grid-area:1/2/6/3}.lobby>.primary{grid-area:3/1;min-height:43px;width:220px;font-size:19px}.lobby>p{grid-area:4/1;font-size:11px}.text-light{grid-area:5/1;font-size:11px;padding:2px}.game{grid-template-columns:.65fr 1.35fr;grid-template-rows:auto 1fr auto;gap:10px 20px}.game>.avatar{grid-area:1/1}.heading{grid-area:2/1}.heading h1{font-size:28px}.play-area{grid-area:1/2/4/3}#show-result{grid-area:3/1}.result-dialog{max-width:620px;padding:18px;display:grid;grid-template-columns:110px 1fr;gap:6px 16px;text-align:left}.result-dialog:not([open]){display:none}.result-dialog h2,.result-dialog>p,.ticket{grid-column:2}.result-dialog h2{font-size:28px}.result-dialog>p{margin:0;font-size:12px}.prize-visual{grid-column:1;grid-row:1/5;width:90px;height:90px;align-self:center}.ticket{padding:8px 12px}.ticket h3{font-size:18px;margin:4px 0}.ticket p{margin-top:4px}.result-dialog>.primary{grid-column:1/-1;min-height:40px;margin:5px 0;font-size:16px}.result-dialog>small{grid-column:1/-1;text-align:center}}
@media(prefers-reduced-motion:reduce){.ambient,#confetti{display:none}*,*:before,*:after{animation:none!important}.cup{transition-timing-function:linear}}
