:root{color-scheme:light;--bg: oklch(.975 .014 8);--bg-soft: oklch(.953 .018 8);--surface: oklch(.988 .01 8 / .92);--surface-strong: oklch(.955 .018 8 / .95);--line: oklch(.852 .03 10 / .7);--text: oklch(.305 .06 8);--text-soft: oklch(.49 .04 10);--accent: oklch(.61 .17 10);--accent-deep: oklch(.42 .11 8);--accent-soft: oklch(.84 .06 12);--jade: oklch(.62 .1 160);--shadow-soft: 0 24px 60px oklch(.53 .09 8 / .1);--ease: cubic-bezier(.22, 1, .36, 1);--font-display: "ZCOOL XiaoWei", "Noto Serif TC", serif;--font-body: "Noto Sans TC", sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;color:var(--text);font-family:var(--font-body);background:radial-gradient(circle at 12% 14%,oklch(.99 .012 10) 0%,transparent 28%),radial-gradient(circle at 86% 10%,oklch(.92 .045 8 / .55) 0%,transparent 24%),radial-gradient(circle at 78% 64%,oklch(.94 .026 30 / .42) 0%,transparent 22%),linear-gradient(180deg,var(--bg) 0%,var(--bg-soft) 54%,oklch(.965 .018 16) 100%)}button,input,textarea{font:inherit}.app-shell{min-height:100vh;display:grid;grid-template-rows:auto auto 1fr auto;gap:0}.top-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:14px 18px 8px}.back-link{justify-self:start;display:inline-flex;align-items:center;gap:8px;color:var(--text-soft);text-decoration:none;font-size:.92rem}.back-link:hover,.back-link:focus-visible{color:var(--accent-deep)}.brand-block{text-align:center}.brand-eyebrow{margin:0;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft)}.brand-title{margin:2px 0 0;font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.1rem);font-weight:500;color:var(--accent-deep)}.top-actions{justify-self:end;display:flex;gap:8px}.theme-bar{padding:4px 18px 10px;overflow-x:auto}.theme-switcher{display:flex;gap:8px;width:max-content;margin:0 auto;padding:4px}.theme-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);color:var(--text-soft);border-radius:999px;padding:8px 14px;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease)}.theme-chip:hover,.theme-chip:focus-visible{color:var(--accent-deep);border-color:var(--accent-soft)}.theme-chip.is-active{background:linear-gradient(135deg,#ffdee1,#fff1f1);background:linear-gradient(135deg,color(xyz 0.831 0.789 0.806),color(xyz 0.894 0.906 0.948));color:var(--accent-deep);border-color:#e6a3aa;box-shadow:0 8px 20px #9a5d671f}.stage-wrap{display:grid;grid-template-columns:1fr 140px;gap:16px;padding:0 18px 12px;min-height:0}.stage{position:relative;min-height:min(58vh,560px);border:1px solid var(--line);border-radius:28px;background:linear-gradient(180deg,#fffafbe6,#ffedede0);background:linear-gradient(180deg,color(xyz 0.937 0.967 1.045 / 0.902),#ffedede0);box-shadow:var(--shadow-soft);overflow:hidden}.side-rail{display:flex;flex-direction:column;gap:10px}.stat-card{flex:1;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:14px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}.stat-card span{color:var(--text-soft);font-size:.82rem}.stat-card strong{font-family:var(--font-display);font-size:1.35rem;font-weight:500}.theme{height:100%;min-height:min(58vh,560px);display:grid;grid-template-rows:1fr auto;place-items:center;padding:24px 20px 18px}.theme-hint{margin:0;color:var(--text-soft);font-size:.92rem;text-align:center}.wheel-stage{position:relative;width:min(360px,78vw);aspect-ratio:1}.wheel-pointer{position:absolute;top:-4px;left:50%;z-index:2;width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-top:22px solid var(--accent-deep);transform:translate(-50%);filter:drop-shadow(0 4px 6px oklch(.4 .05 8 / .25))}.wheel-disk{width:100%;height:100%;border-radius:50%;border:8px solid oklch(.92 .03 12);box-shadow:inset 0 0 0 6px #fff6f7b3,0 18px 40px #8a4f592e;position:relative}.wheel-label{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:start center;pointer-events:none;transform-origin:center center}.wheel-label>span{display:inline-block;margin-top:18%;max-width:4.5em;font-size:clamp(.7rem,2vw,.85rem);font-weight:700;color:#3d1e24;text-shadow:0 1px 0 oklch(1 0 0 / .35);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lot-cylinder{position:relative;width:min(220px,56vw);height:min(280px,48vh);border-radius:28px 28px 40px 40px;background:linear-gradient(180deg,#cc9874,#976346);box-shadow:0 18px 36px #704b3647;overflow:hidden}.lot-cylinder.is-shaking{animation:shake .18s linear 10}.lot-rim{height:28px;background:linear-gradient(180deg,#e4bba0,#bc8c71);border-bottom:2px solid oklch(.48 .06 50 / .35)}.lot-sticks{position:absolute;top:36px;right:24px;bottom:48px;left:24px;display:flex;justify-content:center;align-items:flex-end}.lot-stick{width:10px;height:78%;margin:0 2px;border-radius:999px;background:linear-gradient(180deg,#f4e6ca,#ceb38d);transform-origin:bottom center;box-shadow:inset -2px 0 #a38a6e59}.lot-cylinder.is-shaking .lot-stick{animation:stick-wiggle .2s ease-in-out infinite alternate}.lot-drawn{position:absolute;left:50%;bottom:18px;transform:translate(-50%,40%) scale(.85);opacity:0;min-width:88px;padding:10px 14px;border-radius:12px;background:#fbf1dc;border:1px solid oklch(.75 .06 70);text-align:center;transition:transform .45s var(--ease),opacity .45s var(--ease)}.lot-drawn.is-up{opacity:1;transform:translate(-50%,-110%) scale(1)}.lot-drawn-text{font-family:var(--font-display);font-size:1.25rem;color:var(--accent-deep)}.petal-field{position:relative;width:min(520px,90%);height:min(360px,48vh)}.petal{position:absolute;display:grid;place-items:center;border-radius:60% 40%;background:radial-gradient(circle at 30% 30%,#ffe7e9,#fa96a3);background:radial-gradient(circle at 30% 30%,color(xyz 0.87 0.844 0.875),#fa96a3);color:#50222c;font-size:.78rem;font-weight:700;box-shadow:0 8px 18px #9a5d672e;transform:rotate(var(--rot)) translateY(0);animation:petal-drift 4.5s var(--ease) infinite alternate;transition:left 1.2s var(--ease),top 1.2s var(--ease),opacity .8s ease,transform 1s var(--ease)}.petal span{max-width:4.2em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.petal-field.is-converging .petal.is-winner{left:50%!important;top:42%!important;transform:translate(-50%,-50%) scale(1.35) rotate(0);z-index:3;animation:none;box-shadow:0 16px 36px #ab506147}.petal-field.is-converging .petal.is-fade{opacity:.18;transform:rotate(var(--rot)) scale(.7)}.blindbox-row{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:flex-end;max-width:640px}.blindbox{width:110px;height:130px;position:relative;perspective:600px}.blindbox-lid{position:absolute;inset:0 0 auto;height:28px;border-radius:12px 12px 4px 4px;background:linear-gradient(180deg,#ef7d83,#be5164);transform-origin:top center;transition:transform .5s var(--ease);z-index:2}.blindbox.is-open .blindbox-lid{transform:rotateX(-108deg) translateY(-6px)}.blindbox-body{position:absolute;top:18px;right:0;bottom:0;left:0;border-radius:10px 10px 16px 16px;background:linear-gradient(180deg,#ffbdbe,#de7d8a);background:linear-gradient(180deg,color(xyz 0.694 0.615 0.565),#de7d8a);display:grid;place-items:center;box-shadow:0 12px 24px #8b4f5738}.blindbox-mark{position:absolute;top:12px;font-family:var(--font-display);font-size:1.4rem;color:#fff6f68c;color:oklch(.98 .02 20 / .55)}.blindbox-name{margin-top:18px;font-family:var(--font-display);font-size:1.15rem;color:var(--accent-deep)}.claw-machine{position:relative;width:min(420px,88%);height:min(360px,50vh);border-radius:22px;background:linear-gradient(180deg,#c9e3ec,#a7ccd2);border:4px solid oklch(.55 .08 30);overflow:hidden;box-shadow:inset 0 0 0 10px #e1f2f859,0 18px 36px #6e4b4533}.claw-rail{position:absolute;top:0;left:0;right:0;height:18px;background:#694e45}.claw-arm{position:absolute;top:10px;width:28px;transform:translate(-50%);transition:left .85s var(--ease);z-index:3}.claw-cable{width:4px;height:36px;margin:0 auto;background:#7c6e69;transition:height .55s var(--ease)}.claw-arm.is-dropping .claw-cable{height:150px}.claw-arm.is-caught .claw-cable{height:72px}.claw-hand{position:relative;width:36px;height:28px;margin:0 auto}.claw-finger{position:absolute;top:0;width:12px;height:28px;border-radius:8px;background:#c59c6d;transition:transform .35s var(--ease)}.claw-finger--l{left:2px;transform:rotate(18deg)}.claw-finger--r{right:2px;transform:rotate(-18deg)}.claw-arm.is-caught .claw-finger--l{transform:rotate(-8deg)}.claw-arm.is-caught .claw-finger--r{transform:rotate(8deg)}.claw-prize{margin-top:4px;padding:6px 8px;border-radius:999px;background:#ffdee1;background:oklch(.93 .05 12);color:var(--accent-deep);font-size:.78rem;font-weight:700;text-align:center;white-space:nowrap;box-shadow:0 6px 14px #8a4f5933}.claw-pit{position:absolute;inset:auto 8% 8% 8%;height:42%}.claw-ball{position:absolute;width:58px;height:58px;transform:translate(-50%);border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 28%,#ffe7e6,#ef7d88);background:radial-gradient(circle at 30% 28%,color(xyz 0.867 0.845 0.847),#ef7d88);color:#411b23;font-size:.72rem;font-weight:700;box-shadow:0 8px 16px #73474a40;transition:opacity .35s ease,transform .35s ease}.claw-ball span{max-width:3.6em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.claw-ball.is-taken{opacity:0;transform:translate(-50%) scale(.4)}.claw-glass{pointer-events:none;position:absolute;top:18px;right:10px;bottom:10px;left:10px;border-radius:12px;background:linear-gradient(135deg,oklch(1 0 0 / .18),transparent 42%)}.bottom-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;padding:12px 18px 22px;background:linear-gradient(180deg,transparent,oklch(.97 .015 12 / .85))}.count-field{display:inline-flex;align-items:center;gap:8px;color:var(--text-soft)}.count-field input{width:64px;padding:8px 10px;border-radius:12px;border:1px solid var(--line);background:var(--surface);text-align:center}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;border:1px solid transparent;padding:10px 16px;cursor:pointer;transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#e9687e,#b64461);color:#fff;box-shadow:0 12px 24px #ab506147}.btn-primary:hover:not(:disabled),.btn-primary:focus-visible:not(:disabled){transform:translateY(-1px)}.btn-draw{min-width:148px;padding:14px 28px;font-size:1.05rem;font-weight:700}.btn-ghost{background:var(--surface);border-color:var(--line);color:var(--text)}.icon-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--surface);cursor:pointer}.toast-error{position:fixed;left:50%;bottom:96px;transform:translate(-50%);margin:0;padding:10px 16px;border-radius:999px;background:#8c3432;color:#fff;z-index:40}.roster-backdrop,.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#2e1c1f59;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:30;opacity:0;pointer-events:none;transition:opacity .2s ease}.roster-backdrop.is-open,.modal-backdrop{opacity:1;pointer-events:auto}.roster-panel{position:fixed;top:0;right:0;width:min(380px,100%);height:100%;z-index:35;background:var(--surface-strong);border-left:1px solid var(--line);padding:18px;transform:translate(104%);transition:transform .28s var(--ease);overflow:auto}.roster-panel.is-open{transform:translate(0)}.roster-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.roster-head h2{margin:0;font-family:var(--font-display);font-size:1.4rem;font-weight:500}.field-label{display:block;margin-bottom:8px;color:var(--text-soft);font-size:.88rem}.roster-textarea{width:100%;resize:vertical;min-height:180px;border-radius:16px;border:1px solid var(--line);padding:12px;background:#fffafb;background:oklch(.99 .008 8);line-height:1.6}.roster-actions{display:flex;gap:8px;margin:12px 0}.check-row{display:flex;align-items:center;gap:8px;margin:8px 0 12px;color:var(--text-soft)}.form-error{color:#ac3031;margin:0 0 10px}.roster-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}.roster-stats div{border:1px solid var(--line);border-radius:14px;padding:10px;text-align:center}.roster-stats strong{display:block;font-family:var(--font-display);font-size:1.3rem}.roster-stats span{color:var(--text-soft);font-size:.78rem}.roster-winners{margin-top:16px;padding-top:12px;border-top:1px dashed var(--line)}.roster-winners h3{margin:0 0 6px;font-size:.95rem}.roster-winners p{margin:0;color:var(--text-soft);line-height:1.6}.result-modal,.history-drawer{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,calc(100vw - 32px));max-height:min(70vh,560px);overflow:auto;z-index:40;background:var(--surface-strong);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:var(--shadow-soft);text-align:center}.history-drawer{text-align:left}.result-eyebrow{margin:0;letter-spacing:.16em;text-transform:uppercase;color:var(--text-soft);font-size:.75rem}.result-title{margin:10px 0 16px;font-family:var(--font-display);font-size:clamp(1.8rem,5vw,2.4rem);font-weight:500;color:var(--accent-deep);line-height:1.25}.result-list{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.result-list li{padding:8px 14px;border-radius:999px;background:#ffe2e5;background:oklch(.94 .04 12);color:var(--accent-deep);font-weight:700}.history-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}.history-list li{padding:12px;border-radius:14px;border:1px solid var(--line);background:#fffafb;background:oklch(.99 .008 8)}.history-meta{display:flex;justify-content:space-between;color:var(--text-soft);font-size:.82rem;margin-bottom:4px}.muted{color:var(--text-soft)}@keyframes shake{0%{transform:translate(0) rotate(0)}25%{transform:translate(-3px) rotate(-1deg)}75%{transform:translate(3px) rotate(1deg)}to{transform:translate(0) rotate(0)}}@keyframes stick-wiggle{0%{transform:rotate(calc(var(--stick, 0deg) - 4deg))}to{transform:rotate(calc(var(--stick, 0deg) + 4deg))}}@keyframes petal-drift{0%{transform:rotate(var(--rot)) translateY(0)}to{transform:rotate(calc(var(--rot) + 12deg)) translateY(10px)}}@media(max-width:860px){.stage-wrap{grid-template-columns:1fr}.side-rail{display:grid;grid-template-columns:repeat(3,1fr)}.stat-card{min-height:76px}.top-bar{grid-template-columns:1fr;justify-items:center;text-align:center}.back-link,.top-actions{justify-self:center}}@media(max-width:560px){.bottom-bar{position:sticky;bottom:0;background:#fff3f5f0;background:oklch(.975 .014 8 / .94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line)}.theme-chip span{display:none}.theme-chip{padding:10px 12px}.stage,.theme{min-height:48vh}}@media(min-width:1100px){.stage,.theme{min-height:min(62vh,620px)}.result-title{font-size:2.6rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.wheel-disk{transition:none!important}}.btn:focus-visible,.theme-chip:focus-visible,.icon-btn:focus-visible,.back-link:focus-visible,.count-field input:focus-visible,.roster-textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}