.bm{--ink:#e9eef5;--muted:#96a4b6;--gold:#efc65b;--teal:#63d6ca;max-width:1080px;margin:32px auto;padding:0 20px 45px;color:var(--ink);font-family:Pretendard,"Noto Sans KR",sans-serif;line-height:1.5;box-sizing:border-box}
.bm *{box-sizing:border-box}.bm h1,.bm h2,.bm p{margin:0}.bm-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}.bm-eyebrow{font-size:11px;font-weight:800;letter-spacing:.18em;color:var(--gold)}.bm h1{font-size:32px;letter-spacing:-.05em;margin-top:6px;font-weight:850}.bm h1 span{display:block;color:var(--muted);font-size:15px;letter-spacing:-.02em;font-weight:400;margin-top:4px}.bm-pill{padding:9px 16px;border:1px solid #8b7135;border-radius:30px;font-size:12px;color:var(--gold);white-space:nowrap;background:#282416}
.bm-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px}.bm-stats>div{background:#141e2c;border:1px solid #283447;border-radius:16px;padding:17px 22px;display:flex;align-items:center;justify-content:space-between;gap:10px}.bm-stats span{font-size:12px;color:var(--muted)}.bm-stats strong{font-size:26px;color:#f6f0df}.bm-stats b{font-weight:800}.bm-stats small{font-size:12px;font-weight:500;margin-left:5px;color:var(--muted)}
.bm-frame{background:#26374a;padding:10px;border:1px solid #485363;border-radius:22px;box-shadow:0 24px 65px #0004}.bm-board{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));gap:5px;aspect-ratio:1;position:relative}
.bm-cell{position:relative;border-radius:8px;background:#f1eddf;color:#2d3440;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-align:center;min-width:0;padding:4px;border-top:4px solid #d5b45e;box-shadow:0 3px 0 #0002}.bm-cell-icon{font-size:17px;line-height:1;font-weight:900;color:#a57b24}.bm-cell-name{font-size:12px;font-weight:800;word-break:keep-all;overflow-wrap:anywhere;line-height:1.2}.bm-cell small{font-size:10px;font-weight:600;color:#746b56;line-height:1.2}.bm-chance{background:#d9f1e9;border-color:#51b9a8}.bm-chance .bm-cell-icon{color:#257c73}.bm-rest{background:#dfe5eb;border-color:#9aabba}.bm-rest .bm-cell-icon{color:#536d84}.bm-corner{background:#f1cf70;border-color:#f8e6a9}.bm-corner .bm-cell-icon{font-size:23px;color:#805916}
.bm-piece{display:none;position:absolute;right:-3px;bottom:-3px;width:25px;height:25px;align-items:center;justify-content:center;background:#e24a65;color:#fff;border:3px solid #fff;border-radius:50%;box-shadow:0 3px 8px #0006;font-size:11px;z-index:2}.bm-cell.is-current .bm-piece{display:flex}.bm-cell.is-current{outline:3px solid #e24a65;outline-offset:-2px}
.bm-center{grid-row:2/10;grid-column:2/10;background:radial-gradient(ellipse at 50% 35%,#233d4e,#101e2c 70%);border:1px solid #486074;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:22px;overflow:hidden}.bm-center-kicker{font-size:11px;letter-spacing:.15em;color:#8fa9b4}.bm-center h2{font-size:clamp(23px,3.2vw,40px);font-weight:850;line-height:1.25;letter-spacing:-.04em;margin:10px 0 22px}.bm-center h2 em{font-style:normal;color:var(--gold)}.bm-die{width:95px;height:95px;border-radius:22px;background:linear-gradient(140deg,#fffdf4,#d7dccc);padding:18px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:7px;box-shadow:0 12px 0 #a6b2ad,0 22px 30px #0006;transform:rotate(-9deg);margin-bottom:30px}.bm-die span{border-radius:50%;background:transparent}.bm-die span.on{background:#243548;box-shadow:inset 0 2px 2px #0005}.bm-die.rolling{animation:bm-shake .16s infinite alternate}.bm-result{min-height:46px;max-width:90%;font-size:14px;color:#d5e0e7;display:flex;align-items:center;justify-content:center;word-break:keep-all}.bm-roll{appearance:none;border:0;border-radius:12px;background:var(--gold);color:#1e2632!important;font:800 17px/1.4 inherit;font-family:inherit;font-size:17px;font-weight:800;cursor:pointer;text-decoration:none!important;padding:15px 32px;margin-top:10px;min-width:210px;box-shadow:0 4px 0 #9d7828;transition:background .15s}.bm-roll:hover{background:#ffda79}.bm-roll:disabled{background:#3c4b59;color:#a7b3bf!important;box-shadow:0 4px 0 #25313c;cursor:default}.bm-roll:focus-visible{outline:3px solid white;outline-offset:5px}.bm-roll span{margin-left:25px}.bm-center-note{font-size:11px;color:#8ea4b2;margin-top:17px!important}.bm-legend{display:flex;gap:20px;align-items:center;justify-content:center;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:20px 0 28px}.bm-legend span{display:flex;align-items:center;gap:6px}.bm-legend i{width:8px;height:8px;border-radius:50%}.bm-dot-gold{background:var(--gold)}.bm-dot-teal{background:var(--teal)}.bm-dot-gray{background:#9aabba}
.bm-bottom{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}.bm-panel{background:#141e2c;border:1px solid #283447;border-radius:16px;padding:24px}.bm-panel h2{font-size:18px;font-weight:800;margin-bottom:15px}.bm-panel h2 small{font-size:11px;font-weight:400;color:var(--muted);margin-left:7px}.bm-history{list-style:none;padding:0;margin:0}.bm-history li{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #2a3544;padding:12px 0;gap:12px;font-size:13px}.bm-history li:first-child{border:0}.bm-history small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.bm-history strong{color:var(--gold);white-space:nowrap}.bm-history .bm-empty{display:block;color:var(--muted);padding:20px 0}.bm-guide ol{padding-left:20px;margin:0;color:#d2dbe4;font-size:13px}.bm-guide li{margin-bottom:10px}.bm-guide p{margin-top:18px;color:var(--muted);font-size:12px;line-height:1.8}
@keyframes bm-shake{from{transform:rotate(-20deg) translateY(-3px)}to{transform:rotate(15deg) translateY(3px)}}
@media(max-width:650px){.bm{margin:18px auto;padding:0 8px 28px}.bm-heading{gap:10px;margin-bottom:18px;padding:0 4px}.bm h1{font-size:25px}.bm h1 span{font-size:12px}.bm-pill{font-size:10px;padding:6px 8px}.bm-eyebrow{font-size:9px}.bm-stats{gap:6px;margin-bottom:12px}.bm-stats>div{display:block;padding:10px 12px;border-radius:10px}.bm-stats span{font-size:10px}.bm-stats strong{display:block;font-size:22px}.bm-frame{padding:5px;border-radius:13px}.bm-board{gap:2px}.bm-cell{border-radius:4px;border-top-width:2px;padding:1px;gap:1px}.bm-cell-icon{font-size:11px}.bm-corner .bm-cell-icon{font-size:13px}.bm-cell-name{font-size:9px;line-height:1.05;word-break:break-all}.bm-cell small{font-size:8px}.bm-chance small,.bm-rest small{display:none}.bm-piece{width:15px;height:15px;border-width:2px;font-size:7px;right:-1px;bottom:-1px}.bm-center{border-radius:8px;padding:8px}.bm-center-kicker{font-size:8px}.bm-center h2{font-size:23px;margin:5px 0 12px}.bm-die{width:57px;height:57px;padding:11px;gap:4px;border-radius:13px;box-shadow:0 6px 0 #a6b2ad,0 10px 15px #0005;margin-bottom:14px}.bm-result{font-size:11px;min-height:29px;max-width:95%;line-height:1.3}.bm-roll{font-size:13px;padding:9px 18px;min-width:150px;border-radius:8px;margin-top:7px}.bm-center-note{font-size:9px;margin-top:10px!important}.bm-legend{gap:13px;font-size:10px;margin:14px 0 18px}.bm-bottom{grid-template-columns:1fr;gap:12px}.bm-panel{padding:19px}.bm-cell.is-current{outline-width:2px}}
@media(max-width:370px){.bm-center-kicker{display:none}.bm-center h2{font-size:20px;margin-bottom:9px}.bm-die{width:48px;height:48px;padding:9px;margin-bottom:12px}.bm-center-note{font-size:8px}.bm-pill{display:none}.bm-cell-name{font-size:8px}.bm-cell small{font-size:7px}}
@media(prefers-reduced-motion:reduce){.bm-die.rolling{animation:none}.bm-roll{transition:none}}
@media(max-width:650px){.bm-cell{overflow:visible;gap:1px}.bm-cell .bm-cell-icon{display:none}.bm-cell-name{font-size:8.5px;line-height:9px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;max-height:18px;flex-shrink:0}.bm-cell small{font-size:7px;line-height:8px;flex-shrink:0}.bm-chance small,.bm-rest small{display:none}.bm-corner .bm-cell-name{font-size:9px}.bm-piece{pointer-events:none}}
.bm-board{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr))}.bm-center{grid-row:2/6;grid-column:2/6}.bm-cell-name{font-size:14px}.bm-cell small{font-size:12px}.bm-cell-icon{font-size:23px}
@media(max-width:650px){.bm-cell .bm-cell-icon{display:block;font-size:12px}.bm-cell-name,.bm-corner .bm-cell-name{font-size:10px;line-height:11px;max-height:22px}.bm-cell small{font-size:8px;line-height:9px}.bm-chance small,.bm-rest small{display:none}.bm-center h2{font-size:20px;margin:4px 0 10px}.bm-die{width:49px;height:49px;padding:9px;margin-bottom:12px}.bm-center-kicker{font-size:8px}.bm-result{font-size:11px;min-height:29px}.bm-center-note{font-size:8px;margin-top:9px!important}.bm-roll{padding:9px 15px;min-width:145px;font-size:13px}.bm-piece{width:18px;height:18px}}
@media(min-width:651px){
  .bm{--bm-content-width:100%;max-width:760px;margin-top:20px}
  .bm-heading,.bm-stats,.bm-frame,.bm-bottom{width:var(--bm-content-width);max-width:100%;margin-left:auto;margin-right:auto}
  .bm-heading{margin-bottom:18px}.bm h1{font-size:28px}.bm h1 span{font-size:13px}
  .bm-stats{margin:0 auto 14px}.bm-stats>div{padding:12px 16px}.bm-stats strong{font-size:23px}
  .bm-frame{margin:0 auto;padding:8px;border-radius:17px}
  .bm-board{gap:4px}.bm-cell-name{font-size:12px}.bm-cell small{font-size:10px}.bm-cell-icon{font-size:17px}.bm-corner .bm-cell-icon{font-size:20px}
  .bm-center{padding:12px}.bm-center-kicker{font-size:10px}.bm-center h2{font-size:24px;line-height:1.22;margin:6px 0 12px}
  .bm-die{width:60px;height:60px;padding:11px;gap:4px;border-radius:15px;margin-bottom:16px;box-shadow:0 7px 0 #a6b2ad,0 14px 20px #0005}
  .bm-result{min-height:32px;font-size:12px;line-height:1.35}.bm-roll{min-width:180px;font-size:15px;line-height:1.4;padding:10px 24px;margin-top:6px;border-radius:9px}
  .bm-center-note{font-size:10px;margin-top:12px!important}.bm-legend{margin:15px 0 20px}
}
.bm .bm-piece{width:44px;height:50px;right:-4px;bottom:-4px;background:none;border:0;border-radius:0;box-shadow:none;pointer-events:none;filter:drop-shadow(0 3px 3px #0007);z-index:3}
.bm .bm-piece img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;margin:0;padding:0;border:0}
@media(max-width:650px){.bm .bm-piece{width:30px;height:35px;right:-3px;bottom:-3px}}
