html, body { background:#F5EDE0; color:#2A1F14; scroll-behavior: smooth; }

body::before {
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background-image:
    radial-gradient(rgba(62,44,28,0.06) 1px, transparent 1px),
    radial-gradient(rgba(62,44,28,0.04) 1px, transparent 1px);
  background-size: 3px 3px, 7px 7px;
  background-position: 0 0, 1px 1px;
  mix-blend-mode: multiply;
  opacity:.6;
}
#root { position:relative; z-index:1; }

.ink-underline {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12'><path d='M2 7 C 40 1, 80 12, 120 5 S 195 8, 198 5' fill='none' stroke='%23C97D5D' stroke-width='3' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat; background-position:center bottom; background-size:100% 10px;
  padding-bottom:10px;
}
.brush-divider {
  height:18px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 18' preserveAspectRatio='none'><path d='M0 9 C 200 2 400 16 600 9 S 1000 2 1200 9' fill='none' stroke='%233E2C1C' stroke-width='2' stroke-linecap='round' opacity='.45'/></svg>");
  background-repeat:no-repeat; background-size:100% 100%;
}

.reveal { opacity:0; transform: translateY(14px); transition: opacity .8s ease, transform .8s ease; }
.reveal.in { opacity:1; transform: translateY(0); }

.art-card { transition: transform .35s ease, box-shadow .35s ease; }
.art-card:hover { transform: translateY(-4px) rotate(-.4deg); }
.art-card:hover .art-frame { box-shadow: 0 30px 60px -25px rgba(62,44,28,0.45); }

@keyframes draw { from { stroke-dashoffset: 600; } to { stroke-dashoffset: 0; } }
.draw-stroke { stroke-dasharray: 600; stroke-dashoffset: 600; animation: draw 2.4s ease-out .3s forwards; }

@keyframes pop { 0%{transform:scale(1)} 50%{transform:scale(1.06)} 100%{transform:scale(1)} }
.pop { animation: pop .35s ease; }

.input {
  width:100%;
  background:#F5EDE0;
  border:1px solid rgba(62,44,28,0.18);
  padding:.6rem .75rem;
  font-size:.95rem;
  color:#2A1F14;
  outline:none;
  border-radius:6px;
  transition:border-color .2s, box-shadow .2s;
}
.input:focus { border-color:#C97D5D; box-shadow: 0 0 0 3px rgba(201,125,93,0.15); }