/* av-fortunado.css — Fortunado (fortunado.html). Loaded after av-bj.css, which supplies the shared game layout (#main, #game-area, #stage,
   #bottom-zone, #sidebar, the chip row, the main button, the log); War's controls styles (.wr-*) are reused. Shell tokens and Inter only. */
#fo-table{width:min(100%,640px);margin:auto 0;display:flex;flex-direction:column;align-items:center;gap:8px}
.fo-risk{display:flex;gap:8px;align-items:center}
.fo-risk .sm{min-width:72px}.fo-gap{width:10px}.fo-risk .sm[data-a].on{background:var(--av-accent);border-color:var(--av-accent);color:#fff}.fo-risk .sm[data-a]{min-width:62px}
.fo-risk .sm.on{background:var(--av-accent);border-color:var(--av-accent);color:#fff}
.fo-sub{min-height:18px;font-size:12.5px;color:var(--av-muted);text-align:center}
.fo-wheel{position:relative;width:min(100%,var(--fw,430px));min-width:220px;aspect-ratio:1;margin:4px 0}
.fo-wheel canvas{width:100%;height:100%;display:block;filter:drop-shadow(0 12px 28px rgba(0,0,0,.65))}
.fo-ptr{position:absolute;left:50%;top:-12px;width:34px;height:46px;transform:translateX(-50%);transform-origin:50% 14%;clip-path:polygon(50% 100%,2% 26%,16% 4%,84% 4%,98% 26%);background:linear-gradient(180deg,#fff 0%,#D9CCFF 55%,#8B5CF6 100%);filter:drop-shadow(0 3px 6px rgba(0,0,0,.7)) drop-shadow(0 0 8px rgba(139,92,246,.8));z-index:3}
.fo-mid{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:23%;aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center}
#fo-mult{font-size:clamp(20px,4.6vw,34px);font-weight:800;color:var(--av-white);letter-spacing:-.01em}
#fo-mult.w{color:var(--av-win)}#fo-mult.l{color:var(--av-muted)}
@media(max-width:720px){#fo-table{gap:6px}.fo-wheel{--fw:min(86vw,360px)}.fo-risk .sm{min-width:74px}#wr-controls .rule{display:none}}
@media(max-width:720px) and (max-height:720px){.fo-wheel{--fw:min(76vw,300px)}.fo-sub{display:none}#stage:has(#fo-table){padding-top:6px;padding-bottom:2px}}
@media(min-width:1280px) and (min-height:860px){.fo-wheel{--fw:520px}}
@media(min-width:1700px) and (min-height:1000px){.fo-wheel{--fw:620px}}

/* a big win: over the game area, centred on the wheel */
.fo-big{position:absolute;inset:0;z-index:20;display:none;background:radial-gradient(circle at var(--cx,50%) var(--cy,50%),rgba(18,14,38,.78),rgba(5,6,14,.93) 70%);cursor:pointer;overflow:hidden}
.fo-big.open{display:block;animation:foIn .3s ease-out}
.fo-big .rays{position:absolute;left:var(--cx,50%);top:var(--cy,50%);width:190vmax;height:190vmax;margin:-95vmax 0 0 -95vmax;background:repeating-conic-gradient(from 0deg,rgba(139,92,246,.11) 0 6deg,rgba(139,92,246,0) 6deg 18deg);-webkit-mask:radial-gradient(circle,#000 0,transparent 34%);mask:radial-gradient(circle,#000 0,transparent 34%);animation:foSpin 26s linear infinite}
.fo-big .card{position:absolute;left:var(--cx,50%);top:var(--cy,50%);transform:translate(-50%,-50%);width:max-content;max-width:90%;display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 48px 22px;border-radius:22px;background:linear-gradient(180deg,rgba(33,49,64,.92),rgba(15,25,35,.94));border:1px solid rgba(183,156,251,.55);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 0 60px rgba(139,92,246,.45),inset 0 0 30px rgba(139,92,246,.12);animation:foPop .55s cubic-bezier(.2,1.3,.4,1) both}
.fo-big .t{white-space:nowrap;font-size:13px;font-weight:700;letter-spacing:.42em;color:var(--av-accent-soft);text-indent:.42em}
.fo-big .m{font-size:clamp(64px,13vw,110px);font-weight:900;line-height:1;letter-spacing:-.02em;background:linear-gradient(180deg,#fff 10%,#FBBF24 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 22px rgba(251,191,36,.55))}
.fo-big.mega .m{background:linear-gradient(180deg,#fff 10%,#FF6B9A 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 26px rgba(255,79,133,.65))}
.fo-big .a{font-size:24px;font-weight:700;color:var(--av-win)}
.fo-big small{margin-top:8px;font-size:10.5px;font-weight:600;letter-spacing:.3em;color:var(--av-muted)}
.fo-big .cf{position:absolute;top:-14px;width:8px;height:14px;border-radius:2px;opacity:.95;animation:foFall var(--d,3.2s) linear var(--dl,0s) forwards}
@keyframes foIn{from{opacity:0}to{opacity:1}}
@keyframes foPop{0%{transform:translate(-50%,-50%) scale(.6);opacity:0}100%{transform:translate(-50%,-50%) scale(1);opacity:1}}
@keyframes foSpin{to{transform:rotate(360deg)}}
@keyframes foFall{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(110vh) rotate(var(--r,540deg));opacity:.9}}

/* result history, Turbo and Auto, the autoplay sheet */
.fo-hist{display:flex;gap:6px;min-height:24px;justify-content:center;overflow:hidden;max-width:100%}
.fo-hist i{font-style:normal;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--av-raised);color:var(--av-muted);white-space:nowrap}
.fo-hist i:first-child{outline:1px solid rgba(255,255,255,.28)}
.fo-hist i.hp{background:rgba(74,143,214,.22);color:#9CCBFF}.fo-hist i.hw{background:rgba(52,211,153,.2);color:#6EE7B7}.fo-hist i.hb{background:rgba(124,134,255,.22);color:#B7BDFF}
.fo-hist i.hg{background:rgba(255,178,46,.22);color:#FFD27A}.fo-hist i.hm{background:rgba(255,79,133,.24);color:#FF9DBD}
.fo-opts{display:flex;gap:8px;justify-content:center}
.fo-opts .sm{min-width:74px}.fo-opts .sm.on{background:var(--av-accent);border-color:var(--av-accent);color:#fff}
.fo-sheet{position:fixed;inset:0;z-index:400;display:none;align-items:center;justify-content:center;background:rgba(5,6,14,.72)}
.fo-sheet.open{display:flex}
.fo-sheet .box{width:min(92vw,360px);display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:18px;background:var(--av-panel);border:1px solid var(--av-line);box-shadow:0 20px 60px rgba(0,0,0,.6)}
.fo-sheet h3{font-size:15px;font-weight:700;color:var(--av-white);text-align:center}
.fo-sheet .ao{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.fo-sheet .sm.on{background:var(--av-accent);border-color:var(--av-accent);color:#fff}
.fo-sheet .wide{width:100%;text-align:left;padding:10px 12px;height:auto;min-height:38px}
.fo-sheet .row{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center}

@media(max-width:720px){.fo-risk{gap:6px}.fo-risk .sm{min-width:60px;padding-left:8px;padding-right:8px}.fo-risk .sm[data-a]{min-width:52px}.fo-gap{width:2px}}
.wr-verdict{min-height:24px}
