:root{--background:#f5f0e8;--foreground:#3a342f;--muted:#766e66;--soft-muted:#988f85;--surface:#fffcf6;--surface-soft:#f1e9de;--line:#ded2c4;--line-strong:#c8baa9;--accent:#8a927d;--accent-dark:#5e6658;--shadow:0 26px 70px #3a342f1c;--shadow-soft:0 14px 36px #3a342f14}html,body{max-width:100vw;min-height:100%;overflow-x:hidden}body{color:var(--foreground);background:radial-gradient(circle at top left, #fffcf6f5, transparent 34%), linear-gradient(135deg, #a99d8e29, transparent 38%), linear-gradient(315deg, #8a927d1f, transparent 44%), var(--background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box;margin:0;padding:0}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline-offset:3px;outline:2px solid #5e66586b}img{max-width:100%;display:block}.app-shell{min-height:100vh;padding:26px}.intro-panel{justify-content:space-between;align-items:end;max-width:1400px;margin:0 auto 22px;display:flex}.eyebrow{color:var(--accent-dark);letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px;font-size:.72rem;font-weight:600}h1{letter-spacing:0;max-width:900px;font-size:clamp(2.2rem,4.4vw,5.15rem);font-weight:500;line-height:1}.intro-copy{color:var(--muted);max-width:720px;margin-top:16px;font-size:1.04rem;line-height:1.7}.workspace{grid-template-columns:minmax(290px,340px) minmax(0,1fr);gap:24px;max-width:1400px;margin:0 auto;display:grid}.controls{box-shadow:var(--shadow-soft);background:#fffcf6db;border:1px solid #ded2c4eb;border-radius:8px;align-self:start;gap:20px;padding:20px;display:grid}.control-group{gap:12px;display:grid}.control-group+.control-group{border-top:1px solid #ded2c4c7;padding-top:20px}h2{color:#4a443e;letter-spacing:0;font-size:.9rem;font-weight:650}.file-drop{border:1px dashed var(--line-strong);cursor:pointer;text-align:center;background:#f3ece2;border-radius:8px;place-content:center;gap:6px;min-height:112px;padding:20px;transition:border-color .16s,background .16s,box-shadow .16s;display:grid}.file-drop:hover{border-color:var(--accent-dark);background:#eee4d8;box-shadow:inset 0 0 0 1px #5e66581a}.file-drop input{opacity:0;width:1px;height:1px;position:absolute}.file-drop span{font-size:1rem;font-weight:650}small,.upload-note,.preview-note{color:var(--muted);font-size:.78rem;line-height:1.4}.upload-note{background:#f1e9de9e;border:1px solid #ded2c4b8;border-radius:8px;padding:10px 12px}.artwork-list,.style-grid{gap:8px;display:grid}.artwork-option,.style-option{border:1px solid var(--line);cursor:pointer;text-align:left;background:#fffcf6eb;border-radius:8px;align-items:center;gap:10px;padding:11px;transition:background .16s,border-color .16s,box-shadow .16s,transform .16s;display:grid}.artwork-option{grid-template-columns:56px 1fr}.artwork-option:hover,.style-option:hover,.catalog-toggle:hover,.nudge-grid button:hover{background:#fffaf2;border-color:#b9b19f}.artwork-option.is-selected,.style-option.is-selected{border-color:var(--accent);background:#fffaf2;box-shadow:0 0 0 3px #8a927d29}.artwork-thumb{aspect-ratio:var(--thumb-aspect);background:#eee5da;border-radius:6px;place-items:center;min-width:0;display:grid;overflow:hidden}.artwork-thumb img{object-fit:contain;object-position:center center;width:100%;height:100%;display:block}.artwork-thumb-fallback{background:linear-gradient(135deg,#fffcf6b3,#0000 52%),#e6ddd2;border:1px solid #c8baa98f;border-radius:6px;width:100%;height:100%;display:block}.artwork-option span,.style-option{min-width:0}.artwork-option strong,.style-option strong{font-size:.92rem;font-weight:650;display:block}.style-option{grid-template-columns:36px 1fr}.catalog-toggle{color:#4f5a4a;cursor:pointer;font:inherit;background:#f3ece29e;border:1px solid #ded2c4e6;border-radius:8px;justify-self:start;padding:8px 11px;font-size:.88rem;font-weight:650;transition:background .16s,border-color .16s,color .16s}.catalog-toggle.is-subtle{color:var(--muted);background:0 0;padding:6px 0;font-size:.8rem}.style-option small{grid-column:2}.frame-swatch{aspect-ratio:1;background:#efe5d7;border-radius:4px;grid-row:span 2;width:36px;box-shadow:inset 0 0 0 7px #d4c3af,inset 0 0 0 11px #fffaf4}.frame-swatch.unframed{box-shadow:inset 0 0 0 4px #d8c6b4}.frame-swatch.framed{box-shadow:inset 0 0 0 7px #8b735f,inset 0 0 0 11px #fffaf4}.frame-swatch.dark{box-shadow:inset 0 0 0 7px #2d2b29,inset 0 0 0 11px #fffaf4}.range-control{gap:8px;display:grid}.range-control span{color:var(--muted);font-size:.84rem}.range-control input{accent-color:var(--accent);cursor:pointer;width:100%}.nudge-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.nudge-grid button{border:1px solid var(--line);cursor:pointer;background:#fffcf6eb;border-radius:8px;min-height:38px;padding:0 8px;font-size:.82rem;transition:background .16s,border-color .16s}.nudge-grid button:first-child,.nudge-grid button:last-child{grid-column:2}.preview-wrap{min-width:0}.room-preview{aspect-ratio:16/10.5;box-shadow:var(--shadow);touch-action:none;background:#e8dfd4;border:1px solid #ded2c4e6;border-radius:8px;position:relative;overflow:hidden}.room-photo{object-fit:cover;width:100%;height:100%}.empty-room{color:var(--muted);background:linear-gradient(#0000 0 66%,#b2a4953d 66%),linear-gradient(90deg,#fffcf685,#0000 42%),#e8dfd4;place-items:center;height:100%;padding:28px;display:grid}.sample-wall{aspect-ratio:4/3;border:1px solid #766e662e;border-radius:8px;width:58%;max-width:440px;position:relative}.sample-wall span{background:#8a927d2e;border-radius:999px;width:64%;height:18px;display:block;position:absolute;bottom:-42px;left:18%}.artwork-placement{--artwork-aspect:2 / 3;--frame-inset:4%;--mat-inset:2.5%;--frame-color:#7a6353;--mat-color:#fffaf4;aspect-ratio:var(--artwork-aspect);cursor:grab;filter:drop-shadow(0 18px 22px #2a241f3b);-webkit-user-select:none;user-select:none;position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}.artwork-placement.is-dragging{cursor:grabbing}.artwork-frame{background:var(--frame-color);place-items:center;width:100%;height:100%;display:grid}.artwork-mat{aspect-ratio:var(--artwork-aspect);background:var(--mat-color);width:calc(100% - (var(--frame-inset) * 2));place-items:center;display:grid}.artwork-image-wrap{aspect-ratio:var(--artwork-aspect);width:calc(100% - (var(--mat-inset) * 2));background:0 0;place-items:center;display:grid;overflow:hidden}.artwork-image-wrap img{object-fit:contain;object-position:center center;pointer-events:none;width:100%;height:100%;display:block}.artwork-fallback{color:#5e574f;pointer-events:none;text-align:center;background:linear-gradient(145deg,#fffcf6c2,#0000 55%),#ebe1d4;place-items:center;gap:8px;width:100%;height:100%;padding:18%;display:grid}.artwork-fallback strong{font-size:clamp(.84rem,1.7vw,1.16rem);font-weight:650;line-height:1.2}.artwork-fallback span{color:var(--muted);font-size:clamp(.68rem,1.2vw,.82rem);line-height:1.35}.artwork-placement.unframed{--frame-color:#f8f3ec;--frame-inset:1.5%;--mat-color:#f8f3ec;--mat-inset:0%}.artwork-placement.framed{--frame-color:#7a6353;--frame-inset:4%;--mat-color:#fffaf4;--mat-inset:2.5%}.artwork-placement.light{--frame-color:#d8c7b4;--frame-inset:5%;--mat-color:#fffaf4;--mat-inset:3%}.artwork-placement.dark{--frame-color:#292725;--frame-inset:5%;--mat-color:#fffaf4;--mat-inset:3%}.preview-note{text-align:center;max-width:820px;margin:14px auto 0}@media (max-width:900px){.app-shell{padding:18px}.intro-panel{align-items:start}.workspace{grid-template-columns:1fr}.controls{order:2}.preview-wrap{order:1}}@media (max-width:560px){.app-shell{padding:14px}.intro-panel{margin-bottom:16px}.room-preview{aspect-ratio:4/4.7}.style-grid{grid-template-columns:1fr}h1{font-size:2.18rem}.intro-copy{font-size:.96rem}.controls{padding:16px}.nudge-grid{grid-template-columns:1fr 1fr}.nudge-grid button:first-child,.nudge-grid button:last-child{grid-column:auto}}