:root{--color-bg: #f5f5f7;--color-panel: #ffffff;--color-border: #d1d1d6;--color-text: #1c1c1e;--color-muted: #6e6e73;--color-accent: #0066cc;--radius: 8px;--spacing: 16px}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--color-bg);color:var(--color-text);line-height:1.4}#app{max-width:1000px;margin:0 auto;padding:var(--spacing)}.app-header{margin-bottom:calc(var(--spacing) * 1.5);text-align:center}.app-header h1{margin:0 0 8px;font-size:1.75rem}.subtitle{margin:0;color:var(--color-muted);font-size:.9rem}.app-main{display:flex;gap:var(--spacing);align-items:flex-start}.panel{flex:1;background:var(--color-panel);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing)}.panel h2{margin:0 0 var(--spacing) 0;font-size:1.2rem}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}.field>span{font-size:.85rem;color:var(--color-muted);font-weight:500}.field input[type=text],.field input[type=number],.field textarea,.field select{padding:8px 10px;border:1px solid var(--color-border);border-radius:4px;font-size:.95rem;font-family:inherit;background:var(--color-panel)}.field input[type=color]{width:60px;height:36px;padding:2px;border:1px solid var(--color-border);border-radius:4px;cursor:pointer;background:var(--color-panel)}.field textarea{resize:vertical;min-height:60px}.checkbox-field{flex-direction:row;align-items:center;gap:8px}.checkbox-field>span{font-size:.95rem;color:var(--color-text)}.preview-box{display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--color-border);border-radius:4px;min-height:256px;padding:var(--spacing);margin-bottom:var(--spacing)}.preview-box canvas,.preview-box img{max-width:100%;height:auto;display:block}.export-controls{display:flex;flex-direction:column;gap:8px}button{padding:10px 16px;background:var(--color-accent);color:#fff;border:none;border-radius:4px;font-size:.95rem;font-weight:500;cursor:pointer;font-family:inherit}button:hover{opacity:.9}button:active{opacity:.8}@media(max-width:768px){.app-main{flex-direction:column}.app-header h1{font-size:1.4rem}}
