:root{--ink: #1c1914;--ink-soft: #4a4338;--paper: #efe7d6;--paper-2: #f7f1e6;--rule: #cfc3ab;--rule-strong: #b9ab90;--stamp: #b42318;--stamp-deep: #8d1a12;--teal: #0f3d3a;--teal-bright: #1a6b64;--gold: #d7a21a;--shadow: 0 18px 40px rgba(42, 32, 18, .12);--sans: "IBM Plex Sans", "Helvetica Neue", sans-serif;--serif: "Fraunces", "Times New Roman", serif;--mono: "IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;color:var(--ink);background:radial-gradient(1200px 600px at 10% -10%,#fffaf0 0%,transparent 50%),linear-gradient(180deg,#f4ecde 0%,var(--paper) 40%,#e7decc 100%);font-family:var(--sans)}button,input,textarea,select{font:inherit}button{cursor:pointer}.app{min-height:100vh;padding:28px 28px 48px}.masthead{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;padding-bottom:22px;border-bottom:1px solid var(--rule);margin-bottom:24px}.eyebrow{margin:0 0 6px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}.masthead h1{margin:0;font-family:var(--serif);font-size:clamp(34px,5vw,56px);font-weight:520;letter-spacing:-.03em;line-height:.95}.masthead p{max-width:420px;margin:0;color:var(--ink-soft);line-height:1.5}.workspace{display:grid;grid-template-columns:minmax(320px,400px) minmax(0,1fr);gap:22px;align-items:start}.panel,.stage{background:#fffbf4b8;border:1px solid rgba(185,171,144,.7);box-shadow:var(--shadow)}.panel{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto;padding:18px 18px 12px}.stage{min-height:640px;padding:18px}.section-title{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:18px 0 10px;font-family:var(--serif);font-size:20px}.section-title:first-child{margin-top:0}.presets,.toggles,.positions{display:flex;flex-wrap:wrap;gap:8px}.chip,.toggle,.ghost,.primary,.secondary{border:1px solid var(--rule-strong);background:var(--paper-2);color:var(--ink);border-radius:999px;padding:8px 12px;transition:.16s ease}.chip.active,.toggle.active{background:var(--teal);border-color:var(--teal);color:#f4efe4}.toggle{display:flex;flex-direction:column;align-items:flex-start;border-radius:12px;min-width:140px;padding:10px 12px}.toggle small,.hint{color:var(--ink-soft);font-size:12px}.toggle.active small{color:#d7cebb}.fields{display:grid;gap:10px}label.field{display:grid;gap:6px;font-size:13px;color:var(--ink-soft)}input[type=text],textarea,select{width:100%;border:1px solid var(--rule-strong);background:#fffdf8;color:var(--ink);border-radius:10px;padding:10px 12px}textarea{min-height:72px;resize:vertical}.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dropzone{position:relative;overflow:hidden;border:1.5px dashed var(--rule-strong);background:linear-gradient(#fffdf8,#fffdf8) padding-box,repeating-linear-gradient(-12deg,transparent,transparent 8px,rgba(185,171,144,.18) 8px,rgba(185,171,144,.18) 9px);min-height:150px;border-radius:16px;padding:18px;text-align:left}.dropzone.hot{border-color:var(--teal-bright);background-color:#f3fff8}.dropzone input{display:none}.dropzone strong{display:block;font-family:var(--serif);font-size:22px;margin-bottom:4px}.actions{position:sticky;bottom:0;display:grid;gap:8px;margin-top:16px;padding-top:12px;background:linear-gradient(180deg,#fffbf400,#fffbf4 18px)}.primary,.secondary,.ghost{width:100%;border-radius:12px;padding:12px 14px;font-weight:600}.primary{background:var(--stamp);border-color:var(--stamp-deep);color:#fff8ef}.primary:disabled,.secondary:disabled,.ghost:disabled{opacity:.5;cursor:not-allowed}.secondary{background:var(--teal);border-color:var(--teal);color:#f3eee3}.stage-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.tabs{display:flex;gap:6px}.tabs button{border:1px solid var(--rule);background:transparent;border-radius:999px;padding:7px 11px}.tabs button.active{background:var(--ink);color:var(--paper);border-color:var(--ink)}.canvas-wrap{position:relative;min-height:520px;background:radial-gradient(circle at 20% 10%,rgba(255,255,255,.5),transparent 30%),#d8c9ae;border-radius:16px;overflow:hidden;display:grid;place-items:center}.canvas-wrap img,.compare-frame img{display:block;max-width:100%;max-height:68vh;width:auto;height:auto}.pair{display:grid;grid-template-columns:1fr 1fr;width:100%}.pair figure,.single figure{margin:0;padding:16px}.pair figcaption,.single figcaption{margin-top:8px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.compare{position:relative;width:100%;max-height:68vh}.compare-frame{position:relative;overflow:hidden;width:100%}.compare .after{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;clip-path:inset(0 var(--reveal, 50%) 0 0)}.compare input[type=range]{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;cursor:ew-resize}.compare-line{position:absolute;top:0;bottom:0;left:var(--line, 50%);width:2px;background:#fff8ef;box-shadow:0 0 0 1px #1c19144d;pointer-events:none}.empty{padding:48px 28px;text-align:center;color:var(--ink-soft)}.empty h2{margin:0 0 8px;font-family:var(--serif);color:var(--ink)}.status{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:#fff7dc;border:1px solid #e2c56a;color:#5c4708;font-size:13px}.status.error{background:#fde8e4;border-color:#e3a094;color:#7a2218}.found{margin-top:10px;padding:10px 12px;border-radius:10px;background:#eef6f3;border:1px solid #b7cfc7;font-family:var(--mono);font-size:12px;white-space:pre-wrap}.footer-note{margin-top:18px;color:var(--ink-soft);font-size:12px;line-height:1.5}@media(max-width:980px){.app{padding:16px}.masthead,.workspace,.pair,.row{grid-template-columns:1fr}.masthead{display:grid}}