/* ============ TROVA — editorial physical-goods marketplace ============ */
:root{
  --paper:#F5F1E8; --bg:#F5F1E8; --surface:#FFFFFF; --ink:#1C1A15; --muted:#6B6357; --faint:#A19883;
  --line:#E4DDCC; --line-2:#EEE8DA; --accent:#7C332A; --accent-soft:#F1E8E1;
  --ok:#3C6A50; --ok-soft:#E7EFE7; --star:#A9812F; --icon-ink:#3A342B; --img-bg:#EBE4D4;
  --serif:"Sitka Banner","Sitka Subheading",Georgia,"Times New Roman",serif;
  --serif-h:"Sitka Heading","Sitka Subheading",Georgia,serif;
  --text:"Sitka Text",Georgia,"Times New Roman",serif;
  --grotesk:"Bahnschrift","Franklin Gothic Medium","Segoe UI",Arial,sans-serif;
  --shadow-sm:0 1px 0 rgba(28,26,21,.02);
  --shadow:0 10px 30px -18px rgba(28,26,21,.35);
  --shadow-lg:0 24px 60px -22px rgba(28,26,21,.4);
  --r:4px; --r-sm:3px;
  --font:var(--text);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{font-family:var(--text);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{background:var(--bg)}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.eyebrow,.lbl{font-family:var(--grotesk);text-transform:uppercase;letter-spacing:.14em;font-weight:600}

/* ---------- page container (normal site, not a device frame) ---------- */
.screen{width:100%;max-width:1500px;min-height:auto;background:var(--bg);margin:0 auto;position:relative}
.screen.tall{min-height:auto}
.phone{width:390px;min-height:844px;background:var(--bg);margin:0 auto;position:relative;overflow:hidden}

/* ---------- browser chrome (desktop) ---------- */
.chrome{background:#E7E3DA;padding:10px 14px 0;border-bottom:1px solid #D8D2C4}
.chrome .bar{display:flex;align-items:center;gap:12px;height:38px}
.dots{display:flex;gap:8px}
.dots i{width:12px;height:12px;border-radius:50%;display:block}
.dots i:nth-child(1){background:#E0685E}.dots i:nth-child(2){background:#E4B24A}.dots i:nth-child(3){background:#7FA86A}
.nav-ic{display:flex;gap:16px;color:#7C7362;font-size:16px;padding:0 4px}
.nav-ic svg{width:18px;height:18px;stroke:#7C7362;fill:none;stroke-width:2}
.omni{flex:1;display:flex;align-items:center;gap:9px;background:#FBFAF6;border:1px solid #DAD3C4;height:34px;border-radius:8px;padding:0 12px;color:#514A3D;font-size:13.5px;font-family:var(--grotesk);max-width:640px;margin:0 auto}
.omni .lock{width:13px;height:13px;stroke:#9C9282;fill:none;stroke-width:2}
.omni .url{display:inline-flex;align-items:center;letter-spacing:.02em}
.url-blur{filter:blur(4px);user-select:none;color:#514A3D}
.omni .star2{margin-left:auto;color:#C3BBA8}
.tabs{display:flex;gap:2px;margin-top:9px}
.tab{background:var(--bg);border-radius:8px 8px 0 0;padding:8px 16px;font-size:12px;color:#514A3D;font-family:var(--grotesk);letter-spacing:.02em;display:flex;align-items:center;gap:9px;max-width:280px}
.tab .fav{width:13px;height:13px;border-radius:2px;background:var(--ink)}
.tab.bg{background:#DAD4C6;color:#7C7362}

/* mobile browser chrome */
.mchrome{background:#EFEBE1;padding:0}
.mstatus{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 22px 0 26px;font-size:14px;font-weight:600;font-family:var(--grotesk);color:var(--ink)}
.mstatus .r{display:flex;align-items:center;gap:6px}
.mstatus .r svg{width:17px;height:12px;fill:var(--ink)}
.maddr{display:flex;align-items:center;gap:8px;padding:6px 14px 10px}
.maddr .pill{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;background:#FFF;border:1px solid #E0D9CA;height:38px;border-radius:10px;font-size:14px;font-family:var(--grotesk);color:#514A3D}
.maddr .pill .lock{width:12px;height:12px;stroke:#9C9282;fill:none;stroke-width:2}
.maddr .mic{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:#7C7362}

/* ---------- top app header ---------- */
.top{background:var(--surface);border-bottom:1px solid var(--line);padding:0 44px;height:76px;display:flex;align-items:center;gap:30px}
.logo{display:flex;align-items:baseline;gap:9px;font-family:var(--serif);font-weight:600;font-size:27px;letter-spacing:.02em;color:var(--ink)}
.logo .mark{display:none}
.logo::after{content:"MARKET";font-family:var(--grotesk);font-size:11px;letter-spacing:.28em;color:var(--accent);font-weight:600;align-self:center;transform:translateY(-3px)}
.search{flex:1;max-width:520px;display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);height:44px;border-radius:3px;padding:0 14px;color:var(--faint);font-family:var(--grotesk);font-size:13.5px;letter-spacing:.02em}
.search svg{width:18px;height:18px;stroke:var(--faint);fill:none;stroke-width:2}
.navlinks{display:flex;gap:26px;margin-left:auto;font-family:var(--grotesk);text-transform:uppercase;letter-spacing:.12em;font-size:12.5px;font-weight:600;color:var(--muted)}
.navlinks a.on{color:var(--ink);border-bottom:2px solid var(--accent);padding-bottom:3px}
.top .acts{display:flex;align-items:center;gap:18px;color:var(--muted)}
.top .acts svg{width:21px;height:21px;stroke:var(--muted);fill:none;stroke-width:1.6}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--paper);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-weight:600;font-size:16px}

/* ---------- generic ---------- */
.wrap{padding:32px 44px}
.chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--grotesk);text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:600;padding:5px 11px;border:1px solid var(--line);color:var(--muted);border-radius:2px}
.chip.brand{border-color:var(--accent);color:var(--accent)}
.chip.ok{border-color:var(--ok);color:var(--ok)}
.chip.line{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:50px;padding:0 26px;border-radius:2px;font-family:var(--grotesk);text-transform:uppercase;letter-spacing:.12em;font-weight:600;font-size:13px;cursor:pointer;border:1px solid transparent}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn.block{width:100%}
.btn.ghost{background:transparent;border-color:var(--ink);color:var(--ink)}
.stars{color:var(--star);letter-spacing:2px;font-size:12px}
.muted{color:var(--muted)} .faint{color:var(--faint)}
.rowb{display:flex;align-items:center;justify-content:space-between}

/* ---------- product photos ---------- */
.ph{width:100%;height:100%;object-fit:contain;display:block;background:#fff}
.pimg,.gallery .big,.thumbs .t,.line-item .li-ic,.dlrow .li-ic,.prodrow .pic,.mli .mic{overflow:hidden}
.gallery .big{background:#fff}
.gallery .big .ph{padding:26px}
.card .pimg .ph{padding:14px}