:root{
  --bg:#F3ECDD; --paper:#FBF7EF; --ink:#201812; --ink-2:#4A3A28; --muted:#8A7A66;
  --line:#D2C3A6; --accent:#A16A38; --accent-2:#D19E63; --sun:#E9C889; --leaf:#7C8A5E;
  --serif:"Noto Serif JP","Hiragino Mincho ProN",serif;
  --sans:"Zen Kaku Gothic New","Hiragino Sans",sans-serif;
  --latin:"Cormorant Garamond",serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.95;letter-spacing:.04em}
.wrap{max-width:640px;margin:0 auto;padding:48px 20px 80px}
.brand{display:block;text-align:center;font-family:var(--serif);font-size:15px;letter-spacing:.2em;
  color:var(--ink);text-decoration:none;margin-bottom:6px}
.brand small{display:block;font-family:var(--latin);font-style:italic;font-size:11px;color:var(--muted);letter-spacing:.18em}
h1{font-family:var(--serif);font-weight:500;font-size:clamp(22px,5vw,30px);letter-spacing:.1em;
  text-align:center;margin:28px 0 10px;line-height:1.7}
.lead{text-align:center;font-size:14px;color:var(--ink-2);margin-bottom:32px}
.card{background:var(--paper);border-radius:8px;padding:32px 28px;box-shadow:0 24px 56px -32px rgba(32,24,18,.3)}
.field{margin-bottom:22px}
.field label{display:block;font-size:13.5px;font-weight:500;margin-bottom:8px;letter-spacing:.06em}
.req{font-size:10px;color:var(--paper);background:var(--accent);padding:2px 8px;border-radius:999px;margin-left:6px;vertical-align:middle}
input[type=text],input[type=email],input[type=tel],textarea{width:100%;font-family:var(--sans);font-size:15px;
  color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:13px 14px}
input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(161,106,56,.12)}
textarea{resize:vertical;line-height:1.85}
.btn{display:block;width:100%;text-align:center;font-family:var(--serif);font-weight:600;font-size:15.5px;
  letter-spacing:.16em;color:var(--paper);background:var(--ink);border:none;border-radius:999px;
  padding:17px;cursor:pointer;text-decoration:none;transition:background .3s,transform .3s}
.btn:hover{background:var(--accent);transform:translateY(-1px)}
.btn[disabled]{opacity:.55;cursor:default;transform:none}
.btn--ghost{background:transparent;color:var(--ink-2);border:1.5px solid var(--line)}
.btn--ghost:hover{background:var(--paper);color:var(--ink)}
.status{margin-top:16px;text-align:center;font-size:14px;min-height:1em}
.status.ok{color:var(--leaf)} .status.err{color:#b4552e}
.note{font-size:12px;color:var(--muted);text-align:center;margin-top:18px;line-height:1.8}
.progress{height:6px;background:var(--bg);border-radius:999px;overflow:hidden;margin-top:14px;display:none}
.progress i{display:block;height:100%;width:0;background:var(--accent-2);transition:width .3s}
/* dropzone */
.drop{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;text-align:center;
  min-height:130px;border:1.5px dashed var(--line);border-radius:6px;background:var(--bg);cursor:pointer;
  transition:border-color .25s,background .25s;padding:18px}
.drop:hover,.drop.drag{border-color:var(--accent);background:#f6efe1}
.drop b{font-family:var(--serif);font-weight:500;font-size:15px;color:var(--ink-2)}
.drop small{font-size:11.5px;color:var(--muted);letter-spacing:.06em}
.thumbs{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.thumb{position:relative;width:64px;height:64px;border-radius:4px;overflow:hidden;box-shadow:0 5px 14px -7px rgba(32,24,18,.4)}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb button{position:absolute;top:2px;right:2px;width:18px;height:18px;border:none;border-radius:50%;
  background:rgba(32,24,18,.72);color:#fff;font-size:12px;line-height:1;cursor:pointer}
/* checkbox row */
.check{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;font-size:14px}
.check input{margin-top:5px;accent-color:var(--accent)}
.gift-sub{display:none;margin:6px 0 16px;padding:16px;background:var(--bg);border-radius:6px}
/* viewer */
model-viewer{width:100%;height:420px;background:radial-gradient(circle at 50% 36%,#fff,#ece2cd);border-radius:6px}
@media(max-width:480px){ model-viewer{height:340px} .card{padding:26px 18px} }
/* 元のお写真 と 3Dフィギュアの並置 */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media(max-width:560px){ .compare{grid-template-columns:1fr;gap:22px} }
.compare .col{min-width:0}
.compare .cap{text-align:center;font-size:12px;letter-spacing:.1em;color:var(--muted);margin-bottom:8px}
.compare .shot{width:100%;aspect-ratio:1/1;object-fit:contain;background:var(--bg);border-radius:6px;display:block}
.compare model-viewer{height:auto;aspect-ratio:1/1}
@media(max-width:480px){ .compare model-viewer{height:auto} }
.thumbrow{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.thumbrow img{width:44px;height:44px;object-fit:cover;border-radius:4px;cursor:pointer;
  opacity:.5;border:2px solid transparent;transition:opacity .2s,border-color .2s}
.thumbrow img.on,.thumbrow img:hover{opacity:1;border-color:var(--accent)}