:root {
  --paper: #f6f1e8;
  --ink: #252525;
  --muted: #6b685f;
  --line: #d9d3c8;
  --blue: #6f92d5;
  --blue-dark: #5476b6;
  --card: rgba(255,255,255,.78);
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.shell { width: min(760px, calc(100% - 32px)); margin: 36px auto 20px; }
.brand-row { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px; }
.eyebrow { margin:0; color:var(--blue-dark); font-weight:800; letter-spacing:.16em; font-size:.78rem; }
h1 { margin:.1rem 0 0; font-size:clamp(2.8rem, 10vw, 5.2rem); line-height:.9; }
h2 { margin-top:0; font-size:clamp(1.45rem, 4vw, 2.1rem); }
h3 { margin-top:0; }
.badge { border:1px solid var(--line); border-radius:999px; padding:8px 12px; color:var(--muted); background:#fff8; font-size:.84rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:20px; padding:22px; margin:14px 0; box-shadow:0 10px 28px rgba(50,45,35,.05); backdrop-filter: blur(3px); }
.compact { padding-bottom:16px; }
.small, .status, .upload-box span, .compact p { color:var(--muted); }
.meta-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.meta-grid div { display:flex; flex-direction:column; gap:5px; padding:12px; border-radius:14px; background:#fff9; }
.meta-grid span { font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.stack { display:grid; gap:16px; }
.upload-box { display:grid; gap:6px; border:1.5px dashed #aaa399; border-radius:16px; padding:24px; cursor:pointer; background:#fff7; }
.upload-box input { margin-top:10px; }
.preview-wrap { border-radius:16px; overflow:hidden; background:#e9e4db; border:1px solid var(--line); }
.preview-wrap img { width:100%; max-height:520px; object-fit:contain; display:block; }
.hidden { display:none; }
.button-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.button { border:none; border-radius:14px; min-height:48px; font-weight:800; cursor:pointer; padding:0 18px; }
.primary { background:var(--blue); color:white; }
.primary:hover { background:var(--blue-dark); }
.secondary { background:#ece7de; color:var(--ink); }
.button:disabled { opacity:.45; cursor:not-allowed; }
.status { margin:0; font-size:.92rem; }
footer { width:min(760px, calc(100% - 32px)); margin:12px auto 40px; display:flex; justify-content:center; gap:10px; color:var(--muted); font-size:.9rem; }
footer a { color:inherit; }
.policy { width:min(760px, calc(100% - 32px)); margin:40px auto; }
.policy h1 { font-size:clamp(2.2rem,7vw,4rem); }
.policy h2 { margin-top:2rem; }
.policy p, .policy li { line-height:1.65; color:#3d3a35; }
.policy a { color:var(--blue-dark); }
@media (max-width: 620px) {
  .brand-row { align-items:flex-start; flex-direction:column; }
  .meta-grid { grid-template-columns:1fr; }
  .button-row { grid-template-columns:1fr; }
}
