:root{--paper:#E8EBE6;--ink:#18221F;--muted:#55625D;--accent:#2F4B7C;--on-accent:#fff;--line:#C9CFC8;
    --head:ui-rounded,"Avenir Next",Avenir,"Segoe UI",system-ui,sans-serif;--body:Georgia,"Iowan Old Style",serif}
  @media (prefers-color-scheme:dark){:root{--paper:#141A18;--ink:#E6EAE4;--muted:#9AA79F;--accent:#8FB0E8;--on-accent:#101614;--line:#2A3430}}
  *{box-sizing:border-box;margin:0}
  body{background:var(--paper);color:var(--ink);font:400 1.15rem/1.6 var(--body)}
  a{color:inherit}
  :focus-visible{outline:3px solid var(--accent);outline-offset:3px}
  .wrap{max-width:1180px;margin:0 auto;padding:0 1.25rem}
  header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 0;gap:1rem}
  .logo{font:700 1.1rem var(--head);text-decoration:none}
  .cartlink{font:700 1rem var(--head);text-decoration:none;padding:.5rem .9rem;border:1px solid var(--ink);border-radius:2px}
  .btn{display:inline-block;padding:.8rem 1.4rem;background:var(--accent);color:var(--on-accent);font:700 1rem var(--head);text-decoration:none;border:0;border-radius:2px;cursor:pointer}
  .btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
  .btn:disabled{opacity:.5;cursor:wait}
  h1{font:800 clamp(3rem,11vw,8.5rem)/.92 var(--head);letter-spacing:-.04em;max-width:11ch}
  h2{font:800 clamp(1.7rem,4vw,2.6rem)/1.1 var(--head);letter-spacing:-.02em;margin-bottom:1rem}
  .lead{max-width:34rem;margin:1.5rem 0 2.5rem;color:var(--muted);font-size:1.25rem}
  .muted{color:var(--muted)}
  .back{display:inline-block;margin:1rem 0;font:400 1rem var(--head)}
  @media (prefers-reduced-motion:no-preference){h1{animation:settle .9s cubic-bezier(.2,.7,.2,1) both}
    @keyframes settle{from{opacity:0;letter-spacing:.02em}to{opacity:1;letter-spacing:-.04em}}}

  /* Albums */
  .albums{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin-bottom:4rem}
  .album{display:block;text-decoration:none}
  .album .img{aspect-ratio:4/3;overflow:hidden;background:var(--line)}
  .album img{width:100%;height:100%;object-fit:cover;display:block}
  .album b{display:block;margin-top:.5rem;font:700 1.15rem var(--head)}
  .album span{font-size:1rem;color:var(--muted)}

  /* Photos */
  .photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.6rem;margin:1.5rem 0 4rem}
  .photo{position:relative;aspect-ratio:1;background:var(--line);overflow:hidden}
  .photo>button.open{all:unset;display:block;width:100%;height:100%;cursor:zoom-in}
  .photo img{width:100%;height:100%;object-fit:cover;display:block}
  .pick{position:absolute;right:.5rem;bottom:.5rem;padding:.4rem .8rem;font:700 .9rem var(--head);background:#fff;color:#18221F;border:0;border-radius:2px;cursor:pointer}
  .pick[aria-pressed=true]{background:var(--accent);color:var(--on-accent)}
  .bar{position:sticky;bottom:0;background:var(--paper);border-top:1px solid var(--line);padding:.8rem 0;display:flex;justify-content:space-between;align-items:center;gap:1rem}

  /* Lightbox */
  #lb{position:fixed;inset:0;background:rgba(10,14,13,.95);display:none;flex-direction:column;z-index:10;color:#fff}
  #lb.on{display:flex}
  #lb .stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;position:relative;padding:1rem}
  #lb img{max-width:100%;max-height:100%;object-fit:contain}
  #lb .nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.15);color:#fff;border:0;font-size:2rem;width:3rem;height:4rem;cursor:pointer}
  #lb .prev{left:.5rem}#lb .next{right:.5rem}
  #lb .top,#lb .foot{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;font:400 1rem var(--head);gap:1rem}
  #lb .top button{background:none;border:0;color:#fff;font:700 1rem var(--head);cursor:pointer}

  /* Cart */
  .item{display:flex;gap:1rem;align-items:center;padding:.8rem 0;border-bottom:1px solid var(--line)}
  .item img{width:84px;height:84px;object-fit:cover;background:var(--line)}
  .item div{flex:1;font-size:1rem}
  .item button{background:none;border:0;color:var(--accent);font:700 .95rem var(--head);cursor:pointer;text-decoration:underline}
  form{display:grid;gap:1rem;max-width:34rem;margin:2rem 0 4rem}
  label{font:700 .95rem var(--head)}
  input,textarea{width:100%;margin-top:.3rem;padding:.7rem .8rem;font:inherit;color:var(--ink);background:transparent;border:1px solid var(--muted);border-radius:2px}
  .note{padding:1rem;border:1px solid var(--line);margin:1rem 0}
  #err{color:#B3261E;font:700 1rem var(--head)}
  @media (prefers-color-scheme:dark){#err{color:#FF8A80}}
  footer{padding:2rem 0;border-top:1px solid var(--line);color:var(--muted);font-size:1rem}
.tight{margin-top:0;margin-bottom:4rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.small{font-size:.95rem;color:var(--muted)}
