:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--border:var(--lightningcss-light,#ddd)var(--lightningcss-dark,#333);--muted:var(--lightningcss-light,#777)var(--lightningcss-dark,#999);--accent:#2563eb;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}body{margin:0}main{box-sizing:border-box;justify-content:center;align-items:center;min-height:100svh;padding:16px;display:flex}.card{flex-direction:column;gap:12px;width:100%;max-width:360px;display:flex}.card.wide{align-self:flex-start;max-width:720px;margin-top:48px}.card h1{margin:0}form{flex-direction:column;gap:12px;display:flex}input{font:inherit;border:1px solid var(--border);background:0 0;border-radius:8px;padding:10px 12px}button{font:inherit;background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:10px 12px}button:disabled{opacity:.5;cursor:default}button.link{color:var(--accent);background:0 0;padding:0}.error{color:#dc2626;margin:0}.muted{color:var(--muted)}header{justify-content:space-between;align-items:baseline;gap:16px;display:flex}.account{align-items:baseline;gap:12px;display:flex}ul.templates{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}ul.templates li{border-bottom:1px solid var(--border);justify-content:space-between;gap:16px;padding:12px 0;display:flex}ul.templates a{color:inherit;text-decoration:none}ul.templates a:hover{color:var(--accent)}.viewer{box-sizing:border-box;flex-direction:column;align-items:center;gap:16px;min-height:100svh;padding:16px;display:flex}.viewer-bar{align-items:baseline;gap:16px;width:100%;max-width:900px;display:flex}.viewer-bar a{color:var(--accent);text-decoration:none}.stage-wrap{border:1px solid var(--border);background:conic-gradient(var(--lightningcss-light,#eee)var(--lightningcss-dark,#2a2a2a) 90deg,#0000 90deg 180deg,var(--lightningcss-light,#eee)var(--lightningcss-dark,#2a2a2a) 180deg 270deg,#0000 270deg) 0 0/16px 16px;line-height:0}.editor{flex-direction:column;height:100svh;display:flex}.editor-bar{border-bottom:1px solid var(--border);align-items:center;gap:16px;padding:10px 16px;display:flex}.editor-bar a{color:var(--accent);white-space:nowrap;text-decoration:none}.template-name{min-width:160px;font-weight:600}.add-bar{gap:8px;display:flex}.add-bar button{color:inherit;background:var(--lightningcss-light,#f0f0f0)var(--lightningcss-dark,#2a2a2a);padding:6px 10px}.save-state{color:var(--muted);white-space:nowrap;margin-left:auto;font-size:13px}.save-state.error{color:#dc2626}.editor-body{flex:1;min-height:0;display:flex}.editor-canvas{flex:1;justify-content:center;align-items:center;min-width:0;display:flex;overflow:hidden}.editor-side{border-left:1px solid var(--border);flex-direction:column;gap:8px;width:280px;padding:12px 16px;display:flex;overflow-y:auto}.editor-side h3{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:8px 0 4px;font-size:13px}.layer-list{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.layer-list button{text-align:left;width:100%;color:inherit;background:0 0;border-radius:6px;gap:8px;padding:6px 8px;display:flex}.layer-list button.active{background:var(--accent);color:#fff}.layer-list .icon{text-align:center;width:18px}.inspector{flex-direction:column;gap:10px;display:flex}.inspector label{color:var(--muted);flex-direction:column;gap:4px;font-size:13px;display:flex}.inspector input,.inspector select,.inspector textarea{font:inherit;color:inherit;border:1px solid var(--border);background:0 0;border-radius:6px;padding:6px 8px}.inspector input[type=color]{height:34px;padding:2px}.inspector input[type=range]{border:none;padding:0}.row{align-items:center;gap:8px;display:flex}.row>label{flex:1}.segmented{gap:4px;display:flex}.segmented button{color:inherit;background:var(--lightningcss-light,#f0f0f0)var(--lightningcss-dark,#2a2a2a);flex:1;padding:6px 8px}.segmented button.active{background:var(--accent);color:#fff}.inspector .danger,button.danger{color:#dc2626}.inspector .danger{background:0 0;border:1px solid #dc2626}.inspector .row button{color:inherit;background:var(--lightningcss-light,#f0f0f0)var(--lightningcss-dark,#2a2a2a);flex:1}.presets{flex-wrap:wrap;gap:8px;display:flex}.presets button:not(.link){color:inherit;background:var(--lightningcss-light,#f0f0f0)var(--lightningcss-dark,#2a2a2a)}.new-template{align-self:flex-start}.fill-side select{font:inherit;color:inherit;border:1px solid var(--border);background:0 0;border-radius:6px;padding:8px}.match-list{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.match-list button{text-align:left;width:100%;color:inherit;background:var(--lightningcss-light,#f0f0f0)var(--lightningcss-dark,#2a2a2a);border-radius:8px;flex-direction:column;gap:2px;display:flex}.match-list button.active{background:var(--accent);color:#fff}.match-list button span{opacity:.75;font-size:13px}.photo-upload{color:var(--muted);flex-direction:column;gap:4px;font-size:13px;display:flex}.export-btn{margin-top:12px}details.settings{border:1px solid var(--border);border-radius:8px;padding:10px 12px}details.settings summary{cursor:pointer;color:var(--muted)}.settings-body{flex-direction:column;gap:10px;padding-top:12px;display:flex}.settings-body h4{margin:8px 0 0}.settings-body label{color:var(--muted);flex-direction:column;gap:4px;font-size:13px;display:flex}.settings-body select,.settings-body input:not([type=file]){font:inherit;color:inherit;border:1px solid var(--border);background:0 0;border-radius:6px;padding:8px}.settings-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.settings-list li{border-bottom:1px solid var(--border);justify-content:space-between;align-items:baseline;gap:12px;padding:6px 0;display:flex}.file-btn{color:var(--accent);cursor:pointer;align-self:flex-start}.file-btn-inline{color:var(--accent);cursor:pointer}
