:root{--bg:#f4f1ea;--panel:#fff;--ink:#1c1a17;--muted:#6b6560;--accent:#c9781f;--border:#ddd6c9;--radius:10px}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin:0}.app-header{padding:24px 20px 8px;text-align:center}.app-header h1{font-size:1.3rem;margin:0 0 4px}.app-header p{color:var(--muted);font-size:.9rem;margin:0}.app-main{align-items:flex-start;flex-wrap:wrap;gap:24px;margin:0 auto;max-width:1100px;padding:20px}.app-main,.canvas-pane{display:flex;justify-content:center}.canvas-pane{flex:1 1 420px}.canvas-wrap{aspect-ratio:1200/1500;background:var(--panel);border-radius:var(--radius);box-shadow:0 4px 20px rgba(0,0,0,.08);max-width:460px;overflow:hidden;position:relative;width:100%}#posterCanvas{cursor:default;display:block;height:100%;touch-action:none;width:100%}#posterCanvas.draggable{cursor:grab}#posterCanvas.dragging{cursor:grabbing}.canvas-hint{align-items:center;background:rgba(244,241,234,.55);color:var(--muted);display:flex;font-size:.9rem;inset:0;justify-content:center;padding:20px;pointer-events:none;position:absolute;text-align:center}.canvas-hint.hidden{display:none}.controls-pane{display:flex;flex:1 1 280px;flex-direction:column;gap:18px;max-width:340px}.control-block{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.control-block h2{font-size:.95rem;margin:0 0 10px}.file-drop{align-items:center;border:1.5px dashed var(--border);border-radius:var(--radius);color:var(--muted);cursor:pointer;display:flex;font-size:.88rem;justify-content:center;padding:18px 10px;text-align:center;transition:border-color .15s,background .15s}.file-drop.dragover,.file-drop:hover{border-color:var(--accent);color:var(--ink)}.file-drop.dragover{background:#fbf3e8}.slider-row{align-items:center;color:var(--muted);display:flex;font-size:.85rem;gap:10px;margin-top:12px}.slider-row input[type=range]{flex:1}.hint{color:var(--muted);font-size:.78rem;margin:10px 0 0}button{background:var(--accent);border:none;border-radius:var(--radius);color:#fff;cursor:pointer;font-size:.95rem;font-weight:600;padding:12px 14px;transition:opacity .15s;width:100%}button:disabled{background:#cfc8ba;cursor:not-allowed}button:not(:disabled):hover{opacity:.92}@media (max-width:720px){.app-main{align-items:center;flex-direction:column}.controls-pane{max-width:460px;width:100%}}