:root{
  --cream:#f6f2ea; --paper:#fffdf8; --ink:#33302b; --muted:#7a7164;
  --line:#e4dccd; --accent:#9a6f43; --accent-d:#7d5832;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;line-height:1.65}
img{max-width:100%;display:block}
a{color:var(--accent-d)}

.hero{background:linear-gradient(180deg,#efe7d8,#f6f2ea);padding:64px 20px 44px;text-align:center}
.hero-inner{max-width:640px;margin:0 auto}
.eyebrow{font-family:"Cormorant Garamond",Georgia,serif;font-size:20px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--accent-d);margin:0 0 22px}
.portrait{width:230px;height:230px;object-fit:cover;border-radius:50%;margin:0 auto 26px;
  box-shadow:0 10px 34px rgba(60,42,20,.28);border:5px solid #fff}
h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:54px;line-height:1.05;margin:0 0 8px}
.dates{font-family:"Cormorant Garamond",Georgia,serif;font-size:23px;color:var(--muted);margin:0}

main{max-width:680px;margin:0 auto;padding:8px 20px 64px}
.invite{font-size:18.5px;text-align:center;color:#4a4439;margin:38px auto 14px;max-width:600px}

.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:34px 0 10px}
.gallery img{aspect-ratio:1/1;object-fit:cover;border-radius:10px;box-shadow:0 4px 14px rgba(60,42,20,.12)}

.share{margin-top:46px;background:var(--paper);border:1px solid var(--line);border-radius:18px;
  padding:30px 26px;box-shadow:0 8px 30px rgba(60,42,20,.07)}
.share h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:34px;text-align:center;margin:0 0 6px}
.share .sub{text-align:center;color:var(--muted);margin:0 0 24px;font-size:15px}

label{display:block;font-weight:500;font-size:14px;margin:18px 0 6px}
.opt{font-weight:400;color:var(--muted)}
input[type=text],input[type=email],textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;
  background:#fff;font:inherit;color:inherit}
input[type=text]:focus,input[type=email]:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(154,111,67,.12)}
textarea{min-height:120px;resize:vertical}
input[type=file]{width:100%;padding:14px;border:1.5px dashed var(--line);border-radius:10px;background:#fbf8f1;font:inherit}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.btn{margin-top:24px;width:100%;padding:15px;border:0;border-radius:11px;background:var(--accent);color:#fff;
  font:inherit;font-weight:600;font-size:17px;cursor:pointer;transition:background .15s}
.btn:hover{background:var(--accent-d)}
.btn:disabled{opacity:.6;cursor:default}
.note{font-size:13px;color:var(--muted);margin-top:14px;text-align:center}

.progress{height:9px;background:#eadfce;border-radius:6px;overflow:hidden;margin-top:18px}
.progress>div{height:100%;width:0;background:var(--accent);transition:width .25s}
#uploadStatus{font-size:14px;color:var(--muted);text-align:center;margin-top:10px;min-height:18px}

.thankyou{text-align:center;padding:18px 6px}
.thankyou h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:34px;margin:0 0 10px}
.btn-link{display:inline-block;margin-top:8px;text-decoration:none;color:var(--accent-d);font-weight:500}

footer{text-align:center;color:var(--muted);font-size:13.5px;padding:30px 20px 50px}

.dropzone{border:2px dashed var(--line);border-radius:12px;background:#fbf8f1;padding:26px 18px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.dropzone:hover,.dropzone:focus{outline:none;border-color:var(--accent);background:#f7f0e4}
.dropzone.drag{border-color:var(--accent);background:#f1e7d6}
.dz-icon{font-size:30px;color:var(--accent);line-height:1}
.dz-main{margin:8px 0 2px;font-size:15px}
.dz-link{color:var(--accent-d);text-decoration:underline}
.dz-sub{margin:0;font-size:13px;color:var(--muted)}
.file-list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.file-item{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.fi-thumb{width:44px;height:44px;flex:0 0 44px;border-radius:8px;background:#eee center/cover no-repeat;display:flex;align-items:center;justify-content:center}
.fi-doc{background:#f1e9da;color:var(--accent-d);font-size:20px}
.fi-meta{flex:1;min-width:0;display:flex;flex-direction:column}
.fi-name{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fi-size{font-size:12px;color:var(--muted)}
.fi-remove{flex:0 0 auto;width:30px;height:30px;border:0;border-radius:50%;background:#f1e9da;color:var(--accent-d);font-size:20px;line-height:1;cursor:pointer}
.fi-remove:hover{background:#e7d9c2}

.btn.secondary{background:transparent;color:var(--accent-d);border:1.5px solid var(--line);margin-top:12px}
.btn.secondary:hover{background:#f3ece0;border-color:var(--accent)}
.choice-note{font-size:13px;color:var(--muted);text-align:center;margin:16px 0 0}

.wall{margin:48px auto 0;max-width:680px}
.wall h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:34px;text-align:center;margin:0 0 6px}
.wall .sub{text-align:center;color:var(--muted);margin:0 0 26px;font-size:15px}
.memory{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin:0 0 16px;box-shadow:0 4px 16px rgba(60,42,20,.06)}
.memory .who{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:23px;margin:0 0 1px}
.memory .rel{color:var(--muted);font-size:13px;margin:0 0 12px}
.memory .text{white-space:pre-wrap;margin:0 0 14px;color:#403a31}
.memory .media{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.memory .media a{display:block}
.memory .media img{width:100%;height:120px;object-fit:cover;border-radius:8px;cursor:zoom-in}
.memory .media video,.memory .media audio{width:100%;border-radius:8px}
.wall .empty{text-align:center;color:var(--muted);padding:6px 0 0}

@media(max-width:540px){
  h1{font-size:42px}
  .portrait{width:180px;height:180px}
  .gallery{grid-template-columns:repeat(2,1fr)}
}
