:root{--ink:#1d2340;--paper:#fffcf5d1;--edge:#1d2340e6;--shadow:0 5px 0 #1d2340d9;--yellow:#fc3;--red:#ff4b4b;--blue:#2f6fed;--gutter:20px}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;background:#9cc3f5;margin:0;font-family:Nunito,system-ui,sans-serif;overflow:hidden}#app,#app canvas{width:100%;height:100%;display:block;position:fixed;inset:0}#app canvas{cursor:grab}#app canvas:active{cursor:grabbing}body.hovering #app canvas{cursor:pointer}.panel{background:var(--paper);-webkit-backdrop-filter:blur(10px)saturate(1.4);border:3px solid var(--edge);box-shadow:var(--shadow);border-radius:16px;position:fixed}.legend-panel{left:var(--gutter);bottom:var(--gutter);min-width:230px;padding:14px 16px 12px}.legend-panel h2{letter-spacing:1px;opacity:.7;margin:0 0 10px;font-family:"Press Start 2P",monospace;font-size:10px}#legend{gap:7px;margin:0;padding:0;list-style:none;display:grid}#legend li{grid-template-columns:30px 1fr auto;align-items:center;gap:10px;font-size:14px;font-weight:800;display:grid}#legend img,.tooltip img{width:30px;height:30px;image-rendering:pixelated;box-shadow:0 0 0 2px var(--ink), 0 3px 0 2px var(--ink);border-radius:6px}#legend .count{background:var(--ink);color:#fff;border-radius:6px;padding:5px 7px 4px;font-family:"Press Start 2P",monospace;font-size:10px}.controls{right:var(--gutter);bottom:var(--gutter);gap:8px;padding:8px;display:flex}.controls button{color:var(--ink);border:2px solid var(--ink);cursor:pointer;box-shadow:0 3px 0 var(--ink);background:#fff;border-radius:10px;align-items:center;gap:8px;padding:7px 11px 7px 8px;font:800 13px Nunito,sans-serif;transition:transform 80ms,box-shadow 80ms,background .2s;display:flex}.controls button:hover{box-shadow:0 4px 0 var(--ink);transform:translateY(-1px)}.controls button:active{box-shadow:0 0 0 var(--ink);transform:translateY(3px)}.controls button.on{background:var(--yellow)}kbd{background:var(--ink);color:#fff;border-radius:5px;padding:4px 5px 3px;font-family:"Press Start 2P",monospace;font-size:9px}.hint{left:50%;bottom:calc(var(--gutter) + 6px);color:#fff;text-shadow:0 2px #1d234080;pointer-events:none;white-space:nowrap;margin:0;font-size:13px;font-weight:800;position:fixed;transform:translate(-50%)}.tooltip{border:3px solid var(--ink);box-shadow:var(--shadow);pointer-events:none;opacity:0;white-space:nowrap;background:#fff;border-radius:12px;align-items:center;gap:12px;padding:10px 14px 10px 10px;transition:opacity .12s;display:flex;position:fixed;top:0;left:0}.tooltip.show{opacity:1}.tooltip strong{font-size:15px;font-weight:900;display:block}.tooltip small{opacity:.7;margin-top:1px;font-size:12px;font-weight:700;display:block}@media (width<=760px){:root{--gutter:16px}.hint{display:none}.legend-panel{min-width:0;bottom:calc(var(--gutter) + 64px);padding:10px 12px}.legend-panel h2{display:none}#legend li{grid-template-columns:24px 1fr auto;font-size:12px}#legend img{width:24px;height:24px}.controls{left:var(--gutter);right:var(--gutter);justify-content:space-between}.controls button{flex:1;justify-content:center;padding:7px 6px;font-size:12px}}.scoreboard{top:var(--gutter);right:var(--gutter);min-width:250px;padding:8px}.scoreboard[hidden]{display:none}.scoreboard header{border-bottom:2px dashed #1d234040;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:6px;padding:4px 6px 8px;display:flex}.scoreboard header b{font-family:"Press Start 2P",monospace;font-size:11px}.scoreboard header small{opacity:.6;white-space:nowrap;font-size:12px;font-weight:800}.scoreboard ol{gap:6px;margin:0;padding:0;list-style:none;display:grid}.scoreboard li{border:2px solid #0000;border-radius:10px;grid-template-columns:38px 1fr auto auto;align-items:center;gap:10px;padding:5px 10px 5px 5px;transition:background .2s,border-color .2s,transform .2s;display:grid}.scoreboard li.turn{border-color:var(--ink);background:#fff4c7;transform:translate(-6px)}.scoreboard li.away{opacity:.5}.scoreboard .avatar{background:var(--c);color:#fff;border:3px solid var(--ink);text-shadow:0 2px #00000059;border-radius:9px;place-items:center;width:38px;height:38px;font-family:"Press Start 2P",monospace;font-size:10px;display:grid;box-shadow:inset 0 -5px #0000002e}.scoreboard .who{min-width:0}.scoreboard .who b{text-overflow:ellipsis;white-space:nowrap;max-width:110px;font-size:15px;font-weight:900;display:block;overflow:hidden}.scoreboard .who small{opacity:.6;min-height:7px;margin-top:2px;font-family:"Press Start 2P",monospace;font-size:7px;display:block}.scoreboard li.you .who small{color:var(--blue);opacity:1}.scoreboard .stat{align-items:center;gap:5px;font-family:"Press Start 2P",monospace;font-size:12px;display:flex}.scoreboard .stat img{width:18px;height:18px;image-rendering:pixelated;box-shadow:0 0 0 2px var(--ink);border-radius:4px}.turn-banner{top:calc(var(--gutter) + 70px);background:var(--yellow);border:3px solid var(--ink);box-shadow:0 6px 0 var(--ink);pointer-events:none;opacity:0;white-space:nowrap;border-radius:14px;justify-items:center;gap:8px;max-width:calc(100% - 32px);padding:14px 26px 12px;transition:opacity .25s,transform .3s cubic-bezier(.3,1.5,.5,1);display:grid;position:fixed;left:50%;transform:translate(-50%,-12px)scale(.9)}.turn-banner.show{opacity:1;transform:translate(-50%)scale(1)}.turn-banner b{color:#fff;text-shadow:2px 0 var(--ink), -2px 0 var(--ink), 0 2px var(--ink), 0 -2px var(--ink), 0 4px 0 var(--ink);font-family:"Press Start 2P",monospace;font-size:clamp(14px,2.4vw,22px)}.turn-banner small{text-overflow:ellipsis;max-width:100%;font-size:14px;font-weight:900;overflow:hidden}.roll{left:50%;bottom:calc(var(--gutter) + 30px);color:var(--ink);background:var(--yellow);border:3px solid var(--ink);box-shadow:0 6px 0 var(--ink);cursor:pointer;border-radius:14px;align-items:center;gap:12px;padding:12px 22px 12px 14px;font:900 18px Nunito,sans-serif;transition:transform 80ms,box-shadow 80ms,opacity .2s,filter .2s;animation:1.6s ease-in-out infinite nudge;display:flex;position:fixed;transform:translate(-50%)}.roll:hover{filter:brightness(1.06)}.roll:active{box-shadow:0 1px 0 var(--ink);transform:translate(-50%)translateY(5px)}.roll:disabled{opacity:0;pointer-events:none;animation:none}@keyframes nudge{0%,to{translate:0}50%{translate:0 -4px}}.hint{bottom:calc(var(--gutter) - 6px);font-size:12px}@media (width<=760px){.scoreboard{min-width:0;padding:5px}.scoreboard ol{gap:3px}.scoreboard header{margin-bottom:4px;padding:3px 4px 5px}.scoreboard header b{font-size:9px}.scoreboard header small{font-size:10px}.scoreboard li{grid-template-columns:28px 1fr auto auto;gap:6px;padding:3px 6px 3px 3px}.scoreboard .avatar{border-width:2px;width:28px;height:28px;font-size:8px}.scoreboard .who b{max-width:70px;font-size:12px}.scoreboard .stat{font-size:9px}.scoreboard .stat img{width:14px;height:14px}.turn-banner{top:auto;bottom:calc(var(--gutter) + 64px + 110px)}.roll{bottom:calc(var(--gutter) + 64px + 170px);font-size:15px}}#board-ui[hidden]{display:none}.wipe{z-index:20;pointer-events:none;clip-path:circle(0%);background:linear-gradient(#5aa0f2,#ffe2c4);place-content:center;justify-items:center;gap:22px;transition:clip-path .55s cubic-bezier(.6,0,.3,1);display:grid;position:fixed;inset:0}.wipe.closed{clip-path:circle(75%);pointer-events:auto}.wipe p{color:#fff;text-shadow:0 4px 0 var(--ink);margin:0;font-family:"Press Start 2P",monospace;font-size:18px}.cheat-menu{z-index:100;border:3px solid var(--edge);width:min(300px,100vw - 32px);box-shadow:var(--shadow);background:#fffcf5f5;border-radius:14px;flex-direction:column;gap:8px;padding:16px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.cheat-menu[hidden]{display:none}.cheat-title{text-align:center;font-family:"Press Start 2P",monospace;font-size:13px}.cheat-sub{text-align:center;opacity:.7;font-size:12px}.cheat-menu button{font:inherit;text-transform:capitalize;color:var(--ink);border:2px solid var(--ink);box-shadow:0 3px 0 var(--ink);cursor:pointer;background:#fff;border-radius:10px;padding:8px 10px;font-weight:800}.cheat-menu button:hover{background:var(--yellow)}.cheat-menu button:active{box-shadow:none;transform:translateY(3px)}.cheat-menu .cheat-quit{background:var(--red);color:#fff}.cheat-menu{max-height:calc(100vh - 32px);overflow-y:auto}.cheat-row{gap:6px;display:flex}.cheat-row button:first-child{text-transform:none;flex:1}.cheat-menu .cheat-remove{padding:8px 11px}.cheat-menu .cheat-add{text-transform:none;box-shadow:none;border-style:dashed}.cheat-note{opacity:1;font-weight:800}.scoreboard .vitals{align-items:center;gap:6px;margin-top:4px;display:flex}.scoreboard .hp{border:2px solid var(--ink);background:#3a2230;border-radius:4px;flex:none;width:64px;height:11px;position:relative;overflow:hidden}.scoreboard .hp i{background:linear-gradient(#7dff9a,#2fbf5a);transition:width .4s cubic-bezier(.3,1.4,.5,1);position:absolute;inset:0 auto 0 0}.scoreboard .hp.low i{background:linear-gradient(#ff8a8a,#e5383b);animation:.8s ease-in-out infinite hp-throb}.scoreboard .hp.shielded{box-shadow:0 0 0 2px var(--ink), 0 0 8px #5fc8f0;border-color:#5fc8f0}.scoreboard .hp em{color:#fff;text-shadow:0 1px 0 var(--ink);place-items:center;font:7px "Press Start 2P",monospace;display:grid;position:absolute;inset:0}@keyframes hp-throb{50%{filter:brightness(1.35)}}.scoreboard .bag{gap:2px;min-height:16px;display:flex}.scoreboard .bag img{width:16px;height:16px;image-rendering:pixelated}.item-bar{left:50%;bottom:calc(var(--gutter) + 100px);background:var(--paper);border:3px solid var(--edge);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:14px;gap:8px;padding:6px;display:flex;position:fixed;transform:translate(-50%)}.item-bar[hidden]{display:none}.item-bar .slot{min-width:128px;color:var(--ink);border:2px solid var(--ink);box-shadow:0 3px 0 var(--ink);cursor:pointer;background:#fff;border-radius:10px;align-items:center;gap:7px;padding:6px 10px 6px 6px;font:900 13px Nunito,sans-serif;transition:transform 80ms,box-shadow 80ms,filter .2s;display:flex}.item-bar .slot img{width:28px;height:28px;image-rendering:pixelated}.item-bar .slot .nm{white-space:nowrap}.item-bar .slot.empty{opacity:.4;box-shadow:none;cursor:default;border-style:dashed}.item-bar .slot:disabled:not(.empty){cursor:default;background:#f1f1f4}.item-bar .slot:disabled:not(.empty)>:not(.tip){filter:saturate(.4);opacity:.75}.item-bar.live .slot:not(:disabled){background:#fbe9ff;animation:1.6s ease-in-out infinite nudge}.item-bar.live .slot:not(:disabled):hover{filter:brightness(1.05)}.item-bar .slot:not(:disabled):active{box-shadow:0 0 0 var(--ink);transform:translateY(3px)}.item-bar .slot{position:relative}.item-bar .tip{text-align:left;width:230px;color:var(--ink);border:3px solid var(--ink);box-shadow:var(--shadow);pointer-events:none;opacity:0;white-space:normal;z-index:6;background:#fff;border-radius:12px;gap:6px;padding:10px 12px;font:800 13px/1.3 Nunito,sans-serif;transition:opacity .12s,transform .15s;display:grid;position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%,6px)}.item-bar .tip:after{content:"";border:solid var(--ink);background:#fff;border-width:0 3px 3px 0;width:12px;height:12px;position:absolute;top:100%;left:50%;transform:translate(-50%,-5px)rotate(45deg)}.item-bar .slot:hover .tip,.item-bar .slot:focus-visible .tip{opacity:1;transform:translate(-50%)}.item-bar .tip .head{align-items:center;gap:8px;display:flex}.item-bar .tip .head img{width:28px;height:28px}.item-bar .tip .head b{flex:1;font-size:15px;font-weight:900}.item-bar .tip .kind{color:#fff;background:var(--ink);border-radius:4px;padding:3px 5px;font-family:"Press Start 2P",monospace;font-size:7px}.item-bar .tip .chips{flex-wrap:wrap;gap:4px;display:flex}.item-bar .tip .chips i{border:2px solid var(--ink);background:#fbe9ff;border-radius:999px;padding:2px 7px;font-size:11px;font-style:normal;font-weight:900}.target-pick{left:50%;top:calc(var(--gutter) + 60px);border:3px solid var(--ink);width:min(460px,100% - 32px);box-shadow:0 6px 0 var(--ink);z-index:5;background:#fff;border-radius:14px;padding:10px;animation:.22s cubic-bezier(.3,1.5,.5,1) pop-in;position:fixed;transform:translate(-50%)}.target-pick[hidden]{display:none}.target-pick header{align-items:center;gap:10px;margin-bottom:8px;display:flex}.target-pick header img{width:36px;height:36px;image-rendering:pixelated}.target-pick header b{font-family:"Press Start 2P",monospace;font-size:11px;display:block}.target-pick header small{opacity:.7;margin-top:3px;font-size:12px;font-weight:800;display:block}.target-pick .targets{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px;display:grid}.target-pick .targets button{text-align:left;color:var(--ink);background:color-mix(in srgb, var(--c,#fff) 22%, #fff);border:2px solid var(--ink);border-left:8px solid var(--c,var(--ink));cursor:pointer;border-radius:9px;grid-template-columns:auto 1fr;align-items:center;column-gap:7px;padding:6px 8px;font:900 14px Nunito,sans-serif;display:grid}.target-pick .targets button kbd{grid-row:span 2}.target-pick .targets button small{opacity:.7;font-size:11px}.target-pick .targets button:disabled{opacity:.38;cursor:default}.target-pick .targets button:not(:disabled):hover{background:color-mix(in srgb, var(--c,#fff) 40%, #fff)}.target-pick .targets .cancel{background:#eee;border-left-width:2px;grid-template-columns:auto 1fr}@keyframes pop-in{0%{opacity:0;transform:translate(-50%)scale(.85)}}@media (width<=760px){.scoreboard .hp{width:44px}.item-bar{left:auto;right:var(--gutter);bottom:calc(var(--gutter) + 64px);flex-direction:column;gap:4px;padding:4px;transform:none}.item-bar .slot{min-width:0;padding:4px 6px;font-size:11px}.item-bar .slot .nm{display:none}.item-bar .tip{width:200px;bottom:50%;left:auto;right:calc(100% + 12px);transform:translate(6px,50%)}.item-bar .slot:hover .tip,.item-bar .slot:focus-visible .tip{transform:translateY(50%)}.item-bar .tip:after{border-width:3px 3px 0 0;top:50%;left:100%;transform:translate(-5px,-50%)rotate(45deg)}.turn-banner{bottom:calc(var(--gutter) + 64px + 240px)}}.item-news{top:calc(var(--gutter) + 150px);border:3px solid var(--ink);border-top:8px solid var(--c,#e78bff);width:max-content;max-width:min(460px,100% - 32px);box-shadow:0 6px 0 var(--ink);pointer-events:none;opacity:0;z-index:4;background:#fff;border-radius:16px;align-items:center;gap:16px;padding:14px 20px 14px 14px;transition:opacity .25s,transform .25s ease-in;display:flex;position:fixed;left:50%;transform:translate(-50%)scale(.6)rotate(-4deg)}.item-news.show{opacity:1;transition:opacity .15s,transform .45s cubic-bezier(.3,1.8,.5,1);transform:translate(-50%)}.item-news .icon{flex:none;place-items:center;width:76px;height:76px;display:grid;position:relative}.item-news .icon img{width:64px;height:64px;image-rendering:pixelated;filter:drop-shadow(0 4px #1d234059);position:relative}.item-news.show .icon img{animation:.7s cubic-bezier(.3,1.6,.5,1) both news-icon,1.4s ease-in-out .7s infinite news-bob}.item-news .burst{background:repeating-conic-gradient(color-mix(in srgb, var(--c,#e78bff) 55%, #fff) 0 12deg, transparent 12deg 30deg);border-radius:50%;animation:6s linear infinite news-spin;position:absolute;inset:-10px;-webkit-mask:radial-gradient(circle,#000 35%,#0000 70%);mask:radial-gradient(circle,#000 35%,#0000 70%)}.item-news .txt{gap:3px;min-width:0;display:grid}.item-news .who{opacity:.7;font-size:14px;font-weight:900}.item-news .nm{color:var(--yellow);text-shadow:2px 0 var(--ink), -2px 0 var(--ink), 0 2px var(--ink), 0 -2px var(--ink), 0 4px 0 var(--ink);font-family:"Press Start 2P",monospace;font-size:clamp(15px,2.6vw,22px);line-height:1.25}.item-news.show .nm{animation:.5s cubic-bezier(.3,1.8,.5,1) .15s both news-name}.item-news .taunt{color:var(--red);font-size:16px;font-style:normal;font-weight:900}.item-news .tip{background:color-mix(in srgb, var(--c,#e78bff) 14%, #fff);border:2px solid var(--ink);border-radius:8px;margin:4px 0 0;padding:6px 9px;font-size:13px;font-weight:800}.item-news .kind{vertical-align:2px;color:#fff;background:var(--ink);border-radius:4px;margin-right:7px;padding:2px 5px;font-family:"Press Start 2P",monospace;font-size:7px;display:inline-block}.item-news .foot{opacity:.65;font-size:12px;font-weight:800}@keyframes news-icon{0%{transform:scale(0)rotate(-200deg)}}@keyframes news-bob{50%{transform:translateY(-4px)rotate(4deg)}}@keyframes news-spin{to{transform:rotate(360deg)}}@keyframes news-name{0%{opacity:0;transform:scale(1.6)}}@media (width<=760px){.item-news{top:calc(var(--gutter) + 90px);gap:10px;padding:10px 12px 10px 8px}.item-news .icon{width:54px;height:54px}.item-news .icon img{width:44px;height:44px}.item-news .taunt{font-size:14px}.item-news .tip{font-size:12px}}.settings-gear{top:var(--gutter);left:var(--gutter);z-index:50;background:var(--paper);-webkit-backdrop-filter:blur(10px)saturate(1.4);border:3px solid var(--edge);width:44px;height:44px;box-shadow:var(--shadow);color:var(--ink);cursor:pointer;border-radius:14px;place-items:center;padding:0;transition:transform .1s,box-shadow .1s;display:grid;position:fixed}.settings-gear svg{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linejoin:round;width:24px;height:24px;transition:transform .4s}.settings-gear:hover{transform:translateY(-1px)}.settings-gear:hover svg,.settings-gear.on svg{transform:rotate(60deg)}.settings-gear:active{box-shadow:0 0 0 var(--ink);transform:translateY(3px)}.settings-gear.on{background:var(--yellow)}.settings-panel{top:calc(var(--gutter) + 56px);left:var(--gutter);z-index:50;width:min(320px, calc(100vw - 2 * var(--gutter)));border:3px solid var(--ink);box-shadow:0 6px 0 var(--ink);color:var(--ink);background:#fffcf5f5;border-radius:16px;padding:14px 16px 16px;font-family:Nunito,system-ui,sans-serif;position:fixed}.settings-panel[hidden]{display:none}.settings-panel h3{letter-spacing:1px;opacity:.7;margin:0 0 8px;font-family:"Press Start 2P",monospace;font-size:10px}.settings-seg{border:2px solid var(--ink);box-shadow:0 3px 0 var(--ink);border-radius:10px;display:flex;overflow:hidden}.settings-seg button{color:var(--ink);border:0;border-left:2px solid var(--ink);cursor:pointer;background:#fff;flex:1;padding:7px 0;font:900 14px Nunito,sans-serif}.settings-seg button:first-child{border-left:0}.settings-seg button.on{background:var(--yellow)}.settings-hint{opacity:.7;min-height:16px;margin:8px 0 16px;font-size:12px;font-weight:700}.settings-head{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.settings-head h3{margin:0}.settings-mute{color:var(--ink);border:2px solid var(--ink);box-shadow:0 2px 0 var(--ink);cursor:pointer;background:#fff;border-radius:8px;padding:4px 10px;font:900 12px Nunito,sans-serif}.settings-mute.on{background:var(--yellow)}.settings-rows{gap:8px;transition:opacity .2s;display:grid}.settings-rows.muted{opacity:.45}.settings-rows label{grid-template-columns:76px 1fr 30px;align-items:center;gap:10px;font-size:14px;font-weight:800;display:grid}.settings-rows b{text-align:right;font-family:"Press Start 2P",monospace;font-size:9px}.settings-rows input[type=range]{width:100%;accent-color:var(--blue);cursor:pointer}.settings-done{background:var(--yellow);width:100%;color:var(--ink);border:2px solid var(--ink);box-shadow:0 3px 0 var(--ink);cursor:pointer;border-radius:10px;margin-top:16px;padding:8px 0;font:900 15px Nunito,sans-serif;display:block}.settings-done:active{box-shadow:none;transform:translateY(3px)}