*{box-sizing:border-box}body{margin:0;background:#e7eaef;color:#253246;font-family:'Segoe UI','Microsoft YaHei',sans-serif}header{max-width:1760px;margin:auto;padding:32px 28px 24px}h1{font-size:26px;margin:0 0 10px}header p{margin:0;color:#5a687c;font-size:14px;line-height:1.8}.tools{display:flex;gap:12px;align-items:center;margin-top:18px;font-size:14px}select{padding:8px 16px;border:1px solid #b2bdc9;background:white;border-radius:5px}.options{max-width:1760px;margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;padding:0 24px 30px}.design{overflow:hidden;position:relative;text-align:center;padding:28px 18px 24px;--serif:Georgia,'Times New Roman',serif}.a{background:#11243c;color:#f7e5ba;--accent:#e3c17d;--ink:#f7e5ba;--muted:#bdc7d5;--button:#ecd29a;--buttonText:#16263a}.b{background:#eff7f2;color:#155243;--accent:#a08142;--ink:#155243;--muted:#698278;--button:#155243;--buttonText:#fff8e9}.c{background:#620f30;color:#fff0db;--accent:#ffdcaa;--ink:#fff0db;--muted:#e4b8c4;--button:#fff0db;--buttonText:#710d32}.style-name{font-size:13px;font-weight:600;color:var(--muted);margin:0 0 12px}.design h2{font:400 clamp(27px,2.4vw,38px)/1.15 var(--serif);letter-spacing:-.035em;margin:0 0 10px}.intro{font-size:12px;color:var(--muted);margin:0 0 15px}.stage{position:relative;width:100%;aspect-ratio:1;margin:12px auto 0;max-width:620px;filter:drop-shadow(0 14px 14px #0002)}.rotor{width:100%;height:100%;transition:transform 4.4s cubic-bezier(.12,.7,.1,1);transform-origin:50% 50%}.rotor svg{display:block;width:100%;height:100%;overflow:visible}.pointer{position:absolute;left:50%;top:0;transform:translateX(-50%);width:9%;height:14%;z-index:3;filter:drop-shadow(0 3px 2px #0006)}.hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:21%;aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:2}.hub svg{width:42%;height:42%}.hub span{font-size:clamp(7px,.7vw,11px);margin-top:4px;letter-spacing:.1em}.a .hub{background:linear-gradient(145deg,#fbebbd,#b28337 38%,#f4d79a 65%,#8f652b);color:#233247;border:4px solid #f1d8a3;box-shadow:0 0 0 4px #15283e,0 0 0 5px #b79256,inset 0 0 0 7px #d9b66e}.b .hub{background:#155243;color:#fff8e8;border:6px solid #f8faf3;box-shadow:0 0 0 2px #b09a65}.c .hub{background:#fff2db;color:#7b183d;border:4px solid #f1bf88;box-shadow:0 0 0 4px #8b2547,0 0 0 6px #e3b485}.spin{display:block;width:72%;max-width:300px;margin:23px auto 14px;padding:16px 18px;border:0;font-size:16px;font-weight:700;letter-spacing:.06em;color:var(--buttonText);background:var(--button);cursor:pointer;min-height:54px}.a .spin{background:linear-gradient(110deg,#b58b48,#f8e7ba 45%,#d2ac65);border:1px solid #f1d6a0;border-radius:5px;box-shadow:0 4px 0 #86632e}.b .spin{border-radius:30px;box-shadow:0 4px 0 #0b392e}.c .spin{border-radius:6px;box-shadow:0 4px 0 #d3a67c}.spin:disabled{opacity:.65;cursor:wait}.caption{font-size:12px;line-height:1.7;margin:0 auto;color:var(--muted);max-width:350px;min-height:40px}.result{font-size:13px;color:var(--ink);margin:12px 0 0;min-height:22px}.fine{max-width:1710px;padding:0 24px 25px;margin:auto;font-size:13px;color:#5a687c;line-height:1.8}.prize-upright{transform-origin:0 0;transition:transform 4.4s cubic-bezier(.12,.7,.1,1)}.prize-copy{font-family:'Segoe UI',Arial,sans-serif;font-weight:700}.prize-sub{font-family:'Segoe UI',Arial,sans-serif;font-weight:500}button:focus-visible,select:focus-visible{outline:3px solid #5894e0;outline-offset:5px}
@media(max-width:1050px){.options{grid-template-columns:1fr;max-width:640px}.design h2{font-size:36px}.hub span{font-size:10px}header,.fine{max-width:640px}.design{padding:28px 20px}.options{padding:0 14px 24px}.spin{font-size:17px}}
@media(prefers-reduced-motion:reduce){.rotor,.prize-upright{transition-duration:.01s}}

/* Material layers stay fixed; only the inner prize plate turns. */
.design{isolation:isolate}.design::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 24% 15%,#fff1 0,transparent 60%)}
.a{background:radial-gradient(ellipse at 25% 8%,#284362,#10233a 64%)}.b{background:radial-gradient(ellipse at 20% 8%,#fffef6,#e9f3ee 75%)}.c{background:radial-gradient(ellipse at 25% 8%,#983457,#590c2b 78%)}
.stage{filter:none;isolation:isolate;margin-top:23px}.stage::before{content:"";position:absolute;left:9%;right:9%;bottom:-3%;height:13%;background:radial-gradient(ellipse,#0008,transparent 68%);filter:blur(12px);z-index:-1}.b .stage::before{opacity:.45}
.fixed-rim{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 10px 0 #060e1899) drop-shadow(0 18px 15px #0005);pointer-events:none}
.rotor{position:relative;z-index:1;transition:none!important;will-change:transform}.prize-upright{transition:none!important;will-change:transform}
.stage::after{content:"";position:absolute;inset:7.1%;border-radius:50%;z-index:1;pointer-events:none;background:linear-gradient(130deg,#fff2,transparent 35%,transparent 60%,#0002);box-shadow:inset 0 5px 14px #0006,inset 0 -2px 5px #fff4}
.hub{z-index:3;filter:drop-shadow(0 7px 5px #0006)}.hub::before{content:"";position:absolute;inset:7%;border:1px solid #fff7;border-radius:50%;pointer-events:none}.hub::after{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,#fff7,transparent 35%,transparent 65%,#0003);pointer-events:none}
.a .hub{box-shadow:0 0 0 3px #0d1d30,0 0 0 5px #ad8240,inset 0 2px 5px #fff9,inset 0 -4px 7px #61431e99}
.b .hub{background:radial-gradient(circle at 30% 15%,#368773,#155243 60%,#103d32);box-shadow:0 0 0 2px #aa935a,inset 0 3px 6px #ffffff40,inset 0 -4px 8px #062c27}
.c .hub{background:radial-gradient(circle at 25% 15%,#fffdf4,#ffebc7 60%,#dfb582);box-shadow:0 0 0 3px #75112f,0 0 0 6px #c28d59,inset 0 2px 3px #fff}
.pointer{z-index:5;transform-origin:50% 12%;filter:drop-shadow(0 5px 3px #0007)}
.led-halo{opacity:.28;transition:opacity .12s}.led-hot .led-halo{opacity:.9}.led-hot .led-core{fill:#fffdf1;filter:drop-shadow(0 0 4px #ffe19b)}
.spinning .hub{filter:drop-shadow(0 7px 5px #0006) drop-shadow(0 0 12px #e8c67c55)}
.spin{position:relative;overflow:hidden;transition:transform .16s,filter .2s,box-shadow .2s}.spin:hover:not(:disabled){filter:brightness(1.07);transform:translateY(-2px)}.spin:active:not(:disabled){transform:translateY(3px);box-shadow:none}.spin::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 25%,#fff4 45%,transparent 65%);transform:translateX(-130%)}.spinning .spin::after{animation:button-light 1.5s linear infinite}
.result{transition:opacity .25s,transform .25s}.spinning .result{opacity:.6}.landed .result{animation:result-in .35s ease-out}.landed .hub{animation:hub-win .8s ease-in-out 2}
.sector-hit{--hit-fill:#cbe4ff;--hit-flash:#f2f9ff;--hit-edge:#37699e;fill:var(--hit-fill);stroke:var(--hit-edge);stroke-width:5;animation:sector-hit .46s ease-in-out 2}
.sector-hit.sector-win{--hit-fill:#ffe29a;--hit-flash:#fff9dc;--hit-edge:#b98223}
@keyframes button-light{to{transform:translateX(130%)}}@keyframes result-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes hub-win{50%{filter:drop-shadow(0 7px 5px #0006) drop-shadow(0 0 18px #ffe6a0)}}@keyframes sector-hit{50%{fill:var(--hit-flash);stroke-width:9;filter:brightness(1.16)}}
@media(prefers-reduced-motion:reduce){.spin,.result,.led-halo{transition:none!important}.spinning .spin::after,.landed .result,.landed .hub,.sector-hit{animation:none!important}}

body{background:#e5e9e1;color:#284c3b}header{max-width:820px;padding:32px 28px 18px}header h1{font-size:22px;font-weight:500}header p{color:#617264}.tools{font-size:12px}.options{display:block;max-width:820px;padding:0 24px 40px}.design.b{background:radial-gradient(ellipse at 18% 3%,#fffff7 0,#f3f1e4 45%,#e1e8db 100%);padding:40px 28px 36px;border:1px solid #c9d1bc;box-shadow:0 20px 60px #46563a14;border-radius:14px;isolation:isolate}.design.b::before{background:repeating-linear-gradient(115deg,#fff0 0px,#fff0 2px,#fff2 2px,#fff2 3px);opacity:.3}.style-name{font-family:Georgia,serif;font-size:16px;color:#829078!important;letter-spacing:.08em;margin:0 0 16px}.design h2{font-family:Georgia,serif;font-size:43px;font-weight:400;color:#234b38;letter-spacing:-.035em;margin:0 0 13px}.intro{font-size:13px;color:#71816b;margin-bottom:25px}.stage{width:100%;max-width:650px;margin:0 auto}.stage::before{bottom:-2%;left:7%;right:0;height:12%;filter:blur(13px);background:radial-gradient(ellipse,#24352280,transparent 67%)}.fixed-rim{filter:drop-shadow(0 9px 0 #253b2bd9) drop-shadow(5px 18px 12px #233b2e45)}.stage::after{box-shadow:inset 0 5px 12px #354e3566,inset 0 -1px 3px #fff7;background:linear-gradient(132deg,#fff3,transparent 37%,transparent 67%,#30432c13)}.b .hub{width:20.5%;background:radial-gradient(circle at 28% 16%,#58846b,#234f3b 55%,#153527 100%);color:#eed9a6;border:5px solid #dbc594;box-shadow:0 0 0 2px #526348,0 0 0 4px #eee0b8,inset 0 1px 2px #ffffff99,inset 0 -5px 9px #071b15a6;filter:drop-shadow(2px 6px 4px #122d1d66)}.hub::before{inset:7%;border:1px solid #e9d4a46e}.hub::after{inset:11%;background:linear-gradient(125deg,#ffffff22,transparent 38%,transparent 60%,#00120826);border:1px solid #a9b78d26}.hub svg{width:43%;height:43%;margin-top:5px}.hub span{font-family:Georgia,serif;font-size:9px;letter-spacing:.15em;margin-top:-1px}.led-halo{opacity:.2}.led-hot .led-halo{opacity:.55}.led-hot .led-core{filter:drop-shadow(0 0 2px #fff0c0)}.pointer{width:8%;height:13%;top:-.3%;filter:drop-shadow(2px 5px 2px #27341b66)}.b .spin{background:linear-gradient(115deg,#46765b 0,#2a5740 36%,#173f2d 100%);color:#f5e8c6;border:1px solid #607c55;border-top-color:#a9bc85;border-radius:9px;width:72%;max-width:340px;min-height:59px;margin-top:34px;box-shadow:0 4px 0 #163723,0 8px 18px #243c2426,inset 0 1px 1px #e4f6bf59;font:600 17px/1.3 'Segoe UI',sans-serif;letter-spacing:.04em}.caption{font-size:12px;color:#7a856d;line-height:1.8}.result{font-size:12px;color:#7a856d;margin-top:16px}.prize-copy{font-family:'Segoe UI',Arial,sans-serif;font-weight:600}.prize-sub{font-weight:400;letter-spacing:.02em}.fine{max-width:800px;font-size:12px;color:#71816b}.design.b .hub::after{pointer-events:none}
@media(max-width:650px){header{padding:22px 18px 14px}header h1{font-size:20px}.options{padding:0 10px 24px}.design.b{padding:30px 8px 27px;border-radius:10px}.design h2{font-size:30px}.intro{font-size:12px;margin-bottom:21px}.style-name{font-size:14px;margin-bottom:12px}.hub span{font-size:6px;letter-spacing:.08em}.hub svg{margin-top:2px}.b .hub{border-width:3px;box-shadow:0 0 0 1px #526348,0 0 0 2px #eee0b8,inset 0 1px 2px #fff7,inset 0 -4px 7px #071b15a6}.b .spin{margin-top:25px;width:77%;min-height:53px;font-size:16px}.result{margin-top:12px}}

body{background:#e7edf5;color:#183e78}header h1{color:#244b80}header p,.tools,.fine{color:#62799c}.design.b{background:radial-gradient(ellipse at 18% 2%,#fffef4,#f1f5fb 55%,#dde7f4);border-color:#c4d2e4;box-shadow:0 20px 65px #1b3e6b1a}.design.b::before{background:repeating-linear-gradient(115deg,#fff0 0px,#fff0 2px,#fff2 2px,#fff2 3px)}.style-name{color:#a28a46!important}.design h2{color:#193f7b}.intro,.caption,.result{color:#6c7e9b}.b .hub{background:radial-gradient(circle at 28% 16%,#5f86c0,#284f91 55%,#15336a 100%);color:#ffedb7;border-color:#e7ce89;box-shadow:0 0 0 2px #4f6490,0 0 0 4px #fff2c5,inset 0 1px 2px #ffffff99,inset 0 -5px 9px #071b44a6;filter:drop-shadow(2px 6px 4px #152c5766)}.b .spin{background:linear-gradient(110deg,#fff1b4,#f2cf63 55%,#d8ad3e);color:#20447b;border:1px solid #c3a14b;border-top-color:#fff8d7;box-shadow:0 4px 0 #b59137,0 9px 20px #20447924,inset 0 1px 2px #fff9}.fixed-rim{filter:drop-shadow(0 9px 0 #122d5bd9) drop-shadow(5px 18px 12px #1738693d)}.stage::before{background:radial-gradient(ellipse,#1c376f6e,transparent 67%)}
.ambient{position:absolute;inset:-4%;border-radius:50%;z-index:-1;pointer-events:none;background:radial-gradient(circle,transparent 61%,#ffe8a326 68%,#efce734a 71%,#86a9ed21 75%,transparent 79%);filter:blur(6px);animation:ambient-breath 3.2s ease-in-out infinite}
.design:not(.spinning) .lamp .led-halo{fill:#ffe7a2;animation:lamp-breath 3.2s ease-in-out infinite;animation-delay:var(--phase,0s)}
.design:not(.spinning) .lamp .led-core{fill:#fff8d8;filter:drop-shadow(0 0 2px #fff0b9);animation:core-breath 3.2s ease-in-out infinite;animation-delay:var(--phase,0s)}
.spinning .ambient{animation:none;opacity:.35}.spinning .led-halo,.spinning .led-core{animation:none}.hub::before{animation:hub-breath 3.2s ease-in-out infinite}.spinning .hub::before{animation:none;opacity:.8}
@keyframes lamp-breath{0%,100%{opacity:.035}48%{opacity:.92}62%{opacity:.82}}@keyframes core-breath{0%,100%{opacity:.38}48%{opacity:1}62%{opacity:.95}}@keyframes ambient-breath{0%,100%{opacity:.12}50%{opacity:.9}}@keyframes hub-breath{0%,100%{opacity:.35}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.design:not(.spinning) .lamp .led-halo,.design:not(.spinning) .lamp .led-core,.ambient,.hub::before{animation:none!important}.design:not(.spinning) .lamp .led-halo{opacity:.35}.design:not(.spinning) .lamp .led-core{opacity:1}}

/* PHP application integration: account, login, history and accessible result dialogs. */
[hidden]{display:none!important}body{padding:0}.fifth-header{display:flex;align-items:center;max-width:none;width:100%;margin:0;padding:14px 24px;background:#1d427b;border-bottom:2px solid #dec47e}.fifth-logo{height:35px;max-width:200px;width:auto}.demo{width:min(780px,calc(100% - 24px));margin:24px auto 40px;text-align:center}.demo>.heading{font:400 34px Georgia,serif;color:#244b80;margin:0 0 12px}.demo>.sub{font-size:14px;color:#62799c;margin:0 0 22px}.demo:has(#amalfiMount)>.heading,.demo:has(#amalfiMount)>.sub{display:none}.account{font-size:13px;line-height:1.8;padding:10px 0 16px;color:#536f98}.account a{color:#204479;margin-left:12px;text-underline-offset:3px}.options{max-width:none;margin:0;padding:0;display:block}.design .result{display:none}.hub span{font-size:9px}.note{max-width:640px;font-size:12px;line-height:1.8;color:#62799c;margin:18px auto}.fifth-history{max-width:650px;margin:30px auto;padding:20px 0;border-top:2px solid #d9bd6d;text-align:left}.fifth-history-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}.fifth-history-head h2{font:400 25px Georgia,serif;margin:0;color:#244b80}.fifth-history-head span{font-size:12px;color:#62799c}.fifth-history-scroll{max-height:360px;overflow:auto;color:#62799c}.fifth-history-row{padding:16px 2px;border-bottom:1px solid #cad5e5;display:flex;justify-content:space-between;align-items:center;gap:12px}.fifth-history-row strong{color:#204479;font-size:14px}.fifth-history-meta{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px 12px;font-size:11px;color:#62799c}.login{max-width:420px;margin:0 auto;display:grid;gap:16px;padding:28px;text-align:left;border:1px solid #c4d2e4;border-top:3px solid #d9bd6d;border-radius:12px;background:#ffffffbd;box-shadow:0 14px 40px #26476f12}.login-head h2{font:400 27px Georgia,serif;margin:0 0 12px;color:#244b80}.login-head p{font-size:14px;line-height:1.7;color:#62799c;margin:0}.login-kicker{display:none}.login input{padding:14px;font-size:16px;color:#204479}.login label{font-size:14px}.login button{padding:16px;border:1px solid #c7a653;border-radius:7px;background:linear-gradient(110deg,#fff1b4,#f2cf63);color:#204479;font-weight:700;font-size:15px;cursor:pointer}.fifth-login-brand{margin:0 auto 20px;background:#1d427b;max-width:420px;padding:16px;border-radius:10px}.fifth-login-logo{width:185px;height:40px;object-fit:contain}.overlay{position:fixed;inset:0;z-index:100;background:#12294dc9;display:grid;place-items:center;padding:20px}.modal{position:relative;width:min(440px,100%);padding:38px 26px 28px;background:linear-gradient(140deg,#fffef7,#f0f4fa);color:#244b80;border:1px solid #dec47e;border-top:5px solid #dec47e;border-radius:14px;text-align:center;box-shadow:0 20px 70px #0005}.modal h2{font:400 30px Georgia,serif;margin:0 0 18px}.modal p{line-height:1.7}.modal a{display:block;background:#244b80;color:#fff5d4;padding:14px;border-radius:7px;text-decoration:none;margin-top:20px}.modal #closeResult{position:absolute;right:10px;top:10px;background:transparent;border:0;color:#244b80;width:32px;height:32px;cursor:pointer;font-size:26px}.draw-notice{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(410px,calc(100% - 28px));z-index:150;background:#fffdf4;border:1px solid #dec47e;box-shadow:0 20px 90px #12294d66;border-radius:12px;padding:22px;display:flex;gap:12px;color:#244b80}.draw-notice-icon{border:1px solid #bb9950;border-radius:50%;width:28px;height:28px;flex-shrink:0;display:grid;place-items:center}.draw-notice-copy{display:grid;gap:8px;font-size:14px;line-height:1.7}.draw-notice-copy strong{font-size:18px}.draw-notice-assistant{display:block;padding:12px;background:#244b80;color:#fff5d4;border-radius:6px;text-decoration:none;text-align:center;margin-top:8px}#drawNoticeClose{border:0;background:transparent;color:#244b80;font-size:25px;cursor:pointer;align-self:flex-start}.spin:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #bc8c21;outline-offset:4px}
@media(max-width:650px){.demo{width:calc(100% - 20px);margin-top:12px}.fifth-header{padding:12px 18px}.fifth-logo{height:29px}.account{font-size:11px;padding-bottom:13px}.design.b{padding-top:27px}.hub span{font-size:6px}.fifth-history-row{align-items:flex-start;flex-direction:column;gap:7px}.fifth-history-meta{justify-content:flex-start}.fifth-history-head h2{font-size:23px}.fifth-history-head span{font-size:11px}.login{padding:24px 20px}.note{padding:0 6px;font-size:11px}}