:root{color-scheme:light;--mint: #97fedd;--lavender: #be95ff;--white: #ffffff;--black: #000000;--ui-scale: 1.5;--s: var(--ui-scale);--bg: #0b1220;--panel: rgba(255, 255, 255, .06);--panel2: rgba(255, 255, 255, .09);--text: rgba(255, 255, 255, .92);--muted: rgba(255, 255, 255, .68);--border: rgba(255, 255, 255, .14);--shadow: 0 14px 50px rgba(0, 0, 0, .45);--shadow2: 0 10px 30px rgba(0, 0, 0, .35);--ring: color-mix(in srgb, var(--lavender) 70%, var(--white) 30%);--radius: 16px;--preview-w: 1080px;--preview-h: 608px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,Noto Sans,Liberation Sans,sans-serif;background:radial-gradient(1200px 700px at 18% 18%,color-mix(in srgb,var(--lavender) 32%,transparent) 0%,transparent 60%),radial-gradient(900px 650px at 82% 28%,color-mix(in srgb,var(--mint) 24%,transparent) 0%,transparent 62%),radial-gradient(900px 700px at 40% 82%,rgba(255,255,255,.1),transparent 65%),linear-gradient(180deg,#00000040,#000000a6),url(/background.jpg) center / cover no-repeat fixed,var(--bg);color:var(--text)}#root{height:100%}html,body{overflow:hidden}html{font-size:calc(16px * var(--ui-scale))}code{background:#ffffff14;border:1px solid rgba(255,255,255,.12);padding:0 .35em;border-radius:calc(8px * var(--s))}.app{max-width:1600px;width:100%;margin:0 auto;padding:calc(20px * var(--s)) calc(24px * var(--s));height:100%;display:flex;flex-direction:column}.header{display:flex;align-items:flex-start;justify-content:space-between;gap:calc(16px * var(--s));margin-bottom:calc(18px * var(--s));flex:0 0 auto}h1{margin:0 0 calc(6px * var(--s));font-size:calc(26px * var(--s));letter-spacing:.2px;line-height:1.1}.muted{color:var(--muted)}.small{font-size:calc(12px * var(--s));line-height:1.35}.actions{display:flex;gap:calc(10px * var(--s));flex-wrap:wrap}.brand{display:flex;align-items:flex-start;gap:calc(12px * var(--s))}.brand-mark{width:calc(34px * var(--s));height:calc(34px * var(--s));border-radius:calc(12px * var(--s));background:linear-gradient(135deg,color-mix(in srgb,var(--lavender) 85%,white),color-mix(in srgb,var(--mint) 80%,white));box-shadow:var(--shadow2);border:1px solid rgba(255,255,255,.18)}.brand-text{display:grid;gap:2px}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:#ffffff0f;color:var(--text);padding:calc(10px * var(--s)) calc(12px * var(--s));border-radius:calc(12px * var(--s));cursor:pointer;transition:transform .05s ease,background .15s ease,border-color .15s ease;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn:hover{background:#ffffff17;border-color:#ffffff38}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,color-mix(in srgb,var(--lavender) 22%,transparent),color-mix(in srgb,var(--mint) 18%,transparent));border-color:#ffffff38}.btn:focus-visible,.thumb:focus-visible{outline:none;box-shadow:0 0 0 3px #00000059,0 0 0 6px color-mix(in srgb,var(--lavender) 24%,transparent)}.grid{display:grid;grid-template-columns:minmax(0,1fr) calc(320px * var(--s));gap:calc(18px * var(--s));flex:1 1 auto;min-height:0;align-items:stretch;justify-content:center}@media (max-width: 980px){.grid{grid-template-columns:1fr}}.card,.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;min-height:0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.card{padding:calc(16px * var(--s));display:flex;flex-direction:column;align-items:flex-start;width:fit-content;height:fit-content}.stage-wrap{display:flex;align-items:flex-start;justify-content:flex-start}.stage{width:var(--preview-w, 800px);height:var(--preview-h, 450px);flex:0 0 auto;border-radius:calc(14px * var(--s));background:linear-gradient(180deg,#ffffff0f,#0003);border:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden}@media (max-width: 900px){:root{--ui-scale: 1}html,body{overflow:auto}.app{height:auto;min-height:100%}.header{flex-direction:column;align-items:flex-start}.actions{width:100%}.grid{grid-template-columns:1fr;justify-content:stretch}.card,.panel{width:100%}.card{height:auto;align-items:stretch}.stage-wrap{width:100%}.stage{width:100%;height:auto;aspect-ratio:var(--preview-ar, 16 / 9);min-height:240px}@supports not (aspect-ratio: 1 / 1){.stage{height:auto}.stage:before{content:"";display:block;padding-top:calc(100% / var(--preview-ar, 1.7777778))}}.controls{max-height:60vh}}.stage-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:calc(14px * var(--s));color:#ffffffc7;font-size:calc(13px * var(--s));text-align:center;background:radial-gradient(500px 250px at 20% 20%,color-mix(in srgb,var(--lavender) 14%,transparent),transparent 60%),radial-gradient(500px 250px at 80% 30%,color-mix(in srgb,var(--mint) 12%,transparent),transparent 62%),#0000001f}.stage-error{color:#ffcdcde6}.layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;image-rendering:auto}.stage-meta{display:flex;justify-content:space-between;align-items:center;gap:calc(12px * var(--s));margin-top:calc(12px * var(--s))}.checkbox{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.panel{padding:calc(14px * var(--s));display:flex;flex-direction:column;height:100%}.panel-title{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#ffffffb8;margin:10px 0}.controls{display:grid;gap:calc(10px * var(--s));flex:1 1 auto;min-height:0;overflow:auto;padding-right:calc(4px * var(--s))}.controls::-webkit-scrollbar{width:10px}.controls::-webkit-scrollbar-thumb{background:#ffffff29;border-radius:999px;border:2px solid rgba(0,0,0,.25)}.controls::-webkit-scrollbar-track{background:#00000024;border-radius:999px}.row{background:var(--panel2);border:1px solid rgba(255,255,255,.12);border-radius:calc(14px * var(--s));padding:calc(10px * var(--s));display:grid;gap:calc(8px * var(--s))}.row-head{display:flex;align-items:center;justify-content:space-between;gap:calc(8px * var(--s))}.trait{font-weight:600;letter-spacing:.2px}.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(56px * var(--s)),1fr));gap:calc(8px * var(--s))}.thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.14);background:#0000002e;border-radius:calc(12px * var(--s));padding:calc(6px * var(--s));cursor:pointer;transition:transform .05s ease,border-color .15s ease,background .15s ease;box-shadow:0 1px #ffffff0f inset}.thumb:hover{border-color:#ffffff3d;background:#00000038}.thumb:active{transform:translateY(1px)}.thumb.is-active{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--lavender) 18%,transparent),0 0 0 1px #ffffff14 inset}.thumb img{width:100%;height:calc(44px * var(--s));object-fit:contain;display:block}.toast{position:fixed;right:calc(18px * var(--s));bottom:calc(18px * var(--s));z-index:50;padding:calc(10px * var(--s)) calc(12px * var(--s));border-radius:calc(14px * var(--s));border:1px solid rgba(255,255,255,.16);background:#00000073;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow2);color:#ffffffe6;font-size:calc(13px * var(--s))}