@import "https://fonts.googleapis.com/css2?family=Hanken+Grotesk:ital,wght@0,100..900;1,100..900&family=SUSE+Mono:ital,wght@0,100..800;1,100..800&display=swap";:root{font-optical-sizing:auto;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-text-primary:#213547;--color-text-secondary:#fff;--color-background:#f9f1ea;--color-surface:#fff;--color-border:#e1e5e9;--color-surface-hover:#f0f0f0;--color-button:#1c1c1c;--color-button-hover:#2d2d2d;--color-button-active:#3d3d3d;--color-error:#ef4444;font-family:Hanken Grotesk,system-ui,Avenir,Helvetica,Arial,sans-serif;font-style:normal;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root:not([data-theme]){--color-text-primary:#fff;--color-text-secondary:#1c1c1c;--color-background:#1c1c1c;--color-surface:#2d2d2d;--color-border:#2d2d44;--color-surface-hover:#3c3c3c;--color-button:#f5f5f5;--color-button-hover:#4d4d4d;--color-button-active:#5d5d5d}}:root[data-theme=light]{--color-text-primary:#213547;--color-text-secondary:#fff;--color-background:#f9f1ea;--color-surface:#fff;--color-border:#e1e5e9;--color-surface-hover:#f0f0f0;--color-button:#1c1c1c;--color-button-hover:#2d2d2d;--color-button-active:#3d3d3d}:root[data-theme=dark]{--color-text-primary:#fff;--color-text-secondary:#1c1c1c;--color-background:#1c1c1c;--color-surface:#2d2d2d;--color-border:#2d2d44;--color-surface-hover:#3c3c3c;--color-button:#f5f5f5;--color-button-hover:#4d4d4d;--color-button-active:#5d5d5d}*{box-sizing:border-box;margin:0;padding:0}:root{color:var(--color-text-primary);background-color:var(--color-background);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}a{color:var(--color-text-secondary);-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500;transition:color .2s}a:hover{color:var(--color-text-secondary);opacity:.8}body{place-items:center;min-width:320px;min-height:100vh;margin:0;display:flex}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.font-mono{font-optical-sizing:auto;font-family:SUSE Mono,monospace;font-style:normal;font-weight:400;line-height:1.5}.input-wrapper{flex-direction:column;gap:.5rem;width:100%;display:flex}.input-label{color:var(--color-text-primary);-webkit-user-select:none;user-select:none;font-size:.75em;font-weight:500}.input{background-color:var(--color-background);height:2.5rem;color:var(--color-text-primary);text-align:center;border:none;border-radius:.5rem;outline:none;padding:0 1rem;font-size:1rem;transition:all .2s}.input:focus{border-color:var(--color-text-secondary);outline:none;box-shadow:0 1px 2px #0000000d}.input:focus-visible{outline-offset:2px;border-color:#007bff;outline:2px solid #007bff}.input::placeholder{color:var(--color-text-primary);opacity:.6}.input--invalid{border-color:#ef4444}.input--invalid:focus{border-color:#ef4444;box-shadow:0 0 0 2px #ef444433}.input-error{color:#ef4444;text-align:left;margin-top:.25rem;font-size:.875rem;display:block}.btn{height:2.5rem;color:var(--color-text-secondary);background-color:var(--color-button);cursor:pointer;border:none;border-radius:9999px;outline:none;padding:0 1rem;font-family:inherit;font-size:1rem;font-weight:600;transition:all .2s;position:relative;overflow:hidden}.btn:hover{color:#fff;background-color:#ff927a;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.btn:focus{outline:none;box-shadow:0 1px 2px #0000000d}.btn:focus-visible{outline-offset:2px;outline:2px solid #007bff;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.btn-content{z-index:1;position:relative}.validation-message-wrapper{justify-content:center;align-items:center;width:100%;height:2rem;margin-top:1rem;display:flex}.validation-message-wrapper .validation-message{text-align:center;color:#ef4444;border:1px solid #ef444480;border-radius:.5rem;justify-content:center;align-items:center;height:100%;padding:0 .5rem;font-size:.875em;display:flex}.modeTrigger-wrapper{background-color:var(--color-surface);border-radius:9999px;padding:.125rem;position:absolute;top:.5rem;right:.5rem}.modeTrigger-wrapper:hover{background-color:var(--color-surface-hover)}#modeTrigger{box-sizing:border-box;cursor:pointer;background-color:#0000;border:none;border-radius:9999px;outline:none;justify-content:center;align-items:center;font-size:1rem;transition:all .2s;display:flex;position:relative}#modeTrigger:hover{background-color:var(--color-surface-hover)}#modeTrigger:active{transform:scale(.98)}#modeTrigger:focus{outline:none;box-shadow:0 1px 2px #0000000d}#modeTrigger:focus-visible{outline-offset:2px;outline:2px solid #007bff}#modeTrigger .modeTrigger-icon{z-index:2;border-radius:9999px;justify-content:center;align-items:center;width:2rem;height:2rem;display:flex}#modeTrigger .modeTrigger-activeIndicator{z-index:1;background-color:var(--color-text-secondary);border-radius:9999px;width:2rem;height:2rem;position:absolute;bottom:0;left:0}#root{text-align:center;flex-direction:column;justify-content:center;align-items:center;max-width:40rem;min-height:100vh;margin:0 auto;padding:2rem;display:flex}#colorPicker{background-color:var(--color-surface);border-radius:1rem;flex-wrap:wrap;justify-content:center;align-items:center;gap:1.5rem;padding:2rem;transition:all .2s;display:flex;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}#colorPickerControls{flex-direction:column;gap:1rem;display:flex}#colorPickerPreview{aspect-ratio:1;transform-origin:50%;will-change:transform,rotation;width:16rem;height:16rem;position:relative}#colorPickerPreview path{stroke-linejoin:round;stroke-linecap:round}