*{box-sizing:border-box}body{margin:0;background:#07101c;color:#f5e5be;font-family:Georgia,serif;min-height:100svh;background-image:linear-gradient(#03101c55,#03101c88),url('../../assets/bruxas-do-eclipse/cenario.png');background-size:cover;background-position:center;background-attachment:fixed}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit;border:1px solid #9b8152;background:#102534;border-radius:6px;padding:10px 14px}button:hover{background:#214253}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #64e8ff;outline-offset:4px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 24px;background:#03101ce8;font:11px Arial,sans-serif;border-bottom:1px solid #a58b4d55}.topbar a{color:#eee;text-decoration:none;font-weight:bold;letter-spacing:2px}.topbar a span{display:block;font-size:8px;margin-top:4px;color:#d6aa65}.topbar>div{display:flex;gap:6px}.topbar button{padding:8px 10px;font:11px Arial}.demo-tag{letter-spacing:2px;color:#c7b78e}.stage{max-width:1120px;margin:auto;padding:0 32px 20px}.title{height:170px;display:flex;justify-content:center;position:relative;z-index:1;margin-bottom:-10px;pointer-events:none}.title img{height:100%;width:auto;object-fit:contain}.machine{background:#071323ed;border:3px solid #b09661;border-radius:22px;padding:8px 16px 10px;box-shadow:0 0 0 6px #101823,0 0 0 8px #554d40,0 30px 80px #000c}.ornament{text-align:center;font-size:27px;color:#dab668;display:flex;align-items:center;justify-content:space-between;padding:0 5px 5px}.ornament span{font:9px Arial;letter-spacing:5px;color:#b9a57e}.reels{display:grid;grid-template-columns:repeat(5,1fr);overflow:hidden;border:1px solid #a88d5b;border-radius:12px;background:#061222}.reel{display:grid;grid-template-rows:repeat(3,1fr);border-right:1px solid #b499625e}.reel:last-child{border:0}.cell{position:relative;aspect-ratio:1.2;min-width:0;border-bottom:1px solid #72819015;padding:5%;transition:filter .2s}.symbol{width:100%;height:100%;background-image:url('../../assets/bruxas-do-eclipse/simbolos-10.png');background-size:500% 200%;background-repeat:no-repeat}.cell.winner{box-shadow:inset 0 0 0 3px #fbc767,inset 0 0 30px #ef9d3055;background:#b373202a;z-index:1;animation:glow 1s ease-in-out infinite alternate}.cell.scatter{box-shadow:inset 0 0 0 3px #6fdbff}.reels.has-win .cell:not(.winner):not(.scatter){filter:brightness(.45)}.reel.moving .symbol{filter:blur(3px);transform:translateY(3px)}@keyframes glow{to{box-shadow:inset 0 0 0 3px #fff1bc,inset 0 0 45px #f5a82499}}.message{min-height:45px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:16px;padding:8px;color:#f4d58e}.console{display:grid;grid-template-columns:1fr 1.1fr 1fr 110px;align-items:center;gap:12px;border-top:1px solid #a58b4d66;padding-top:12px}.meter,.bet{text-align:center}.meter>span,.bet>span{display:block;font:9px Arial;letter-spacing:2px;color:#c7b78e;margin-bottom:5px}.meter strong,.bet strong{font-size:26px;font-weight:normal;font-variant-numeric:tabular-nums}.bet>div{display:flex;align-items:center;justify-content:center;gap:16px}.bet button{padding:3px 12px;font-size:23px}.spin{border:2px solid #e8c574;background:radial-gradient(circle,#14748b,#082d42);border-radius:50%;width:96px;height:96px;box-shadow:0 0 0 4px #645337,0 0 24px #5fcdfb22;display:flex;align-items:center;justify-content:center;flex-direction:column}.spin span{font-size:48px;line-height:.9;color:#e3fcff}.spin b{font:10px Arial;letter-spacing:2px;margin-top:7px}.bottom{display:flex;justify-content:space-between;align-items:center;margin-top:7px;font:9px Arial;letter-spacing:1px;color:#bfae8c}.bottom button{font:10px Arial;border:0;background:none;padding:8px}.disclaimer{text-align:center;font:11px/1.6 Arial;color:#c5c8ce;margin:20px 0 0}.loading{position:fixed;inset:0;background:#07101c;z-index:10;display:flex;align-items:center;justify-content:center;flex-direction:column;letter-spacing:3px}.loading p{font:14px Arial;letter-spacing:0;color:#bdcdd7}.loading[hidden]{display:none}dialog{background:#0c1e2c;color:#eee1c4;border:1px solid #b99b60;border-radius:15px;max-width:760px;width:92%;max-height:85svh;padding:30px}dialog::backdrop{background:#000b}dialog h1{font-size:30px}dialog h2{font-size:22px;margin-top:28px}dialog p{font:14px/1.8 Arial;color:#d0d7db}.eyebrow{letter-spacing:3px;color:#d9b56f!important}.close{float:right;font-size:24px;padding:2px 10px}table{width:100%;border-collapse:collapse;font:13px Arial}td,th{text-align:left;padding:10px;border-bottom:1px solid #ffffff1a}.paylines{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.payline{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}.payline i{height:8px;background:#ffffff15}.payline i.on{background:#dbb970}.payline span{grid-column:1/-1;font:10px Arial}.fine{font-size:11px!important}.bonus-mode .machine{border-color:#72d9ee}.bonus-mode #bonus{color:#85eeff}@media(max-width:650px){.topbar{padding:10px 12px;flex-wrap:wrap}.demo-tag{font-size:8px;letter-spacing:1px}.topbar>div{margin-left:auto}.stage{padding:0 12px 15px}.title{height:135px}.machine{padding:5px 5px 8px;border-radius:12px}.ornament span{font-size:7px;letter-spacing:2px}.cell{aspect-ratio:.9;padding:2%}.message{font-size:12px;min-height:46px}.console{grid-template-columns:1fr 1.2fr 1fr 66px;gap:5px}.meter strong,.bet strong{font-size:18px}.meter>span,.bet>span{font-size:7px;letter-spacing:.6px}.bet>div{gap:5px}.bet button{padding:3px 8px;font-size:18px}.spin{width:58px;height:58px}.spin span{font-size:30px}.spin b{font-size:7px}.bottom{font-size:7px}.paylines{grid-template-columns:repeat(4,1fr)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.stage{max-width:980px}.title{height:140px}.cell{display:flex;align-items:center;justify-content:center;aspect-ratio:1.35;padding:4%}.symbol{width:100%;height:auto;aspect-ratio:1;clip-path:inset(2.5%)}
@media(min-width:651px) and (max-height:850px){.stage{max-width:850px}.title{height:105px}.console{padding-top:7px}.spin{height:72px;width:72px}.spin span{font-size:36px}.message{min-height:35px}}
@media(max-width:650px){.title{height:120px}.cell{aspect-ratio:1;padding:2%}.symbol{clip-path:inset(3%)}}

/* Reel presentation v2 */
.reel-stage{position:relative}.reel{position:relative;overflow:hidden}.spinning>.cell{visibility:hidden}.spin-strip{position:absolute;top:0;left:0;width:100%;z-index:2;background:#061222;will-change:transform}.spin-strip .cell{width:100%;flex-shrink:0}.spin-strip .symbol{filter:blur(.6px)}.line-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}.line-overlay polyline{fill:none;stroke:#ffe4a0;stroke-width:2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 4px #ff8a00)}#line-prize{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:4;background:#05121de8;border:1px solid #ddac56;padding:7px 22px;border-radius:8px;font-size:32px;color:#ffe49e;text-shadow:0 2px 10px #000;pointer-events:none}#line-caption{text-align:center;font:9px Arial;letter-spacing:2px;color:#e7c48c;height:19px;padding-top:6px}.cell.winner{background:#cf9a2530}.cell.winner .symbol{animation:prize-breathe 1.3s ease-in-out infinite alternate}@keyframes prize-breathe{to{transform:scale(1.05);filter:brightness(1.15)}}#bonus-modal{text-align:center;padding:40px 28px;max-width:520px;background:radial-gradient(ellipse at top,#1c5365,#071322 70%);border:2px solid #b89659}#bonus-modal h2{font-size:34px;color:#ffe2a4}#bonus-modal button{padding:14px 35px;margin-top:15px;border-color:#e6c17a}.bonus-eclipse{font-size:80px;color:#efca81;text-shadow:0 0 30px #e9982e}.topbar button[aria-pressed=true]{background:#185065;border-color:#6bcce3}@media(max-width:650px){#line-prize{font-size:22px;padding:5px 14px}.topbar>div{flex-wrap:wrap}.topbar button{font-size:10px;padding:8px}#line-caption{font-size:7px;height:17px}}

.locked-overlay{position:absolute;left:0;width:100%;z-index:5;background:#071322;visibility:visible!important;box-shadow:inset 0 0 0 2px #82e6ff,inset 0 0 30px #54ddff33}.locked-overlay:after{content:"TRAVADO";position:absolute;bottom:1px;left:0;right:0;text-align:center;color:#bdf2ff;font:7px Arial;letter-spacing:1px}.locked-overlay .symbol{filter:none}

.reels{align-items:end;aspect-ratio:2.05;grid-template-rows:100%}.reel{min-height:0}.reel .cell{aspect-ratio:auto;min-height:0;padding:3%;overflow:hidden}.reel .cell>.symbol{height:100%;width:auto;max-width:100%;aspect-ratio:1}.expanding{animation:expansion-flash .65s ease-out}@keyframes expansion-flash{50%{box-shadow:inset 0 0 45px #71cce577}}@media(max-width:650px){.reels{aspect-ratio:1.5}.reel .cell{padding:2%}}

#golden-progress{text-align:center;padding:8px 5px 2px;color:#f8d883;font:10px Arial;letter-spacing:1.5px}.golden-mode .machine{border-color:#ffd77b;box-shadow:0 0 0 6px #322716,0 0 0 8px #b68c43,0 0 50px #d9a73744}.golden-mode .spin{background:radial-gradient(circle,#967226,#3b2b10)}.golden-mode #bonus{color:#ffe099}.golden-mode #bonus-modal{background:radial-gradient(ellipse at top,#624d22,#171309 70%)}@media(max-width:650px){#golden-progress{font-size:8px;letter-spacing:.7px}}

/* Bonus feedback: neutral unrevealed cells never imply a scatter award. */
.cell.unrevealed{background:radial-gradient(ellipse,#b9954920,transparent 70%)}.cell.unrevealed .symbol{background-image:none;border:1px solid #b9954955;border-radius:50%;height:45%;aspect-ratio:1;box-shadow:0 0 12px #dab65a18}.golden-earned{animation:golden-earned 1.2s ease-out}@keyframes golden-earned{35%{color:#fff7d7;text-shadow:0 0 16px #ffd56b;transform:scale(1.05)}}
@media(max-width:650px){#bonus-modal{padding:24px 18px}#bonus-modal h2{font-size:27px}.bonus-eclipse{font-size:56px}.topbar button{min-height:40px}.message{overflow-wrap:anywhere}.bottom{gap:6px}}

/* Visual guide v8 */
#rules{padding:24px;scrollbar-gutter:stable}.guide-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.guide-header h1{margin:6px 0 18px}.guide-header .eyebrow{font-size:10px;margin:0}.guide-header .close{min-width:44px;min-height:44px;float:none;align-self:flex-start}.guide-nav{display:flex;gap:8px;border-bottom:1px solid #b99b6044;padding-bottom:14px}.guide-nav button{flex:1;font:13px Arial;min-height:44px;padding:8px}.guide-nav button[aria-pressed=true]{background:#b99b6029;border-color:#f1cf89;color:#ffe2a4;box-shadow:inset 0 -3px #e6bf76}#guide-stake{padding:12px;background:#e6bf7612;border-left:2px solid #d5ad69;color:#ffe2a4}.guide-note{font-size:12px!important}.symbol-paytable th,.symbol-paytable td{padding:8px 6px}.symbol-paytable td{font-variant-numeric:tabular-nums;color:#ffe2a4;white-space:nowrap}.symbol-paytable th{font-weight:normal}.symbol-paytable thead{color:#b9c9d5}.symbol-label{display:flex;align-items:center;gap:10px}.guide-icon,#guide-scatter{width:58px;height:58px;flex-shrink:0}.guide-icon .symbol,#guide-scatter .symbol{width:100%;height:100%}.scatter-guide{display:flex;align-items:center;gap:14px;margin-top:18px;padding:12px;border:1px solid #b99b6044;border-radius:8px}.scatter-guide p{margin:0;font-size:12px}.scatter-guide strong{color:#ffe2a4}#rules section[hidden]{display:none}
@media(max-width:650px){#rules{padding:16px;width:96%;max-height:90svh}.guide-nav{gap:5px}.guide-nav button{font-size:12px}.symbol-paytable{font-size:11px}.symbol-label{gap:5px}.guide-icon{width:38px;height:38px}.symbol-paytable th,.symbol-paytable td{padding:7px 3px}.symbol-paytable th:first-child{width:43%}.guide-header h1{font-size:26px}}

/* Individual transparent symbol assets v9. */
.symbol{background-image:none;background-size:contain;background-position:center;background-repeat:no-repeat;clip-path:none!important}
[data-symbol="0"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/selene.webp')}
[data-symbol="1"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/amara.webp')}
[data-symbol="2"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/raven.webp')}
[data-symbol="3"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/potion.webp')}
[data-symbol="4"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/wild.webp')}
[data-symbol="5"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/hearts.webp')}
[data-symbol="6"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/spades.webp')}
[data-symbol="7"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/clubs.webp')}
[data-symbol="8"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/diamonds.webp')}
[data-symbol="9"]>.symbol{background-image:url('../../assets/bruxas-do-eclipse/sprites-v10/scatter.webp')}

.cell.winner[data-symbol="4"] .symbol{animation:wild-awaken 1.4s ease-in-out infinite alternate}
.cell.scatter[data-symbol="9"] .symbol,.locked-overlay[data-symbol="9"] .symbol{animation:eclipse-awaken 1.8s ease-in-out infinite alternate}
@keyframes wild-awaken{from{filter:drop-shadow(-2px 0 3px #58e6ef66);transform:scale(1)}to{filter:drop-shadow(2px 0 7px #e8ac5388) brightness(1.15);transform:scale(1.07)}}
@keyframes eclipse-awaken{from{filter:drop-shadow(0 0 2px #ffc76444);transform:scale(1)}to{filter:drop-shadow(0 0 8px #ffd68caa);transform:scale(1.05)}}
.spinning>.cell .symbol,.spin-strip .symbol{animation:none!important}
@media(prefers-reduced-motion:reduce){.cell .symbol{animation:none!important;transform:none!important}}