:root{--bayern-royalblau:#001f47;--bayern-himmelblau:#008ecf;--bayern-lichtblau:#21b5ea;--bayern-accent-dunkelrot:#9e092f;--bayern-accent-hellrot:#e4003a;--bayern-accent-gelb:#ffce44;--bayern-accent-hellgruen:#a0c96d;--bayern-accent-dunkelgruen:#007a62;--bayern-accent-eisenblau:#d3ddf2;--bayern-accent-steingrau:#708197;--bayern-accent-nuss-hell:#aea693;--bayern-accent-nuss-dunkel:#7f6f5a;--surface:#fff;--surface-soft:#f4f7fc;--surface-tint:#edf4fb;--border:#d3ddf2;--text:#001f47;--muted:#708197;--shadow:#001f4724;color:var(--text);background:var(--surface-soft);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;padding:24px}.workspace{grid-template-columns:minmax(0,1fr) 360px;gap:24px;max-width:1380px;margin:0 auto;display:grid}.preview-panel,.control-panel{border:1px solid var(--border);background:var(--surface);box-shadow:0 18px 50px var(--shadow);border-radius:8px}.preview-panel{min-width:0;overflow:hidden}.preview-toolbar{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;display:flex}.eyebrow{color:var(--bayern-himmelblau);letter-spacing:0;text-transform:uppercase;margin:0 0 4px;font-size:.78rem;font-weight:800}h1{color:var(--bayern-royalblau);margin:0;font-size:clamp(1.1rem,2vw,1.55rem);line-height:1.2}.toolbar-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;display:flex}.icon-button,.primary-button{border:1px solid var(--border);background:var(--surface);min-height:42px;color:var(--bayern-royalblau);border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.icon-button{width:42px}.primary-button{background:var(--bayern-royalblau);color:var(--surface);border-color:var(--bayern-royalblau);gap:9px;padding:0 16px;font-weight:800}.icon-button:hover{border-color:var(--bayern-himmelblau);color:var(--bayern-himmelblau)}.primary-button:hover{background:var(--bayern-himmelblau);border-color:var(--bayern-himmelblau)}.icon-button:hover,.primary-button:hover{transform:translateY(-1px)}.preview-stage{background:linear-gradient(135deg, var(--surface-tint) 0%, var(--surface) 100%);place-items:center;min-height:calc(100vh - 130px);padding:24px;display:grid}canvas{aspect-ratio:3/4;background:var(--surface);touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab;border-radius:8px;width:min(100%,62vh);max-height:calc(100vh - 180px);box-shadow:0 20px 60px #001f473d}canvas.is-dragging{cursor:grabbing}.control-panel{align-self:start;gap:18px;padding:18px;display:grid;position:sticky;top:24px}.upload-zone{border:2px dashed var(--bayern-accent-steingrau);background:var(--surface-tint);width:100%;color:var(--bayern-royalblau);text-align:center;border-radius:8px;justify-items:center;gap:8px;padding:28px 18px;display:grid}.upload-zone.is-over,.upload-zone:hover{border-color:var(--bayern-himmelblau);background:#eaf7fc}.upload-icon{background:var(--bayern-accent-gelb);width:48px;height:48px;color:var(--bayern-royalblau);border-radius:8px;place-items:center;display:grid}.upload-title{font-weight:850}.upload-subtitle,.file-name{color:var(--muted);font-size:.92rem;line-height:1.35}.file-name{overflow-wrap:anywhere;max-width:100%}.control-group{border:1px solid var(--border);border-radius:8px;gap:16px;padding:16px;display:grid}.group-heading{color:var(--bayern-royalblau);align-items:center;gap:8px;font-weight:850;display:flex}label{color:var(--bayern-royalblau);grid-template-columns:46px minmax(0,1fr) 58px;align-items:center;gap:10px;font-size:.94rem;display:grid}input[type=range]{width:100%;accent-color:var(--bayern-himmelblau)}output{color:var(--bayern-royalblau);font-variant-numeric:tabular-nums;text-align:right}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=980px){.app-shell{padding:14px}.workspace{grid-template-columns:1fr}.control-panel{order:-1;position:static}.preview-toolbar{flex-direction:column;align-items:flex-start}.toolbar-actions{justify-content:flex-start}.preview-stage{min-height:auto;padding:16px}canvas{width:min(100%,520px);max-height:none}}@media (width<=560px){.primary-button,.toolbar-actions{width:100%}label{grid-template-columns:32px minmax(0,1fr) 52px}}