.vp{-webkit-user-select:none;user-select:none;max-width:560px;margin:0 auto;padding:14px 10px 44px}.vp header{text-align:center;margin-bottom:12px;position:relative}.vp .back{color:var(--chalk-dim);border:1px solid #f6e9cd4d;border-radius:8px;padding:4px 9px;font-size:13px;text-decoration:none;position:absolute;top:4px;left:0}.vp h1{color:var(--gold);text-shadow:0 2px #00000059;letter-spacing:.5px;font-size:clamp(26px,7vw,38px)}.vp .sub{color:var(--chalk-dim);margin-top:2px;font-size:13px}.vp .prow{align-items:center;gap:8px;margin:8px 0;display:flex}.vp .prow .swatch{border:2px solid #ffffffa6;border-radius:50%;flex:none;width:16px;height:16px}.vp .prow input{min-width:0;font:inherit;color:var(--chalk);background:#00000040;border:1px solid #f6e9cd4d;border-radius:8px;flex:1;padding:8px 10px;font-size:15px}.vp .prow .type{text-align:center;flex:none;width:118px}.vp .resume{border:1px dashed var(--gold);background:#f2c14e24;border-radius:10px;margin-bottom:14px;padding:12px}.vp .resume p{margin-bottom:8px}.vp .howto{color:var(--chalk-dim);margin-top:14px;font-size:14px}.vp .howto summary{cursor:pointer;color:var(--chalk);font-weight:600}.vp .howto ul{margin:8px 0 4px 18px;line-height:1.55}.vp .topbar{justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;display:flex}.vp .board{aspect-ratio:1;background:linear-gradient(var(--floor),var(--floor));border:8px solid var(--floor-dark);border-radius:12px;width:min(94vw,500px);margin:0 auto;position:relative;box-shadow:0 6px 22px #00000073,inset 0 0 40px #0003}.vp .sq{width:10%;height:10%;position:absolute;box-shadow:inset 0 0 0 1px #f6e9cd80}.vp .sq.alt{background:#f6e9cd14}.vp .sq.virtue{background:#6c9a3f4d}.vp .sq.vice{background:#c645304d}.vp .sq.goal{background:#f2c14e59}.vp .sq .n{color:#f6e9cdd9;font-size:clamp(6px,1.9vw,10px);font-weight:600;line-height:1;position:absolute;top:1px;left:2px}.vp .sq .cap{text-align:center;color:var(--chalk);text-shadow:0 1px 2px #0009;pointer-events:none;font-size:clamp(5.5px,1.8vw,9.5px);font-weight:700;line-height:1.1;position:absolute;bottom:1px;left:0;right:0}.vp .lines{pointer-events:none;z-index:2;width:100%;height:100%;position:absolute;inset:0}.vp .token{aspect-ratio:1;z-index:5;background:radial-gradient(circle at 32% 28%, #ffffffd9, #fff0 38%), var(--c);border:1.5px solid #ffffffe6;border-radius:50%;width:5.5%;transition:left .13s linear,top .13s linear;position:absolute;transform:translate(-50%,-50%);box-shadow:0 2px 4px #00000080,inset 0 -2px 4px #0000004d}.vp .token.lift{z-index:9;box-shadow:0 5px 10px #0000008c,inset 0 -2px 4px #0000004d}.vp .tray{background:#00000047;border:1px solid #f6e9cd40;border-radius:14px;grid-template-columns:auto 1fr auto;align-items:center;gap:6px 12px;max-width:min(94vw,500px);margin:12px auto;padding:12px 14px;display:grid}.vp .die{filter:drop-shadow(0 2px 3px #0006);width:46px;height:46px}.vp .die.rolling{animation:.14s linear infinite vp-jig}@keyframes vp-jig{0%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}to{transform:rotate(-8deg)}}.vp .sixes{letter-spacing:2px;color:var(--gold);text-align:center;min-height:1.2em;font-size:18px}.vp .msg{text-align:center;color:var(--chalk);grid-column:1/-1;min-height:1.4em;margin-top:2px;font-size:14px}.vp .msg .te{font-size:13px}.vp .cards{grid-template-columns:1fr 1fr;gap:8px;max-width:min(94vw,500px);margin:0 auto;display:grid}.vp .card{background:#00000047;border:1px solid #f6e9cd38;border-radius:11px;padding:9px 11px;transition:border-color .2s,background .2s}.vp .card.on{border-color:var(--gold);background:#f2c14e1a}.vp .cname{white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:7px;font-size:14px;font-weight:700;display:flex;overflow:hidden}.vp .cname .dot{background:var(--c);border:1.5px solid #ffffffb3;border-radius:50%;flex:none;width:12px;height:12px}.vp .cname .tag{flex:none;font-size:12px;font-weight:400}.vp .cpos{color:var(--gold);margin:4px 0 2px;font-size:22px;font-weight:800}.vp .cmeta{color:var(--chalk-dim);font-size:11.5px}.vp .overlay{z-index:50;background:#1e0e06d1;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.vp .overlay .box{border:2px solid var(--gold);text-align:center;background:linear-gradient(#5c3018,#462512);border-radius:18px;max-width:340px;padding:28px 26px;box-shadow:0 10px 40px #0009}.vp .overlay h2{color:var(--gold);margin-bottom:8px;font-size:24px}.vp .overlay p{color:var(--chalk-dim);margin-bottom:16px}
