.fluid-play-root{color:#f0f4ff;background:#07111f;font-family:var(--font-geist-sans),"Apple SD Gothic Neo",sans-serif;-webkit-font-smoothing:antialiased}.fluid-play-root *,.fluid-play-root :after,.fluid-play-root :before{box-sizing:border-box}.fluid-play-root a,.fluid-play-root button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}.fluid-play-root button{font:inherit;cursor:pointer}.fluid-play-root button:disabled{opacity:.35;cursor:default}.fluid-play-root a:focus-visible,.fluid-play-root button:focus-visible{outline:3px solid #fff1bb;outline-offset:4px}.fluid-play-root svg{width:24px;height:24px;flex-shrink:0}.fp-playground{--fp-edge:clamp(12px,2vw,28px);--fp-top:max(var(--fp-edge),env(safe-area-inset-top));--fp-bottom:max(var(--fp-edge),env(safe-area-inset-bottom));--fp-left:max(var(--fp-edge),env(safe-area-inset-left));--fp-right:max(var(--fp-edge),env(safe-area-inset-right));position:fixed;inset:0;height:100dvh;overflow:hidden;isolation:isolate;background:#07111f;user-select:none}.fp-playground:fullscreen{height:100%}.fp-canvas-stage,.fp-viewport{position:absolute;inset:0}.fp-canvas-stage{outline:none}.fp-canvas-stage:focus-visible{box-shadow:inset 0 0 0 3px #fff1bb}.fp-viewport canvas{display:block;width:100%;height:100%;touch-action:none}.fp-header{position:absolute;top:var(--fp-top);left:var(--fp-left);right:var(--fp-right);justify-content:space-between;pointer-events:none}.fp-brand,.fp-header{display:flex;align-items:center;gap:12px}.fp-brand{min-width:0}.fp-brand h1{font-size:21px;line-height:1.3;font-weight:800;letter-spacing:-.05em;white-space:nowrap;margin:0;text-shadow:0 2px 16px #07111f}.fp-brand p{margin:4px 0 0;color:#a4b3ca;font-size:11px}.fp-back{place-items:center;flex-shrink:0;border:1px solid #b7c8e41a;border-radius:50%;color:#c6d1e4;background:#0c182bcc;pointer-events:auto}.fp-back,.fp-brand-mark{display:grid;width:44px;height:44px}.fp-brand-mark{place-items:center;color:#b6a1ff;background:linear-gradient(140deg,#a78bfa22,#6edfff15);border-radius:16px}.fp-brand-mark svg{width:30px;height:30px}.fp-actions{display:flex;align-items:center;gap:6px;pointer-events:auto}.fp-action{min-width:44px;height:46px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;color:#d7e0ef;background:#0e1a2cdb;border:1px solid #b7c8e424;border-radius:16px;backdrop-filter:blur(16px)}.fp-action span{font-size:12px;font-weight:600;white-space:nowrap}.fp-action svg{width:19px;height:19px}.fp-action[aria-pressed=true]{background:#183545e8;border-color:#7ee1dd80;color:#aefff0}.fp-clear{margin-left:6px}.fp-fullscreen{padding:0;width:46px}.fp-glass{border:1px solid #bacbff26;background:#0c1829e8;box-shadow:0 12px 45px #0004,inset 0 1px 0 #ffffff08;backdrop-filter:blur(20px)}.fp-welcome{position:absolute;top:44%;left:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;width:max-content;max-width:calc(100% - 180px)}.fp-welcome-art{position:relative;width:100px;height:88px;margin:0 auto 24px;display:grid;place-items:center}.fp-welcome-art i{position:absolute;width:54px;height:64px;border-radius:45% 55% 60% 40%;background:linear-gradient(145deg,#73e5ff,#3b85e6);transform:rotate(-22deg) translate(-14px);opacity:.85;box-shadow:0 0 35px #69dcff25}.fp-welcome-art i:nth-child(2){background:linear-gradient(145deg,#dd9bff,#8249df);transform:rotate(35deg) translate(12px,-3px);mix-blend-mode:screen}.fp-welcome-art i:nth-child(3){width:26px;height:32px;background:#f9a3d6;transform:rotate(20deg) translate(35px,15px)}.fp-welcome-art svg{position:relative;width:38px;height:38px;color:#fff;transform:rotate(-10deg);filter:drop-shadow(0 2px 6px #142345)}.fp-eyebrow{display:block;color:#9bafc9;font-size:12px;letter-spacing:.13em;margin-bottom:14px}.fp-welcome h2{margin:0;font-size:clamp(32px,4.1vw,55px);font-weight:800;line-height:1.24;letter-spacing:-.07em}.fp-welcome h2 em{font-style:normal;background:linear-gradient(110deg,#99e5ff,#c1b1ff 52%,#ffb9d7);background-clip:text;-webkit-text-fill-color:transparent}.fp-welcome p{color:#c2cee0;font-size:14px;line-height:1.8;margin:18px 0 14px}.fp-finger-hint{display:inline-block;padding:8px 13px;color:#8c9fb9;border:1px dashed #8ca9d133;border-radius:30px;font-size:11px}.fp-portrait-break{display:none}.fp-tool-dock{position:absolute;right:var(--fp-right);top:calc(50% - 26px);transform:translateY(-50%);display:flex;gap:8px;padding:10px;border-radius:24px}.fp-tool-options{display:flex;gap:inherit}.fp-tool-options[hidden]{display:none}.fp-dock-toggle{position:absolute;right:calc(100% + 6px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:0;border:1px solid #bacbff40;border-radius:16px;color:#c6d1e4;background:#0c1829e8;box-shadow:0 4px 18px #0003;backdrop-filter:blur(20px)}.fp-dock-toggle[aria-expanded=true] svg{width:20px;height:20px;transform:rotate(180deg)}.fp-dock-toggle span{font-size:11px;font-weight:600}.fp-tool-dock[data-collapsed=true]{padding:0;border:0;background:transparent;box-shadow:none;backdrop-filter:none}.fp-tool-dock[data-collapsed=true] .fp-dock-toggle{position:static;transform:none;width:56px;height:62px;color:var(--fp-paint);border-color:color-mix(in srgb,var(--fp-paint) 38%,transparent)}.fp-size,.fp-sizes,.fp-tool,.fp-tools{display:flex;flex-direction:column;gap:6px}.fp-size,.fp-tool{width:58px;min-height:60px;padding:7px 2px;border:1px solid transparent;border-radius:16px;align-items:center;justify-content:center;color:#98aac3;background:transparent}.fp-size span,.fp-tool span{font-size:11px;font-weight:600;white-space:nowrap}.fp-size[aria-pressed=true],.fp-tool[aria-pressed=true]{color:var(--fp-paint);background:color-mix(in srgb,var(--fp-paint) 12%,transparent);border-color:color-mix(in srgb,var(--fp-paint) 38%,transparent)}.fp-sizes{position:relative;padding-left:8px;border-left:1px solid #a5bde91a}.fp-size{width:44px}.fp-size i{border-radius:50%;background:currentColor;display:block}.fp-dock-label{position:absolute;top:-32px;left:8px;right:0;text-align:center;color:#91a4be;font-size:10px}.fp-bottom{position:absolute;bottom:var(--fp-bottom);left:var(--fp-left);right:var(--fp-right);flex-direction:column;gap:12px;pointer-events:none}.fp-bottom,.fp-tool-hint{display:flex;align-items:center}.fp-tool-hint{margin:0;justify-content:center;gap:10px;font-size:11px;line-height:1.5;color:#b5c6dd;text-shadow:0 2px 8px #000}.fp-tool-hint b{color:var(--fp-paint);font-weight:600}.fp-palette{gap:5px;border-radius:26px;padding:10px 12px;pointer-events:auto}.fp-color,.fp-palette{display:flex;align-items:center;justify-content:center}.fp-color{width:52px;height:62px;flex-direction:column;gap:7px;color:#a5b6ce;padding:0;background:transparent;border:1px solid transparent;border-radius:16px}.fp-color-drop{width:33px;height:33px;display:grid;place-items:center;border-radius:45% 55% 48% 52%;background:var(--swatch);color:#102032;font-weight:900;font-size:20px;box-shadow:inset 0 2px 3px #fff4,inset 0 -3px 4px #0002;transition:transform .18s ease}.fp-color-name{font-size:10px;font-weight:600}.fp-color[aria-pressed=true]{color:#f3f7ff;background:#ffffff0b}.fp-color[aria-pressed=true] .fp-color-drop{outline:2px solid #fff;outline-offset:3px;transform:rotate(-8deg)}.fp-rainbow .fp-color-drop{background:conic-gradient(#ff8faa,#ffc36b,#f6f38a,#7ce6b6,#6cdbff,#b293ff,#ff8faa);border-radius:50%}.fp-palette-divider{width:1px;height:34px;background:#c5d5f529;margin:0 3px}.fp-center-message{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:20px;pointer-events:none}.fp-center-message h2{font-size:22px;font-weight:700;letter-spacing:-.04em;margin:0}.fp-center-message p{font-size:12px;line-height:1.7;color:#adbed5;margin:0}.fp-center-message button{pointer-events:auto}.fp-pause-message{bottom:80px;text-shadow:0 2px 12px #000}.fp-pause-message button{display:grid;place-items:center;width:76px;height:76px;margin-bottom:6px;color:#0b1e2b;background:var(--fp-paint);border:6px solid #fff5;border-radius:28px;box-shadow:0 0 50px #0005}.fp-error-backdrop{position:absolute;inset:80px 0 125px;background:#07111fe8}.fp-retry{border:1px solid #aacbff70;border-radius:18px;min-height:48px;padding:0 24px;color:#fff;background:#24395a;margin-top:8px}.fp-loading-dot{width:18px;height:18px;border-radius:50%;background:#81dfff;box-shadow:0 0 35px #81dfff70}.fp-rotation-hint{display:none}.fp-toast{position:absolute;top:calc(var(--fp-top) + 62px);left:50%;transform:translateX(-50%);display:flex;align-items:center;max-width:calc(100% - 24px);width:max-content;padding:4px 4px 4px 16px;border:1px solid #9ab1d04d;border-radius:18px;background:#16243bf5;box-shadow:0 4px 20px #0003}.fp-toast span{font-size:12px;line-height:1.6}.fp-rotation-hint button,.fp-toast button{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border:0;background:transparent;color:#b7c9e3;border-radius:12px}.fp-rotation-hint svg,.fp-toast svg{width:18px;height:18px}@media (hover:hover){.fp-action:hover:not(:disabled),.fp-back:hover,.fp-dock-toggle:hover{background:#24374ae8}.fp-color:hover:not(:disabled) .fp-color-drop{transform:translateY(-3px) rotate(-8deg)}.fp-size:hover:not(:disabled),.fp-tool:hover:not(:disabled){background:#ffffff0d}}@media (orientation:landscape) and (max-height:500px){.fp-playground{--fp-edge:8px}.fp-brand{gap:8px}.fp-brand h1{font-size:18px}.fp-brand p,.fp-brand-mark,.fp-dock-label,.fp-finger-hint{display:none}.fp-action{height:44px;border-radius:14px;padding:0 11px}.fp-fullscreen{padding:0}.fp-welcome{top:44%;left:45%}.fp-welcome-art{width:58px;height:48px;margin-bottom:12px}.fp-welcome-art i{width:35px;height:40px}.fp-welcome-art i:nth-child(3){width:16px;height:20px}.fp-welcome-art svg{width:27px;height:27px}.fp-welcome h2{font-size:28px}.fp-welcome h2 br{display:none}.fp-welcome h2 em{margin-left:6px}.fp-eyebrow{font-size:10px;margin-bottom:6px}.fp-welcome p{font-size:12px;margin:10px 0 0}.fp-tool-dock{top:calc(50% - 20px);border-radius:20px;padding:7px;gap:4px}.fp-sizes,.fp-tools{gap:4px}.fp-size,.fp-tool{width:48px;min-height:44px;height:44px;padding:3px 0;gap:3px;border-radius:12px}.fp-tool svg{width:20px;height:20px}.fp-size span,.fp-tool span{font-size:10px}.fp-size{width:44px}.fp-sizes{padding-left:4px}.fp-bottom{gap:7px}.fp-palette{padding:6px 8px;border-radius:20px;gap:4px}.fp-color{width:44px;height:50px;gap:4px;border-radius:12px}.fp-color-drop{width:28px;height:28px;font-size:17px}.fp-color-name{font-size:9px}.fp-pause-message{bottom:55px;gap:6px}.fp-pause-message button{width:54px;height:54px;border-width:4px;border-radius:19px}.fp-pause-message h2{font-size:18px}}@media (orientation:portrait){.fp-tool-dock{top:auto;right:auto;left:50%;bottom:calc(var(--fp-bottom) + 134px);transform:translateX(-50%);padding:8px;gap:8px}.fp-dock-toggle{top:auto;bottom:calc(100% + 6px);right:0;transform:none}.fp-dock-toggle[aria-expanded=true] svg{transform:rotate(-90deg)}.fp-sizes,.fp-tools{flex-direction:row;gap:4px}.fp-size,.fp-tool{width:48px;min-height:54px}.fp-dock-label{display:none}.fp-welcome{top:calc(50% - 70px);max-width:calc(100% - 40px)}.fp-rotation-hint{position:absolute;left:50%;top:calc(var(--fp-top) + 62px);transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:0 0 0 14px;border:1px solid #a3b7d124;border-radius:30px;background:#101e31db;white-space:nowrap;color:#9db0cc}.fp-rotation-hint span{font-size:11px}}@media (max-width:600px){.fp-brand{gap:7px}.fp-brand h1{font-size:14px;white-space:normal;width:3.1em}.fp-action span,.fp-brand p,.fp-brand-mark{display:none}.fp-actions{gap:4px}.fp-action{width:44px;height:44px;padding:0;border-radius:14px}.fp-clear{margin-left:0}}@media (orientation:portrait) and (max-width:600px){.fp-playground{--fp-edge:12px}.fp-header{gap:6px}.fp-brand h1{font-size:14px}.fp-tool-dock{bottom:calc(var(--fp-bottom) + 178px)}.fp-palette{display:grid;grid-template-columns:repeat(5,52px);gap:5px 8px;padding:8px 12px;border-radius:24px}.fp-color{height:55px;gap:5px}.fp-palette-divider{display:none}.fp-rainbow{grid-column:5;grid-row:1/3;align-self:stretch;height:auto;border-left-color:#b7caff1a;border-radius:0 16px 16px 0}.fp-rainbow .fp-color-drop{width:36px;height:36px}.fp-color:nth-child(5){grid-row:2;grid-column:1}.fp-color:nth-child(6){grid-row:2;grid-column:2}.fp-color:nth-child(7){grid-row:2;grid-column:3}.fp-color:nth-child(8){grid-row:2;grid-column:4}.fp-tool-hint{flex-direction:column;gap:2px;font-size:10px}.fp-bottom{gap:9px}.fp-welcome{top:calc(50% - 85px)}.fp-welcome h2{font-size:36px}.fp-welcome p{font-size:13px}.fp-portrait-break{display:block}.fp-pause-message{bottom:205px}.fp-error-backdrop{inset:120px 0 265px}}@media (orientation:portrait) and (max-height:740px){.fp-welcome-art{height:45px;margin-bottom:12px;transform:scale(.7)}.fp-welcome h2{font-size:29px}.fp-welcome p{margin:12px 0 0}.fp-finger-hint{display:none}.fp-welcome{top:calc(50% - 70px)}}@media (max-width:360px){.fp-brand h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.fp-brand-mark{display:none;width:32px;height:32px;border-radius:12px}.fp-brand-mark svg{width:25px;height:25px}.fp-back{width:44px}.fp-brand{gap:4px}.fp-actions{gap:2px}.fp-header{gap:3px}.fp-palette{grid-template-columns:repeat(5,44px);gap:5px}.fp-color,.fp-size,.fp-tool{width:44px}.fp-tool-dock{gap:4px;padding:6px}}@media (orientation:portrait) and (max-height:640px){.fp-welcome{top:122px;bottom:calc(var(--fp-bottom) + 256px);transform:translateX(-50%);display:flex;flex-direction:column;justify-content:center}.fp-eyebrow,.fp-welcome p,.fp-welcome-art{display:none}.fp-welcome h2{font-size:26px}}@media (prefers-reduced-motion:reduce){.fluid-play-root *,.fluid-play-root :after,.fluid-play-root :before{animation:none!important;transition:none!important}}