:root{--base-bg-color: #1e1e2e;--secondary-bg-color: #181825;--secondary-bg-color-dimmed: #11111b;--surface-color: #585b70;--surface-color-dimmed: #45475a;--color-blue: #89b4fa;--color-text: #cdd6f4;--color-subtext: #bac2de}*{box-sizing:border-box;margin:0;padding:0}#root{display:block}body{background-color:var(--base-bg-color);color:var(--color-text);font-family:Inter,sans-serif;margin:0;min-height:100dvh}.app{display:flex;flex-direction:column;width:100%}.container{display:flex;gap:1rem;flex-direction:column;align-items:center;justify-content:center;min-height:100dvh;width:100%;padding:2rem}.panel{background-color:var(--secondary-bg-color);border-radius:10px;padding:1rem;width:100%;max-width:600px;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:1rem}.footer{background-color:var(--secondary-bg-color-dimmed);border-top:1px solid var(--surface-color);width:100%;padding:2rem 1rem;display:flex;flex-direction:column;gap:.5rem}.link{color:var(--color-blue);text-decoration:none}.link:hover{text-decoration:underline}.canvas{background-color:var(--secondary-bg-color);border:1px solid var(--surface-color);border-radius:10px;flex-shrink:0;padding:1rem;display:block;margin:0 auto;max-width:80vw;max-height:60vh;aspect-ratio:1 / 1;object-fit:contain}.btn{padding:.6rem 1.2rem;border:none;border-radius:5px;font-weight:600;cursor:pointer}.btn:active{transform:scale(.95)}.btn-primary{background-color:var(--color-blue);color:var(--base-bg-color);border:1px solid var(--surface-color);border-radius:6px}.btn-secondary{background-color:var(--secondary-bg-color-dimmed);color:var(--color-text);border:1px solid var(--surface-color);border-radius:6px}.btn-secondary:hover{border-color:var(--color-blue)}.select-input{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding:.6rem 1.2rem;font-family:inherit;font-size:.9rem;cursor:pointer;background-color:var(--secondary-bg-color-dimmed);color:var(--color-text);border:1px solid var(--surface-color);border-radius:6px;background-image:url("data:image/svg+xml,%3c!--%20Heroicons%20Mini%20-%20chevron-down%20--%3e%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2020%2020'%20fill='%23bac2de'%3e%3cpath%20fill-rule='evenodd'%20d='M5.22%208.22a.75.75%200%200%201%201.06%200L10%2011.94l3.72-3.72a.75.75%200%201%201%201.06%201.06l-4.25%204.25a.75.75%200%200%201-1.06%200L5.22%209.28a.75.75%200%200%201%200-1.06Z'%20clip-rule='evenodd'%20/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .7rem center;background-size:1rem}.select-input:hover{border-color:var(--color-blue)}.select-input:focus{outline:none;border-color:var(--color-blue)}.select-input option{background-color:var(--secondary-bg-color);color:var(--color-text)}.hidden{display:none}.text-center{text-align:center}