:root{
  --bg:#031f10;
  --panel:#062b17;
  --gold:#d9a829;
  --gold2:#ffe28a;
  --shadow:#4b2105;
  --text:#f7d772;
}
*{box-sizing:border-box}
html,body{margin:0;font-family:Georgia,'Times New Roman',serif;color:var(--text);background:var(--bg)}
.wheel-page{height:100vh;overflow:hidden;background:radial-gradient(circle at 50% 45%,#0c4623 0%,#062912 42%,#011508 100%)}
.game-shell{position:relative;height:100vh;width:100vw;border:3px solid var(--gold);padding:clamp(8px,1.2vh,16px);display:grid;grid-template-rows:auto minmax(0,1fr) auto auto auto;align-items:center;justify-items:center;gap:.5vh;background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(0,0,0,.2))}
.topbar{width:min(1120px,94vw);display:grid;grid-template-columns:180px 1fr 180px;align-items:center;gap:12px;z-index:4}
h1{margin:0;text-align:center;font-size:clamp(34px,5vw,68px);letter-spacing:.08em;line-height:.95;white-space:nowrap;color:var(--gold2);text-shadow:0 3px 0 #6a3408,0 8px 18px #000}
.ornate-btn,.spin-btn,.config-page button{border:2px solid var(--gold);color:var(--gold2);background:linear-gradient(#07331a,#02180b);font-weight:900;font-family:Georgia,'Times New Roman',serif;text-decoration:none;text-align:center;box-shadow:inset 0 0 0 2px rgba(255,226,138,.12),0 3px 0 #4a2606;cursor:pointer}
.ornate-btn{padding:14px 18px;font-size:20px;clip-path:polygon(9% 0,91% 0,100% 18%,100% 82%,91% 100%,9% 100%,0 82%,0 18%)}
.wheel-stage{position:relative;width:min(68vh,78vw);height:min(68vh,78vw);display:grid;place-items:center;align-self:center;z-index:2}
#wheelCanvas{width:100%;height:100%;display:block;filter:drop-shadow(0 18px 25px rgba(0,0,0,.55));cursor:pointer}
.pointer{position:absolute;top:-1.8%;left:50%;transform:translateX(-50%);z-index:8;width:7.6%;height:14%}
.pointer:before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:46%;height:46%;border-radius:50%;background:radial-gradient(circle,var(--gold2),var(--gold));border:3px solid #9b690f;z-index:2}.pointer span{position:absolute;left:50%;top:11%;transform:translateX(-50%);width:0;height:0;border-left:22px solid transparent;border-right:22px solid transparent;border-top:70px solid var(--gold);filter:drop-shadow(0 3px 2px #000)}
.centre-badge{position:absolute;z-index:7;width:var(--logo-size,32%);aspect-ratio:1/1;border-radius:50%;display:grid;place-items:center;pointer-events:none;filter:drop-shadow(0 5px 8px rgba(0,0,0,.65))}.centre-badge img{width:100%;height:100%;object-fit:contain;border-radius:50%}
.spin-btn{font-size:clamp(20px,2.4vw,34px);padding:10px 42px;clip-path:polygon(8% 0,92% 0,100% 20%,100% 80%,92% 100%,8% 100%,0 80%,0 20%);z-index:3}.hint{margin:0;font-size:clamp(12px,1.3vw,17px);color:#ffd978}.result{height:24px;font-size:clamp(18px,2vw,26px);font-weight:900;text-shadow:0 2px 2px #000}
.corner{position:absolute;width:80px;height:80px;border-color:var(--gold);opacity:.9}.corner-tl{top:12px;left:12px;border-top:4px solid;border-left:4px solid;border-radius:0 0 60px 0}.corner-tr{top:12px;right:12px;border-top:4px solid;border-right:4px solid;border-radius:0 0 0 60px}.corner-bl{bottom:12px;left:12px;border-bottom:4px solid;border-left:4px solid;border-radius:0 60px 0 0}.corner-br{bottom:12px;right:12px;border-bottom:4px solid;border-right:4px solid;border-radius:60px 0 0 0}
.config-page{min-height:100vh;overflow-y:auto;overflow-x:hidden;background:radial-gradient(circle at top,#0e4b27,#031b0d 65%,#010d06);padding:28px}.config-shell{max-width:1120px;margin:0 auto;padding-bottom:60px}.config-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.config-header h1{text-align:left;font-size:clamp(32px,5vw,58px)}.eyebrow{margin:0 0 4px;text-transform:uppercase;letter-spacing:.16em;color:var(--gold)}.panel{background:rgba(3,28,13,.86);border:2px solid var(--gold);box-shadow:0 10px 30px rgba(0,0,0,.3),inset 0 0 0 2px rgba(255,226,138,.08);padding:22px;margin:18px 0;border-radius:8px}.panel h2{margin:0 0 12px;color:var(--gold2);font-size:28px}.muted{color:#d3bd77;margin:6px 0 12px;line-height:1.4}.grid-two{display:grid;grid-template-columns:1fr 1fr;gap:22px}label{display:block;margin:14px 0;font-size:18px;font-weight:700}input,textarea,select{width:100%;margin-top:7px;padding:12px;border:1px solid #bd8f26;background:#02130a;color:#ffe8a3;border-radius:4px;font:16px Arial,sans-serif}textarea{resize:vertical;min-height:230px} select{appearance:auto}.check-label{display:flex;align-items:center;gap:10px}.check-label input{width:auto;margin:0;transform:scale(1.2)}.confetti-canvas{position:fixed;inset:0;z-index:45;pointer-events:none}.inline-actions{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}.config-page button{padding:12px 18px;font-size:17px;border-radius:4px}.primary{background:linear-gradient(#b88418,#684009)!important;color:#fff1b5!important}.actions-panel{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.save-status{font-size:18px;color:#fff1b5}
@media(max-width:760px){.topbar{grid-template-columns:1fr 1fr}.topbar h1{grid-column:1/-1;grid-row:1}.wheel-stage{width:min(68vh,96vw);height:min(68vh,96vw)}.ornate-btn{font-size:15px;padding:10px}.grid-two,.inline-actions{grid-template-columns:1fr}.config-header{display:block}.config-header .ornate-btn{display:inline-block;margin-top:16px}}

.modal-backdrop{position:fixed;inset:0;z-index:30;display:none;place-items:center;background:rgba(0,0,0,.68);padding:24px}.modal-backdrop.is-open{display:grid}.result-modal{position:relative;width:min(560px,92vw);border:3px solid var(--gold);background:radial-gradient(circle at top,#114c28,#03190c 72%,#010904);box-shadow:0 24px 70px rgba(0,0,0,.75),inset 0 0 0 3px rgba(255,226,138,.1);padding:42px 34px 34px;text-align:center;color:var(--text);clip-path:polygon(5% 0,95% 0,100% 8%,100% 92%,95% 100%,5% 100%,0 92%,0 8%)}.result-modal:before{content:"";position:absolute;inset:12px;border:1px solid rgba(217,168,41,.78);pointer-events:none}.modal-kicker{margin:0 0 10px;text-transform:uppercase;letter-spacing:.18em;color:var(--gold2);font-size:clamp(14px,1.8vw,20px);font-weight:900}.result-modal h2{margin:0 0 26px;font-size:clamp(34px,6vw,66px);line-height:.98;color:var(--gold2);text-shadow:0 3px 0 #5b2a05,0 8px 18px #000;text-transform:uppercase}.modal-close{position:absolute;top:10px;right:14px;z-index:2;border:0;background:transparent;color:var(--gold2);font-size:36px;line-height:1;cursor:pointer;text-shadow:0 2px 2px #000}.modal-spin{font-size:clamp(18px,2.4vw,28px);padding:10px 34px}