.canvas.sizeitup{--ink:#1c1d45;--gold:#f5b83a;--gold-edge:#b57f12;--paper:#f3f1ff;--paper-edge:#a9aee0;--cv-ink:#eef1ff;--cv-btn-bg:#f3f1ff;--cv-btn-ink:#1c1d45;--cv-btn-edge:#a9aee0;--cv-main-bg:#f5b83a;--cv-main-ink:#1c1d45;--cv-main-edge:#b57f12;--cv-well:#080a2d6b;--cv-on-bg:#f3f1ff;--cv-on-ink:#1c1d45;--cv-on-edge:#a9aee0;--cv-card-bg:#fff6e6;--cv-card-ink:#1c1d45;--cv-card-edge:#c9c2ae;--cv-card-sub:#f3e6cf;--cv-card-mute:#5a5b82;--cv-ok:#f5b83a;--cv-ok-edge:#b57f12;background:radial-gradient(120% 90% at 50% 0,#4b5fc4 0%,#2f3c8f 45%,#161c4e 100%)}.canvas.sizeitup .scene{background-image:repeating-radial-gradient(circle at 10% 118%,#ffffff13 0 1.2px,#0000 1.4px 30px),repeating-radial-gradient(circle at 94% -24%,#ffffff0d 0 1.2px,#0000 1.4px 36px)}.canvas.sizeitup .s1{background:#aabeff24;width:420px;height:420px;top:-200px;right:-150px}.canvas.sizeitup .s2{background:#0508284d;width:300px;height:300px;bottom:-150px;left:-110px}.canvas.sizeitup .sz{justify-items:stretch;gap:12px;width:100%;max-width:920px;display:grid}.canvas.sizeitup .rounds{justify-content:space-between;align-items:center;gap:12px;min-height:36px;display:flex}.canvas.sizeitup .rds{gap:8px;margin:0;padding:0;list-style:none;display:flex}.canvas.sizeitup .rd{min-width:36px;height:30px;font-weight:600;font-size:var(--fs-s);font-variant-numeric:tabular-nums;color:#eef1ff8c;border:2px solid #eef1ff4d;border-radius:999px;justify-content:center;align-items:center;padding:0 9px;display:flex}.canvas.sizeitup .rd.done{background:var(--paper);border-color:var(--paper);color:var(--ink);box-shadow:0 2px 0 var(--paper-edge);font-weight:700}.canvas.sizeitup .rd.now{border-color:var(--gold);color:var(--gold);box-shadow:0 0 0 4px #f5b83a38}.canvas.sizeitup .rd[data-i]{cursor:default}.canvas.sizeitup .rd .ic{stroke-width:3px;width:14px;height:14px}.canvas.sizeitup .tot{font-variant-numeric:tabular-nums;align-items:baseline;margin:0;display:flex}.canvas.sizeitup .tot b{font-size:var(--fs-2xl);font-weight:700}.canvas.sizeitup .tot span{font-size:var(--fs-m);opacity:.65;white-space:pre;font-weight:600}.canvas.sizeitup .sz-plate{border-radius:var(--rl);background:var(--ink);touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;padding:10px;box-shadow:inset 0 2px #aab4ff33,0 8px #0d0e2b,0 18px 30px #05051e80}.canvas.sizeitup .sz-plate:focus{outline:none}.canvas.sizeitup .sz-plate:focus-visible{outline:3px solid var(--gold);outline-offset:6px}.canvas.sizeitup .sz-plate.ptr:focus-visible{outline:none}.canvas.sizeitup .vw{border-radius:var(--radius);aspect-ratio:900/320;background:#2b2c63;position:relative;overflow:hidden}.canvas.sizeitup .vp{--hz:78%;position:absolute;inset:0}.canvas.sizeitup .vp-m{--hz:76%;display:none}.canvas.sizeitup .vp i,.canvas.sizeitup .vp b{display:block;position:absolute}.canvas.sizeitup .sky{width:100%;height:var(--hz);background:linear-gradient(#9db8ec,#d9e1f4 55%,#fce3c3);top:0;left:0}.canvas.sizeitup .glow{background:radial-gradient(closest-side,#fff4dcf2,#fff4dc00);width:84%;height:86%;top:35%;left:20%}.canvas.sizeitup .vp-m .glow{height:84%;top:34%}.canvas.sizeitup .ground{width:100%;left:0;top:var(--hz);background:linear-gradient(#34366f,#1e1f4a);bottom:0}.canvas.sizeitup .gl{background:#ffffff0f;width:100%;height:1px;left:0}.canvas.sizeitup .hzl{width:100%;left:0;top:var(--hz);background:#f7d9b3;height:2px;margin-top:-1px}.canvas.sizeitup .sil-w{pointer-events:none;position:absolute}.canvas.sizeitup .sil{background:var(--c);width:100%;height:100%;-webkit-mask:var(--mi) center / 100% 100% no-repeat;mask:var(--mi) center / 100% 100% no-repeat;display:block;position:static}.canvas.sizeitup .sil-w.ref{--c:var(--ink)}.canvas.sizeitup .sil-w.tgt{--c:var(--gold);filter:drop-shadow(1px 0 0 var(--ink)) drop-shadow(-1px 0 0 var(--ink)) drop-shadow(0 1px 0 var(--ink)) drop-shadow(0 -1px 0 var(--ink)) drop-shadow(0 4px 4px #14143c4d)}.canvas.sizeitup .ghost{box-sizing:border-box;border:2px dashed var(--ink);pointer-events:none;background:#1c1d4512;border-radius:3px}.canvas.sizeitup .ghost[hidden],.canvas.sizeitup .brk[hidden],.canvas.sizeitup .pin[hidden],.canvas.sizeitup .knob[hidden],.canvas.sizeitup .verdict[hidden],.canvas.sizeitup .band[hidden]{display:none}.canvas.sizeitup .dl{pointer-events:none}.canvas.sizeitup .dl.h{background:linear-gradient(currentColor,currentColor) 0/100% 2px no-repeat,linear-gradient(currentColor,currentColor) 0 0/2px 100% no-repeat,linear-gradient(currentColor,currentColor) 100% 0/2px 100% no-repeat}.canvas.sizeitup .dl.v{background:linear-gradient(currentColor,currentColor) 50% 0/2px 100% no-repeat,linear-gradient(currentColor,currentColor) 0 0/100% 2px no-repeat}.canvas.sizeitup .dl.h.r{color:#c9ccf0}.canvas.sizeitup .dl.h.t{color:var(--gold)}.canvas.sizeitup .dl.v.r{color:var(--ink)}.canvas.sizeitup .dl.v.t{color:var(--gold-edge)}.canvas.sizeitup .brk{pointer-events:none}.canvas.sizeitup .brk b{border:0 solid var(--ink);width:12px;height:12px;position:absolute}.canvas.sizeitup .brk b:first-child{border-width:2.5px 0 0 2.5px;top:0;left:0}.canvas.sizeitup .brk b:nth-child(2){display:none}.canvas.sizeitup .brk b:nth-child(3){border-width:0 0 2.5px 2.5px;bottom:0;left:0}.canvas.sizeitup .brk b:nth-child(4){border-width:0 2.5px 2.5px 0;bottom:0;right:0}.canvas.sizeitup .pin{box-sizing:border-box;border:2px dashed var(--gold);pointer-events:none;border-radius:50%}.canvas.sizeitup .knob{cursor:grab;touch-action:none;background:0 0;border-radius:50%;width:44px;height:44px;margin:-22px 0 0 -22px;padding:0;position:absolute}.canvas.sizeitup .knob:active{cursor:grabbing}.canvas.sizeitup .knob svg{width:100%;height:100%;display:block;overflow:visible}.canvas.sizeitup .knob .halo{fill:#f5b83a4d}.canvas.sizeitup .knob .kb{fill:#fff6e6;stroke:var(--ink);stroke-width:2.5px;filter:drop-shadow(0 3px 2px #0a0a2859)}.canvas.sizeitup .knob .kg{fill:none;stroke:var(--ink);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.canvas.sizeitup .chip{border-radius:var(--r-sm);max-width:calc(50% - 16px);font-weight:600;font-size:var(--fs-s);align-items:center;gap:7px;padding:5px 10px;line-height:1.25;display:inline-flex;position:absolute;bottom:10px}.canvas.sizeitup .chip .ic{stroke-width:2.5px;flex:none;width:14px;height:14px}.canvas.sizeitup .c-ref{background:var(--paper);color:var(--ink);box-shadow:0 2px 0 var(--paper-edge);left:10px}.canvas.sizeitup .c-ref:before{content:"";background:var(--ink);border-radius:3px;flex:none;width:10px;height:10px}.canvas.sizeitup .c-tgt{background:var(--gold);color:var(--ink);box-shadow:0 2px 0 var(--gold-edge);right:10px}.canvas.sizeitup .verdict{height:36px;color:var(--ink);font-weight:600;font-size:var(--fs-m);white-space:nowrap;background:#fff6e6;border-radius:999px;align-items:center;gap:8px;margin:0;padding:0 5px 0 12px;animation:.3s both sz-pop;display:flex;position:absolute;top:10px;left:50%;transform:translate(-50%);box-shadow:0 3px #c9c2ae,0 6px 12px #0a0a2838}.canvas.sizeitup .verdict .ic{stroke-width:2.6px;width:17px;height:17px}.canvas.sizeitup .verdict b{background:var(--ink);min-width:36px;height:28px;color:var(--gold);font-size:var(--fs-m);font-variant-numeric:tabular-nums;border-radius:999px;justify-content:center;align-items:center;padding:0 9px;display:flex}@keyframes sz-pop{0%{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%)}}.canvas.sizeitup .vw.anim [data-el]{transition:left .45s cubic-bezier(.3,.8,.3,1),top .45s cubic-bezier(.3,.8,.3,1),width .45s cubic-bezier(.3,.8,.3,1),height .45s cubic-bezier(.3,.8,.3,1)}.canvas.sizeitup .sz-ctl{align-items:center;gap:18px;margin-top:12px;display:flex}.canvas.sizeitup .rule-wrap{flex:1;min-width:0}.canvas.sizeitup .rule{border-radius:var(--radius);height:60px;color:var(--ink);touch-action:none;cursor:ew-resize;-webkit-user-select:none;user-select:none;background:linear-gradient(#fff8ea,#f1e4c9);padding:0 24px;position:relative;box-shadow:inset 0 1px #fff,0 5px #c9b48c,0 10px 18px #05051e59}.canvas.sizeitup .rule-in{height:100%;position:relative}.canvas.sizeitup .ticks{width:100%;height:26px;position:absolute;top:0;left:0}.canvas.sizeitup .ticks path{stroke:var(--ink);stroke-width:1.2px;vector-effect:non-scaling-stroke;opacity:.5}.canvas.sizeitup .ticks path.mj{stroke-width:2px;opacity:1}.canvas.sizeitup .rl{left:var(--p);font-weight:700;font-size:var(--fs-s);font-variant-numeric:tabular-nums;white-space:nowrap;line-height:18px;position:absolute;bottom:8px;transform:translate(-50%)}.canvas.sizeitup .rl.one{border-radius:var(--r-sm);background:var(--ink);color:var(--paper);padding:0 6px}.canvas.sizeitup .band{left:var(--a);width:calc(var(--b) - var(--a));box-sizing:border-box;border:2px dashed var(--gold-edge);border-radius:var(--r-sm);pointer-events:none;background:#f5b83a52;position:absolute;top:-4px;bottom:-4px}.canvas.sizeitup .cur{left:var(--p);box-sizing:border-box;border-radius:var(--r-sm);border:2px solid var(--ink);pointer-events:none;background:#f5b83a47;width:30px;position:absolute;top:-7px;bottom:-7px;transform:translate(-50%);box-shadow:0 3px 6px #0a0a284d}.canvas.sizeitup .cur:after{content:"";background:var(--ink);width:2px;margin-left:-1px;position:absolute;top:3px;bottom:3px;left:50%}.canvas.sizeitup .cur-v{border-radius:var(--r-sm);background:var(--ink);color:var(--gold);font-weight:700;font-size:var(--fs-s);white-space:nowrap;font-variant-numeric:tabular-nums;padding:2px 8px;line-height:18px;position:absolute;bottom:calc(100% + 3px);left:50%;transform:translate(-50%)}.canvas.sizeitup .cur.ghost{border:2px dashed var(--ink);box-shadow:none;background:0 0}.canvas.sizeitup .cur.ghost:after,.canvas.sizeitup .cur.ghost .cur-v{display:none}.canvas.sizeitup .cur.truth{background:#f5b83a8c}.canvas.sizeitup .lock{min-width:168px;height:56px;font-size:var(--fs-l);border-radius:var(--radius)}.canvas.sizeitup .lock .ic{width:19px;height:19px}.canvas.sizeitup .lock:disabled{opacity:.6;cursor:default}@media (prefers-reduced-motion:reduce){.canvas.sizeitup .vw.anim [data-el]{transition:none}.canvas.sizeitup .verdict{animation:none}}@media (width<=640px){.canvas.sizeitup .vw{aspect-ratio:338/226;border-radius:10px}.canvas.sizeitup .vp-d{display:none}.canvas.sizeitup .vp-m{display:block}.canvas.sizeitup .sz{gap:8px;max-width:400px;margin:0 auto}.canvas.sizeitup .rounds{min-height:30px}.canvas.sizeitup .rds{gap:5px}.canvas.sizeitup .rd{min-width:30px;height:28px;font-size:var(--fs-xs);padding:0 6px}.canvas.sizeitup .tot b{font-size:var(--fs-xl)}.canvas.sizeitup .tot span{font-size:var(--fs-s)}.canvas.sizeitup .sz-plate{border-radius:var(--rl);padding:6px;box-shadow:inset 0 2px #aab4ff33,0 6px #0d0e2b,0 14px 24px #05051e80}.canvas.sizeitup .chip{gap:5px;max-width:calc(50% - 10px);padding:4px 7px;font-size:11px;bottom:6px}.canvas.sizeitup .c-ref{left:6px}.canvas.sizeitup .c-tgt{right:6px}.canvas.sizeitup .c-ref:before{width:8px;height:8px}.canvas.sizeitup .chip .ic{width:12px;height:12px}.canvas.sizeitup .verdict{height:30px;font-size:var(--fs-s);gap:6px;padding:0 4px 0 10px;top:6px}.canvas.sizeitup .verdict b{min-width:30px;height:24px;font-size:var(--fs-s)}.canvas.sizeitup .verdict .ic{width:15px;height:15px}.canvas.sizeitup .knob{width:44px;height:44px}.canvas.sizeitup .sz-ctl{flex-direction:column;align-items:stretch;gap:12px;margin-top:16px}.canvas.sizeitup .rule{height:56px;padding:0 16px}.canvas.sizeitup .rl{font-size:11.5px;bottom:6px}.canvas.sizeitup .cur{width:26px}.canvas.sizeitup .lock{width:100%;height:50px;font-size:var(--fs-l)}}
