.flow3d{--sans:var(--font-sans,-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif);--mono:ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;--ease-out:cubic-bezier(.23, 1, .32, 1);font-family:var(--sans);font-variant-numeric:tabular-nums;line-height:1.6}.flow3d *,.flow3d :before,.flow3d :after{box-sizing:border-box}.flow3d button{font-family:inherit}.flow3d{--st-bg:#0a0d18;--st-ink:#e9ecf5;--st-muted:#8e97b3;--st-edge:#e9ecf51a;color:var(--st-ink);background:radial-gradient(120% 90% at 25% -10%, #1d2447 0%, #0e1224 45%, var(--st-bg) 75%);margin:0;padding:0;position:relative}.flow3d .labels{pointer-events:none;position:absolute;inset:0}.flow3d .gl3{position:absolute;inset:0;overflow:hidden}.flow3d .gl3 canvas{display:block}.flow3d .tags3{pointer-events:none;position:absolute;inset:0;overflow:hidden}.flow3d .tag3{font:600 11px/1 var(--sans);white-space:nowrap;background:#0a0d18d9;border:1px solid;border-radius:999px;padding:4px 8px;position:absolute;top:0;left:0}.flow3d .tag3.block{color:#ffb347}.flow3d .tag3.up{color:#ff5a67}.flow3d .tag3.down{color:#4f95ff}.flow3d .tag3.swap{color:#ffe300}.flow3d .hint{right:16px;bottom:calc(58px + env(safe-area-inset-bottom));color:var(--st-muted);pointer-events:none;text-align:right;max-width:46%;font-size:11px;position:absolute}.flow3d [data-scene]{position:relative}.flow3d .c-view{height:100dvh;position:relative;overflow:hidden}.flow3d [data-scene]:fullscreen{background:#0a0d18;flex-direction:column;height:100%;display:flex}.flow3d [data-scene]:fullscreen .c-view{flex:1;height:auto}.flow3d [data-scene] .gl3 canvas{touch-action:pan-y}.flow3d .c-nav{left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:2;align-items:center;gap:8px;display:flex;position:absolute}.flow3d .chips{scrollbar-width:none;flex:1;min-width:0;padding:2px 0;display:flex;overflow-x:auto}.flow3d .chips-in{gap:6px;margin:0 auto;padding:0 2px;display:flex}.flow3d .chips::-webkit-scrollbar{display:none}.flow3d .chips button,.flow3d .ctrl button{font:600 12px/1 var(--sans);color:var(--st-ink);border:1px solid var(--st-edge);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .18s var(--ease-out), transform .12s var(--ease-out);background:#0a0d18b8;border-radius:999px;flex:none;padding:8px 12px}.flow3d .chips button:hover,.flow3d .ctrl button:hover{background:#283050cc}.flow3d .chips button:active,.flow3d .ctrl button:active{transform:scale(.96)}.flow3d .chips button[aria-pressed=true]{color:#191919;background:#ffe300;border-color:#ffe300}.flow3d .chips button.u{color:#ff8a93}.flow3d .chips button.d{color:#7fb2ff}.flow3d .chips button.u[aria-pressed=true],.flow3d .chips button.d[aria-pressed=true]{color:#191919}.flow3d .chips button:focus-visible,.flow3d .ctrl button:focus-visible{outline-offset:2px;outline:2px solid #7fe7ff}.flow3d .ctrl{flex:none;gap:6px;display:flex}.flow3d .ctrl button{width:34px;height:30px;padding:0;font-size:15px}@media (max-width:767px){.flow3d .hint{display:none}}.flow3d [data-scene] .labels{overflow:hidden}.flow3d .n3{pointer-events:auto;cursor:pointer;text-align:center;white-space:nowrap;font:700 12px/1.25 var(--sans);color:var(--st-ink);border:1px solid color-mix(in srgb, var(--ac) 55%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .18s var(--ease-out), border-color .18s var(--ease-out);background:#0a0d18bd;border-radius:10px;gap:1px;padding:5px 9px;display:grid;position:absolute;top:0;left:0}.flow3d .n3 span{font:600 10px/1.2 var(--mono);color:var(--ac)}.flow3d .n3:hover{background:#1e2646e6}.flow3d .n3.on{border-color:var(--ac);box-shadow:0 0 16px color-mix(in srgb, var(--ac) 45%, transparent)}.flow3d .n3:focus-visible{outline-offset:2px;outline:2px solid #7fe7ff}.flow3d .l3{pointer-events:none;font:600 10px/1 var(--sans);white-space:nowrap;opacity:.9;background:#0a0d188c;border-radius:6px;padding:3px 6px;position:absolute;top:0;left:0}.flow3d .hero3{pointer-events:none;font:700 11px/1 var(--mono);color:#191919;white-space:nowrap;background:#ffe300;border-radius:999px;padding:4px 8px;position:absolute;top:0;left:0;box-shadow:0 0 14px #ffe30080}.flow3d .p3{pointer-events:auto;cursor:pointer;text-align:center;white-space:nowrap;font:700 11px/1.25 var(--sans);color:var(--st-ink);border:1px solid color-mix(in srgb, var(--ac) 50%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a0d18bd;border-radius:8px;gap:1px;padding:3px 7px;display:grid;position:absolute;top:0;left:0}.flow3d .p3 span{font:600 10px/1.2 var(--mono);color:var(--ac)}.flow3d .p3.compact b{display:none}.flow3d .p3:focus-visible{outline-offset:2px;outline:2px solid #7fe7ff}.flow3d .fallback{color:var(--st-muted);place-items:center;margin:0;font-size:14px;display:grid;position:absolute;inset:0}.flow3d .sr{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.flow3d figcaption{color:var(--st-muted);margin-top:10px;font-size:12px}.flow3d figcaption b{color:var(--st-ink)}.flow3d .focus-card{--ac:#ffe300;background:linear-gradient(115deg, color-mix(in srgb, var(--ac) 9%, #0f1324) 0%, #0d1120 45%, #0a0d18 100%);border:1px solid color-mix(in srgb, var(--ac) 22%, #e9ecf514);min-height:136px;box-shadow:inset 0 1px 0 #ffffff0d, 0 18px 36px -30px color-mix(in srgb, var(--ac) 45%, transparent);transition:border-color .3s var(--ease-out), box-shadow .3s var(--ease-out);border-radius:16px;align-items:start;gap:16px 28px;margin-top:12px;padding:18px 18px 20px;display:grid;position:relative;overflow:hidden}.flow3d .focus-card:before{content:"";background:linear-gradient(90deg, transparent, var(--ac), transparent);opacity:.8;height:1px;position:absolute;top:0;left:8%;right:8%}@media (min-width:760px){.flow3d .focus-card{grid-template-columns:minmax(250px,320px) 1fr;padding:22px 26px}.flow3d .focus-card .fc-head{border-right:1px solid #e9ecf514;min-height:100%;padding-right:26px}}.flow3d .focus-card.swap>*{animation:f3CardIn .34s var(--ease-out)}@keyframes f3CardIn{0%{opacity:0;transform:translateY(5px)}}.flow3d .focus-card .fc-head{min-width:0}.flow3d .fc-k{letter-spacing:.08em;color:var(--ac);align-items:center;gap:8px;font-size:11px;font-weight:600;display:flex}.flow3d .fc-k i{background:var(--ac);width:7px;height:7px;box-shadow:0 0 10px var(--ac);border-radius:50%}.flow3d .focus-card h3{font:700 22px/1.25 var(--sans);color:var(--st-ink);letter-spacing:-.015em;text-wrap:balance;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0 0;display:flex}.flow3d .fc-code{font-family:var(--mono);letter-spacing:0;font-weight:600}.flow3d .fc-chip{font:600 11px/1 var(--mono);color:var(--ac);border:1px solid color-mix(in srgb, var(--ac) 45%, transparent);background:color-mix(in srgb, var(--ac) 8%, transparent);border-radius:999px;padding:5px 9px}.flow3d .fc-rule{color:#9aa3bd;margin-top:6px;font-size:12px;line-height:1.5}.flow3d .fc-pill{font:600 11px/1 var(--sans);border-radius:999px;margin-top:12px;padding:7px 11px;display:inline-block}.flow3d .fc-pill.p-c{color:#7fe7ff;background:#7fe7ff1a}.flow3d .fc-pill.p-w{color:#ffb347;background:#ffb3471c}.flow3d .fc-pill.p-n{color:#9aa3bd;background:#e9ecf50f}.flow3d .fc-tiles{grid-template-columns:repeat(var(--n,3), minmax(0, 1fr));gap:12px 16px;margin-top:16px;display:grid}.flow3d .fc-tile{min-width:0}.flow3d .fc-tile span{letter-spacing:.06em;color:#7f88a3;font-size:10px;display:block}.flow3d .fc-tile b{font:600 20px/1.1 var(--mono);color:var(--st-ink);margin-top:3px;transition:color .2s;display:block}.flow3d .fc-tile .t-u{color:#ff5a67}.flow3d .fc-tile .t-d{color:#4f95ff}.flow3d .fc-tile .t-y{color:#ffe300}.flow3d .fc-tile .t-c{color:#7fe7ff}.flow3d .fc-tile .t-w{color:#ffb347}.flow3d .fc-facts{gap:11px 34px;margin:0;padding:2px 0 0;list-style:none;display:grid}@media (min-width:1000px){.flow3d .fc-facts{grid-template-columns:1fr 1fr}}.flow3d .fc-facts li{color:#c9cfe0;padding-left:18px;font-size:13px;line-height:1.6;position:relative}.flow3d .fc-facts li:before{content:"";background:var(--ac);width:6px;height:6px;box-shadow:0 0 8px color-mix(in srgb, var(--ac) 70%, transparent);position:absolute;top:.6em;left:1px;transform:rotate(45deg)}.flow3d .fc-legend{gap:14px 34px;margin:0;padding:2px 0 0;list-style:none;display:grid}@media (min-width:1000px){.flow3d .fc-legend{grid-template-columns:1fr 1fr}}.flow3d .fc-legend li{grid-template-columns:34px 1fr;align-items:start;gap:12px;display:grid}.flow3d .fc-legend li i{background:linear-gradient(90deg, transparent, var(--lc));height:2px;box-shadow:0 0 8px var(--lc);border-radius:2px;margin-top:8px;position:relative}.flow3d .fc-legend li i:after{content:"";background:var(--lc);width:8px;height:8px;box-shadow:0 0 10px var(--lc);border-radius:50%;position:absolute;top:-3px;right:-3px}.flow3d .fc-legend b{color:var(--st-ink);font-size:12px;font-weight:700;display:block}.flow3d .fc-legend span{color:#aab2c9;margin-top:3px;font-size:12px;line-height:1.55;display:block}.flow3d .fc-rail{grid-template-columns:repeat(8,minmax(0,1fr));margin:0;padding:6px 0 0;list-style:none;display:grid}.flow3d .fc-rail li{text-align:center;align-content:start;justify-items:center;gap:7px;padding:0 4px;display:grid;position:relative}.flow3d .fc-rail li:before{content:"";background:#e9ecf51a;width:calc(100% - 18px);height:2px;position:absolute;top:6px;left:calc(50% + 9px)}.flow3d .fc-rail li:last-child:before{display:none}.flow3d .fc-rail li.done:before{background:linear-gradient(90deg,#7fe7ff,#7fe7ff59)}.flow3d .fc-rail li i{z-index:1;background:#0a0d18;border:2px solid #e9ecf538;border-radius:50%;width:14px;height:14px;position:relative}.flow3d .fc-rail li.done i{background:#7fe7ff;border-color:#7fe7ff;box-shadow:0 0 10px #7fe7ff8c}.flow3d .fc-rail li.now i{background:#ffe300;border-color:#ffe300;box-shadow:0 0 12px #ffe30099}.flow3d .fc-rail li.now i:after{content:"";animation:f3RailPing 1.5s var(--ease-out) infinite;border:2px solid #ffe300;border-radius:50%;position:absolute;inset:-6px}.flow3d .fc-rail li.block i{background:#ffb347;border-color:#ffb347;border-radius:3px;transform:rotate(45deg);box-shadow:0 0 12px #ffb34799}.flow3d .fc-rail li b{color:#5f6883;white-space:nowrap;font-size:12px;font-weight:600}.flow3d .fc-rail li.done b,.flow3d .fc-rail li.now b{color:var(--st-ink)}.flow3d .fc-rail li.block b{color:#ffb347}.flow3d .fc-rail li span{font:500 11px/1.45 var(--mono);color:#8e97b3;overflow-wrap:anywhere;-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.flow3d .fc-rail li.block span{color:#ffb347}.flow3d .fc-rail li.now span{color:#ffe300}@keyframes f3RailPing{0%{opacity:.9;transform:scale(.55)}to{opacity:0;transform:scale(1.5)}}@media (max-width:759px){.flow3d .fc-rail{grid-template-columns:1fr;padding:0}.flow3d .fc-rail li{text-align:left;grid-template-columns:14px auto 1fr;place-items:center start;gap:12px;padding:6px 0}.flow3d .fc-rail li:before{width:2px;height:calc(100% - 6px);top:calc(50% + 9px);left:6px}.flow3d .fc-rail li.done:before{background:#7fe7ff}.flow3d .fc-rail li span{-webkit-line-clamp:1;text-align:right;justify-self:end}}@media (prefers-reduced-motion:reduce){.flow3d .fc-rail li.now i:after,.flow3d .focus-card.swap>*{animation:none}}.flow3d{margin:0}.flow3d .fc-legend li{grid-template-columns:34px 1fr;align-items:center}.flow3d .fc-legend li i{margin-top:0}@media (min-width:1000px){.flow3d .fc-legend{grid-template-columns:1fr 1fr 1fr}}@media (max-width:639px){.flow3d .c-nav{left:12px;right:12px}.flow3d .l3{display:none}.flow3d .n3{padding:3px 7px;font-size:11px}.flow3d .n3 span{display:none}.flow3d .focus-card{gap:12px;min-height:0;margin-top:8px;padding:14px}.flow3d figcaption{margin-top:8px}.flow3d .focus-card h3{font-size:18px}.flow3d .fc-legend{gap:8px}.flow3d .fc-tiles{margin-top:12px}}.flow3d .hud3{pointer-events:none;z-index:1;position:absolute;inset:0;overflow:hidden}.flow3d .hud3 .hc{pointer-events:auto;cursor:pointer;visibility:hidden;text-align:left;min-width:128px;color:var(--st-ink);border:1px solid color-mix(in srgb, var(--hc,#8e97b3) 40%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:border-color .18s var(--ease-out), background .18s var(--ease-out);background:#0c1020c7;border-radius:12px;padding:9px 13px 10px;position:absolute;top:0;left:0;box-shadow:0 10px 28px -16px #000c}.flow3d .hud3 .hc:hover{background:#1c2442db}.flow3d .hud3 .hc[aria-pressed=true]{border-color:var(--hc,#8e97b3);box-shadow:0 0 18px color-mix(in srgb, var(--hc,#8e97b3) 40%, transparent)}.flow3d .hud3 .hc:focus-visible{outline-offset:2px;outline:2px solid #7fe7ff}.flow3d .hud3 span:before{content:"";vertical-align:1px;background:var(--hc,#e9ecf54d);border-radius:50%;width:6px;height:6px;margin-right:7px;display:inline-block}.flow3d .hud3 span{letter-spacing:.06em;color:#9aa3bd;white-space:nowrap;font-size:11px;font-weight:600;display:block}.flow3d .hud3 b{font:600 22px/1.1 var(--mono);color:var(--st-ink);white-space:nowrap;align-items:baseline;gap:5px;margin-top:4px;display:flex}.flow3d .hud3 i{font-style:normal}.flow3d .hud3 em{font:600 11px/1 var(--sans);color:#6c7590;margin-right:8px;font-style:normal}.flow3d .hud3 em:last-child{margin-right:0}.flow3d .hud3 .u{color:#ff5a67}.flow3d .hud3 .d{color:#4f95ff}.flow3d .hud3 .y{color:#ffe300}.flow3d .hud3 .w{color:#ffb347}@media (max-width:767px){.flow3d .c-view{--hud-top:120px;--hud-bottom:124px}.flow3d .hud3{inset:auto 0 calc(58px + env(safe-area-inset-bottom)) 0;scrollbar-width:none;pointer-events:auto;gap:8px;padding:0 12px;display:flex;overflow-x:auto}.flow3d .hud3::-webkit-scrollbar{display:none}.flow3d .hud3 .hc{border-radius:10px;flex:none;min-width:112px;padding:7px 10px 8px;position:static;visibility:visible!important;transform:none!important}.flow3d .hud3 span:before{width:5px;height:5px;margin-right:5px}.flow3d .hud3 span{letter-spacing:.02em;font-size:10px}.flow3d .hud3 b{gap:3px;margin-top:3px;font-size:18px}.flow3d .hud3 em{margin-right:5px;font-size:10px}}:root:has(.intro-page) body{background:#070a14}.intro-page{color:#eef1f8;min-height:100dvh;font-family:var(--font-sans,-apple-system, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif);background:radial-gradient(1100px 560px at 12% -8%,#3d5cdc38,#0000 62%),radial-gradient(760px 420px at 92% 4%,#ffe3000f,#0000 60%),#070a14}.intro-page .intro-wrap{max-width:1200px;padding:8px 16px calc(48px + env(safe-area-inset-bottom));margin:0 auto}@media (min-width:640px){.intro-page .intro-wrap{padding-left:24px;padding-right:24px}}.intro-page a{color:inherit;text-decoration:none}.intro-stage{position:relative}.intro-head{z-index:3;padding:calc(12px + env(safe-area-inset-top)) 16px 28px;pointer-events:none;background:linear-gradient(#070a14d1 0%,#070a1473 60%,#0000 100%);justify-content:space-between;align-items:center;display:flex;position:absolute;top:0;left:0;right:0}.intro-head>a{pointer-events:auto}@media (min-width:640px){.intro-head{padding-left:24px;padding-right:24px}}.intro-brand{align-items:center;gap:10px;display:inline-flex}.intro-mark{background:#ffe300;border-radius:9px;place-items:center;width:30px;height:30px;display:grid;box-shadow:0 0 0 1px #ffe30059,0 6px 18px -6px #ffe3008c}.intro-brand b{letter-spacing:-.01em;color:#f4f6fb;font-size:16px;font-weight:700}.intro-brand b span{color:#8b93ad;font-weight:600}.intro-login{transition:background .18s var(--ease-out,ease), border-color .18s var(--ease-out,ease);background:#ffffff08;border:1px solid #e9ecf52e;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600}.intro-login:hover{background:#ffffff14;border-color:#e9ecf54d}.intro-login:focus-visible,.intro-cta a:focus-visible{outline-offset:2px;outline:2px solid #7fe7ff}.intro-hero{left:16px;right:16px;top:calc(64px + env(safe-area-inset-top));z-index:3;pointer-events:none;position:absolute}@media (min-width:640px){.intro-hero{left:24px;right:auto;top:calc(72px + env(safe-area-inset-top));max-width:min(520px,60vw)}}.intro-kicker{letter-spacing:.04em;color:#aab2c9;text-shadow:0 1px 8px #070a14e6;align-items:center;gap:10px;margin:0;font-size:12px;font-weight:600;display:flex}.intro-kicker i{background:#ffe300;border-radius:2px;width:22px;height:2px;box-shadow:0 0 10px #ffe30099}.intro-hero h1{letter-spacing:-.03em;color:#f4f6fb;white-space:nowrap;text-shadow:0 2px 14px #070a14f2;margin:8px 0 0;font-size:22px;font-weight:800;line-height:1.15}@media (min-width:640px){.intro-hero h1{white-space:normal;text-wrap:balance;max-width:20ch;font-size:30px}}@media (min-width:1024px){.intro-hero h1{font-size:34px}}.intro-hero h1 em{color:#ffe300;text-shadow:0 0 28px #ffe30040,0 2px 14px #070a14f2;font-style:normal}.intro-rules{flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0;list-style:none;display:flex}.intro-rules li{color:#c9cfe0;background:#ffffff06;border:1px solid #e9ecf51a;border-radius:999px;align-items:center;gap:8px;padding:9px 14px;font-size:13px;font-weight:600;display:flex}.intro-rules li:before{content:"";background:#7fe7ff;width:6px;height:6px;transform:rotate(45deg)}.intro-cta{background:linear-gradient(110deg,#ffe30012,#ffffff05 55%);border:1px solid #ffe3002e;border-radius:16px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;padding:18px 20px;display:flex}.intro-cta b{color:#f4f6fb;font-size:16px;font-weight:700}.intro-cta a{color:#15171f;background:#ffe300;border-radius:999px;padding:10px 20px;font-size:14px;font-weight:700;box-shadow:0 8px 22px -10px #ffe300b3}@media (min-width:768px){.flow3d .c-view{--hud-top:88px}.flow3d .focus-card{left:16px;bottom:calc(64px + env(safe-area-inset-bottom));overscroll-behavior:contain;z-index:2;background:linear-gradient(115deg, color-mix(in srgb, var(--ac) 9%, #0f1324db) 0%, #0d1120d6 45%, #0a0d18d6 100%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);grid-template-columns:minmax(230px,300px) 1fr;gap:10px 24px;width:min(860px,100% - 32px);min-height:0;max-height:34dvh;margin:0;padding:14px 18px 16px;position:absolute;overflow:auto}.flow3d .focus-card .fc-head{padding-right:22px}.flow3d .focus-card h3{margin-top:6px;font-size:18px}.flow3d .fc-tiles{gap:8px 14px;margin-top:10px}.flow3d .fc-tile b{font-size:18px}.flow3d .fc-pill{margin-top:8px}.flow3d .fc-facts,.flow3d .fc-legend{align-content:center;gap:8px 24px}.flow3d .fc-legend{grid-template-columns:1fr 1fr}.flow3d .fc-rail li span{-webkit-line-clamp:1}.flow3d figcaption{right:24px;top:calc(66px + env(safe-area-inset-top));z-index:3;text-align:right;pointer-events:none;text-shadow:0 1px 8px #070a14e6;margin:0;font-size:11px;position:absolute}}@media (max-width:767px){.flow3d .focus-card{margin:12px 12px 0}.flow3d figcaption{margin:8px 12px 0}}.intro-fallback{min-height:100dvh;padding:150px 16px 16px}@media (min-width:640px){.intro-fallback{padding:170px 24px 24px}}
