:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f4f1ea;font-synthesis:none;text-rendering:optimizelegibility;background:#070707;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:#070707;min-width:320px;min-height:100%}body{background:linear-gradient(120deg,#ff45201f,#0000 30%),radial-gradient(circle at 82% 12%,#2db49224,#0000 30%),#070707;min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button{color:#f6f2ea;cursor:pointer;letter-spacing:0;background:#ffffff0f;border:1px solid #f4f1ea24;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:36px;padding:0 12px;font-size:13px;font-weight:700;transition:border-color .16s,background .16s,color .16s,transform .16s;display:inline-flex}button:hover{background:#ffffff1a;border-color:#ff4f269e;transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.58;transform:none}button:focus-visible,input:focus-visible,select:focus-visible{outline-offset:2px;outline:2px solid #ff4b22}select,input[type=text]{color:#fff7ed;background:#ffffff0f;border:1px solid #f4f1ea24;border-radius:8px;width:100%;min-height:38px;padding:0 10px;font-size:13px}select{color:#fff7ed}option{color:#fff7ed;background:#111}input[type=color]{cursor:pointer;background:#ffffff0f;border:1px solid #f4f1ea24;border-radius:8px;width:100%;height:38px;padding:4px}input[type=checkbox]{accent-color:#ff4b22;width:16px;height:16px}input[type=range]{accent-color:#ff4b22;width:100%}.app-shell{flex-direction:column;width:100%;min-height:100dvh;margin:0;padding:12px;display:flex}.topbar{background:#0e0e0ed1;border:1px solid #f4f1ea1f;border-radius:8px;justify-content:space-between;align-items:center;gap:16px;min-height:72px;padding:14px;display:flex;box-shadow:0 18px 80px #00000052}.brand-lockup{align-items:center;gap:12px;min-width:0;display:flex}.brand-mark{color:#0a0a0a;background:#ff3b1a;border:1px solid #ff4f2694;border-radius:8px;flex:none;place-items:center;width:42px;height:42px;font-weight:900;display:grid}.brand-lockup h1,.panel-heading h2{color:#fff9ef;letter-spacing:0;margin:0;font-size:18px;font-weight:820;line-height:1.1}.brand-lockup p{color:#f4f1eaa3;max-width:520px;margin:5px 0 0;font-size:13px;line-height:1.35}.topbar-actions,.preview-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.icon-button{width:38px;padding:0}.primary-button{color:#0a0a0a;background:#ff3b1a;border-color:#ff4f2694}.primary-button:hover{color:#0a0a0a;background:#ff6b45;border-color:#ff8a69}.studio-grid{flex:1;grid-template-columns:clamp(280px,16vw,340px) minmax(0,1fr) clamp(300px,17vw,360px);align-items:stretch;gap:14px;min-height:0;margin-top:14px;display:grid}.panel{scrollbar-color:#ff4f268c #ffffff0a;scrollbar-width:thin;background:#0f0f0fe0;border:1px solid #f4f1ea1f;border-radius:8px;max-height:calc(100dvh - 112px);padding:14px;overflow:auto}.panel-heading{color:#ff6845;align-items:center;gap:8px;margin-bottom:14px;display:flex}.panel-heading h2{font-size:14px}.upload-zone{background:#ffffff0a;border:1px dashed #f4f1ea33;border-radius:8px;gap:8px;margin-bottom:14px;padding:12px;display:grid}.upload-zone span{color:#f4f1ea94;text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.compact-zone{gap:6px;margin-bottom:12px;padding:9px}.utility-grid,.template-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:14px;display:grid}.mini-section{margin-bottom:14px}.mini-heading{color:#f4f1eab8;align-items:center;gap:7px;margin-bottom:8px;font-size:12px;font-weight:780;display:flex}.preset-list{gap:6px;display:grid}.preset-list button,.template-grid button{text-align:left;justify-items:start;gap:3px;height:auto;padding:9px 10px;display:grid}.preset-list span,.template-grid span{color:#fff9ef;font-size:12px;font-weight:780}.preset-list small,.template-grid small{color:#f4f1ea85;font-size:11px;font-weight:650;line-height:1.25}.segmented-block,.field,.range-control{gap:7px;margin-bottom:12px;display:grid}.segmented-block>span,.field>span,.range-control>span{color:#f4f1eab8;letter-spacing:0;justify-content:space-between;align-items:center;gap:10px;font-size:12px;font-weight:760;display:flex}.range-control output{color:#ff8a69;font-variant-numeric:tabular-nums}.segmented{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.segmented button{overflow-wrap:anywhere;min-width:0;min-height:32px;padding:0 8px;font-size:12px}.segmented button.is-active{color:#ffb49d;background:#ff4f262e;border-color:#ff4f26b3}.field-row{grid-template-columns:minmax(0,1fr) 92px;gap:10px;display:grid}.color-field{min-width:0}.check-row{color:#f4f1eab3;align-items:center;gap:9px;margin:2px 0 14px;font-size:13px;font-weight:650;display:flex}.preview-column{flex-direction:column;min-width:0;min-height:0;display:flex}.preview-toolbar{background:#0f0f0fd6;border:1px solid #f4f1ea1f;border-radius:8px;justify-content:space-between;align-items:center;gap:10px;min-height:52px;margin-bottom:10px;padding:8px;display:flex}.media-pill{color:#a8ffe4;border:1px solid #2fc99f52;border-radius:8px;align-items:center;gap:8px;min-width:0;padding:8px 10px;font-size:13px;font-weight:760;display:inline-flex}.canvas-frame{background-color:#0b0b0b;background-image:linear-gradient(45deg,#ffffff09 25%,#0000 25%),linear-gradient(-45deg,#ffffff09 25%,#0000 25%),none;background-position:0 0,0 12px;background-repeat:repeat,repeat,repeat;background-size:24px 24px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border:1px solid #f4f1ea1f;border-radius:8px;flex:1;place-items:center;min-height:0;padding:12px;display:grid;position:relative;overflow:hidden}.ascii-canvas{width:min(100%, calc((100dvh - 184px) * var(--preview-aspect,1)));cursor:crosshair;touch-action:none;background:#050505;border:1px solid #ff4f264d;border-radius:8px;max-width:100%;height:auto;max-height:calc(100dvh - 184px);display:block;box-shadow:0 20px 70px #0000006b,inset 0 0 0 1px #ffffff0a}.loading-state{color:#f4f1eabd;background:#050505b8;border-radius:8px;place-items:center;font-size:13px;font-weight:760;display:grid;position:absolute;inset:12px}.status-line{color:#f4f1ea94;min-height:18px;margin:10px 2px 0;font-size:12px}.creation-strip{background:#0f0f0fb8;border:1px solid #f4f1ea1a;border-radius:8px;margin-top:10px;padding:10px}.creation-strip p{color:#f4f1ea80;margin:0;font-size:12px}.creation-list{grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px;display:grid}.creation-card{grid-template-columns:minmax(0,1fr) 34px;gap:6px;min-width:0;display:grid}.creation-card>button:first-child{gap:5px;min-width:0;height:auto;padding:6px;display:grid}.creation-card img{aspect-ratio:1;object-fit:cover;background:#050505;border:1px solid #f4f1ea1f;border-radius:6px;width:100%}.creation-card span{color:#f4f1ea94;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:11px;overflow:hidden}.export-grid{grid-template-columns:1fr;gap:8px;margin-top:12px;display:grid}.source-media{opacity:0;pointer-events:none;width:1px;height:1px;position:fixed}@media (width<=1160px){.studio-grid{grid-template-columns:minmax(240px,300px) minmax(0,1fr)}.inspector-panel{grid-column:1/-1;max-height:none}}@media (width<=820px){.app-shell{padding:10px}.topbar,.preview-toolbar{flex-direction:column;align-items:stretch}.brand-lockup{align-items:flex-start}.topbar-actions,.preview-actions{justify-content:stretch}.topbar-actions button,.preview-actions button{flex:1}.studio-grid{grid-template-columns:1fr}.panel{max-height:none}.canvas-frame{min-height:360px}.ascii-canvas{width:100%;max-height:none}}@media (width<=460px){.brand-lockup h1{font-size:16px}.brand-lockup p{font-size:12px}.segmented{grid-template-columns:repeat(2,minmax(0,1fr))}.field-row{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}