@font-face{font-family:Poppins SemiBold;src:url(/fonts/Poppins-SemiBold.ttf)format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:DejaVu Sans;src:url(/fonts/DejaVuSans.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:DejaVu Sans;src:url(/fonts/DejaVuSans-Bold.ttf)format("truetype");font-weight:700;font-style:normal;font-display:swap}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0a0a0f;--title:#f0eee8;--choose:#918ba1;--name:#e6e8e2;--side-name:#d7dbd6;--sub:#899790;--soon:#838b88;--accent:#8b7ac1;--stage-scale:1}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--title);min-height:100%;margin:0}body{min-height:100dvh;font-family:DejaVu Sans,Segoe UI,sans-serif}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(46% 38% at 50% 34%,#2212388c,#0a0a0f00 70%);position:fixed;inset:0}#app{z-index:1;min-height:100dvh;position:relative}html.stage,html.stage body{height:100%;overflow:hidden}html.stage #app{place-items:center;height:100dvh;display:grid}.frame{width:100%;min-height:100dvh;padding:calc(20px + env(safe-area-inset-top)) 18px calc(28px + env(safe-area-inset-bottom));flex-direction:column;justify-content:center;align-items:center;gap:2px;display:flex;position:relative}html.stage .frame{width:1440px;height:1000px;min-height:0;transform:scale(var(--stage-scale));transform-origin:50%;flex:none;padding:0;display:block}.chart{z-index:0;pointer-events:none;width:100vw;height:100dvh;position:fixed;inset:0;overflow:visible}html.stage .chart{width:100%;height:100%;position:absolute}.title,.choose,.products{z-index:2;margin:0;position:relative}.title{letter-spacing:0;color:var(--title);text-align:center;opacity:0;margin:0;font-family:Poppins SemiBold,DejaVu Sans,sans-serif;font-size:clamp(40px,12vw,64px);font-weight:600;line-height:.9}html.reduced .title{opacity:1!important;transform:none!important}.choose{letter-spacing:3px;color:var(--choose);text-align:center;margin-top:10px;padding-left:3px;font-size:11px;line-height:1}.crown-svg{z-index:1;pointer-events:none;width:min(86vw,420px);height:auto;display:block;position:relative;overflow:visible}.products{grid-template-columns:1fr 1.2fr 1fr;align-items:start;gap:8px;width:min(100%,560px);margin:0;padding:18px 0 0;list-style:none;display:grid}.product{text-align:center;min-width:0}.product a{color:inherit;-webkit-tap-highlight-color:transparent;border-radius:12px;flex-direction:column;align-items:center;text-decoration:none;display:flex}.product a:focus-visible{outline-offset:6px;outline:2px solid #d9c8ff}@media (hover:hover){.product a:hover .name{color:#fff}.product a:hover .accent{opacity:1}}.mark{place-items:center;width:100%;height:96px;display:grid;position:relative;overflow:visible}.glyph{display:inline-grid;position:relative}.glyph .contour,.glyph img{grid-area:1/1}.mark img{z-index:1;background:0 0;display:block;position:relative}.contour{z-index:0;pointer-events:none;position:relative}.contour i{-webkit-mask-image:var(--mark);-webkit-mask-image:var(--mark);mask-image:var(--mark);background:#6860874a;position:absolute;inset:-2px;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:calc(100% - 4px) calc(100% - 4px);mask-size:calc(100% - 4px) calc(100% - 4px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.contour i:first-child{transform:translate(1px)}.contour i:nth-child(2){transform:translate(-1px)}.contour i:nth-child(3){transform:translateY(1px)}.contour i:nth-child(4){transform:translateY(-1px)}.contour i:nth-child(5){transform:translate(1px,1px)}.contour i:nth-child(6){transform:translate(-1px,1px)}.contour i:nth-child(7){transform:translate(1px,-1px)}.contour i:nth-child(8){transform:translate(-1px,-1px)}.paint-mark{background:0 0;width:min(114.484px,100%);height:auto}.pixel .glyph{transform:translateY(-6px)}.pixel-mark{width:96px;height:96px;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;image-rendering:pixelated}.pixel .contour{--pad:1;--nw:96;--nh:96;position:absolute;inset:0}.pixel .contour canvas{left:calc(100% * -1 * var(--pad) / var(--nw));top:calc(100% * -1 * var(--pad) / var(--nh));width:calc(100% * (var(--nw) + 2 * var(--pad)) / var(--nw));height:calc(100% * (var(--nh) + 2 * var(--pad)) / var(--nh));image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;image-rendering:pixelated;pointer-events:none;position:absolute}.gobot-mark{background:0 0;width:100.174px;height:auto}.name,.note{margin:0}.name{color:var(--name);margin-top:8px;font-family:DejaVu Sans,sans-serif;font-weight:700;line-height:1.1}.pixel .name{font-size:21px}.paint .name,.gobot .name{color:var(--side-name);font-size:14px}.note{color:var(--soon);margin-top:4px;font-size:12px;line-height:1.2}.pixel .note{color:var(--sub)}.accent{background:var(--accent);opacity:.95;border:0;width:30px;height:2px;margin:14px auto 0;display:block}html.stage .crown-svg{width:732px;height:732px;position:absolute;top:-42px;left:355px}html.stage .title{font-size:63px;line-height:1;position:absolute;top:590px;left:0;right:0}html.stage .choose{margin-top:0;font-size:11px;position:absolute;top:666px;left:0;right:0}html.stage .products{width:1440px;height:200px;padding:0;display:block;position:absolute;top:731px;left:0}html.stage .product{width:200px;position:absolute;top:0;transform:translate(-50%)}html.stage .paint{left:470px}html.stage .pixel{width:220px;left:720px}html.stage .gobot{left:970px}html.stage .mark{height:96px}html.stage .paint-mark{width:127.205px;height:auto}html.stage .gobot-mark{width:111.304px;height:auto}html.stage .pixel .mark{place-items:start center}html.stage .pixel .glyph{width:192px;height:192px;position:absolute;top:-60px;left:50%;transform:translate(-50%)}html.stage .pixel-mark{width:192px;height:192px}html.stage .pixel .name{font-size:21px}html.stage .paint .name,html.stage .gobot .name{font-size:14px}html.stage .note{margin-top:9px}html.stage .accent{margin-top:24px}@media (width<=420px){.pixel-mark{width:96px;height:96px}.paint-mark{width:min(92.2236px,100%);height:auto}.gobot-mark{width:80.6957px}.mark{height:78px}.pixel .name{font-size:16px}.paint .name,.gobot .name{font-size:12px}.note{font-size:11px}.title{font-size:clamp(34px,11vw,48px)}}@media (prefers-reduced-motion:reduce){.chart [data-motif]{transform:none}}
