:root{color-scheme:dark;--bg:#101116;--panel:#17181f;--line:#2a2c36;--muted:#999ba9;--accent:#b8a5ff;--text:#f1f0f7}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 system-ui,sans-serif}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;background:#252631;border:1px solid var(--line);border-radius:8px;padding:9px 12px}button:hover{background:#343342}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button:disabled{opacity:.5;cursor:wait}a{color:inherit;text-decoration:none}header{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:28px;padding:0 28px}.brand{font-size:29px;font-weight:800;letter-spacing:-1.5px;white-space:nowrap}.brand span{color:var(--accent)}.brand small{font-size:10px;letter-spacing:2px;background:#302a44;padding:5px 8px;border-radius:5px;color:#d7c7ff;vertical-align:middle;margin-left:10px}.back{color:var(--muted);font-size:12px}.header-note{color:var(--muted);margin-left:auto;font-size:12px}.primary{background:var(--accent);color:#201833;border:0;font-weight:700;padding:12px 20px}.primary:hover{background:#d0c2ff}.layout{display:grid;grid-template-columns:248px minmax(0,1fr) 260px;min-height:calc(100vh - 76px)}.library,.settings{background:var(--panel);padding:26px 20px}.library{border-right:1px solid var(--line)}.settings{border-left:1px solid var(--line)}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.7px;color:var(--muted)}.eyebrow span{float:right;background:#33313e;border-radius:4px;padding:0 5px;color:#ddd}h1{font-size:25px;letter-spacing:-1px;margin:12px 0 4px}.muted{color:var(--muted);font-size:12px}p{margin:6px 0 18px}input[type=search],input[type=number],select{width:100%;border:1px solid #393b47;border-radius:7px;background:#20212a;color:var(--text);padding:10px;min-width:0}input[type=search]{margin:5px 0 15px}.categories{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:20px}.categories button{font-size:10px;padding:5px 7px;background:transparent;border-color:transparent}.categories button.active{background:#393149;color:#e0d4ff}#generators{display:grid;gap:5px;max-height:calc(100vh - 325px);overflow:auto;scrollbar-width:thin}.generator{display:flex;align-items:center;gap:11px;border-color:transparent;background:transparent;text-align:left;padding:7px;font-size:12px}.generator.active{background:#302b42;border-color:#5c4c82}.generator canvas{width:48px;height:34px;border-radius:5px}.generator .number{margin-left:auto;color:#777483;font-size:10px}main{padding:30px;min-width:0}.stage-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 24px}h2{margin:5px 0 0;font-size:25px;letter-spacing:-.6px}.badge{color:#b9d4bf;border:1px solid #35463d;padding:5px 9px;border-radius:20px;font-size:10px;white-space:nowrap}.stage{display:flex;justify-content:center;align-items:center;min-height:320px;height:min(51vw,540px);padding:20px;background:radial-gradient(ellipse,#272631,#1c1d24);border:1px solid var(--line);border-radius:12px;overflow:hidden}#preview{display:block;max-width:100%;max-height:100%;width:auto;height:auto;box-shadow:0 15px 50px #0006;border-radius:3px}.transport{display:flex;align-items:center;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}.transport button{min-width:38px}.transport output{font-size:11px;color:#b8b6c6;white-space:nowrap;font-variant-numeric:tabular-nums}.transport input{flex:1;min-width:20px}input[type=range]{accent-color:var(--accent);width:100%;cursor:pointer}.stage-foot{display:flex;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted);padding:14px 0}.stage-foot span:last-child{white-space:nowrap}.info-card{display:flex;align-items:center;gap:18px;border:1px solid var(--line);border-radius:10px;padding:20px;margin-top:30px}.info-card p{font-size:12px;color:var(--muted);margin:5px 0 0}.loop-icon{font-size:40px;color:var(--accent)}.info-card strong{font-size:13px}.settings section{border-bottom:1px solid var(--line);padding:20px 0}h3{font-size:13px;margin:0 0 14px}fieldset{border:0;padding:0;margin:0;min-width:0}label{display:block;font-size:11px;color:#b9b8c5;margin:13px 0 6px}.range-label{display:flex;justify-content:space-between}.range-label output{color:var(--accent)}#palettes{display:grid;grid-template-columns:1fr 1fr;gap:7px}.palette{display:flex;height:30px;padding:5px;gap:2px;overflow:hidden}.palette.active{border-color:var(--accent)}.palette span{flex:1;border-radius:2px}.custom-colors{display:flex;gap:9px}.custom-colors label{font-size:9px;flex:1}.custom-colors input{display:block;width:100%;height:26px;border:0;background:transparent;padding:0;margin-top:5px}.checkbox{display:flex;gap:7px;align-items:center}.seed-row{display:flex;gap:6px}.seed-row button{font-size:11px}.full{width:100%;margin-top:10px;font-size:12px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#status{color:var(--accent);margin-top:18px;font-size:12px}#export-progress{display:flex;align-items:center;gap:12px}#export-progress[hidden]{display:none}progress{width:100%;accent-color:var(--accent)}@media(min-width:1500px){main{padding:40px 60px}.layout{grid-template-columns:270px minmax(0,1fr) 280px}}@media(max-width:1100px){.layout{grid-template-columns:210px minmax(0,1fr)}.settings{grid-column:1/-1;border-top:1px solid var(--line)}fieldset{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.settings section{border-bottom:0}.stage{height:440px}.header-note{display:none}header .primary{margin-left:auto}}@media(max-width:650px){header{padding:12px 16px;gap:12px;height:auto;flex-wrap:wrap}.brand{font-size:24px}.back{font-size:10px}.primary{padding:9px 12px;font-size:12px}.layout{display:flex;flex-direction:column}.library{padding:18px;border-right:0}.library h1,.library>p.muted{display:none}.library .eyebrow{margin-bottom:10px}#search{margin-bottom:9px}.categories{margin-bottom:10px}#generators{display:flex;overflow:auto;max-height:90px}.generator{min-width:155px}.generator .number{display:none}main{padding:20px 16px}.stage-heading{margin-bottom:15px}h2{font-size:22px}.badge{font-size:9px}.stage{height:350px;min-height:0;padding:12px}.stage-foot{flex-direction:column;gap:5px}.info-card{margin-top:12px}.settings{padding:20px 16px}fieldset{grid-template-columns:1fr 1fr;gap:16px}.transport{gap:9px}}

.stage{position:relative}.stage-actions{display:flex;align-items:center;gap:12px}.stage-actions button{font-size:11px}.immersive-top,.immersive-bottom{display:none}.stage:fullscreen,.stage.immersive{background:#080910;border:0;border-radius:0;padding:0;width:100vw;height:100dvh;max-height:none}.stage.immersive{position:fixed;inset:0;z-index:1000}.stage:fullscreen #preview,.stage.immersive #preview{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;border-radius:0;box-shadow:none}.stage:fullscreen .immersive-top,.stage.immersive .immersive-top,.stage:fullscreen .immersive-bottom,.stage.immersive .immersive-bottom{display:flex;position:absolute;z-index:2;left:0;right:0;justify-content:space-between;align-items:center;padding:24px 32px;transition:opacity .4s}.immersive-top{top:0;background:linear-gradient(#0008,transparent)}.immersive-bottom{bottom:0;background:linear-gradient(transparent,#0008);font-size:12px;color:#ddd}.immersive-top span{font-size:18px;font-weight:600}.immersive-top button,.immersive-bottom button{background:#12121a88;backdrop-filter:blur(10px)}.stage.hide-chrome .immersive-top,.stage.hide-chrome .immersive-bottom{opacity:0;pointer-events:none}.stage.hide-chrome{cursor:none}.download{color:#eee;text-decoration:underline}@media(max-width:650px){.stage-actions .badge{display:none}.immersive-bottom span{font-size:10px;padding:0 12px;text-align:center}.stage:fullscreen .immersive-top,.stage.immersive .immersive-top,.stage:fullscreen .immersive-bottom,.stage.immersive .immersive-bottom{padding:16px}}