.xp-page{--xp-blue:#3aa0ff;--xp-goal:#b76cff}.xp-chip{color:#e6eefb;min-height:40px;font:800 14px/1 var(--body-font);font-variant-numeric:tabular-nums;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#07112ab8;border:1px solid #ffffff2e;border-radius:99px;align-items:center;gap:8px;padding:0 15px;display:inline-flex}.xp-chip svg{color:#8fd0ff}.xp-board{width:min(1080px,100% - 32px);animation:mx-card-in .6s var(--mx-ease) both;background:radial-gradient(at 50% -10%,#23508a 0%,#15294a 40%,#0d1a30 100%);border:1px solid #36547d;border-radius:22px;margin:0 auto;padding:clamp(18px,3vw,30px);position:relative;box-shadow:inset 0 1px #ffffff1a,0 26px 56px #0007}.xp-inputs{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.xp-group{--accent:var(--xp-blue);background:radial-gradient(ellipse at 50% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 60%), #0a1526d9;border:1px solid #2c4468;border-radius:18px;flex-direction:column;gap:16px;min-width:0;margin:0;padding:18px 18px 20px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff12}.xp-group:before{content:"";background:var(--accent);height:2px;box-shadow:0 0 16px var(--accent);border-radius:0 0 4px 4px;position:absolute;inset:0 22% auto}.xp-group.is-goal{--accent:var(--xp-goal)}.xp-group>legend{float:left;color:#fff;width:100%;font:900 22px/1 var(--display-font);text-transform:uppercase;justify-content:center;align-items:center;gap:10px;margin:0;padding:0;display:flex}.xp-group>legend+*{clear:both}.xp-group-num{background:color-mix(in srgb, var(--accent) 26%, #0b1628);width:28px;height:28px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 65%, transparent);color:#fff;font:900 14px/1 var(--body-font);border-radius:9px;place-items:center;display:grid}.xp-field{flex-direction:column;gap:8px;min-width:0;display:flex}.xp-field-head{justify-content:space-between;align-items:center;gap:10px;min-height:28px;display:flex}.xp-field-head>:is(label,span:first-child){color:#9fb7d8;font:800 12px/1 var(--body-font);letter-spacing:.1em;text-transform:uppercase}.xp-stepper{background:linear-gradient(#0b1830,#08111f);border:1px solid #2f4c76;border-radius:14px;grid-template-columns:52px minmax(0,1fr) 52px;height:56px;transition:border-color .2s,box-shadow .2s;display:grid;overflow:hidden;box-shadow:inset 0 2px 6px #0007}.xp-stepper:focus-within{border-color:#4398ff;box-shadow:inset 0 2px 6px #0007,0 0 0 3px #4398ff33}.xp-stepper button{color:#d6e8ff;cursor:pointer;background:linear-gradient(#1d3c69,#142b4d);border:0;border-radius:10px;place-items:center;margin:5px;transition:background .15s,color .15s,transform .1s;display:grid;box-shadow:inset 0 1px #ffffff24,0 2px #050b16}.xp-stepper button:hover:not(:disabled){background:linear-gradient(180deg, var(--select-blue-hover,#1878f3), var(--select-blue,#0867e8));color:#fff}.xp-stepper button:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 1px #ffffff1a}.xp-stepper button:disabled{opacity:.35;cursor:default}.xp-stepper button:focus-visible{outline-offset:1px;outline:2px solid #78b6ff}.xp-stepper input{color:#fff;min-width:0;font:900 24px/1 var(--body-font);letter-spacing:-.01em;text-align:center;font-variant-numeric:tabular-nums;-webkit-appearance:textfield;appearance:textfield;background:0 0;border:0}.xp-stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.xp-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.xp-stepper input:focus{outline:0}.xp-stepper input::placeholder{color:#6f88ab;font:800 15px/1 var(--body-font);letter-spacing:0;opacity:1}.xp-stepper:has(input:placeholder-shown){border-style:dashed;border-color:#4a6f9f}.xp-quick{gap:6px;display:inline-flex}.xp-quick button{color:#cfe2ff;min-width:46px;height:28px;font:900 12px/1 var(--body-font);font-variant-numeric:tabular-nums;cursor:pointer;background:#0b1830;border:1px solid #3a5a86;border-radius:8px;padding:0 10px;transition:background .15s,border-color .15s,color .15s;position:relative}.xp-quick button:after{content:"";position:absolute;inset:-8px -3px}.xp-quick button:hover{color:#fff;border-color:#6fbeff}.xp-quick button.is-on{border-color:var(--select-blue-border,#4398ff);background:var(--select-blue,#0867e8);color:#fff}.xp-quick button:focus-visible{outline-offset:2px;outline:2px solid #78b6ff}.xp-days{grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;display:grid}.xp-days button{color:#7f97ba;height:56px;font:900 18px/1 var(--body-font);font-variant-numeric:tabular-nums;cursor:pointer;background:linear-gradient(#0b1830,#08111f);border:1px solid #2f4c76;border-radius:12px;transition:background .15s,border-color .15s,color .15s,transform .1s}.xp-days button:hover{color:#fff;border-color:#6fbeff}.xp-days button:active{transform:translateY(1px)}.xp-days button.is-on{color:#e6f1ff;background:linear-gradient(#1d4880,#143562);border-color:#4398ffaa;box-shadow:inset 0 1px #ffffff1f}.xp-days button.is-current{border-color:var(--select-blue-hover-border,#80b9ff);background:linear-gradient(160deg, var(--select-blue-hover,#1878f3), var(--select-blue,#0867e8));box-shadow:inset 0 1px 0 #ffffff40, 0 6px 16px color-mix(in srgb, var(--select-blue,#0867e8) 40%, transparent);color:#fff}.xp-days button:focus-visible{outline-offset:2px;outline:2px solid #78b6ff}.xp-result{border-top:1px solid #ffffff14;margin-top:26px;padding-top:26px}.xp-road{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px;padding-top:30px;display:grid}.xp-shield{clip-path:polygon(8% 0,92% 0,100% 8%,100% 64%,50% 100%,0 64%,0 8%);text-align:center;filter:drop-shadow(0 10px 18px #0009);place-content:center;width:80px;height:90px;display:grid;position:relative}.xp-shield.is-now{background:linear-gradient(160deg, #5aa8ff, var(--select-blue,#0867e8) 60%, #163f8f);color:#fff}.xp-shield.is-goal{color:#fff;background:linear-gradient(160deg,#d9a6ff,#9a4ff0 55%,#5e23b0)}.xp-shield:before{content:"";clip-path:inherit;pointer-events:none;background:linear-gradient(#ffffff2e,#0000 45%);position:absolute;inset:4px}.xp-shield small{font:900 12px/1 var(--body-font);letter-spacing:.12em;text-transform:uppercase;opacity:.85;margin-top:-10px;display:block}.xp-shield strong{font:900 28px/1 var(--body-font);letter-spacing:-.02em;font-variant-numeric:tabular-nums;text-shadow:0 2px 8px #0006;margin-top:4px;display:block}.xp-road-track{min-width:0;padding:0 8px;position:relative}.xp-blocks{gap:6px;display:flex}.xp-block{background:linear-gradient(#08111f,#0c1a30);border-radius:5px;flex:1 1 0;height:28px;position:relative;overflow:hidden;transform:skew(-16deg);box-shadow:inset 0 0 0 1px #2c4468,inset 0 3px 6px #0008}.xp-block>span{background:linear-gradient(180deg, #7fd0ff 0%, #36a3ff 45%, var(--select-blue,#0867e8) 100%);transition:width .5s var(--mx-ease);position:absolute;inset:0 auto 0 0;box-shadow:inset 0 1px #fff6,0 0 14px #36bfff88}.xp-block>span:after{content:"";background:linear-gradient(90deg,#0000,#fff6,#0000) 0 0/50% 100% no-repeat;animation:2.8s ease-in-out infinite mx-shimmer;position:absolute;inset:0}.xp-block.is-full{box-shadow:inset 0 0 0 1px #80b9ff,0 0 12px #36bfff44}.xp-ticks{height:14px;margin:10px 8px 0;position:relative}.xp-ticks span{color:#8fa8c9;font:800 12px/1 var(--body-font);font-variant-numeric:tabular-nums;white-space:nowrap;position:absolute;top:0;translate:-50%}.xp-ticks span:first-child{translate:0}.xp-ticks span:last-child{translate:-100%}.xp-pace{z-index:2;width:2px;height:64px;transition:left .5s var(--mx-ease);pointer-events:none;background:#fff;border-radius:2px;margin-left:-1px;position:absolute;top:-30px;box-shadow:0 0 10px #9fd8ff}.xp-pace-label{color:#0b1f44;font:800 12px/1 var(--body-font);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;background:#fff;border-radius:7px;padding:5px 9px;position:absolute;bottom:100%;left:50%;translate:-50% -4px;box-shadow:0 6px 14px #0007}.xp-pace-label b{font-variant-numeric:tabular-nums;font-weight:900}.xp-pace.is-start .xp-pace-label{left:-6px;translate:0 -4px}.xp-pace.is-end .xp-pace-label{left:auto;right:-6px;translate:0 -4px}.xp-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:28px;display:grid}.xp-stat{text-align:center;min-width:0;animation:mx-card-in .55s var(--mx-ease) both;animation-delay:calc(var(--i,0) * 60ms);background:linear-gradient(#102340,#0a1526);border:1px solid #2c4468;border-radius:16px;flex-direction:column;align-items:center;gap:8px;padding:18px 10px 16px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff12}.xp-stat-icon{color:#8fd0ff;background:#3aa0ff1f;border-radius:12px;place-items:center;width:38px;height:38px;display:grid;box-shadow:inset 0 0 0 1px #3aa0ff55}.xp-stat strong{color:#fff;font:900 clamp(22px, 2.6vw, 30px)/1 var(--body-font);font-variant-numeric:tabular-nums;letter-spacing:-.02em}.xp-stat>span:not(.xp-stat-icon):not(.sr-only){color:#9fb7d8;font:800 12px/1.2 var(--body-font);letter-spacing:.08em;text-transform:uppercase}.xp-stat.is-main{box-shadow:inset 0 1px 0 #ffffff26, 0 12px 28px color-mix(in srgb, var(--select-blue,#0867e8) 25%, transparent);background:radial-gradient(at 50% 0,#2a7cf05c,#0000 70%),linear-gradient(#13305a,#0b1a33);border-color:#4398ff}.xp-stat.is-main .xp-stat-icon{background:linear-gradient(160deg, var(--select-blue-hover,#1878f3), var(--select-blue,#0867e8));box-shadow:0 6px 14px color-mix(in srgb, var(--select-blue,#0867e8) 40%, transparent);color:#fff}.xp-stat.is-main strong{text-shadow:0 0 22px #36bfff66;font-size:clamp(26px,3vw,36px)}.xp-stat.is-warn{cursor:help;background:radial-gradient(at 50% 0,#f1952d33,#0000 70%),linear-gradient(#2a2126,#141320);border-color:#f1952d;box-shadow:inset 0 1px #ffffff1a}.xp-stat.is-warn .xp-stat-icon{color:#ffcf96;background:#f1952d33;box-shadow:inset 0 0 0 1px #f1952d}.xp-stat.is-warn strong{color:#ffcf96;text-shadow:none}.xp-verdict{color:#e8eef9;min-height:52px;font:700 15px/1.35 var(--body-font);text-align:center;border:1px solid #0000;border-radius:14px;justify-content:center;align-items:center;gap:10px;margin:16px auto 0;padding:10px 18px;transition:background .3s,border-color .3s;display:flex}.xp-verdict b{font-variant-numeric:tabular-nums;font-weight:900}.xp-verdict-icon{border-radius:50%;flex:none;place-items:center;width:30px;height:30px;display:grid}.xp-verdict[data-state=ahead],.xp-verdict[data-state=done]{background:#35d84a14;border-color:#35d84a55}.xp-verdict[data-state=ahead] .xp-verdict-icon,.xp-verdict[data-state=done] .xp-verdict-icon{color:#9dffb0;background:#35d84a2e}.xp-verdict[data-state=ahead] b,.xp-verdict[data-state=done] b{color:#9dffb0}.xp-verdict[data-state=behind]{background:#f1952d14;border-color:#f1952d66}.xp-verdict[data-state=behind] .xp-verdict-icon{color:#ffcf96;background:#f1952d2e}.xp-verdict[data-state=behind] b{color:#ffcf96}.xp-verdict[data-state=plan],.xp-verdict[data-state=ask]{background:#4398ff14;border-color:#4398ff55}.xp-verdict[data-state=plan] .xp-verdict-icon,.xp-verdict[data-state=ask] .xp-verdict-icon{color:#9fd0ff;background:#4398ff2e}.xp-verdict[data-state=plan] b{color:#9fd0ff}.xp-page .mx-mode:before{content:"";background:var(--xp-blue);height:2px;box-shadow:0 0 14px var(--xp-blue);border-radius:0 0 4px 4px;position:absolute;inset:0 26% auto}.xp-page .mx-mode[data-capped]:before{background:#f1952d;box-shadow:0 0 14px #f1952d}.xp-page .mx-mode-main strong{font-size:44px}@media (max-width:760px){.xp-inputs{grid-template-columns:minmax(0,1fr)}.xp-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.xp-stat>span:not(.xp-stat-icon):not(.sr-only){place-items:center;min-height:2.4em;display:grid}.xp-verdict{min-height:64px;font-size:14px}}@media (max-width:600px){.xp-chip{white-space:nowrap;gap:6px;min-height:38px;padding:0 10px;font-size:13px}.xp-chip svg{width:14px;height:14px}}@media (max-width:560px){.xp-board{border-radius:18px;padding:16px 14px 18px}.xp-group{padding:16px 14px 18px}.xp-days{gap:5px}.xp-days button{height:48px;font-size:16px}.xp-road{gap:10px;padding-top:34px}.xp-shield{width:58px;height:66px}.xp-shield small{letter-spacing:.06em;margin-top:-8px;font-size:12px}.xp-shield strong{font-size:20px}.xp-road-track{padding:0 4px}.xp-blocks{gap:3px}.xp-block{border-radius:3px;height:22px;transform:skew(-12deg)}.xp-pace{height:58px;top:-30px}.xp-ticks{margin:8px 4px 0}.xp-ticks span:nth-child(2),.xp-ticks span:nth-child(4){display:none}}@media (prefers-reduced-motion:reduce){.xp-board,.xp-stat,.xp-block>span:after{animation:none}.xp-block>span,.xp-pace,.xp-verdict{transition:none}}@supports not (color:color-mix(in srgb, red 50%, blue)){.xp-group{background:#0a1526d9}}
