.boxff-wg{--bg:#eef6e9;--panel:#fff;--ink:#183022;--muted:#66756b;--line:#d7e2d7;--accent:#286d43;--accent2:#184f30;--danger:#a02b2b;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);width:100%;box-sizing:border-box}
.boxff-wg *{box-sizing:border-box}
.boxff-wg__shell{width:min(100%,1120px);margin:0 auto;display:grid;gap:9px}
.boxff-wg__topbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.boxff-wg__topbar>div,.boxff-wg__bench-card,.boxff-wg__message,.boxff-wg__modal,.boxff-wg__stats{background:var(--panel);border:1px solid var(--line);border-radius:12px}
.boxff-wg__topbar>div{padding:7px 4px;text-align:center;font-size:12px;font-weight:800;white-space:nowrap}
.boxff-wg__layout{display:grid;grid-template-columns:minmax(0,2.15fr) minmax(300px,.95fr);gap:10px;align-items:start}
.boxff-wg__arena-wrap{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#9bca7f;line-height:0;min-width:0}
.boxff-wg__canvas{display:block;width:100%;height:auto;aspect-ratio:720/430;touch-action:manipulation;user-select:none}
.boxff-wg__sidebar{display:grid;gap:7px;min-width:0;align-content:start}
.boxff-wg__arena-controls{position:absolute;top:8px;left:8px;display:flex;gap:5px;flex-wrap:wrap;line-height:1.2}
.boxff-wg button{appearance:none;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:10px;min-height:42px;padding:6px 8px;font:inherit;font-weight:800;cursor:pointer;transition:transform .12s ease,opacity .12s ease,background .12s ease}
.boxff-wg button:hover{background:#f6faf6}
.boxff-wg button:active{transform:scale(.97)}
.boxff-wg button:focus-visible{outline:3px solid rgba(40,109,67,.28);outline-offset:2px}
.boxff-wg button:disabled{opacity:.42;cursor:not-allowed;transform:none}
.boxff-wg__arena-controls button{min-height:36px;padding:4px 8px;font-size:10px;background:rgba(255,255,255,.93);backdrop-filter:blur(4px)}
.boxff-wg__banner{position:absolute;left:18%;right:18%;top:55px;display:none;background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:12px;padding:9px;text-align:center;line-height:1.3;font-size:13px;font-weight:900;box-shadow:0 8px 25px rgba(0,0,0,.08)}
.boxff-wg__banner.is-visible{display:block}

.boxff-wg__complete{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(88%,430px);z-index:8;background:rgba(255,255,255,.97);border:2px solid #87b88f;border-radius:18px;padding:18px;line-height:1.25;text-align:center;box-shadow:0 18px 50px rgba(16,45,25,.24)}
.boxff-wg__complete[hidden]{display:none!important}
.boxff-wg__complete>strong{display:block;font-size:20px;color:#205d38;margin-bottom:6px}
.boxff-wg__complete>span{display:block;font-size:11px;color:var(--muted);margin-bottom:12px}
.boxff-wg__complete-actions{display:grid;grid-template-columns:1.35fr 1fr;gap:8px}
.boxff-wg__complete-actions button{min-height:54px;font-size:12px}
.boxff-wg__complete-actions small{display:block;font-size:9px;font-weight:600;margin-top:3px;color:var(--muted)}
.boxff-wg__next-level{background:linear-gradient(180deg,#e8f7d9,#ccebbf)!important;border-color:#87b977!important;color:#1c5b32!important;font-size:14px!important}
.boxff-wg__bench-card{padding:8px}
.boxff-wg__section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px;line-height:1.25}
.boxff-wg__section-head strong{font-size:13px}.boxff-wg__section-head span{font-size:9px;color:var(--muted);text-align:right}
.boxff-wg__bench{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.boxff-wg__slot{min-width:0;min-height:62px!important;padding:4px!important;text-align:center;overflow:hidden;background:#f8fbf7!important}
.boxff-wg__slot.is-selected{outline:3px solid var(--accent);outline-offset:1px}
.boxff-wg__slot-icon{font-size:23px;line-height:1}.boxff-wg__slot-name{font-size:8px;line-height:1.1;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.boxff-wg__slot-meta{font-size:7px;line-height:1.15;color:var(--muted);margin-top:2px}.boxff-wg__slot-empty{font-size:18px;color:#b8c3ba;margin-top:7px}.boxff-wg__slot-empty-label{font-size:8px;color:var(--muted)}
.boxff-wg__actions{display:grid;gap:5px}.boxff-wg__actions--3{grid-template-columns:repeat(3,minmax(0,1fr))}.boxff-wg__actions--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.boxff-wg__actions button{min-width:0;line-height:1.1;font-size:11px}.boxff-wg__actions small{display:block;font-size:8px;font-weight:500;margin-top:2px;color:var(--muted)}
.boxff-wg__primary{background:#e0f0e4!important;border-color:#a7ccb1!important;color:var(--accent2)!important}
.boxff-wg__message{padding:8px 9px;line-height:1.25;min-height:57px}.boxff-wg__message strong{display:block;font-size:11px}.boxff-wg__message span{display:block;font-size:9px;color:var(--muted);margin-top:2px}
.boxff-wg__stats{display:flex;justify-content:space-between;gap:7px;flex-wrap:wrap;padding:7px 9px;font-size:9px;color:var(--muted);line-height:1.2}
.boxff-wg__modal{padding:12px;line-height:1.4}.boxff-wg__modal-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.boxff-wg__modal-head button{min-width:40px;padding:5px}.boxff-wg__modal-body{margin-top:10px;font-size:12px}.boxff-wg__modal-body .boxff-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.boxff-wg__modal-body .boxff-card{border:1px solid var(--line);border-radius:10px;padding:8px}.boxff-wg__modal-body .boxff-card b{display:block;font-size:11px}.boxff-wg__modal-body .boxff-card span{font-size:9px;color:var(--muted)}
@media(max-width:860px){.boxff-wg__shell{width:min(100%,760px)}.boxff-wg__layout{grid-template-columns:1fr}.boxff-wg__sidebar{grid-template-columns:1fr 1fr}.boxff-wg__bench-card,.boxff-wg__message,.boxff-wg__stats{grid-column:1/-1}.boxff-wg__modal-body .boxff-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.boxff-wg__topbar>div{font-size:10px;padding:6px 2px}.boxff-wg__sidebar{grid-template-columns:1fr}.boxff-wg__bench-card,.boxff-wg__message,.boxff-wg__stats{grid-column:auto}.boxff-wg__actions button{font-size:10px;padding:5px}.boxff-wg__slot{min-height:58px!important}.boxff-wg__slot-icon{font-size:21px}.boxff-wg__section-head{align-items:flex-start}.boxff-wg__stats{flex-direction:row;flex-wrap:wrap}.boxff-wg__banner{left:8%;right:8%;top:50px}}
@media(prefers-reduced-motion:reduce){.boxff-wg button{transition:none}}
/* v1.2.0 premium 3D-style character portraits */
.boxff-wg__slot{background:linear-gradient(180deg,#fff,#eef6eb)!important;border-color:#c8d8c8!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 5px rgba(29,64,39,.07)}
.boxff-wg__slot-visual{height:34px;display:flex;align-items:center;justify-content:center;position:relative;margin:-1px 0 1px}
.boxff-wg__portrait{display:inline-flex;width:36px;height:36px;border-radius:50%;overflow:hidden;border:2px solid #dae7d9;background:#dce9d6;box-shadow:0 2px 5px rgba(22,55,31,.18)}
.boxff-wg__portrait img{width:100%;height:100%;object-fit:cover;display:block}
.boxff-wg__fusion-portrait{position:relative;width:48px;height:36px;display:inline-block}
.boxff-wg__fusion-portrait img{position:absolute;top:1px;width:34px;height:34px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 2px 5px rgba(35,20,52,.22)}
.boxff-wg__fusion-portrait img:first-child{left:0}.boxff-wg__fusion-portrait img:nth-child(2){right:0}
.boxff-wg__fusion-portrait i{position:absolute;right:0;bottom:-1px;width:15px;height:15px;display:grid;place-items:center;border-radius:50%;background:#6e36aa;color:#fff;font-size:8px;font-weight:900;font-style:normal;border:1px solid #fff}
.boxff-wg__slot-emoji{font-size:23px;line-height:1}
.boxff-wg__card-visual,.boxff-card-visual{min-height:42px;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.boxff-wg__modal-body .boxff-card .boxff-wg__portrait{width:48px;height:48px}
.boxff-wg__modal-body .boxff-card .boxff-wg__fusion-portrait{transform:scale(1.15);transform-origin:center}
.boxff-wg__arena-wrap{box-shadow:0 8px 20px rgba(24,62,34,.12);border-color:#bfd2bd}
.boxff-wg__topbar>div{background:linear-gradient(180deg,#fff,#f4f8f2);box-shadow:0 2px 6px rgba(25,70,35,.05)}
.boxff-wg__bench-card,.boxff-wg__message,.boxff-wg__stats{box-shadow:0 3px 9px rgba(25,70,35,.06)}
/* v1.3.0 leveling & evolution */
.boxff-wg__playerbar{display:grid;grid-template-columns:auto minmax(120px,1fr) auto auto;align-items:center;gap:8px;padding:7px 10px;background:linear-gradient(180deg,#fff,#f3f8f1);border:1px solid var(--line);border-radius:12px;box-shadow:0 3px 9px rgba(25,70,35,.06);font-size:10px;line-height:1.2}
.boxff-wg__player-level{font-weight:800;white-space:nowrap}.boxff-wg__player-level b{color:var(--accent2)}
.boxff-wg__xp-track{height:9px;border-radius:999px;background:#dfe9df;overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.08)}
.boxff-wg__xp-track i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#63b86f,#e1b941);transition:width .25s ease}
.boxff-wg__xp-text,.boxff-wg__power{font-size:9px;color:var(--muted);white-space:nowrap}.boxff-wg__power strong{color:#8b5c13}
.boxff-wg__slot-visual{position:relative}
.boxff-wg__evo-mark{position:absolute;right:2px;top:0;display:grid;place-items:center;min-width:17px;height:17px;padding:0 3px;border-radius:999px;color:#fff;font-size:7px;line-height:1;border:1px solid rgba(255,255,255,.92);box-shadow:0 1px 4px rgba(0,0,0,.22)}
.boxff-wg__evo-mark.evo-1{background:#2fa76a}.boxff-wg__evo-mark.evo-2{background:#8f4bd7}.boxff-wg__evo-mark.evo-3{background:#c99513}
.boxff-player-summary{display:grid;gap:4px;margin-bottom:10px;padding:10px;border-radius:10px;background:#f3f8f1;border:1px solid var(--line)}
.boxff-player-summary b{font-size:13px}.boxff-player-summary span{font-size:10px;color:var(--ink)}.boxff-player-summary small{font-size:9px;color:var(--muted)}
.boxff-progress-card{display:flex;flex-direction:column;min-height:178px}
.boxff-progress-card .boxff-mini-xp{height:7px;border-radius:999px;background:#e3e9e2;overflow:hidden;margin:5px 0 3px}
.boxff-progress-card .boxff-mini-xp i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#56ad67,#dcb841)}
.boxff-progress-card button{margin-top:auto;min-height:30px;padding:4px 5px;font-size:8px;border-radius:7px;background:#eaf5e8}
.boxff-wg__stats{align-items:center;flex-wrap:wrap}
@media(max-width:860px){.boxff-wg__playerbar{grid-template-columns:auto minmax(120px,1fr) auto}.boxff-wg__power{grid-column:1/-1}.boxff-progress-card{min-height:165px}}
@media(max-width:560px){.boxff-wg__playerbar{grid-template-columns:1fr auto;gap:5px}.boxff-wg__xp-track{grid-column:1/-1}.boxff-wg__power{grid-column:auto}.boxff-wg__player-level{white-space:normal}.boxff-wg__xp-text,.boxff-wg__power{font-size:8px}.boxff-wg__modal-body .boxff-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.boxff-wg__xp-track i{transition:none}}

@media(max-width:520px){.boxff-wg__complete{width:92%;padding:14px}.boxff-wg__complete-actions{grid-template-columns:1fr}.boxff-wg__complete>strong{font-size:17px}}