.bf-frame-engine-strip{display:grid;grid-template-columns:minmax(260px,1.1fr) minmax(360px,1fr);gap:18px;align-items:center;margin:0 0 18px;padding:18px 20px;border:1px solid rgba(200,255,56,.18);background:linear-gradient(135deg,rgba(200,255,56,.055),rgba(0,210,255,.025) 55%,rgba(255,255,255,.018));border-radius:18px;box-shadow:0 16px 40px rgba(0,0,0,.18)}
.bf-engine-copy{display:flex;flex-direction:column;gap:5px}.bf-engine-copy strong{font-size:17px;letter-spacing:-.02em}.bf-engine-copy span{font-size:12px;color:var(--muted)}
.bf-mode-mini-list{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.bf-mode-mini-list span{min-height:58px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.022);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font:500 9px/1.1 'DM Mono',monospace;letter-spacing:.07em;color:#aeb5bf;text-align:center}.bf-mode-mini-list b{font-size:16px;color:var(--acid);font-family:'Space Grotesk',sans-serif}

.bf-spin-stage{min-height:560px;display:grid;grid-template-columns:minmax(260px,.8fr) minmax(340px,1.1fr) minmax(230px,.7fr);gap:28px;align-items:center;padding:42px;border:1px solid rgba(200,255,56,.18);border-radius:24px;overflow:hidden;position:relative;background:radial-gradient(circle at 58% 45%,rgba(200,255,56,.075),transparent 28%),radial-gradient(circle at 78% 65%,rgba(0,210,255,.06),transparent 26%),linear-gradient(145deg,#0b0e12,#07090c 66%)}
.bf-spin-stage:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.012) 4px);pointer-events:none;mix-blend-mode:screen}
.bf-spin-copy,.bf-spin-lock,.bf-wheel-zone{position:relative;z-index:1}.bf-spin-copy h1{font-size:clamp(34px,4vw,62px);line-height:.94;letter-spacing:-.055em;margin:12px 0 18px}.bf-spin-copy p{max-width:430px;line-height:1.65}
.bf-wheel-zone{display:flex;align-items:center;justify-content:center;min-height:420px}.bf-wheel{--bf-wheel-stop:1650deg;width:min(390px,32vw);aspect-ratio:1;border-radius:50%;position:relative;display:grid;place-items:center;background:conic-gradient(from -30deg,rgba(200,255,56,.20) 0 60deg,rgba(0,210,255,.13) 60deg 120deg,rgba(255,255,255,.055) 120deg 180deg,rgba(200,255,56,.12) 180deg 240deg,rgba(0,210,255,.08) 240deg 300deg,rgba(255,255,255,.04) 300deg 360deg);border:1px solid rgba(200,255,56,.35);box-shadow:0 0 0 12px rgba(255,255,255,.018),0 0 70px rgba(200,255,56,.10),inset 0 0 60px rgba(0,0,0,.6);animation:bf-wheel-spin 6.15s cubic-bezier(.11,.69,.16,1) both}
.bf-wheel:before,.bf-wheel:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.bf-wheel:before{inset:11%;border:1px solid rgba(255,255,255,.09)}.bf-wheel:after{inset:28%;border:1px solid rgba(200,255,56,.12)}
.bf-wheel-core{width:96px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:#080b0e;border:1px solid rgba(200,255,56,.42);font:700 26px/1 'Space Grotesk',sans-serif;letter-spacing:-.08em;color:var(--acid);box-shadow:0 0 35px rgba(200,255,56,.14)}
.bf-wheel-label{--i:0;position:absolute;left:50%;top:50%;width:84px;margin-left:-42px;margin-top:-12px;text-align:center;font:500 10px/1 'DM Mono',monospace;letter-spacing:.06em;color:#d9dde2;transform:rotate(calc(var(--i) * 60deg)) translateY(-150px) rotate(calc(var(--i) * -60deg));transform-origin:42px 12px;text-shadow:0 2px 10px #000}.bf-wheel-label b{display:block;color:var(--acid);font:700 17px/1 'Space Grotesk',sans-serif;margin-bottom:4px}
.bf-wheel-pointer{position:absolute;z-index:5;top:15px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:16px solid transparent;border-right:16px solid transparent;border-top:28px solid var(--acid);filter:drop-shadow(0 0 12px rgba(200,255,56,.45))}
.bf-spin-count{position:absolute;bottom:4px;left:50%;transform:translateX(-50%);font-size:13px;color:#7f8892;letter-spacing:.14em}
.bf-spin-lock{opacity:0;transform:translateY(14px);animation:bf-lock-in .55s ease 5.7s forwards;border-left:1px solid rgba(200,255,56,.28);padding-left:22px}.bf-spin-lock>span{display:block;font:500 10px/1 'DM Mono',monospace;letter-spacing:.16em;color:#77818b;margin-bottom:11px}.bf-spin-lock>strong{display:block;font-size:28px;line-height:1.02;color:var(--acid);letter-spacing:-.035em}.bf-spin-lock>div{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}.bf-spin-lock b{font:500 9px/1 'DM Mono',monospace;letter-spacing:.08em;border:1px solid rgba(255,255,255,.09);padding:7px 8px;border-radius:999px;color:#aeb6be;background:rgba(255,255,255,.025)}
@keyframes bf-wheel-spin{0%{transform:rotate(0deg);filter:blur(0)}12%{filter:blur(.9px)}72%{filter:blur(.5px)}100%{transform:rotate(var(--bf-wheel-stop));filter:blur(0)}}@keyframes bf-lock-in{to{opacity:1;transform:translateY(0)}}

.bf-constraint-deck{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 16px}.bf-constraint{min-height:112px;padding:15px;border:1px solid rgba(255,255,255,.075);border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.028),rgba(255,255,255,.012));display:flex;flex-direction:column;gap:8px}.bf-constraint>span{font:500 9px/1 'DM Mono',monospace;letter-spacing:.15em;color:#68727d}.bf-constraint strong{font-size:15px;line-height:1.15}.bf-constraint small{color:#818b95;font-size:11px;line-height:1.4}.bf-constraint.wild{border-color:rgba(200,255,56,.27);background:linear-gradient(145deg,rgba(200,255,56,.06),rgba(255,255,255,.012))}.bf-constraint.wild strong{color:var(--acid)}

.bf-reveal-title,.bf-create-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:4px 0 16px;padding:0 2px}.bf-reveal-title h1{font-size:clamp(36px,5vw,74px);line-height:.9;letter-spacing:-.055em;margin:8px 0}.bf-reveal-title p{max-width:680px;color:var(--muted);margin:0}.bf-reveal-mark{font-size:64px;color:var(--acid);opacity:.7;text-shadow:0 0 35px rgba(200,255,56,.14)}
.bf-reveal-wrap .prompt-visual,.bf-create-reveal .prompt-visual{animation:bf-frame-reveal .75s cubic-bezier(.2,.8,.2,1) both}.bf-create-reveal .prompt-grid{align-items:start}
@keyframes bf-frame-reveal{0%{opacity:0;transform:scale(.975);filter:blur(12px) brightness(.45)}55%{filter:blur(2px) brightness(1.25)}100%{opacity:1;transform:scale(1);filter:blur(0) brightness(1)}}
.bf-prompt-meta{position:absolute;z-index:4;top:14px;left:14px;display:flex;gap:6px;flex-wrap:wrap;max-width:calc(100% - 90px)}.bf-prompt-meta span{font:500 8px/1 'DM Mono',monospace;letter-spacing:.08em;padding:6px 7px;border-radius:999px;background:rgba(5,8,11,.78);border:1px solid rgba(255,255,255,.13);backdrop-filter:blur(8px);color:#d7dce1}.bf-prompt-meta span:first-child{color:var(--acid);border-color:rgba(200,255,56,.3)}
.bf-create-intro h2{margin:7px 0 0;font-size:clamp(22px,3vw,36px);letter-spacing:-.035em}.bf-difficulty{font:500 10px/1 'DM Mono',monospace;letter-spacing:.12em;padding:9px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.1);color:#aab3bc}.bf-difficulty.hard{color:#ffbf8c;border-color:rgba(255,160,90,.28)}.bf-difficulty.easy{color:var(--acid);border-color:rgba(200,255,56,.25)}
.bf-progress-v2{overflow-x:auto;scrollbar-width:none}.bf-progress-v2::-webkit-scrollbar{display:none}

@media(max-width:1050px){.bf-frame-engine-strip{grid-template-columns:1fr}.bf-mode-mini-list{grid-template-columns:repeat(3,1fr)}.bf-spin-stage{grid-template-columns:1fr;min-height:0;padding:28px}.bf-spin-copy{text-align:center}.bf-spin-copy p{margin-left:auto;margin-right:auto}.bf-wheel{width:min(390px,76vw)}.bf-spin-lock{border-left:0;border-top:1px solid rgba(200,255,56,.22);padding:20px 0 0;text-align:center}.bf-spin-lock>div{justify-content:center}.bf-constraint-deck{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.bf-frame-engine-strip{padding:14px}.bf-mode-mini-list{grid-template-columns:repeat(3,1fr);gap:5px}.bf-mode-mini-list span{min-height:52px;font-size:8px}.bf-spin-stage{padding:20px 14px;border-radius:18px}.bf-spin-copy h1{font-size:38px}.bf-wheel-zone{min-height:320px}.bf-wheel{width:290px}.bf-wheel-label{transform:rotate(calc(var(--i) * 60deg)) translateY(-112px) rotate(calc(var(--i) * -60deg));font-size:8px}.bf-wheel-core{width:72px;font-size:21px}.bf-constraint-deck{grid-template-columns:1fr 1fr}.bf-constraint{min-height:100px;padding:12px}.bf-reveal-title{align-items:center}.bf-reveal-mark{font-size:42px}.bf-prompt-meta{top:10px;left:10px}.bf-prompt-meta span{font-size:7px;padding:5px 6px}}
