:root{
  --cream:#f3eadc;--paper:#f6efe4;--brown:#5a3928;--brown2:#2a1c14;--burgundy:#6f1d2a;--ink:#17120f;--gold:#b78b4a;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"DM Sans",sans-serif;background:#1d140f;color:var(--ink)}button{font:inherit}.intro{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:#1d140f;color:#f5eee5;transition:opacity .9s ease,visibility .9s}.intro.hide{opacity:0;visibility:hidden}.intro-copy{text-align:center;animation:introIn 1s ease both}.intro-copy p{font-family:"Playfair Display",serif;font-size:clamp(42px,7vw,88px);margin:0}.intro-copy span{display:block;margin-top:10px;font-family:"Special Elite"}@keyframes introIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.desk-page{min-height:100svh;display:grid;place-items:center;background:#1d140f;overflow:hidden}.desk-scene{position:relative;width:min(100vw,1920px);aspect-ratio:3/2;overflow:hidden;background:#5d402b}.desk-image{width:100%;height:100%;object-fit:cover;display:block;user-select:none}.tape-nav{position:absolute;left:17%;right:12%;top:2.3%;display:grid;grid-template-columns:1.1fr 1.2fr .8fr 1fr 1.15fr 1.1fr;gap:1.1%;z-index:8;align-items:start}.tape-btn{border:0;background:linear-gradient(180deg,#f4e8d2,#ead8ba);color:#17120f;min-height:52px;padding:8px 10px;font-family:"Special Elite";font-weight:700;text-transform:uppercase;letter-spacing:.02em;cursor:pointer;box-shadow:0 8px 16px #0004;clip-path:polygon(2% 7%,98% 2%,100% 88%,95% 95%,3% 91%,0 15%);transition:.18s ease;white-space:nowrap}.tape-btn:hover,.tape-btn:focus-visible{transform:translateY(-3px) rotate(-.3deg);background:#f7ead5;box-shadow:0 12px 20px #0005}.home-tab{font-family:"Playfair Display",serif;font-size:30px;font-style:italic;color:var(--burgundy);text-transform:none}.object-hit{position:absolute;z-index:6;border:0;background:transparent;cursor:pointer}.object-hit:before{content:"";position:absolute;inset:0;border-radius:18px;opacity:0;transition:.2s;box-shadow:0 0 0 2px #fff7,0 0 35px 18px rgba(255,222,168,.36);background:rgba(255,235,199,.08)}.object-hit:hover:before,.object-hit:focus-visible:before{opacity:1}.object-hit span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#f2e7d6;color:#26180f;border:1px solid #7d5a44;padding:7px 10px;border-radius:999px;font-family:"Special Elite";font-size:13px;opacity:0;transition:.2s;box-shadow:0 8px 18px #0004}.object-hit:hover span,.object-hit:focus-visible span{opacity:1;transform:translate(-50%,-60%)}
.camera-hit{left:12.5%;top:10.5%;width:18.5%;height:24%;border-radius:38% 42% 30% 32%}.laptop-hit{right:8.5%;top:7.5%;width:32%;height:48%;border-radius:18%}.phone-hit{left:14.7%;bottom:19%;width:15.5%;height:37%;border-radius:20%}.journal-hit{left:34.5%;bottom:0%;width:28%;height:39%;border-radius:14%}.receipts-hit{right:19%;bottom:0%;width:23%;height:42%;border-radius:10%}
.experience{position:fixed;inset:0;z-index:50;background:radial-gradient(circle at 50% 10%,#76563c,#2b1f17 68%,#17110d);opacity:0;visibility:hidden;transition:.35s;overflow:auto}.experience.open{opacity:1;visibility:visible}.back{position:fixed;left:18px;top:18px;z-index:60;border:1px solid #8f705a;background:#f2e8da;color:#2a1d14;border-radius:999px;padding:.75rem 1rem;cursor:pointer;box-shadow:4px 4px 0 var(--burgundy)}.experience-stage{min-height:100svh;display:grid;place-items:center;padding:74px 20px 30px}.view-card{width:min(1180px,96vw);animation:zoomIn .5s ease both}@keyframes zoomIn{from{opacity:0;transform:scale(.86) translateY(18px)}to{opacity:1;transform:none}}
.camera-window{background:#efe6da;border:1px solid #a28770;border-radius:22px;overflow:hidden;box-shadow:0 35px 90px #0008}.camera-window header{display:flex;justify-content:space-between;padding:14px 18px;background:#f7f1e8;border-bottom:1px solid #cbb9a8}.camera-window header div{display:flex;gap:18px;align-items:center}.camera-layout{display:grid;grid-template-columns:220px 1fr;min-height:620px}.camera-layout aside{background:#e4d7c8;border-right:1px solid #bfa991;padding:18px}.camera-layout aside small{display:block;margin-bottom:12px}.folder{width:100%;border:0;background:transparent;padding:12px;text-align:left;border-radius:8px;cursor:pointer}.folder.active{background:var(--burgundy);color:#fff}.folder em{font-size:11px}.folder.muted{opacity:.65}.camera-gallery-wrap{padding:20px}.gallery-heading{display:flex;justify-content:space-between;align-items:center}.gallery-heading h2{font-family:"Playfair Display",serif;font-size:34px;margin:0}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}.gallery-card{aspect-ratio:4/3;background:linear-gradient(145deg,#a77b5e,#f3e5d5);border-radius:14px;box-shadow:0 10px 20px #54341f20;position:relative;overflow:hidden}.gallery-card:nth-child(2n){background:linear-gradient(145deg,#6f1d2a,#d7b88f)}.gallery-card:nth-child(3n){background:linear-gradient(145deg,#221814,#efe1cf)}.gallery-card span{position:absolute;left:12px;bottom:10px;background:#f5ecdfdd;padding:6px 8px;border-radius:7px;font-size:12px}
.dashboard-shell{display:grid;grid-template-columns:190px 1fr;background:#f1e7d9;border-radius:24px;overflow:hidden;box-shadow:0 35px 90px #0008;min-height:650px}.dash-sidebar{background:linear-gradient(#6f1d2a,#4f1720);color:#fff;padding:22px 14px;display:flex;flex-direction:column;gap:8px}.dm-mark{font-family:"Playfair Display",serif;font-size:36px;font-style:italic;margin:4px 8px 18px}.dash-tab{border:0;background:transparent;color:#f6e9dc;text-align:left;padding:12px;border-radius:9px;cursor:pointer}.dash-tab.active{background:#efe4d5;color:#271a13}.dash-main{padding:28px}.dash-main h1{font-family:"Playfair Display",serif;font-size:52px;margin:0 0 6px}.dash-main .sub{color:#7b6a5f}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0}.metric{background:#f7efe4;border:1px solid #d1bea8;border-radius:16px;padding:17px}.metric strong{display:block;font-size:34px;margin-top:6px}.metric em{color:#546b40;font-size:12px}.chart-card{background:#f7efe4;border:1px solid #d1bea8;border-radius:16px;padding:20px}.chart{height:250px;display:flex;align-items:end;gap:12px;margin-top:20px}.chart i{flex:1;height:var(--h);background:linear-gradient(#b98d62,#6f1d2a);border-radius:8px 8px 2px 2px}
.phone-view{width:min(430px,92vw);position:relative}.phone-shell{min-height:760px;border:12px solid #111;border-radius:56px;background:linear-gradient(160deg,#fbf2e5,#f1e1cf);padding:24px 18px 34px;position:relative;box-shadow:0 35px 90px #0008}.notch{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:130px;height:30px;background:#111;border-radius:0 0 18px 18px}.phone-status{display:flex;justify-content:space-between;font-size:12px;padding:0 7px}.phone-copy{text-align:center;margin-top:56px}.phone-copy small{font-family:"Special Elite"}.phone-copy h2{font-family:"Playfair Display",serif;color:var(--burgundy);font-size:42px;margin:4px 0}.phone-copy p{font-size:13px}.app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px 14px;margin-top:34px}.app-grid button{border:0;background:transparent;cursor:pointer}.app-grid b{width:64px;height:64px;border-radius:16px;background:#f8efe2;border:1px solid #cbb49d;display:grid;place-items:center;margin:auto;font-size:25px;box-shadow:0 10px 20px #5d3b2424}.app-grid span{display:block;font-size:11px;margin-top:7px}.phone-note{position:absolute;bottom:48px;left:0;right:0;text-align:center;font-family:"Special Elite"}.home-pill{position:absolute;bottom:13px;left:50%;transform:translateX(-50%);width:120px;height:5px;background:#111;border-radius:999px}.toast{position:absolute;left:50%;bottom:-52px;transform:translateX(-50%);background:#1c1510;color:#fff;padding:10px 14px;border-radius:999px;opacity:0;transition:.2s;white-space:nowrap}.toast.show{opacity:1}
.journal-book{display:grid;grid-template-columns:1fr 30px 1fr;min-height:620px;filter:drop-shadow(0 28px 45px #0007)}.journal-page{background:repeating-linear-gradient(#efe4d3 0 34px,#d8cab8 35px);padding:44px;border:1px solid #9d7d62}.journal-page.left{border-radius:20px 0 0 20px}.journal-page.right{border-radius:0 20px 20px 0}.journal-rings{background:repeating-linear-gradient(#1e1a16 0 8px,#c79a52 8px 16px)}.journal-page h2{font-family:"Special Elite";font-size:48px;margin:0 0 20px}.journal-page p{font-family:"Special Elite";line-height:1.7;font-size:17px}.journal-page .tape{display:inline-block;background:var(--burgundy);color:#fff;padding:7px 12px;transform:rotate(-2deg)}.journal-page .polaroid{width:60%;background:#fff;padding:10px 10px 34px;transform:rotate(3deg);box-shadow:0 10px 18px #0003;margin:20px auto}.journal-page .polaroid div{aspect-ratio:4/3;background:linear-gradient(145deg,#684631,#c8a887)}.page-controls{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:18px}.page-controls button{border:1px solid #a7866b;background:#f0e6d8;border-radius:999px;padding:10px 14px;cursor:pointer}
.receipts-view{width:min(560px,92vw);position:relative}.receipt-stack{position:relative;min-height:760px}.receipt{position:absolute;inset:0;background:#f2e8da;clip-path:polygon(0 0,100% 0,100% 97%,96% 100%,92% 97%,88% 100%,84% 97%,80% 100%,76% 97%,72% 100%,68% 97%,64% 100%,60% 97%,56% 100%,52% 97%,48% 100%,44% 97%,40% 100%,36% 97%,32% 100%,28% 97%,24% 100%,20% 97%,16% 100%,12% 97%,8% 100%,4% 97%,0 100%);box-shadow:0 24px 60px #0006}.receipt.back.one{transform:rotate(-4deg) translate(-18px,8px);opacity:.65}.receipt.back.two{transform:rotate(3deg) translate(20px,12px);opacity:.8}.receipt.main{position:relative;padding:42px 38px;font-family:"Special Elite"}.receipt.main h2{text-align:center;font-size:28px}.receipt-rule{border-top:2px dashed #4a3a2d;margin:18px 0}.receipt.main button{display:block;width:100%;border:0;background:transparent;text-align:left;padding:11px 0;cursor:pointer;font-family:"Special Elite"}.receipt.main button:hover{color:var(--burgundy)}.receipt-total{text-align:center;font-size:20px}.receipt-total em{color:var(--burgundy);font-size:28px}.barcode{height:70px;width:72%;margin:28px auto 16px;background:repeating-linear-gradient(90deg,#111 0 2px,transparent 2px 4px,#111 4px 8px,transparent 8px 10px)}.receipt.main p{text-align:center;font-size:12px}.proof-pop{position:absolute;left:50%;top:50%;transform:translate(-50%,-45%) scale(.96);width:min(460px,90%);background:#f4eadc;border:1px solid #9b7c63;border-radius:20px;padding:28px;box-shadow:0 30px 80px #0008;opacity:0;visibility:hidden;transition:.2s}.proof-pop.open{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1)}.proof-pop button{position:absolute;right:12px;top:10px;border:0;background:transparent;font-size:26px;cursor:pointer}.proof-pop h3{font-family:"Playfair Display",serif;font-size:38px;margin:8px 0}
@media(max-width:900px){.desk-scene{width:100vw;height:100svh;aspect-ratio:auto}.desk-image{object-fit:cover;object-position:center}.tape-nav{left:2%;right:2%;top:1.5%;gap:4px;grid-template-columns:repeat(6,1fr)}.tape-btn{min-height:42px;font-size:11px;padding:6px 4px}.tape-btn span{display:none}.home-tab{font-size:23px}.camera-hit{left:7%;top:11%;width:28%;height:24%}.laptop-hit{right:3%;top:8%;width:42%;height:43%}.phone-hit{left:9%;bottom:17%;width:24%;height:38%}.journal-hit{left:34%;bottom:0;width:32%;height:38%}.receipts-hit{right:5%;bottom:0;width:27%;height:40%}.camera-layout{grid-template-columns:1fr}.camera-layout aside{display:flex;overflow:auto;border-right:0;border-bottom:1px solid #bfa991}.folder{width:auto;white-space:nowrap}.gallery-grid{grid-template-columns:repeat(2,1fr)}.dashboard-shell{grid-template-columns:1fr}.dash-sidebar{flex-direction:row;overflow:auto}.dm-mark{margin:0 12px 0 0}.metric-grid{grid-template-columns:1fr}.journal-book{grid-template-columns:1fr}.journal-page.left,.journal-rings{display:none}.journal-page.right{border-radius:20px}.back{top:10px;left:10px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* v1.1 fixes: the visible washi labels are the actual HTML buttons. */
.tape-nav{
  position:absolute;
  inset:0;
  display:block;
  z-index:12;
  pointer-events:none;
}
.tape-btn{
  position:absolute;
  pointer-events:auto;
  min-height:0;
  height:6.7%;
  padding:.45% .7%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  overflow:visible;
  isolation:isolate;
  background:
    linear-gradient(93deg,rgba(255,255,255,.24),transparent 18% 82%,rgba(92,55,31,.08)),
    repeating-linear-gradient(0deg,rgba(83,52,31,.025) 0 1px,transparent 1px 3px),
    #f1e2c8;
  border:1px solid rgba(88,57,38,.22);
  box-shadow:0 7px 12px rgba(32,19,11,.28);
  clip-path:polygon(1.5% 9%,5% 4%,11% 8%,17% 3%,24% 7%,31% 2%,39% 7%,47% 3%,55% 7%,63% 2%,71% 6%,79% 3%,87% 7%,94% 3%,99% 9%,98% 89%,94% 95%,88% 91%,81% 97%,74% 92%,66% 97%,58% 92%,50% 98%,42% 92%,34% 97%,26% 92%,18% 97%,10% 92%,3% 96%);
}
.tape-btn::before{
  content:"";
  position:absolute;
  inset:4px 6px;
  z-index:-1;
  opacity:.28;
  background:linear-gradient(105deg,transparent 0 22%,rgba(255,255,255,.65) 28%,transparent 35% 70%,rgba(92,55,31,.12));
  filter:blur(.2px);
}
.tape-btn:hover,.tape-btn:focus-visible{
  transform:translateY(-3px) rotate(-.35deg);
  background:#f7ead5;
  outline:2px solid rgba(111,29,42,.72);
  outline-offset:3px;
}
.tape-btn:active{transform:translateY(1px) scale(.99)}
.camera-tab{left:16.8%;top:2.35%;width:11.8%;transform:rotate(-.5deg)}
.laptop-tab{left:29.1%;top:2.25%;width:11.7%;transform:rotate(.2deg)}
.home-tab{left:42.4%;top:2.05%;width:10.7%;height:7.6%;transform:rotate(-.5deg);font-size:clamp(22px,2.35vw,42px)}
.phone-tab{left:55.0%;top:2.45%;width:11.2%;transform:rotate(.25deg)}
.journal-tab{left:66.1%;top:2.25%;width:11.7%;transform:rotate(-.15deg)}
.receipts-tab{left:77.4%;top:2.35%;width:11.1%;transform:rotate(.25deg)}
.nav-icon{font-size:1.15em;line-height:1}

/* stable receipt layout */
.receipts-view{
  width:min(620px,94vw);
  min-height:min(820px,86vh);
  display:grid;
  place-items:center;
  position:relative;
}
.receipt-stack{
  width:min(500px,88vw);
  min-height:720px;
  position:relative;
  display:grid;
  place-items:center;
  margin:auto;
}
.receipt-sheet{
  width:100%;
  min-height:680px;
  background:#f2e8da;
  clip-path:polygon(0 0,100% 0,100% 97.5%,97% 100%,94% 97.5%,91% 100%,88% 97.5%,85% 100%,82% 97.5%,79% 100%,76% 97.5%,73% 100%,70% 97.5%,67% 100%,64% 97.5%,61% 100%,58% 97.5%,55% 100%,52% 97.5%,49% 100%,46% 97.5%,43% 100%,40% 97.5%,37% 100%,34% 97.5%,31% 100%,28% 97.5%,25% 100%,22% 97.5%,19% 100%,16% 97.5%,13% 100%,10% 97.5%,7% 100%,4% 97.5%,0 100%);
  box-shadow:0 24px 60px rgba(0,0,0,.5);
}
.receipt-sheet-back{position:absolute;inset:22px 0 0;pointer-events:none;opacity:.72}
.receipt-sheet-back-left{transform:rotate(-4deg) translateX(-20px)}
.receipt-sheet-back-right{transform:rotate(3.2deg) translateX(22px);opacity:.86}
.receipt-main{
  position:relative;
  z-index:2;
  padding:38px 34px 52px;
  font-family:"Special Elite",monospace;
  overflow:hidden;
}
.receipt-kicker{text-align:center;letter-spacing:.2em;font-size:11px;margin:0 0 5px}
.receipt-main h2{text-align:center;font-size:clamp(25px,4vw,32px);margin:0}
.receipt-items{display:grid}
.receipt-items button{
  width:100%;
  min-height:48px;
  display:grid;
  grid-template-columns:34px 1fr auto;
  align-items:center;
  gap:10px;
  border:0;
  border-bottom:1px dashed rgba(74,58,45,.28);
  background:transparent;
  color:#211711;
  text-align:left;
  padding:8px 4px;
  cursor:pointer;
  font-family:"Special Elite",monospace;
}
.receipt-items button:hover,.receipt-items button:focus-visible{background:rgba(111,29,42,.08);color:var(--burgundy);outline:none}
.receipt-items button span{font-size:12px;opacity:.65}
.receipt-items button b{font-weight:400}
.receipt-items button em{font-style:normal;text-transform:uppercase;font-size:10px;letter-spacing:.1em}
.receipt-total{display:grid;grid-template-columns:1fr auto auto;align-items:baseline;gap:12px;font-size:17px}
.receipt-total em{font-family:"Playfair Display",serif;color:var(--burgundy);font-size:30px}
.receipt-thanks{text-align:center;font-size:11px;letter-spacing:.06em}
.proof-pop{
  position:absolute;
  z-index:10;
  left:50%;top:50%;
  transform:translate(-50%,-45%) scale(.96);
  width:min(460px,88vw);
  background:#f7eee1;
  border:1px solid #9b7c63;
  border-radius:20px;
  padding:30px;
  box-shadow:0 30px 80px rgba(0,0,0,.68);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:.2s ease;
}
.proof-pop.open{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.proof-pop #closeProof{position:absolute;right:12px;top:10px;border:0;background:transparent;font-size:28px;cursor:pointer}
.proof-pop h3{font-family:"Playfair Display",serif;font-size:clamp(30px,6vw,42px);margin:8px 0}

@media(max-width:900px){
  .tape-btn{height:5.6%;font-size:clamp(8px,2.3vw,12px);gap:.2rem;padding:2px}
  .camera-tab{left:1.2%;top:1.2%;width:15.4%}
  .laptop-tab{left:17.5%;top:1.2%;width:15.4%}
  .home-tab{left:34%;top:1%;width:14%;height:6.2%;font-size:clamp(18px,5vw,28px)}
  .phone-tab{left:49%;top:1.2%;width:15.4%}
  .journal-tab{left:65.3%;top:1.2%;width:16.2%}
  .receipts-tab{left:82%;top:1.2%;width:16.6%}
  .tape-btn span:not(.nav-icon){display:none}
  .nav-icon{font-size:1.35em}
  .receipt-stack{min-height:650px}
  .receipt-sheet{min-height:620px}
  .receipt-main{padding:32px 22px 46px}
}

/* v1.2 — remove the baked-in tape artwork and use only real HTML tape buttons. */
.nav-art-cleanup{position:absolute;inset:0;z-index:10;pointer-events:none}
.nav-art-cleanup .erase{
  position:absolute;
  height:8.9%;
  border-radius:8px;
  /* Layered CSS-only wood texture; this is not another tape image. */
  background:
    linear-gradient(90deg,rgba(255,214,158,.16),transparent 18% 72%,rgba(30,14,6,.18)),
    repeating-linear-gradient(2deg,rgba(60,29,12,.08) 0 1px,transparent 1px 7px),
    repeating-linear-gradient(91deg,#8f603d 0 16px,#956641 16px 34px,#845638 34px 52px,#9b6943 52px 76px);
  box-shadow:inset 0 1px rgba(255,231,196,.18),inset 0 -1px rgba(43,21,10,.18);
  filter:saturate(.82) brightness(.92);
  opacity:.98;
}
.camera-erase{left:15.9%;top:1.4%;width:13.7%;transform:rotate(-.2deg)}
.laptop-erase{left:28.2%;top:1.4%;width:13.5%;transform:rotate(.1deg)}
.home-erase{left:41.5%;top:.9%;width:12.5%;height:10%!important;transform:rotate(-.15deg)}
.phone-erase{left:54.1%;top:1.35%;width:13%;transform:rotate(.1deg)}
.journal-erase{left:65.2%;top:1.25%;width:13.5%;transform:rotate(-.1deg)}
.receipts-erase{left:76.5%;top:1.35%;width:13.2%;transform:rotate(.1deg)}

.tape-nav{z-index:14}
.tape-btn{
  /* Genuine HTML buttons styled as textured, torn washi tape. */
  background:
    linear-gradient(93deg,rgba(255,255,255,.28),transparent 20% 78%,rgba(91,55,31,.09)),
    repeating-linear-gradient(0deg,rgba(91,55,31,.035) 0 1px,transparent 1px 3px),
    #f1e1c6;
  border:1px solid rgba(87,54,35,.24);
  box-shadow:0 7px 13px rgba(30,17,9,.34),inset 0 1px rgba(255,255,255,.35);
}
.tape-btn:hover,.tape-btn:focus-visible{background:#f8ead4;box-shadow:0 11px 18px rgba(30,17,9,.42);}

@media(max-width:900px){
  .nav-art-cleanup .erase{height:7.4%}
  .camera-erase{left:.3%;top:.3%;width:17.3%}
  .laptop-erase{left:16.7%;top:.3%;width:17.2%}
  .home-erase{left:33.1%;top:.1%;width:15.8%;height:8.2%!important}
  .phone-erase{left:48.2%;top:.3%;width:17.2%}
  .journal-erase{left:64.4%;top:.3%;width:18%}
  .receipts-erase{left:81.2%;top:.3%;width:18.8%}
}


/* v1.3 — content-first navigation labels */
.tape-btn{
  font-size:clamp(10px,1.08vw,18px);
  letter-spacing:.015em;
  text-transform:none;
  line-height:1.05;
  text-align:center;
}
.camera-tab{left:15.9%;width:13.2%}
.laptop-tab{left:29.4%;width:12.5%}
.home-tab{left:42.7%;width:10.2%}
.phone-tab{left:54.3%;width:12.4%}
.journal-tab{left:66.8%;width:11.9%}
.receipts-tab{left:78.5%;width:12.5%;font-size:clamp(9px,.95vw,16px)}
.object-hit span{font-weight:700;white-space:nowrap}

@media(max-width:900px){
  .tape-btn{font-size:clamp(8px,2.15vw,11px);text-transform:none}
  .camera-tab{left:.8%;width:17%}
  .laptop-tab{left:17.7%;width:16.2%}
  .home-tab{left:34.3%;width:13.5%}
  .phone-tab{left:48.3%;width:15.2%}
  .journal-tab{left:63.9%;width:16.4%}
  .receipts-tab{left:80.3%;width:19%;font-size:clamp(7px,1.95vw,10px)}
  .tape-btn span{display:inline!important}
}

/* v1.4 — refined editorial navigation: quieter, slimmer, and integrated with the desk */
.tape-nav{
  position:absolute;
  left:50%;
  right:auto;
  top:1.45%;
  width:min(68%,1080px);
  height:6.4%;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.45%;
  padding:.38% .55%;
  border:1px solid rgba(246,235,218,.15);
  border-radius:999px;
  background:rgba(35,23,16,.58);
  box-shadow:0 8px 24px rgba(20,11,7,.24),inset 0 1px rgba(255,255,255,.08);
  backdrop-filter:blur(8px) saturate(.85);
  -webkit-backdrop-filter:blur(8px) saturate(.85);
  z-index:14;
  pointer-events:auto;
}
.tape-btn,
.camera-tab,.laptop-tab,.home-tab,.phone-tab,.journal-tab,.receipts-tab{
  position:relative;
  left:auto;
  top:auto;
  width:auto;
  height:74%;
  min-height:0;
  flex:1 1 0;
  transform:none;
  padding:0 clamp(8px,1vw,17px);
  clip-path:none;
  border:1px solid rgba(238,223,202,.18);
  border-radius:999px;
  background:transparent;
  color:#f3e8d8;
  box-shadow:none;
  font-family:"DM Sans",sans-serif;
  font-size:clamp(9px,.83vw,14px);
  font-weight:600;
  letter-spacing:.02em;
  text-transform:none;
  white-space:nowrap;
  opacity:.83;
}
.tape-btn::before{display:none}
.tape-btn:hover,.tape-btn:focus-visible{
  transform:none;
  color:#fff8ed;
  background:rgba(111,29,42,.78);
  border-color:rgba(255,244,229,.32);
  box-shadow:0 5px 13px rgba(31,13,10,.28);
  outline:none;
  opacity:1;
}
.tape-btn:active{transform:scale(.98)}
.home-tab{
  flex:0 0 clamp(42px,3.5vw,58px);
  height:clamp(42px,3.4vw,57px);
  padding:0;
  margin:0 .2%;
  color:#f8eee1;
  background:linear-gradient(145deg,#4c111b,#7a2431);
  border-color:rgba(250,233,211,.5);
  box-shadow:0 5px 15px rgba(21,8,6,.4),inset 0 1px rgba(255,255,255,.18);
  font-family:"Playfair Display",serif;
  font-size:clamp(18px,1.55vw,27px);
  font-style:italic;
  opacity:1;
}
.home-tab:hover,.home-tab:focus-visible{
  background:linear-gradient(145deg,#6b1725,#8d3140);
  box-shadow:0 7px 18px rgba(21,8,6,.48),inset 0 1px rgba(255,255,255,.2);
}
.receipts-tab{font-size:clamp(8px,.75vw,13px)}

/* The cleanup layer remains behind the nav, but blends into the desk more softly. */
.nav-art-cleanup .erase{
  opacity:.91;
  filter:saturate(.72) brightness(.84) contrast(.9);
  box-shadow:none;
}

@media(max-width:900px){
  .tape-nav{
    left:50%;
    top:.7%;
    width:97%;
    height:6.5%;
    gap:2px;
    padding:3px;
    border-radius:18px;
    overflow-x:auto;
    justify-content:flex-start;
    scrollbar-width:none;
  }
  .tape-nav::-webkit-scrollbar{display:none}
  .tape-btn,
  .camera-tab,.laptop-tab,.phone-tab,.journal-tab,.receipts-tab{
    position:relative;
    left:auto;
    top:auto;
    width:auto;
    height:38px;
    flex:0 0 auto;
    padding:0 11px;
    font-size:10px;
  }
  .home-tab{
    position:relative;
    left:auto;
    top:auto;
    width:42px;
    height:42px;
    flex:0 0 42px;
    font-size:19px;
  }
  .tape-btn span{display:inline!important}
}

/* v1.5 — approved floating navigation: no outer rectangles or frosted panel. */
.tape-nav{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding:0 !important;
  height:5.9% !important;
  gap:.5% !important;
}

/* Remove the broad cleanup blocks so there is no rectangular strip behind the nav. */
.nav-art-cleanup{display:none !important;}

.tape-btn,
.camera-tab,.laptop-tab,.phone-tab,.journal-tab,.receipts-tab{
  height:100% !important;
  background:linear-gradient(180deg,#2b1b14,#1d120e) !important;
  color:#f4e9dc !important;
  border:1px solid rgba(244,233,220,.16) !important;
  box-shadow:0 7px 16px rgba(16,8,5,.34),inset 0 1px rgba(255,255,255,.06) !important;
  opacity:.96 !important;
}
.tape-btn:hover,.tape-btn:focus-visible{
  transform:translateY(-2px) rotate(-.2deg) !important;
  background:linear-gradient(180deg,#3a241a,#251610) !important;
  color:#fff8ef !important;
  border-color:rgba(244,233,220,.28) !important;
  box-shadow:0 10px 20px rgba(16,8,5,.42),inset 0 1px rgba(255,255,255,.08) !important;
}
.home-tab{
  height:clamp(44px,3.6vw,60px) !important;
  background:linear-gradient(145deg,#4d0f1a,#7b2131) !important;
  border-color:rgba(248,233,213,.48) !important;
  box-shadow:0 7px 17px rgba(21,7,7,.42),inset 0 1px rgba(255,255,255,.15) !important;
}
.home-tab:hover,.home-tab:focus-visible{
  background:linear-gradient(145deg,#641522,#8b2b3d) !important;
}

@media(max-width:900px){
  .tape-nav{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    padding:0 4px !important;
  }
}

/* v1.6 — realistic editorial journal interior. Homepage and all other views remain unchanged. */
.journal-view{
  width:min(1120px,96vw);
  perspective:1800px;
}
.journal-book{
  position:relative;
  display:grid;
  grid-template-columns:1fr 44px 1fr;
  min-height:650px;
  padding:18px 20px 20px;
  border-radius:30px 26px 28px 32px;
  background:
    linear-gradient(115deg,rgba(255,255,255,.08),transparent 18% 82%,rgba(0,0,0,.18)),
    repeating-linear-gradient(5deg,rgba(255,255,255,.018) 0 1px,transparent 1px 5px),
    #171310;
  border:1px solid #3a2a20;
  box-shadow:0 38px 85px rgba(15,8,5,.62),inset 0 0 0 2px rgba(255,255,255,.025);
  filter:none;
  transform:rotateX(1.2deg);
}
.journal-book::before{
  content:"";
  position:absolute;
  inset:8px 10px 9px;
  border-radius:24px;
  border:1px solid rgba(203,166,126,.18);
  pointer-events:none;
}
.journal-book::after{
  content:"";
  position:absolute;
  left:50%;
  top:24px;
  bottom:24px;
  width:58px;
  transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(20,12,8,.48),transparent 68%);
  pointer-events:none;
  z-index:2;
}
.journal-page{
  position:relative;
  overflow:hidden;
  padding:58px 54px 48px;
  color:#2a211b;
  border:0;
  background-color:#f1e7d7;
  background-image:
    linear-gradient(90deg,rgba(116,81,62,.065) 1px,transparent 1px),
    repeating-linear-gradient(0deg,transparent 0 31px,rgba(111,83,61,.105) 31px 32px),
    radial-gradient(circle at 24% 10%,rgba(255,255,255,.55),transparent 34%),
    linear-gradient(145deg,#f8efe2,#e6d7c5);
  box-shadow:inset 0 0 38px rgba(105,74,50,.12);
  z-index:1;
}
.journal-page.left{
  border-radius:18px 4px 4px 18px;
  box-shadow:inset -18px 0 26px rgba(69,43,28,.13),inset 0 0 38px rgba(105,74,50,.1);
  transform:rotateY(.7deg);
  transform-origin:right center;
}
.journal-page.right{
  border-radius:4px 18px 18px 4px;
  box-shadow:inset 18px 0 26px rgba(69,43,28,.14),inset 0 0 38px rgba(105,74,50,.1);
  transform:rotateY(-.7deg);
  transform-origin:left center;
}
.journal-page::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.32;
  background:
    repeating-linear-gradient(12deg,rgba(77,51,35,.018) 0 1px,transparent 1px 4px),
    radial-gradient(circle at 12% 88%,rgba(122,78,44,.08),transparent 22%);
}
.journal-page::after{
  position:absolute;
  bottom:18px;
  color:rgba(74,50,35,.52);
  font-family:"Special Elite",monospace;
  font-size:12px;
}
.journal-page.left::after{content:"DEJA MARIE";left:44px;letter-spacing:.12em}
.journal-page.right::after{content:"ABOUT ME";right:44px;letter-spacing:.12em}
.journal-rings{
  position:relative;
  z-index:4;
  margin:-4px 0;
  background:transparent;
}
.journal-rings::before{
  content:"";
  position:absolute;
  inset:12px 4px;
  background:
    repeating-linear-gradient(
      to bottom,
      transparent 0 19px,
      #161311 19px 24px,
      #b78a55 24px 29px,
      #2c211b 29px 34px,
      transparent 34px 54px
    );
  border-radius:999px;
  filter:drop-shadow(2px 2px 2px rgba(0,0,0,.45));
}
.journal-page h2{
  position:relative;
  z-index:1;
  margin:6px 0 24px;
  color:#4b111b;
  font-family:"Playfair Display",serif;
  font-size:clamp(42px,5vw,64px);
  font-style:italic;
  font-weight:600;
  letter-spacing:-.025em;
}
.journal-page p{
  position:relative;
  z-index:1;
  max-width:92%;
  margin:0;
  color:#3c3028;
  font-family:"Special Elite",monospace;
  font-size:clamp(15px,1.25vw,18px);
  line-height:1.9;
}
.journal-page .tape{
  position:relative;
  z-index:1;
  display:inline-block;
  padding:8px 16px 7px;
  color:#f8eee1;
  background:
    linear-gradient(90deg,rgba(255,255,255,.12),transparent 30% 75%,rgba(31,9,10,.11)),
    #5b121e;
  border:1px solid rgba(80,20,29,.28);
  box-shadow:0 5px 10px rgba(52,24,18,.15);
  clip-path:polygon(2% 8%,98% 2%,100% 90%,95% 96%,4% 92%,0 13%);
  transform:rotate(-1.2deg);
  font-family:"Special Elite",monospace;
  font-size:13px;
  letter-spacing:.03em;
}
.journal-page .polaroid{
  position:relative;
  z-index:1;
  width:min(62%,250px);
  margin:30px auto 0;
  padding:10px 10px 40px;
  background:#fffaf2;
  border:1px solid #d5c2aa;
  box-shadow:0 13px 24px rgba(65,42,28,.2);
  transform:rotate(2.4deg);
}
.journal-page .polaroid::before{
  content:"";
  position:absolute;
  top:-13px;
  left:50%;
  width:92px;
  height:24px;
  transform:translateX(-50%) rotate(-2deg);
  background:rgba(207,190,164,.72);
  border:1px solid rgba(111,83,61,.12);
}
.journal-page .polaroid div{
  aspect-ratio:4/3;
  background:
    linear-gradient(rgba(45,30,24,.22),rgba(45,30,24,.22)),
    linear-gradient(145deg,#71513d,#c7a27b);
  border:1px solid rgba(62,41,28,.2);
}
.page-controls{
  margin-top:24px;
}
.page-controls button{
  border:1px solid #6a4a37;
  background:linear-gradient(#f1e7d8,#e2d2bf);
  color:#2c211a;
  box-shadow:3px 4px 0 #4b111b;
  transition:.18s ease;
}
.page-controls button:hover,.page-controls button:focus-visible{
  transform:translate(-1px,-1px);
  box-shadow:5px 6px 0 #4b111b;
}
.page-controls span{
  color:#f2e8da;
  font-family:"Special Elite",monospace;
}

@media(max-width:900px){
  .journal-view{width:min(690px,95vw)}
  .journal-book{grid-template-columns:1fr;min-height:70vh;padding:12px;border-radius:24px;transform:none}
  .journal-book::after,.journal-rings,.journal-page.left{display:none}
  .journal-page.right{display:block;border-radius:16px;transform:none;padding:48px 30px 42px}
  .journal-page p{max-width:100%}
  .journal-page.right::after{right:28px}
}

/* v1.7 — locked homepage polish: espresso DM button + alternating cutout title. */
.home-tab{
  color:#f7ede0 !important;
  background:linear-gradient(145deg,#2f1d15,#160d09) !important;
  border-color:rgba(247,237,224,.34) !important;
  box-shadow:0 7px 17px rgba(12,6,4,.46),inset 0 1px rgba(255,255,255,.09) !important;
}
.home-tab:hover,.home-tab:focus-visible{
  background:linear-gradient(145deg,#40271c,#21130d) !important;
}

.desk-cutout-title{
  position:absolute;
  left:48.2%;
  top:39.7%;
  z-index:7;
  width:34%;
  transform:translate(-50%,-50%) rotate(-.5deg);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.55vw;
  pointer-events:none;
  filter:drop-shadow(0 7px 6px rgba(35,18,9,.22));
}
.cutout-word{
  width:100%;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:.25%;
}
.cutout{
  display:grid;
  place-items:center;
  min-width:11.8%;
  height:clamp(48px,7.15vw,116px);
  padding:0 .15em;
  color:#17100c;
  font-family:"Playfair Display",serif;
  font-size:clamp(38px,5.2vw,84px);
  font-weight:600;
  line-height:1;
  border:1px solid rgba(42,27,18,.16);
  clip-path:polygon(2% 7%,12% 3%,22% 6%,35% 2%,48% 6%,61% 3%,75% 7%,88% 2%,98% 7%,100% 92%,89% 96%,77% 93%,63% 98%,49% 94%,35% 97%,21% 93%,8% 97%,0 91%);
}
.cutout:nth-child(2n){transform:rotate(1.3deg) translateY(2%)}
.cutout:nth-child(3n){transform:rotate(-1deg) translateY(-1%)}
.cutout:nth-child(4n){transform:rotate(.6deg) translateY(1%)}
.light-white{background:#fffdfa;color:#17100c}
.light-cream{background:#eadfce;color:#17100c}
.dark-black{background:#14100d;color:#fffaf2;border-color:rgba(255,255,255,.12)}
.dark-brown{background:#3a2419;color:#fff8ee;border-color:rgba(255,255,255,.1)}
.cutout-subtitle{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.55vw;
}
.cutout-strip{
  display:inline-block;
  padding:.18em .62em .24em;
  font-family:"Playfair Display",serif;
  font-size:clamp(24px,3.1vw,52px);
  font-style:italic;
  line-height:1;
  box-shadow:0 4px 9px rgba(34,17,8,.18);
  clip-path:polygon(1% 7%,7% 2%,14% 6%,24% 3%,34% 7%,45% 2%,56% 6%,67% 3%,78% 7%,89% 2%,99% 6%,100% 91%,91% 96%,81% 92%,70% 97%,59% 93%,48% 98%,37% 93%,26% 97%,15% 92%,4% 96%,0 90%);
}
.cutout-subtitle .cutout-strip:first-child{transform:rotate(-1deg)}
.cutout-subtitle .cutout-strip:last-child{transform:rotate(.8deg)}

@media(max-width:900px){
  .desk-cutout-title{left:50%;top:40%;width:48%;gap:4px}
  .cutout{height:clamp(34px,8vw,68px);font-size:clamp(25px,6vw,54px)}
  .cutout-strip{font-size:clamp(18px,4.4vw,36px)}
}

/* v1.8 — raster-rebuilt realistic cutout title + cream DM circle. */
.desk-cutout-title{display:none!important}
.home-tab{
  color:#2a1a13 !important;
  background:linear-gradient(145deg,#f4ead8,#dfcfb5) !important;
  border-color:rgba(55,34,24,.30) !important;
  box-shadow:0 7px 17px rgba(12,6,4,.38),inset 0 1px rgba(255,255,255,.62) !important;
}
.home-tab:hover,.home-tab:focus-visible{
  color:#1c110d !important;
  background:linear-gradient(145deg,#fff8ea,#e9d8bd) !important;
}


/* v1.9 — seamless cleanup: crisp navigation and a rebuilt title, with no blur panels. */
.desk-scene{background:#5b3c29}
.desk-image{
  position:absolute;
  left:0;
  top:-9%;
  width:100%;
  height:109%;
  object-fit:fill;
  filter:none!important;
  transform:none!important;
}
.tape-nav{
  top:1.4%!important;
  width:min(68%,1080px)!important;
  height:5.9%!important;
  filter:none!important;
  opacity:1!important;
}
.tape-btn,
.camera-tab,.laptop-tab,.phone-tab,.journal-tab,.receipts-tab{
  opacity:1!important;
  filter:none!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
  background:linear-gradient(180deg,#2d1c15 0%,#1a100c 100%)!important;
  border:1px solid rgba(255,247,235,.22)!important;
  box-shadow:0 7px 16px rgba(13,7,4,.42),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.tape-btn::before{display:none!important}
.tape-btn span{filter:none!important;opacity:1!important}
.home-tab{
  color:#281810!important;
  background:linear-gradient(145deg,#fff7e8 0%,#e8d8bd 100%)!important;
  border-color:rgba(61,38,25,.38)!important;
  box-shadow:0 7px 17px rgba(12,6,4,.42),inset 0 1px 0 rgba(255,255,255,.78)!important;
}
.home-tab:hover,.home-tab:focus-visible{
  color:#17100c!important;
  background:linear-gradient(145deg,#fffaf0 0%,#efdfc5 100%)!important;
}
.nav-art-cleanup{display:none!important}

.desk-cutout-title{
  display:flex!important;
  position:absolute;
  left:49.1%;
  top:37.6%;
  z-index:7;
  width:34.5%;
  transform:translate(-50%,-50%) rotate(-.35deg);
  flex-direction:column;
  align-items:center;
  gap:.52vw;
  pointer-events:none;
  filter:drop-shadow(0 8px 7px rgba(35,18,9,.30));
}
.cutout-word{width:100%;display:flex;align-items:flex-end;justify-content:center;gap:.2%}
.cutout{
  position:relative;
  display:grid;
  place-items:center;
  min-width:11.9%;
  height:clamp(50px,7.05vw,114px);
  padding:0 .14em;
  font-family:"Playfair Display",serif;
  font-size:clamp(38px,5.15vw,83px);
  font-weight:600;
  line-height:1;
  border:1px solid rgba(55,35,23,.18);
  box-shadow:0 4px 8px rgba(38,19,9,.22),inset 0 0 0 1px rgba(255,255,255,.08);
  clip-path:polygon(1% 8%,8% 3%,15% 7%,24% 2%,34% 6%,44% 3%,55% 7%,65% 2%,75% 6%,85% 3%,98% 8%,100% 90%,92% 96%,82% 92%,71% 98%,60% 93%,49% 97%,38% 92%,27% 97%,16% 93%,6% 97%,0 90%);
  background-image:repeating-linear-gradient(8deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px);
}
.cutout::after,.cutout-strip::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 28% 18%,rgba(255,255,255,.14),transparent 34%),repeating-linear-gradient(0deg,rgba(65,42,26,.025) 0 1px,transparent 1px 3px);
  pointer-events:none;
}
.cutout:nth-child(2n){transform:rotate(1.2deg) translateY(2%)}
.cutout:nth-child(3n){transform:rotate(-.9deg) translateY(-1%)}
.cutout:nth-child(4n){transform:rotate(.6deg) translateY(1%)}
.paper-white{background-color:#fffdfa;color:#18110d}
.paper-cream{background-color:#eadfce;color:#18110d}
.paper-black{background-color:#14100d;color:#fffaf2;border-color:rgba(255,255,255,.12)}
.paper-brown{background-color:#3b251a;color:#fff8ee;border-color:rgba(255,255,255,.11)}
.cutout-subtitle{display:flex;justify-content:center;align-items:center;gap:.5vw}
.cutout-strip{
  position:relative;
  display:inline-block;
  padding:.17em .62em .23em;
  font-family:"Playfair Display",serif;
  font-size:clamp(24px,3.05vw,51px);
  font-style:italic;
  line-height:1;
  border:1px solid rgba(53,34,22,.15);
  box-shadow:0 4px 9px rgba(34,17,8,.24);
  clip-path:polygon(1% 8%,8% 2%,16% 7%,26% 3%,37% 7%,48% 2%,59% 6%,70% 3%,81% 7%,91% 2%,99% 7%,100% 90%,91% 96%,80% 92%,69% 97%,58% 93%,47% 98%,36% 93%,25% 97%,14% 92%,4% 96%,0 90%);
}
.cutout-subtitle .cutout-strip:first-child{transform:rotate(-1deg)}
.cutout-subtitle .cutout-strip:last-child{transform:rotate(.8deg)}

/* Re-align the invisible object hotspots to the vertically cropped artwork. */
.camera-hit{top:2.5%;height:27%}
.laptop-hit{top:0;width:32%;height:51%}
.phone-hit{bottom:17%;height:41%}
.journal-hit{bottom:0;height:43%}
.receipts-hit{bottom:0;height:46%}

@media(max-width:900px){
  .desk-image{top:-7%;height:107%}
  .tape-nav{top:.8%!important;width:97%!important}
  .desk-cutout-title{left:50%;top:37%;width:49%;gap:4px}
  .cutout{height:clamp(34px,8vw,68px);font-size:clamp(25px,6vw,54px)}
  .cutout-strip{font-size:clamp(18px,4.4vw,36px)}
}

/* v2.0 — clean rebuilt title: realistic staggered clippings with a gentle arch. */
.desk-cutout-title{
  left:49.05%!important;
  top:37.25%!important;
  width:35.5%!important;
  gap:.32vw!important;
  transform:translate(-50%,-50%) rotate(-.2deg)!important;
  filter:none!important;
}
.cutout-word{
  align-items:flex-start!important;
  gap:0!important;
  isolation:isolate;
  padding:0 1.4%;
}
.cutout{
  min-width:12.6%!important;
  height:clamp(52px,7.15vw,116px)!important;
  margin-left:-1.15%!important;
  padding:0 .13em!important;
  border:1px solid rgba(48,31,20,.21)!important;
  box-shadow:
    0 4px 0 rgba(39,22,12,.10),
    0 9px 13px rgba(34,18,10,.25),
    inset 0 1px 0 rgba(255,255,255,.22)!important;
  background-image:
    radial-gradient(circle at 22% 19%,rgba(255,255,255,.25),transparent 31%),
    repeating-linear-gradient(7deg,rgba(56,36,22,.045) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(96deg,rgba(255,255,255,.035) 0 1px,transparent 1px 5px)!important;
  text-shadow:0 .5px 0 rgba(255,255,255,.12);
  transform-origin:50% 76%;
}
.cutout:first-child{margin-left:0!important}
.cutout::before{
  content:"";
  position:absolute;
  inset:3px 4px;
  border:1px solid rgba(255,255,255,.08);
  clip-path:inherit;
  pointer-events:none;
}
.cutout:nth-child(1){transform:translateY(12%) rotate(-4.2deg)!important;z-index:1;font-family:Georgia,"Times New Roman",serif}
.cutout:nth-child(2){transform:translateY(5%) rotate(2.1deg)!important;z-index:2;font-family:"Playfair Display",serif}
.cutout:nth-child(3){transform:translateY(-2%) rotate(-1.8deg)!important;z-index:4;font-family:Georgia,"Times New Roman",serif}
.cutout:nth-child(4){transform:translateY(-7%) rotate(2.5deg)!important;z-index:5;font-family:"Playfair Display",serif}
.cutout:nth-child(5){transform:translateY(-4%) rotate(-2deg)!important;z-index:4;font-family:Georgia,"Times New Roman",serif}
.cutout:nth-child(6){transform:translateY(4%) rotate(2.7deg)!important;z-index:3;font-family:"Playfair Display",serif}
.cutout:nth-child(7){transform:translateY(11%) rotate(-2.8deg)!important;z-index:2;font-family:Georgia,"Times New Roman",serif}
.cutout:nth-child(1),.cutout:nth-child(3),.cutout:nth-child(5),.cutout:nth-child(7){
  clip-path:polygon(1% 9%,9% 3%,18% 7%,29% 2%,41% 6%,53% 3%,65% 8%,77% 2%,89% 6%,99% 3%,100% 91%,91% 97%,80% 92%,68% 98%,55% 93%,43% 97%,31% 92%,18% 98%,7% 94%,0 89%)!important;
}
.cutout:nth-child(2),.cutout:nth-child(4),.cutout:nth-child(6){
  clip-path:polygon(0 6%,11% 2%,23% 7%,35% 3%,47% 8%,59% 2%,71% 6%,84% 3%,99% 8%,100% 89%,90% 95%,78% 91%,66% 97%,54% 92%,42% 98%,29% 93%,17% 97%,6% 92%,0 96%)!important;
}
.cutout-subtitle{
  margin-top:-.3vw;
  gap:.35vw!important;
  transform:rotate(.2deg);
}
.cutout-strip{
  box-shadow:0 8px 13px rgba(34,18,10,.25),inset 0 1px 0 rgba(255,255,255,.12)!important;
  background-image:
    radial-gradient(circle at 22% 18%,rgba(255,255,255,.14),transparent 34%),
    repeating-linear-gradient(6deg,rgba(70,43,25,.04) 0 1px,transparent 1px 4px)!important;
}
.cutout-subtitle .cutout-strip:first-child{transform:translateY(2px) rotate(-1.8deg)!important}
.cutout-subtitle .cutout-strip:last-child{transform:translateY(-1px) rotate(1.25deg)!important}
@media(max-width:900px){
  .desk-cutout-title{top:36.5%!important;width:51%!important}
  .cutout{margin-left:-1.5%!important}
}

/* v10 — exact image-led homepage. The supplied artwork is the visual source of truth. */
html,body{width:100%;min-height:100%;overflow-x:hidden}
.desk-page{width:100%;min-height:100svh;background:#2a1b12;display:grid;place-items:center;overflow:hidden}
.desk-scene{position:relative;width:100vw;height:100svh;min-height:560px;overflow:hidden;background:#2a1b12}
.desk-image{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center center;user-select:none;-webkit-user-drag:none}

/* The visual buttons are part of the artwork. These are crisp, invisible hit areas only. */
.image-nav-hotspots{position:absolute;inset:0;z-index:24;pointer-events:none}
.image-nav-hit{position:absolute;top:2.7%;height:5.8%;border:0;background:transparent;border-radius:999px;cursor:pointer;pointer-events:auto;color:transparent;outline:none}
.image-nav-hit:focus-visible{box-shadow:0 0 0 3px rgba(246,239,228,.95),0 0 0 6px rgba(74,43,30,.82)}
.nav-content{left:5.6%;width:10.9%}
.nav-analytics{left:18.1%;width:10.5%}
.nav-connect{left:30.3%;width:10.5%}
.nav-home{left:45.4%;width:7.9%;height:7.1%;top:1.1%}
.nav-about{left:56.7%;width:9.9%}
.nav-proof{left:67.6%;width:11.4%}
.nav-resume{left:80.1%;width:11.4%}

/* Keep all object interactions, but make their labels appear only on hover/focus. */
.object-hit{z-index:20}

/* Remove every legacy visual layer so nothing is blurred, covered, or stacked. */
.nav-art-cleanup,.tape-nav,.desk-cutout-title{display:none!important}

.resume-view{display:grid;place-items:center;min-height:100%;padding:clamp(18px,4vw,48px)}
.resume-paper{width:min(720px,92vw);max-height:86svh;overflow:auto;background:#f3eadc;color:#21160f;padding:clamp(28px,5vw,64px);box-shadow:0 26px 70px rgba(0,0,0,.45);border:1px solid rgba(82,52,33,.26)}
.resume-paper small{letter-spacing:.22em}.resume-paper h1{font-family:"Playfair Display",serif;font-size:clamp(44px,7vw,82px);margin:.2em 0}.resume-paper h2{font-family:"Playfair Display",serif}.resume-rule{height:1px;background:#5a3928;margin:24px 0}.resume-download{margin-top:24px;border:1px solid #4d2f20;background:#2b1b13;color:#f5eadc;padding:13px 18px;border-radius:999px}

/* Laptop / Full HD */
@media (min-width:1024px) and (max-aspect-ratio:16/10){
  .desk-image{object-position:center top}
}

/* Tablets: preserve the composition while keeping every nav target usable. */
@media (max-width:1023px){
  .desk-scene{min-height:100svh}
  .desk-image{object-fit:cover;object-position:center center}
  .image-nav-hit{top:2.3%;height:6.4%}
}

/* Mobile: the square artwork becomes a tall, scroll-safe hero without adding new visuals. */
@media (max-width:600px){
  .desk-page{display:block;overflow:auto}
  .desk-scene{width:100vw;height:100svh;min-height:700px}
  .desk-image{object-fit:cover;object-position:center center}
  .image-nav-hit{top:2.1%;height:6.2%}
  .nav-content{left:4.7%;width:12.3%}
  .nav-analytics{left:17.4%;width:11.7%}
  .nav-connect{left:29.7%;width:11.8%}
  .nav-home{left:45.2%;width:9.4%;height:7.3%;top:1.1%}
  .nav-about{left:56.0%;width:10.8%}
  .nav-proof{left:67.0%;width:12.5%}
  .nav-resume{left:80.0%;width:12.4%}
}

/* Exact-composition responsive artboard: never crop, stretch, blur, or re-layer the approved visual. */
.desk-page{min-height:100svh;display:grid;place-items:center;background:#24160f;padding:0}
.desk-scene{width:min(100vw,100svh);height:auto;min-height:0;aspect-ratio:1333/1180;overflow:hidden;flex:none;box-shadow:0 0 90px rgba(0,0,0,.28)}
.desk-image{object-fit:fill;object-position:center;width:100%;height:100%}

/* Object hit areas recalibrated to the approved artboard. */
.camera-hit{left:0;top:0;width:18.5%;height:25%}
.laptop-hit{left:70%;right:auto;top:0;width:30%;height:43%}
.phone-hit{left:0;bottom:0;width:23%;height:56%}
.journal-hit{left:26%;bottom:0;width:39%;height:37%}
.receipts-hit{left:69%;right:auto;bottom:0;width:31%;height:49%}

@media (max-width:600px){
  .desk-page{min-height:100svh;display:grid;place-items:start center;padding-top:0}
  .desk-scene{width:100vw;height:auto;min-height:0;aspect-ratio:1333/1180}
  .desk-image{object-fit:fill}
}

/* v11 — true edge-to-edge homepage + clean invisible navigation hit targets. */
html,body{
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  background:#2a1b12;
  overflow:hidden;
}
.desk-page{
  width:100vw!important;
  height:100svh!important;
  min-height:100svh!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  overflow:hidden!important;
  background:transparent!important;
}
.desk-scene{
  position:relative!important;
  width:100vw!important;
  height:100svh!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  box-shadow:none!important;
  background:transparent!important;
}
.desk-image{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:fill!important;
  object-position:center center!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
}

/* Hotspots must never render their own circles, fills, labels, shadows, or borders. */
.image-nav-hotspots,
.image-nav-hit,
.image-nav-hit:hover,
.image-nav-hit:active,
.image-nav-hit:focus,
.image-nav-hit:focus-visible,
.nav-home,
.nav-home:hover,
.nav-home:active,
.nav-home:focus,
.nav-home:focus-visible,
.home-tab,
.home-tab:hover,
.home-tab:active,
.home-tab:focus,
.home-tab:focus-visible{
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  filter:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  color:transparent!important;
  text-shadow:none!important;
  opacity:1!important;
  transform:none!important;
  clip-path:none!important;
}
.image-nav-hit::before,
.image-nav-hit::after,
.nav-home::before,
.nav-home::after,
.home-tab::before,
.home-tab::after{
  content:none!important;
  display:none!important;
}

/* Keep keyboard accessibility without drawing a duplicate circle over the artwork. */
.image-nav-hit:focus-visible{
  outline:2px dashed rgba(255,255,255,.01)!important;
  outline-offset:2px!important;
}

@media (max-width:600px){
  html,body{overflow:hidden!important}
  .desk-page,.desk-scene{width:100vw!important;height:100svh!important;min-height:0!important}
  .desk-image{width:100%!important;height:100%!important;object-fit:fill!important}
}

/* v15 — proportionate full-screen composition.
   The entire approved desk scene is scaled down as one unit, blended into a matching
   wood background, and kept fully inside the viewport without stretching. */
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#4b2d1b}
.desk-page,.desk-scene{width:100vw!important;height:100svh!important;margin:0!important;padding:0!important;overflow:hidden!important;background:#4b2d1b url("assets/wood-fill.jpg") center/cover no-repeat!important}
.desk-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;transform:none!important;filter:none!important}

/* Resume was intentionally removed. */
.nav-resume{display:none!important}

/* Hotspots recalibrated to the new 1920×1080 composite.
   Art occupies x=386..1533 and y=35..1045. */
.image-nav-hit{top:5.5%!important;height:5.4%!important}
.nav-content{left:23.3%!important;width:6.6%!important}
.nav-analytics{left:30.8%!important;width:6.3%!important}
.nav-connect{left:38.1%!important;width:6.3%!important}
.nav-home{left:47.2%!important;width:4.8%!important;height:6.7%!important;top:4.2%!important}
.nav-about{left:54.0%!important;width:6.0%!important}
.nav-proof{left:60.6%!important;width:6.9%!important}
.camera-hit{left:20.1%!important;top:3.2%!important;width:11.1%!important;height:23.4%!important}
.laptop-hit{left:62.0%!important;top:3.2%!important;width:18.2%!important;height:40.3%!important}
.phone-hit{left:20.1%!important;bottom:3.2%!important;width:13.9%!important;height:52.4%!important}
.journal-hit{left:35.8%!important;bottom:3.2%!important;width:23.7%!important;height:34.6%!important}
.receipts-hit{left:61.9%!important;right:auto!important;bottom:3.2%!important;width:18.8%!important;height:45.9%!important}

/* Preserve proportions on narrower screens without stretching the artwork. */
@media(max-aspect-ratio:16/10){
  .desk-image{object-fit:cover!important}
}
@media(max-width:700px){
  .desk-scene{min-height:100svh!important}
  .desk-image{object-fit:cover!important;object-position:center!important}
}

/* v16 — final 16:9 expanded desk homepage. Preserve all interior experiences. */
html,body{
  width:100%;
  height:100%;
  margin:0;
  overflow:hidden;
  background:#4b2f1d;
}
.desk-page,
.desk-scene{
  width:100vw!important;
  height:100svh!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:#4b2f1d!important;
  box-shadow:none!important;
  aspect-ratio:auto!important;
}
.desk-image{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  display:block!important;
  filter:none!important;
  transform:none!important;
}

/* Invisible navigation hit areas aligned to the visible artwork. */
.image-nav-hotspots{position:absolute!important;inset:0!important;z-index:24!important;pointer-events:none!important}
.image-nav-hit{
  position:absolute!important;
  top:3.0%!important;
  height:5.4%!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:none!important;
  border-radius:999px!important;
  cursor:pointer!important;
  pointer-events:auto!important;
}
.nav-content{left:18.2%!important;width:9.2%!important}
.nav-analytics{left:28.2%!important;width:8.8%!important}
.nav-connect{left:37.7%!important;width:8.6%!important}
.nav-home{left:47.4%!important;top:2.2%!important;width:7.0%!important;height:7.2%!important}
.nav-home-label{left:55.9%!important;top:3.0%!important;width:8.0%!important;height:5.4%!important}
.nav-about{left:64.6%!important;width:9.3%!important}
.nav-proof{left:74.0%!important;width:10.6%!important}
.nav-resume{display:none!important}

/* Object hotspots aligned to the expanded 16:9 scene. */
.camera-hit{left:0!important;top:2%!important;width:18.6%!important;height:30%!important}
.laptop-hit{left:67%!important;right:auto!important;top:0!important;width:33%!important;height:64%!important}
.phone-hit{left:4%!important;bottom:7%!important;width:20%!important;height:49%!important}
.journal-hit{left:32%!important;bottom:0!important;width:30%!important;height:33%!important}
.receipts-hit{left:66%!important;right:auto!important;bottom:0!important;width:23%!important;height:42%!important}

/* Keep hotspots visually invisible unless an object itself is hovered. */
.image-nav-hit::before,.image-nav-hit::after{content:none!important;display:none!important}
.image-nav-hit:focus-visible{outline:2px dashed rgba(255,255,255,.01)!important;outline-offset:2px!important}

/* Maintain the 16:9 composition on common laptop and desktop screens. */
@media (min-aspect-ratio:16/9){
  .desk-image{object-fit:cover!important;object-position:center center!important}
}
@media (max-aspect-ratio:16/9){
  .desk-image{object-fit:cover!important;object-position:center center!important}
}

/* v17 — approved final homepage artwork: HOME label removed; DM remains the home control. */
.nav-content{left:21.6%!important;width:8.0%!important}
.nav-analytics{left:30.9%!important;width:8.0%!important}
.nav-connect{left:40.5%!important;width:6.8%!important}
.nav-home{left:49.3%!important;top:2.2%!important;width:5.6%!important;height:8.0%!important}
.nav-home-label{display:none!important}
.nav-about{left:57.3%!important;width:7.5%!important}
.nav-proof{left:66.1%!important;width:10.3%!important}

.camera-hit{left:0!important;top:1.5%!important;width:18.7%!important;height:32%!important}
.laptop-hit{left:69.2%!important;right:auto!important;top:0!important;width:30.8%!important;height:67%!important}
.phone-hit{left:8.8%!important;bottom:8.5%!important;width:16.5%!important;height:44%!important}
.journal-hit{left:35.3%!important;bottom:0!important;width:24.8%!important;height:32.5%!important}
.receipts-hit{left:65.5%!important;right:auto!important;bottom:1.8%!important;width:20.5%!important;height:39.5%!important}


/* v18 — camera content update only. Homepage and all other experiences remain visually unchanged. */
.camera-view{position:relative}
.camera-gallery-wrap{min-width:0}
.gallery-grid{align-content:start}
.gallery-card.video-card{
  display:block;width:100%;padding:0;border:0;cursor:pointer;text-align:left;color:inherit;background:#1b120e;
}
.gallery-card.video-card img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .22s ease,opacity .22s ease}
.gallery-card.video-card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 48%,rgba(19,11,8,.72));pointer-events:none}
.gallery-card.video-card span{z-index:2;max-width:calc(100% - 24px)}
.gallery-card.video-card i{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:rgba(246,238,226,.9);color:#351f16;font-style:normal;font-size:18px;box-shadow:0 8px 20px rgba(0,0,0,.3);opacity:0;transition:opacity .2s ease,transform .2s ease}
.gallery-card.video-card:hover img,.gallery-card.video-card:focus-visible img{transform:scale(1.035);opacity:.9}
.gallery-card.video-card:hover i,.gallery-card.video-card:focus-visible i{opacity:1;transform:translate(-50%,-50%) scale(1.04)}
.gallery-card.video-card:focus-visible{outline:3px solid var(--burgundy);outline-offset:2px}
.video-lightbox{position:fixed;inset:0;z-index:1000;display:grid;grid-template-columns:minmax(44px,1fr) minmax(0,auto) minmax(44px,1fr);align-items:center;gap:18px;padding:26px;background:rgba(10,7,5,.94);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,visibility .25s ease}
.video-lightbox.open{opacity:1;visibility:visible;pointer-events:auto}
.video-frame{grid-column:2;max-width:min(92vw,1200px);max-height:92svh;display:flex;flex-direction:column;align-items:center;justify-content:center}
.video-frame video{display:block;max-width:min(88vw,1100px);max-height:82svh;width:auto;height:auto;border-radius:14px;background:#000;box-shadow:0 30px 90px rgba(0,0,0,.72)}
.video-caption{width:100%;padding:13px 5px 0;display:flex;justify-content:space-between;gap:18px;color:#f6ede2}
.video-caption strong{font-family:"Playfair Display",serif;font-size:clamp(18px,2vw,28px)}
.video-caption span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;opacity:.74}
.video-close,.video-nav{border:0;color:#f8efe5;background:rgba(255,255,255,.08);cursor:pointer;transition:background .2s ease,transform .2s ease}
.video-close:hover,.video-close:focus-visible,.video-nav:hover,.video-nav:focus-visible{background:rgba(111,29,42,.88);outline:none}
.video-close{position:absolute;top:18px;right:22px;width:46px;height:46px;border-radius:50%;font-size:30px;line-height:1}
.video-nav{width:52px;height:72px;border-radius:999px;font-size:42px;display:grid;place-items:center}
.video-prev{grid-column:1;justify-self:end}.video-next{grid-column:3;justify-self:start}.video-nav:active{transform:scale(.96)}
@media(max-width:900px){
  .camera-layout{min-height:calc(100svh - 150px)}
  .camera-gallery-wrap{padding:15px}
  .gallery-grid{gap:11px}
  .video-lightbox{grid-template-columns:1fr;padding:62px 14px 18px}
  .video-frame{grid-column:1;max-width:100%}
  .video-frame video{max-width:94vw;max-height:76svh}
  .video-nav{position:absolute;bottom:20px;width:48px;height:48px;font-size:34px}
  .video-prev{left:18px}.video-next{right:18px}
  .video-caption{padding-bottom:54px;flex-direction:column;gap:4px}
}


/* v19 — Photos folder added to the camera only. All approved visuals elsewhere remain unchanged. */
.gallery-card.photo-card{display:block;width:100%;padding:0;border:0;cursor:pointer;text-align:left;color:inherit;background:#1b120e}
.gallery-card.photo-card img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .22s ease,opacity .22s ease}
.gallery-card.photo-card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 48%,rgba(19,11,8,.72));pointer-events:none}
.gallery-card.photo-card span{z-index:2;max-width:calc(100% - 24px)}
.gallery-card.photo-card i{position:absolute;z-index:3;right:12px;top:12px;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:rgba(246,238,226,.9);color:#351f16;font-style:normal;font-size:16px;box-shadow:0 8px 20px rgba(0,0,0,.3);opacity:0;transition:opacity .2s ease,transform .2s ease}
.gallery-card.photo-card:hover img,.gallery-card.photo-card:focus-visible img{transform:scale(1.035);opacity:.9}
.gallery-card.photo-card:hover i,.gallery-card.photo-card:focus-visible i{opacity:1;transform:scale(1.04)}
.gallery-card.photo-card:focus-visible{outline:3px solid var(--burgundy);outline-offset:2px}
.photo-lightbox{position:fixed;inset:0;z-index:1000;display:grid;grid-template-columns:minmax(44px,1fr) minmax(0,auto) minmax(44px,1fr);align-items:center;gap:18px;padding:26px;background:rgba(10,7,5,.96);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,visibility .25s ease}
.photo-lightbox.open{opacity:1;visibility:visible;pointer-events:auto}
.photo-frame{grid-column:2;margin:0;max-width:min(92vw,1200px);max-height:92svh;display:flex;flex-direction:column;align-items:center;justify-content:center}
.photo-frame img{display:block;max-width:min(88vw,1100px);max-height:82svh;width:auto;height:auto;object-fit:contain;border-radius:14px;background:#111;box-shadow:0 30px 90px rgba(0,0,0,.72)}
.photo-frame figcaption{width:100%;padding:13px 5px 0;color:#f6ede2;font-family:"Playfair Display",serif;font-size:clamp(18px,2vw,28px)}
.photo-close,.photo-nav{border:0;color:#f8efe5;background:rgba(255,255,255,.08);cursor:pointer;transition:background .2s ease,transform .2s ease}
.photo-close:hover,.photo-close:focus-visible,.photo-nav:hover,.photo-nav:focus-visible{background:rgba(111,29,42,.88);outline:none}
.photo-close{position:absolute;top:18px;right:22px;width:46px;height:46px;border-radius:50%;font-size:30px;line-height:1}
.photo-nav{width:52px;height:72px;border-radius:999px;font-size:42px;display:grid;place-items:center}
.photo-prev{grid-column:1;justify-self:end}.photo-next{grid-column:3;justify-self:start}.photo-nav:active{transform:scale(.96)}
@media(max-width:900px){.photo-lightbox{grid-template-columns:1fr;padding:62px 14px 18px}.photo-frame{grid-column:1;max-width:100%}.photo-frame img{max-width:94vw;max-height:76svh}.photo-nav{position:absolute;bottom:20px;width:48px;height:48px;font-size:34px}.photo-prev{left:18px}.photo-next{right:18px}.photo-frame figcaption{padding-bottom:54px}}


/* v20 — viewport-locked video viewer. Camera videos open fully fitted with no scrolling. */
.video-lightbox{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  overflow:hidden!important;
  place-items:center!important;
}
.video-frame{
  width:min(1100px,calc(100vw - 180px))!important;
  height:calc(100dvh - 52px)!important;
  max-width:none!important;
  max-height:none!important;
  justify-content:center!important;
}
.video-frame video{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:calc(100dvh - 118px)!important;
  object-fit:contain!important;
}
@media(max-width:900px){
  .video-lightbox{padding:58px 12px 72px!important}
  .video-frame{width:100%!important;height:calc(100dvh - 130px)!important}
  .video-frame video{max-width:100%!important;max-height:calc(100dvh - 190px)!important}
}


/* v21 — refreshed photo gallery + viewport-locked photo viewer. */
.photo-lightbox{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  overflow:hidden!important;
  place-items:center!important;
}
.photo-frame{
  width:min(1100px,calc(100vw - 180px))!important;
  height:calc(100dvh - 52px)!important;
  max-width:none!important;
  max-height:none!important;
  justify-content:center!important;
}
.photo-frame img{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:calc(100dvh - 118px)!important;
  object-fit:contain!important;
}
@media(max-width:900px){
  .photo-lightbox{padding:58px 12px 72px!important}
  .photo-frame{width:100%!important;height:calc(100dvh - 130px)!important}
  .photo-frame img{max-width:100%!important;max-height:calc(100dvh - 190px)!important}
}

.app-grid button{transition:transform .15s}.app-grid button.app-tapped,.app-grid button:active{transform:scale(.94)}
/* v22.1 — packaged SVG app icons so every icon displays offline. */
.app-grid b.app-icon{background:transparent!important;border:0!important;padding:0!important;overflow:hidden!important}
.app-grid b.app-icon img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;border-radius:16px!important}


/* v24 — laptop analytics dashboard only. All locked sections remain unchanged. */
.laptop-view{width:min(1240px,96vw);position:relative;min-height:720px}
.analytics-boot{position:absolute;inset:0;z-index:5;display:grid;place-content:center;justify-items:center;gap:10px;min-height:700px;border-radius:26px;background:linear-gradient(145deg,#17110e,#271914);color:#f6eee4;box-shadow:0 35px 90px #0008;transition:opacity .45s ease,visibility .45s ease}
.analytics-boot.done{opacity:0;visibility:hidden;pointer-events:none}.boot-mark{width:68px;height:68px;border-radius:22px;display:grid;place-items:center;background:#f3e8d8;color:#4f1720;font-family:"Playfair Display",serif;font-size:30px;font-style:italic;box-shadow:0 12px 34px #0005}.analytics-boot strong{font-family:"Playfair Display",serif;font-size:32px}.analytics-boot span{font-size:13px;opacity:.68}.boot-line{width:220px;height:4px;margin-top:12px;overflow:hidden;border-radius:99px;background:#ffffff18}.boot-line i{display:block;width:100%;height:100%;transform-origin:left;animation:bootLoad 1s ease both;background:linear-gradient(90deg,#c2744f,#f1cf9b)}@keyframes bootLoad{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.analytics-dashboard{opacity:0;transform:translateY(8px);transition:.45s ease}.analytics-dashboard.ready{opacity:1;transform:none}.analytics-dashboard.dashboard-shell{grid-template-columns:210px 1fr;min-height:720px;background:#eee5d9}.analytics-dashboard .dash-sidebar{position:relative;background:linear-gradient(180deg,#271914,#4f1720);padding:25px 16px}.analytics-dashboard .dash-sidebar small{margin:0 8px 18px;font-size:9px;letter-spacing:.16em;opacity:.62}.analytics-dashboard .dash-tab{font-size:13px}.dash-source{margin-top:auto;padding:18px 8px 0;border-top:1px solid #ffffff20;font-size:10px;line-height:1.6;opacity:.58}.analytics-dashboard .dash-main{padding:26px 28px 34px;overflow:auto;max-height:82svh}.analytics-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:22px}.analytics-head small{color:#8b4a36;font-weight:700;letter-spacing:.15em;text-transform:uppercase}.analytics-head h1{font-size:clamp(34px,4vw,52px);line-height:1.02;margin:7px 0 8px}.analytics-head p{max-width:720px;margin:0;color:#6f6258;font-size:13px;line-height:1.6}.live-pill{white-space:nowrap;padding:8px 11px;border-radius:99px;background:#e7d8c8;color:#4f1720;font-size:10px;font-weight:700}.analytics-content{display:grid;gap:16px}.analytics-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.analytics-metric{padding:16px;border:1px solid #d4c3b0;border-radius:16px;background:#f8f1e8;box-shadow:0 8px 20px #5d3b2412;animation:metricIn .45s ease both;animation-delay:var(--delay)}@keyframes metricIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.analytics-metric small{font-size:10px;color:#75665b}.analytics-metric strong{display:block;margin:7px 0 4px;font-size:clamp(24px,2.6vw,38px);letter-spacing:-.04em}.analytics-metric span{font-size:10px;color:#8b4a36}.analytics-grid{display:grid;gap:16px}.analytics-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.analytics-panel{padding:18px;border:1px solid #d4c3b0;border-radius:17px;background:#f8f1e8;box-shadow:0 8px 20px #5d3b2410}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.panel-title strong{font-size:14px}.panel-title span{font-size:10px;color:#857367}.platform-bars{display:grid;gap:16px}.platform-bars label,.age-bars label{display:flex;justify-content:space-between;margin-bottom:6px;font-size:11px}.platform-bars em{font-style:normal;font-weight:700}.platform-bars span,.age-bars span{display:block;height:10px;border-radius:99px;background:#e1d6ca;overflow:hidden}.platform-bars i,.age-bars i{display:block;height:100%;width:var(--w);border-radius:inherit;background:linear-gradient(90deg,#7b2431,#c2744f);transform-origin:left;animation:growBar .8s ease both}@keyframes growBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}.discovery-rings{display:flex;justify-content:space-around;gap:18px}.ring{width:132px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;text-align:center;background:conic-gradient(#7b2431 calc(var(--p)*1%),#e1d6ca 0);position:relative}.ring::after{content:"";position:absolute;inset:12px;border-radius:50%;background:#f8f1e8}.ring b,.ring span{position:relative;z-index:1}.ring b{font-size:25px}.ring span{font-size:9px;line-height:1.35;color:#79685c}.platform-card .platform-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.platform-label span{font-family:"Playfair Display",serif;font-size:24px}.platform-label b{font-size:10px}.platform-card dl{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0}.platform-card dl div{padding:10px;border-radius:11px;background:#efe4d8}.platform-card dt{font-size:9px;color:#7e6e62}.platform-card dd{margin:4px 0 0;font-size:17px;font-weight:700}.instagram-card{border-top:4px solid #b45b42}.tiktok-card{border-top:4px solid #17110e}.gender-layout{display:flex;align-items:center;justify-content:center;gap:24px}.donut{width:150px;aspect-ratio:1;border-radius:50%;background:conic-gradient(#7b2431 0 calc(var(--female)*1%),#c2744f 0 calc((var(--female) + var(--male))*1%),#d7cabd 0);display:grid;place-items:center}.donut::before{content:"";grid-area:1/1;width:102px;aspect-ratio:1;border-radius:50%;background:#f8f1e8}.donut div{grid-area:1/1;z-index:1;text-align:center}.donut b{display:block;font-size:25px}.donut span{font-size:10px}.legend{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:11px}.legend li{display:grid;grid-template-columns:10px 1fr auto;gap:7px;align-items:center}.legend i{width:8px;height:8px;border-radius:50%;background:#7b2431}.legend li:nth-child(2) i{background:#c2744f}.legend li:nth-child(3) i{background:#d7cabd}.age-bars{display:grid;gap:10px}.time-stat b{display:block;font-family:"Playfair Display",serif;font-size:52px;color:#4f1720}.time-stat span{font-size:11px;color:#78685c}.hour-bars{height:70px;display:flex;align-items:end;gap:5px;margin-top:12px}.hour-bars i{flex:1;height:var(--h);min-height:5px;border-radius:4px 4px 0 0;background:#d7c4b2}.hour-bars i:nth-last-child(2){background:#7b2431}.snapshot-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.snapshot-list p{margin:0;padding:12px;border-radius:12px;background:#efe4d8}.snapshot-list b{display:block;font-size:19px}.snapshot-list span{font-size:9px;color:#77675b}.top-content-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.top-post{overflow:hidden;border-radius:17px;background:#f8f1e8;border:1px solid #d4c3b0}.top-post.featured{grid-column:span 2;display:grid;grid-template-columns:45% 1fr}.top-post img{width:100%;height:210px;object-fit:cover;display:block}.top-post.featured img{height:100%}.top-post div{padding:15px}.top-post span{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:#8b4a36}.top-post h3{font-family:"Playfair Display",serif;font-size:22px;margin:6px 0}.top-post strong{font-size:14px}.top-post p{font-size:11px;line-height:1.5;color:#75655a}.content-note{display:flex;gap:8px;align-items:baseline}.content-note p{margin:0;font-size:12px;color:#6f6055}.insight-hero{display:grid;grid-template-columns:1fr 220px;gap:18px;padding:25px;border-radius:20px;background:linear-gradient(135deg,#271914,#5a1925);color:#f8efe5}.insight-hero small{letter-spacing:.16em}.insight-hero h2{font-family:"Playfair Display",serif;font-size:40px;margin:8px 0}.insight-hero p{margin:0;max-width:650px;font-size:12px;line-height:1.65;opacity:.78}.insight-score{display:grid;place-content:center;text-align:center;border-left:1px solid #ffffff2b}.insight-score b{font-size:54px}.insight-score span{font-size:10px;opacity:.72}.insight-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.insight-cards article{padding:16px;border-radius:16px;background:#f8f1e8;border:1px solid #d4c3b0}.insight-cards b{font-size:25px;color:#7b2431}.insight-cards h3{font-size:13px;margin:7px 0}.insight-cards p{font-size:10px;line-height:1.5;color:#726359}.tag-cloud{display:flex;flex-wrap:wrap;gap:8px}.tag-cloud span{padding:8px 11px;border-radius:99px;background:#e9dbcd;font-size:10px;font-weight:700;color:#5a3026}
@media(max-width:900px){.laptop-view{width:96vw}.analytics-dashboard.dashboard-shell{grid-template-columns:1fr}.analytics-dashboard .dash-sidebar{flex-direction:row;align-items:center;overflow:auto;padding:10px}.analytics-dashboard .dash-sidebar small,.dash-source{display:none}.analytics-dashboard .dash-main{max-height:74svh;padding:18px}.analytics-metrics{grid-template-columns:repeat(2,1fr)}.analytics-grid.two,.insight-hero{grid-template-columns:1fr}.top-content-grid{grid-template-columns:repeat(2,1fr)}.top-post.featured{grid-column:span 2}.insight-cards{grid-template-columns:repeat(2,1fr)}.insight-score{border-left:0;border-top:1px solid #ffffff2b;padding-top:16px}.analytics-head{flex-direction:column}.live-pill{align-self:flex-start}}
@media(max-width:560px){.analytics-metrics,.platform-card dl,.snapshot-list,.top-content-grid,.insight-cards{grid-template-columns:1fr}.top-post.featured{grid-column:auto;display:block}.discovery-rings{flex-direction:column;align-items:center}.gender-layout{flex-direction:column}.analytics-head h1{font-size:32px}}

/* v25 — scrapbook journal update only. All previously locked sections remain unchanged. */
.journal-scrapbook-view{width:min(1220px,97vw)}
.journal-scrapbook-book{min-height:690px}
.journal-page{font-family:"Special Elite",monospace}
.journal-page h2{margin:10px 0 20px;font-size:clamp(38px,4.4vw,58px);line-height:1;color:#45121b}
.journal-page-label{
  display:inline-block;
  padding:7px 13px;
  background:#d5b88f;
  color:#2a1b14;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  transform:rotate(-1deg);
  box-shadow:0 4px 8px rgba(73,46,28,.12);
  clip-path:polygon(2% 8%,98% 2%,100% 90%,94% 97%,4% 92%,0 14%);
}
.journal-lead{font-size:1.05em}
.journal-signoff{margin-top:24px}
.journal-signoff strong{display:inline-block;margin-top:8px;color:#8a3343;font-size:1.2em}
.journal-polaroid{position:absolute!important;right:6%;bottom:7%;width:38%!important;margin:0!important;transform:rotate(3deg)!important}
.journal-polaroid img{width:100%;aspect-ratio:4/5;display:block;object-fit:cover}
.journal-polaroid figcaption{text-align:center;padding-top:10px;font-size:12px}
.journal-paperclip{
  position:absolute;right:7%;top:7%;width:20px;height:68px;border:3px solid #6e625a;border-radius:12px;transform:rotate(8deg);z-index:5
}
.journal-sticker{position:absolute;font-size:42px;color:#9c4052;text-shadow:0 3px 0 #d7b7a1}
.heart-sticker{left:6%;bottom:7%;transform:rotate(-12deg)}

.journal-scrapbook{padding:45px 30px 32px!important;background:#201712!important;color:#f7ecde!important}
.journal-scrapbook h2{color:#f7ecde!important;font-size:32px;margin-bottom:8px}
.journal-scrapbook .journal-page-label{background:#dbc39f}
.scrapbook-collage{position:relative;height:510px;margin-top:6px}
.scrap-photo{position:absolute;margin:0;background:#fff;padding:7px 7px 25px;box-shadow:0 8px 14px rgba(0,0,0,.35);width:31%}
.scrap-photo img{width:100%;height:130px;object-fit:cover;display:block}
.scrap-photo figcaption{color:#2b1c15;font-size:10px;text-align:center;padding-top:5px}
.scrap-photo.p1{left:2%;top:3%;transform:rotate(-5deg)}
.scrap-photo.p2{left:34%;top:0;transform:rotate(3deg)}
.scrap-photo.p3{right:1%;top:5%;transform:rotate(-2deg)}
.scrap-photo.p4{left:9%;top:31%;transform:rotate(4deg)}
.scrap-photo.p5{left:39%;top:29%;transform:rotate(-4deg)}
.scrap-photo.p6{right:2%;top:34%;transform:rotate(5deg)}
.scrap-photo.p7{left:20%;bottom:0;transform:rotate(-2deg)}
.scrap-photo.p8{right:17%;bottom:1%;transform:rotate(3deg)}
.scrap-note,.scrap-ticket{position:absolute;z-index:8;padding:8px 10px;box-shadow:0 5px 10px rgba(0,0,0,.25);font-size:11px}
.note-one{left:1%;bottom:9%;background:#eee2ce;color:#2a1b14;transform:rotate(-4deg)}
.note-two{right:3%;bottom:11%;background:#d58b99;color:#24140f;transform:rotate(4deg)}
.scrap-ticket{left:40%;bottom:2%;background:#c57d75;color:#27130f;border:1px dashed #542319;transform:rotate(-2deg);letter-spacing:.1em}

.journal-purpose .purpose-kicker{font-size:1.15em;color:#7a2635}
.journal-purpose p{line-height:1.75}
.community-note{margin-top:18px;padding:17px 18px;background:#d9a5ad;color:#281511;transform:rotate(-1deg);box-shadow:0 6px 12px rgba(70,35,25,.13)}
.community-note h3{margin:0 0 8px;font-size:18px}
.community-note ul{display:grid;grid-template-columns:1fr 1fr;gap:5px 16px;margin:0;padding:0;list-style:none}
.community-note li::before{content:"♡ ";color:#6f1d2a}
.purpose-footer{font-size:1.08em;text-align:center;margin-top:18px;color:#6f1d2a}

.love-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px;padding-right:27%}
.love-grid div{background:rgba(255,250,240,.72);border:1px solid rgba(91,60,39,.15);padding:12px 8px;text-align:center;min-height:90px}
.love-grid span{display:block;font-size:30px;margin-bottom:5px}
.love-grid b{font-size:11px;font-weight:400}
.happy-note{position:absolute;right:5%;top:24%;width:22%;background:#dfb6bd;padding:16px 12px;line-height:1.7;transform:rotate(2deg);box-shadow:0 6px 12px rgba(71,39,28,.13)}
.happy-note strong{display:block;margin-bottom:6px}

.fact-wall{position:relative;height:500px;margin-top:8px}
.fact{position:absolute;width:42%;min-height:100px;padding:18px 16px;display:grid;place-items:center;text-align:center;box-shadow:0 6px 12px rgba(61,36,23,.15)}
.f1{left:2%;top:2%;background:#eadac2;transform:rotate(-3deg)}
.f2{right:2%;top:1%;background:#d8a4ae;transform:rotate(3deg)}
.f3{left:29%;top:22%;background:#b7a7bb;transform:rotate(-1deg)}
.f4{left:1%;top:43%;background:#f2e7d5;transform:rotate(2deg)}
.f5{right:1%;top:42%;background:#dfc9aa;transform:rotate(-2deg)}
.f6{left:29%;bottom:1%;background:#2b211d;color:#f5eadc;transform:rotate(2deg)}
.f7{right:3%;bottom:2%;background:#d6a0aa;transform:rotate(-2deg)}
.f8{left:3%;bottom:1%;background:#e8dcc9;transform:rotate(1deg)}

.journal-notes{background:linear-gradient(145deg,#2c211b,#15100d)!important;color:#f6eadc!important}
.journal-notes h2{color:#f6eadc!important}
.journal-notes .journal-page-label{background:#d5b88f;color:#23150e}
.notes-instruction{color:#d8c7b8}
.hidden-note-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.hidden-note{min-height:120px;border:0;padding:18px;background:#efe2cf;color:#251711;cursor:pointer;font-family:"Special Elite",monospace;box-shadow:0 8px 15px rgba(0,0,0,.28);clip-path:polygon(0 0,85% 0,100% 18%,100% 100%,0 100%);transition:.18s ease}
.hidden-note:hover,.hidden-note:focus-visible{transform:translateY(-3px) rotate(-1deg);outline:2px solid #d9b47d;outline-offset:3px}
.dark-note{background:#17110e;color:#f4e9db}
.pink-note{background:#ce8e99}
.note-reveal{margin-top:20px;min-height:115px;padding:20px;background:rgba(255,244,226,.12);border:1px dashed rgba(255,238,216,.4);display:grid;place-items:center;text-align:center;font-size:16px;line-height:1.6;transition:.2s ease}
.note-reveal.open{background:#f1e4d1;color:#2a1b14;transform:rotate(-1deg)}

.journal-controls button{font-family:"Special Elite",monospace}
@media(max-width:900px){
  .journal-scrapbook-book{min-height:72vh}
  .journal-page{padding:42px 25px 36px}
  .journal-polaroid{position:relative!important;right:auto;bottom:auto;width:60%!important;margin:24px auto 0!important}
  .scrapbook-collage{height:520px}
  .scrap-photo{width:38%}
  .love-grid{grid-template-columns:repeat(2,1fr);padding-right:0}
  .happy-note{position:relative;right:auto;top:auto;width:100%;margin-top:16px}
  .fact-wall{height:610px}
  .fact{width:46%}
}

/* v26 — final five-page Journal revision. Locked Homepage, Camera, Phone, Media Kit, and Laptop remain unchanged. */
.journal-scrapbook-view{
  width:min(1180px,96vw);
  height:calc(100svh - 86px);
  max-height:880px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  overflow:hidden;
}
.journal-scrapbook-book{
  flex:1 1 auto;
  min-height:0!important;
  height:auto;
  max-height:calc(100svh - 145px);
}
.journal-scrapbook-book .journal-page{
  min-height:0;
  padding:clamp(28px,3.4vh,46px) clamp(26px,3.1vw,48px) clamp(28px,3.2vh,44px);
}
.journal-scrapbook-book .journal-page h2{
  margin:6px 0 clamp(12px,2vh,20px);
  font-size:clamp(34px,4vh,52px);
}
.journal-controls{
  flex:0 0 auto;
  margin-top:10px!important;
  min-height:42px;
}
.journal-controls button{padding:8px 13px}
.journal-page-label{font-size:10px;padding:6px 11px}
.journal-page p{
  font-size:clamp(12px,1.45vh,16px);
  line-height:1.62;
}

/* Page 1 */
.about-layout{
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(185px,.96fr);
  gap:24px;
  align-items:start;
}
.about-copy p{max-width:100%;margin:0 0 12px}
.about-portrait{
  margin:0;
  padding:9px 9px 30px;
  background:#fffaf2;
  border:1px solid #d2bea6;
  box-shadow:0 12px 22px rgba(65,42,28,.22);
  transform:rotate(1.7deg);
}
.about-portrait img{
  width:100%;
  height:clamp(300px,43vh,445px);
  object-fit:cover;
  object-position:center 20%;
  display:block;
}
.about-portrait figcaption{
  padding-top:8px;
  text-align:center;
  font-size:10px;
}
.journal-about .journal-signoff{margin-top:10px}
.journal-about .journal-signoff strong{font-size:1.04em}

/* Page 2 */
.journal-story{
  padding-left:26px!important;
  padding-right:26px!important;
  background:#211713!important;
  color:#f5e9db!important;
}
.journal-story h2{color:#f7ecdf!important;font-size:clamp(30px,3.3vh,42px)!important}
.journal-story .journal-page-label{background:#d6bb93}
.story-collage{
  position:relative;
  height:calc(100% - 92px);
  min-height:420px;
}
.story-photo{
  position:absolute;
  margin:0;
  padding:6px 6px 22px;
  background:#fffaf2;
  box-shadow:0 7px 15px rgba(0,0,0,.42);
  width:27%;
}
.story-photo img{width:100%;height:118px;object-fit:cover;display:block}
.story-photo figcaption{color:#291a13;font-size:9px;text-align:center;padding-top:4px}
.story-photo.s1{left:1%;top:1%;transform:rotate(-4deg)}
.story-photo.s2{left:28%;top:0;transform:rotate(3deg)}
.story-photo.s3{right:16%;top:1%;transform:rotate(-2deg)}
.story-photo.s4{right:0;top:20%;transform:rotate(4deg)}
.story-photo.s5{left:4%;top:37%;transform:rotate(3deg)}
.story-photo.s6{left:34%;top:34%;transform:rotate(-3deg)}
.story-photo.s7{right:4%;bottom:0;transform:rotate(2deg)}
.story-photo.s8{left:18%;bottom:0;transform:rotate(-2deg)}
.story-note,.story-ticket{
  position:absolute;
  z-index:10;
  padding:7px 9px;
  font-size:10px;
  box-shadow:0 4px 9px rgba(0,0,0,.3);
}
.story-note.n1{left:1%;bottom:6%;background:#e7d5bc;color:#281912;transform:rotate(-4deg)}
.story-note.n2{right:0;top:2%;background:#d99aa5;color:#2a1714;transform:rotate(4deg)}
.story-ticket{left:43%;bottom:1%;background:#b8685f;color:#24110e;border:1px dashed #4b1914;transform:rotate(2deg);letter-spacing:.08em}

/* Page 3 */
.purpose-layout{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(150px,.75fr);
  gap:22px;
  align-items:start;
}
.purpose-copy p{max-width:100%;margin:0 0 13px}
.purpose-kicker{
  color:#6f1d2a!important;
  font-size:clamp(14px,1.7vh,18px)!important;
  line-height:1.5!important;
}
.purpose-card{
  margin-top:6px;
  padding:18px 16px;
  background:#d7a0aa;
  color:#281511;
  transform:rotate(1.5deg);
  box-shadow:0 7px 13px rgba(67,35,25,.15);
}
.purpose-card h3{font-size:15px;margin:0 0 10px}
.purpose-card span{display:block;padding:4px 0;font-size:12px}
.purpose-card span::before{content:"♡ ";color:#681b27}
.purpose-strip{
  margin-top:12px;
  padding:9px 12px;
  background:#4c171e;
  color:#f8ecdf;
  text-align:center;
  font-size:10px;
  letter-spacing:.08em;
  transform:rotate(-.5deg);
}

/* Page 4 */
.journal-inspire{padding-left:30px!important;padding-right:30px!important}
.inspire-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px;
}
.inspire-grid figure{
  margin:0;
  padding:6px 6px 20px;
  background:#fffaf2;
  border:1px solid #dac7af;
  box-shadow:0 6px 12px rgba(65,42,28,.15);
}
.inspire-grid figure:nth-child(2n){transform:rotate(1.5deg)}
.inspire-grid figure:nth-child(3n){transform:rotate(-1.5deg)}
.inspire-grid img{
  width:100%;
  height:clamp(86px,13vh,125px);
  object-fit:cover;
  display:block;
}
.inspire-grid figcaption{
  padding-top:5px;
  text-align:center;
  font-size:9px;
  line-height:1.2;
}
.inspire-note{
  margin:14px auto 0;
  width:85%;
  padding:10px 14px;
  background:#d6a5ad;
  text-align:center;
  font-size:11px;
  transform:rotate(-1deg);
}

/* Page 5 */
.thanks-layout{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(180px,.8fr);
  gap:24px;
  align-items:center;
}
.thanks-letter p{max-width:100%;margin:0 0 12px}
.thanks-photo{
  margin:0;
  padding:9px 9px 32px;
  background:#fffaf2;
  border:1px solid #d4c0a8;
  box-shadow:0 12px 22px rgba(65,42,28,.2);
  transform:rotate(2deg);
}
.thanks-photo img{
  width:100%;
  height:clamp(285px,40vh,420px);
  object-fit:cover;
  object-position:center 22%;
  display:block;
}
.thanks-photo figcaption{text-align:center;padding-top:8px;font-size:10px}
.journal-thanks .journal-signoff{margin-top:12px}
.endpaper-message{
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:20px;
  text-align:center;
  color:#4a201c;
}
.endpaper-message span{font-family:"Playfair Display",serif;font-size:36px;font-style:italic}
.endpaper-message strong{font-size:22px;line-height:1.7}
.endpaper-message small{font-size:12px}

@media(max-height:780px) and (min-width:901px){
  .journal-scrapbook-view{height:calc(100svh - 74px)}
  .journal-scrapbook-book{max-height:calc(100svh - 125px)}
  .journal-scrapbook-book .journal-page{padding-top:24px;padding-bottom:24px}
  .about-portrait img,.thanks-photo img{height:310px}
  .story-photo img{height:92px}
  .inspire-grid img{height:78px}
  .journal-page p{font-size:12px;line-height:1.5}
}

@media(max-width:900px){
  .journal-scrapbook-view{
    height:calc(100svh - 75px);
    max-height:none;
  }
  .journal-scrapbook-book{
    max-height:calc(100svh - 132px);
  }
  .journal-scrapbook-book .journal-page.right{
    padding:30px 22px 28px;
    overflow:auto;
  }
  .about-layout,.purpose-layout,.thanks-layout{grid-template-columns:1fr}
  .about-portrait,.thanks-photo{width:58%;margin:0 auto}
  .about-portrait img,.thanks-photo img{height:240px}
  .inspire-grid{grid-template-columns:repeat(2,1fr)}
  .story-collage{min-height:520px}
}

/* v27 — Journal refinements: Page 2 cutout collage and Page 4 inspiration updates. */
.cutout-collage .cutout-photo{
  border:0;
  padding:7px 7px 23px;
  clip-path:polygon(3% 1%,12% 3%,20% 0,30% 2%,39% 0,49% 2%,59% 0,69% 3%,78% 0,88% 2%,98% 0,100% 97%,90% 100%,80% 98%,70% 100%,60% 98%,50% 100%,40% 98%,30% 100%,20% 98%,10% 100%,0 97%,1% 10%);
}
.cutout-collage .cutout-photo::before{
  content:"";
  position:absolute;
  left:26%;
  top:-8px;
  width:48%;
  height:17px;
  background:rgba(217,190,150,.78);
  transform:rotate(-2deg);
  box-shadow:0 2px 5px rgba(0,0,0,.18);
  z-index:3;
}
.collage-sticker{
  position:absolute;
  z-index:15;
  display:grid;
  place-items:center;
  color:#f5eadb;
  filter:drop-shadow(0 4px 4px rgba(0,0,0,.35));
  pointer-events:none;
}
.star-one{left:25%;top:17%;font-size:31px;transform:rotate(-13deg)}
.star-two{right:4%;top:47%;font-size:33px;transform:rotate(9deg)}
.heart-one{left:48%;top:28%;font-size:31px;color:#d98d9b;transform:rotate(-8deg)}
.camera-sticker{left:46%;bottom:6%;font-size:27px;transform:rotate(5deg)}
.sparkle-sticker{right:27%;top:3%;font-size:30px;color:#d7b173}
.monster-sticker{
  left:48%;
  top:7%;
  width:55px;
  height:61px;
  background:#060606;
  color:#74c92b;
  border-radius:7px;
  transform:rotate(8deg);
  font-family:Arial,sans-serif;
}
.monster-sticker b{font-size:31px;font-style:italic;line-height:1}
.monster-sticker small{font-size:6px;letter-spacing:.08em;color:#fff}
.cutout-phrase{
  position:absolute;
  z-index:14;
  padding:7px 9px;
  font-size:9px;
  line-height:1.35;
  text-align:center;
  color:#261711;
  background:#ead9bf;
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.25));
  clip-path:polygon(2% 7%,12% 2%,22% 5%,33% 0,44% 4%,55% 1%,67% 5%,78% 2%,89% 6%,98% 2%,100% 93%,89% 98%,78% 94%,67% 100%,56% 95%,44% 99%,33% 95%,22% 100%,11% 95%,0 98%);
}
.phrase-one{right:2%;top:31%;transform:rotate(5deg)}
.phrase-two{left:54%;bottom:7%;background:#17110e;color:#f4e9da;transform:rotate(-4deg)}
.phrase-three{left:2%;top:27%;background:#d9a0aa;transform:rotate(-6deg)}

.journal-inspire .inspire-grid figure{
  position:relative;
}
.journal-inspire .inspire-grid figure::before{
  content:"";
  position:absolute;
  left:30%;
  top:-6px;
  width:40%;
  height:12px;
  background:rgba(205,173,127,.72);
  transform:rotate(-2deg);
  z-index:2;
}
.journal-inspire .inspire-grid img{
  object-position:center;
}

/* v28 — Page 2 only: realistic full-page cutout scrapbook collage. */
.journal-story{
  overflow:hidden;
}
.realistic-cutout-collage{
  position:relative;
  height:calc(100% - 76px);
  min-height:450px;
  margin-top:2px;
  isolation:isolate;
}
.real-cutout{
  position:absolute;
  margin:0;
  padding:0;
  background:transparent;
  filter:
    drop-shadow(0 11px 9px rgba(0,0,0,.34))
    drop-shadow(0 2px 2px rgba(0,0,0,.2));
}
.real-cutout::after{
  content:"";
  position:absolute;
  inset:-2px;
  pointer-events:none;
  background:
    linear-gradient(105deg,rgba(255,255,255,.17),transparent 28%),
    linear-gradient(transparent 72%,rgba(0,0,0,.1));
  mix-blend-mode:soft-light;
  clip-path:inherit;
}
.real-cutout img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  clip-path:inherit;
}
.rc1{
  left:1%;
  top:2%;
  width:28%;
  height:46%;
  z-index:5;
  transform:rotate(-6deg);
  clip-path:polygon(5% 1%,19% 3%,32% 0,44% 2%,58% 0,70% 3%,86% 1%,98% 5%,100% 20%,97% 38%,100% 55%,96% 72%,99% 90%,87% 98%,70% 96%,54% 100%,38% 97%,21% 100%,3% 95%,0 79%,3% 62%,0 45%,4% 27%);
}
.rc2{
  left:21%;
  top:0;
  width:29%;
  height:43%;
  z-index:8;
  transform:rotate(4deg);
  clip-path:polygon(2% 7%,14% 1%,29% 4%,42% 0,55% 3%,69% 0,83% 5%,98% 2%,100% 22%,97% 41%,100% 61%,96% 80%,99% 95%,83% 100%,65% 97%,49% 100%,31% 96%,14% 100%,0 94%,3% 72%,0 49%,4% 27%);
}
.rc3{
  left:46%;
  top:1%;
  width:25%;
  height:45%;
  z-index:6;
  transform:rotate(-3deg);
  clip-path:polygon(6% 0,23% 3%,39% 0,55% 4%,72% 0,91% 5%,100% 17%,97% 35%,100% 54%,96% 71%,100% 91%,87% 99%,68% 96%,51% 100%,32% 97%,14% 100%,0 91%,4% 72%,0 53%,3% 34%,0 15%);
}
.rc4{
  right:1%;
  top:3%;
  width:28%;
  height:42%;
  z-index:7;
  transform:rotate(6deg);
  clip-path:polygon(4% 3%,18% 0,33% 4%,48% 0,65% 3%,82% 0,98% 6%,100% 27%,97% 48%,100% 70%,96% 92%,82% 100%,64% 97%,48% 100%,30% 96%,13% 100%,0 92%,3% 70%,0 48%,4% 25%);
}
.rc5{
  left:0;
  top:39%;
  width:27%;
  height:39%;
  z-index:9;
  transform:rotate(5deg);
  clip-path:polygon(2% 5%,19% 0,34% 4%,51% 1%,69% 5%,87% 0,100% 9%,97% 31%,100% 51%,96% 72%,100% 94%,83% 100%,65% 96%,47% 100%,29% 97%,11% 100%,0 91%,4% 69%,0 47%,3% 25%);
}
.rc6{
  left:20%;
  top:35%;
  width:31%;
  height:41%;
  z-index:12;
  transform:rotate(-4deg);
  clip-path:polygon(5% 0,20% 4%,37% 1%,54% 5%,72% 0,88% 4%,100% 14%,97% 34%,100% 54%,96% 74%,100% 94%,82% 100%,63% 96%,44% 100%,25% 96%,8% 100%,0 87%,4% 65%,0 44%,3% 22%);
}
.rc7{
  left:46%;
  top:36%;
  width:28%;
  height:38%;
  z-index:10;
  transform:rotate(5deg);
  clip-path:polygon(3% 2%,21% 0,39% 4%,57% 0,75% 3%,94% 0,100% 17%,97% 37%,100% 58%,96% 79%,99% 96%,80% 100%,61% 96%,42% 100%,23% 97%,5% 100%,0 86%,4% 65%,0 44%,3% 23%);
}
.rc8{
  right:0;
  top:37%;
  width:27%;
  height:40%;
  z-index:11;
  transform:rotate(-5deg);
  clip-path:polygon(6% 1%,22% 4%,39% 0,56% 3%,73% 0,91% 5%,100% 20%,96% 40%,100% 61%,97% 81%,100% 95%,84% 100%,66% 96%,48% 100%,29% 96%,11% 100%,0 91%,4% 70%,0 49%,3% 28%);
}
.rc9{
  left:5%;
  bottom:0;
  width:24%;
  height:31%;
  z-index:13;
  transform:rotate(-7deg);
  clip-path:polygon(4% 3%,22% 0,42% 4%,61% 0,80% 3%,98% 0,100% 24%,96% 48%,100% 73%,95% 97%,76% 100%,55% 96%,34% 100%,14% 96%,0 89%,4% 65%,0 41%,3% 19%);
}
.rc10{
  left:27%;
  bottom:-2%;
  width:27%;
  height:32%;
  z-index:15;
  transform:rotate(3deg);
  clip-path:polygon(5% 0,24% 4%,43% 0,62% 3%,81% 0,98% 6%,100% 29%,96% 53%,100% 77%,94% 98%,74% 100%,53% 96%,33% 100%,13% 96%,0 87%,4% 63%,0 39%,3% 17%);
}
.rc11{
  left:52%;
  bottom:0;
  width:25%;
  height:33%;
  z-index:14;
  transform:rotate(-3deg);
  clip-path:polygon(3% 5%,20% 0,38% 4%,56% 0,74% 3%,92% 0,100% 18%,97% 40%,100% 62%,96% 84%,99% 97%,80% 100%,60% 96%,40% 100%,21% 97%,3% 100%,0 82%,4% 60%,0 38%,3% 17%);
}
.rc12{
  right:1%;
  bottom:-1%;
  width:24%;
  height:32%;
  z-index:16;
  transform:rotate(6deg);
  clip-path:polygon(5% 2%,23% 0,42% 4%,61% 0,80% 3%,98% 0,100% 21%,96% 44%,100% 68%,95% 93%,78% 100%,58% 96%,38% 100%,18% 96%,0 89%,4% 66%,0 43%,3% 20%);
}

/* Remove every decorative Page 2 sticker, caption, note, and label from prior versions. */
.journal-story .story-note,
.journal-story .story-ticket,
.journal-story .collage-sticker,
.journal-story .cutout-phrase,
.journal-story .real-cutout figcaption{
  display:none!important;
}

@media(max-height:780px) and (min-width:901px){
  .realistic-cutout-collage{
    min-height:380px;
  }
}

/* v29 — Final Receipts / Proof of Impact section */
.receipt-proof-view{
  width:min(1360px,97vw);
  height:calc(100svh - 74px);
  max-height:900px;
  overflow:hidden;
  display:grid;
  place-items:center;
}
.receipt-proof-scene{
  position:relative;
  width:100%;
  height:100%;
  min-height:640px;
  border-radius:24px;
  background:
    radial-gradient(circle at 20% 10%,rgba(255,255,255,.08),transparent 26%),
    linear-gradient(90deg,rgba(255,255,255,.035),transparent 30%,rgba(0,0,0,.07)),
    #251913;
  box-shadow:inset 0 0 75px rgba(0,0,0,.55);
  overflow:hidden;
}
.impact-receipt{
  position:absolute;
  left:50%;
  top:50%;
  width:min(790px,61vw);
  height:calc(100% - 44px);
  transform:translate(-50%,-50%) rotate(-.35deg);
  padding:30px 48px 40px;
  color:#2d251f;
  font-family:"Special Elite",monospace;
  background:
    linear-gradient(rgba(255,255,255,.18),rgba(255,255,255,.18)),
    repeating-linear-gradient(0deg,rgba(86,66,48,.035) 0 1px,transparent 1px 4px),
    #eee2d1;
  clip-path:polygon(
    0 0,100% 0,100% 97.5%,
    97% 100%,94% 97.7%,91% 100%,88% 97.6%,85% 100%,82% 97.5%,
    79% 100%,76% 97.6%,73% 100%,70% 97.5%,67% 100%,64% 97.6%,
    61% 100%,58% 97.5%,55% 100%,52% 97.6%,49% 100%,46% 97.5%,
    43% 100%,40% 97.6%,37% 100%,34% 97.5%,31% 100%,28% 97.6%,
    25% 100%,22% 97.5%,19% 100%,16% 97.6%,13% 100%,10% 97.5%,
    7% 100%,4% 97.6%,0 100%
  );
  box-shadow:0 30px 65px rgba(0,0,0,.45);
  overflow:auto;
  scrollbar-width:none;
}
.impact-receipt::-webkit-scrollbar{display:none}
.impact-receipt::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 14% 18%,rgba(111,76,52,.09) 0 1px,transparent 2px),
    radial-gradient(circle at 78% 72%,rgba(111,76,52,.07) 0 1px,transparent 2px);
  background-size:16px 18px,21px 19px;
  mix-blend-mode:multiply;
}
.impact-receipt-header{text-align:center;position:relative;z-index:1}
.impact-receipt-header small{font-size:10px;letter-spacing:.22em}
.impact-receipt-header h2{
  margin:6px 0 3px;
  font-family:"Special Elite",monospace;
  font-size:clamp(30px,3.4vw,48px);
  letter-spacing:.16em;
}
.impact-receipt-header p{
  margin:0;
  font-family:"Playfair Display",serif;
  font-style:italic;
  font-size:14px;
  color:#6f1d2a;
}
.thermal-divider{
  border-top:2px dashed rgba(45,37,31,.72);
  margin:16px 0;
}
.receipt-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 22px;
  font-size:11px;
}
.receipt-meta div,
.receipt-summary div,
.receipt-total-block div{
  display:flex;
  justify-content:space-between;
  gap:14px;
}
.receipt-meta span,.receipt-summary span,.receipt-total-block span{opacity:.75}
.receipt-brand-list h3,
.receipt-reviews h3{
  text-align:center;
  font-size:13px;
  letter-spacing:.12em;
  margin:0 0 7px;
}
.receipt-disclaimer{
  margin:0 0 10px;
  text-align:center;
  font-size:9px;
  line-height:1.45;
  opacity:.74;
}
.brand-name-lines{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:6px 20px;
  font-size:11px;
}
.brand-name-lines span{
  display:flex;
  justify-content:space-between;
  border-bottom:1px dotted rgba(45,37,31,.35);
  padding-bottom:3px;
}
.brand-name-lines span::after{content:"✓";color:#6f1d2a}
.receipt-summary,.receipt-total-block{
  display:grid;
  gap:7px;
  font-size:11px;
}
.receipt-total-block div:first-child{
  font-size:19px;
  align-items:baseline;
}
.receipt-total-block div:first-child b{
  color:#6f1d2a;
  font-size:28px;
  letter-spacing:.06em;
}
.receipt-barcode{
  width:76%;
  height:55px;
  margin:18px auto 8px;
  background:repeating-linear-gradient(
    90deg,
    #1c1815 0 2px,transparent 2px 4px,
    #1c1815 4px 8px,transparent 8px 10px,
    #1c1815 10px 11px,transparent 11px 14px
  );
}
.receipt-number{
  text-align:center;
  margin:0;
  font-size:8px;
  letter-spacing:.08em;
}
.receipt-reviews{margin-top:18px}
.receipt-reviews{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.receipt-reviews h3{grid-column:1/-1}
.thermal-review{
  padding:12px 14px;
  border:1px solid rgba(45,37,31,.26);
  background:rgba(255,255,255,.18);
  box-shadow:inset 0 0 18px rgba(73,50,33,.04);
}
.thermal-review-head{
  display:flex;
  align-items:center;
  gap:10px;
}
.thermal-review-head img{
  width:42px;
  height:42px;
  object-fit:contain;
  border-radius:50%;
}
.thermal-review-head div{display:grid}
.thermal-review-head strong{font-size:12px}
.thermal-review-head span{font-size:12px;color:#a67900;letter-spacing:.08em}
.thermal-review p{
  margin:10px 0 0;
  font-size:10px;
  line-height:1.5;
}
.receipt-clip{
  position:absolute;
  z-index:4;
  width:22px;
  height:76px;
  border:3px solid #6d6258;
  border-radius:14px;
  top:20px;
}
.receipt-clip-left{left:28px;transform:rotate(-6deg)}
.receipt-tape{
  position:absolute;
  z-index:3;
  width:170px;
  height:30px;
  background:rgba(201,174,133,.68);
  top:-5px;
  left:50%;
  transform:translateX(-50%) rotate(-1deg);
  box-shadow:0 3px 8px rgba(0,0,0,.14);
}
.brand-sticker-field{position:absolute;inset:0;pointer-events:none}
.brand-sticker{
  position:absolute;
  width:clamp(70px,7vw,112px);
  aspect-ratio:1;
  object-fit:contain;
  border-radius:50%;
  filter:drop-shadow(0 9px 8px rgba(0,0,0,.38));
  transition:transform .2s ease,filter .2s ease;
  pointer-events:auto;
}
.brand-sticker:hover{
  transform:translateY(-5px) scale(1.05)!important;
  filter:drop-shadow(0 14px 12px rgba(0,0,0,.48));
}
.bs1{left:1.2%;top:9%;transform:rotate(-8deg)}
.bs2{left:3.5%;top:31%;transform:rotate(5deg)}
.bs3{left:1%;top:54%;transform:rotate(-4deg)}
.bs4{left:8.2%;bottom:6%;transform:rotate(7deg)}
.bs5{left:12%;top:18%;transform:rotate(-9deg)}
.bs6{left:14.5%;top:45%;transform:rotate(6deg)}
.bs7{left:18%;bottom:2%;transform:rotate(-5deg)}
.bs8{right:16%;top:7%;transform:rotate(5deg)}
.bs9{right:7%;top:18%;transform:rotate(-6deg)}
.bs10{right:2%;top:41%;transform:rotate(8deg)}
.bs11{right:14%;bottom:4%;transform:rotate(-3deg)}
.bs12{right:3%;bottom:7%;transform:rotate(4deg)}
.bs13{right:19%;top:43%;transform:rotate(-5deg)}
.bs14{right:10%;top:61%;transform:rotate(7deg)}
.receipt-dried-flower{
  position:absolute;
  right:1.5%;
  top:52%;
  font-size:84px;
  color:#b78b54;
  transform:rotate(15deg);
  opacity:.7;
}
.receipt-heart-doodle{
  position:absolute;
  left:5%;
  bottom:2%;
  color:#d9909d;
  font-size:52px;
  transform:rotate(-11deg);
}
@media(max-height:820px) and (min-width:901px){
  .impact-receipt{padding-top:22px;padding-bottom:32px}
  .impact-receipt-header h2{font-size:31px}
  .thermal-divider{margin:11px 0}
  .brand-name-lines{font-size:9px;gap:4px 16px}
  .receipt-summary,.receipt-total-block,.receipt-meta{font-size:9px}
  .thermal-review p{font-size:8px}
  .thermal-review-head img{width:34px;height:34px}
  .receipt-barcode{height:38px;margin-top:10px}
}
@media(max-width:900px){
  .receipt-proof-view{
    width:96vw;
    height:calc(100svh - 70px);
  }
  .impact-receipt{
    width:86vw;
    padding:26px 24px 38px;
  }
  .brand-sticker{
    width:58px;
    opacity:.9;
  }
  .receipt-reviews{grid-template-columns:1fr}
  .receipt-reviews h3{grid-column:auto}
  .brand-name-lines{grid-template-columns:1fr}
  .bs4,.bs7,.bs11,.bs12,.bs14{display:none}
}

/* v30 — Receipts viewport, legibility, and logo corrections */
.receipt-proof-view{
  width:min(1440px,98vw)!important;
  height:calc(100svh - 66px)!important;
  max-height:none!important;
  overflow:hidden!important;
}
.receipt-proof-scene{
  min-height:0!important;
  height:100%!important;
  padding:10px 0!important;
  overflow:hidden!important;
}
.impact-receipt{
  top:50%!important;
  width:min(860px,64vw)!important;
  height:calc(100% - 24px)!important;
  max-height:none!important;
  padding:18px 44px 24px!important;
  overflow:hidden!important;
  transform:translate(-50%,-50%) rotate(-.25deg)!important;
}
.impact-receipt-header h2{
  margin:3px 0 2px!important;
  font-size:clamp(34px,3.2vw,46px)!important;
  line-height:1!important;
}
.impact-receipt-header small{
  font-size:11px!important;
}
.impact-receipt-header p{
  font-size:15px!important;
}
.thermal-divider{
  margin:9px 0!important;
}
.receipt-meta{
  gap:5px 22px!important;
  font-size:11.5px!important;
}
.receipt-brand-list h3,
.receipt-reviews h3{
  font-size:13.5px!important;
  margin-bottom:5px!important;
}
.receipt-disclaimer{
  margin-bottom:7px!important;
  font-size:9.5px!important;
}
.brand-name-lines{
  gap:4px 20px!important;
  font-size:11.5px!important;
}
.brand-name-lines span{
  padding-bottom:2px!important;
}
.receipt-summary,
.receipt-total-block{
  gap:4px!important;
  font-size:11.5px!important;
}
.receipt-total-block div:first-child{
  font-size:20px!important;
}
.receipt-total-block div:first-child b{
  font-size:30px!important;
}
.receipt-barcode{
  height:38px!important;
  margin:9px auto 5px!important;
}
.receipt-number{
  font-size:8.5px!important;
}
.receipt-reviews{
  margin-top:10px!important;
  gap:10px!important;
}
.thermal-review{
  padding:9px 11px!important;
}
.thermal-review-head img{
  width:38px!important;
  height:38px!important;
  object-fit:contain!important;
  border-radius:50%!important;
}
.thermal-review-head strong{
  font-size:12.5px!important;
}
.thermal-review-head span{
  font-size:12px!important;
}
.thermal-review p{
  margin-top:7px!important;
  font-size:10.5px!important;
  line-height:1.42!important;
}
.brand-sticker{
  width:clamp(78px,7.2vw,116px)!important;
  aspect-ratio:1!important;
  object-fit:contain!important;
  border-radius:50%!important;
  padding:0!important;
  background:transparent!important;
}
.receipt-clip{
  top:12px!important;
}
.receipt-tape{
  top:-2px!important;
}
@media(max-height:760px) and (min-width:901px){
  .impact-receipt{
    width:min(900px,66vw)!important;
    padding:14px 40px 20px!important;
  }
  .impact-receipt-header h2{font-size:32px!important}
  .impact-receipt-header p{font-size:13px!important}
  .thermal-divider{margin:6px 0!important}
  .receipt-meta,.receipt-summary,.receipt-total-block,.brand-name-lines{font-size:10px!important}
  .receipt-disclaimer{font-size:8.5px!important}
  .receipt-brand-list h3,.receipt-reviews h3{font-size:12px!important}
  .receipt-barcode{height:28px!important;margin:6px auto 4px!important}
  .thermal-review{padding:7px 9px!important}
  .thermal-review p{font-size:9px!important;line-height:1.32!important}
  .thermal-review-head img{width:31px!important;height:31px!important}
  .brand-sticker{width:68px!important}
}
@media(max-width:900px){
  .receipt-proof-view{
    height:calc(100svh - 64px)!important;
  }
  .impact-receipt{
    width:88vw!important;
    height:calc(100% - 18px)!important;
    padding:16px 22px 22px!important;
    overflow:auto!important;
  }
  .impact-receipt-header h2{font-size:28px!important}
  .receipt-reviews{grid-template-columns:1fr!important}
}

/* v31 — Exact uploaded logo art + fully visible review area */
.receipt-proof-view{
  width:min(1520px,98vw)!important;
}
.impact-receipt{
  width:min(980px,72vw)!important;
  height:calc(100% - 10px)!important;
  padding:14px 42px 18px!important;
}
.impact-receipt-header h2{
  font-size:clamp(34px,3vw,46px)!important;
}
.thermal-divider{
  margin:7px 0!important;
}
.receipt-meta{
  gap:4px 24px!important;
}
.receipt-brand-list h3,
.receipt-reviews h3{
  margin-bottom:4px!important;
}
.receipt-disclaimer{
  margin-bottom:5px!important;
}
.brand-name-lines{
  gap:3px 22px!important;
}
.receipt-summary,
.receipt-total-block{
  gap:3px!important;
}
.receipt-barcode{
  height:26px!important;
  margin:6px auto 3px!important;
}
.receipt-reviews{
  margin-top:6px!important;
  gap:8px!important;
}
.thermal-review{
  padding:7px 10px!important;
  min-height:0!important;
}
.thermal-review-head img{
  width:34px!important;
  height:34px!important;
}
.thermal-review p{
  margin-top:5px!important;
  font-size:10.5px!important;
  line-height:1.34!important;
}
.brand-sticker{
  width:clamp(82px,7.5vw,122px)!important;
  padding:0!important;
  overflow:hidden!important;
  background:transparent!important;
  border-radius:50%!important;
  object-fit:cover!important;
}
.thermal-review-head img{
  object-fit:cover!important;
  border-radius:50%!important;
}
@media(max-height:760px) and (min-width:901px){
  .impact-receipt{
    width:min(1020px,74vw)!important;
    height:calc(100% - 6px)!important;
    padding:11px 36px 14px!important;
  }
  .impact-receipt-header h2{font-size:30px!important}
  .impact-receipt-header p{font-size:12px!important}
  .thermal-divider{margin:4px 0!important}
  .receipt-meta,.receipt-summary,.receipt-total-block,.brand-name-lines{font-size:9.8px!important}
  .receipt-brand-list h3,.receipt-reviews h3{font-size:11.5px!important}
  .receipt-disclaimer{font-size:8.3px!important;margin-bottom:4px!important}
  .receipt-barcode{height:22px!important;margin:4px auto 2px!important}
  .thermal-review{padding:5px 8px!important}
  .thermal-review p{font-size:8.9px!important;line-height:1.25!important}
  .thermal-review-head img{width:28px!important;height:28px!important}
  .brand-sticker{width:72px!important}
}

/* v32 — Final receipt composition: side logo rails, full logo visibility, full reviews */
.receipt-proof-view{
  width:100vw!important;
  height:calc(100svh - 58px)!important;
  max-height:none!important;
  overflow:hidden!important;
}
.receipt-proof-scene{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  border-radius:0!important;
  overflow:hidden!important;
}
.impact-receipt{
  left:50%!important;
  top:50%!important;
  width:min(900px,58vw)!important;
  height:calc(100% - 18px)!important;
  padding:16px 42px 18px!important;
  transform:translate(-50%,-50%) rotate(-.15deg)!important;
  overflow:hidden!important;
  z-index:3!important;
}
.impact-receipt-header small{font-size:10.5px!important}
.impact-receipt-header h2{
  font-size:clamp(34px,3vw,46px)!important;
  line-height:.98!important;
}
.impact-receipt-header p{font-size:14px!important}
.thermal-divider{margin:6px 0!important}
.receipt-meta{font-size:10.8px!important;gap:4px 24px!important}
.receipt-brand-list h3,.receipt-reviews h3{
  font-size:12.8px!important;
  margin-bottom:4px!important;
}
.receipt-disclaimer{font-size:8.8px!important;margin-bottom:5px!important}
.brand-name-lines{font-size:10.6px!important;gap:3px 22px!important}
.receipt-summary,.receipt-total-block{font-size:10.6px!important;gap:3px!important}
.receipt-total-block div:first-child{font-size:18px!important}
.receipt-total-block div:first-child b{font-size:28px!important}
.receipt-barcode{height:24px!important;margin:5px auto 2px!important}
.receipt-number{font-size:7.8px!important}
.receipt-reviews{
  margin-top:5px!important;
  gap:8px!important;
}
.thermal-review{
  padding:6px 9px!important;
  min-height:0!important;
}
.thermal-review-head{gap:7px!important}
.thermal-review-head img{
  width:31px!important;
  height:31px!important;
  object-fit:contain!important;
  border-radius:50%!important;
}
.thermal-review-head strong{font-size:11.5px!important}
.thermal-review-head span{font-size:10.5px!important}
.thermal-review p{
  margin-top:4px!important;
  font-size:9.4px!important;
  line-height:1.28!important;
}

/* Keep every logo completely outside the receipt text area. */
.brand-sticker-field{
  position:absolute!important;
  inset:0!important;
  z-index:5!important;
  pointer-events:none!important;
}
.brand-sticker{
  width:clamp(82px,6.7vw,116px)!important;
  height:auto!important;
  aspect-ratio:1!important;
  object-fit:contain!important;
  padding:0!important;
  border-radius:50%!important;
  background:transparent!important;
  pointer-events:auto!important;
  filter:drop-shadow(0 9px 8px rgba(0,0,0,.4))!important;
}

/* Left logo rail */
.bs1{left:2.3%!important;top:8%!important;transform:rotate(-4deg)!important}
.bs2{left:3.5%!important;top:31%!important;transform:rotate(3deg)!important}
.bs3{left:2%!important;top:55%!important;transform:rotate(-3deg)!important}
.bs4{left:8.5%!important;bottom:4%!important;transform:rotate(4deg)!important}
.bs5{left:12.7%!important;top:18%!important;transform:rotate(-5deg)!important}
.bs6{left:14.8%!important;top:44%!important;transform:rotate(4deg)!important}
.bs7{left:18.2%!important;bottom:2%!important;transform:rotate(-3deg)!important}

/* Right logo rail */
.bs8{right:15.8%!important;top:7%!important;transform:rotate(3deg)!important}
.bs9{right:6.3%!important;top:18%!important;transform:rotate(-4deg)!important}
.bs10{right:2.2%!important;top:42%!important;transform:rotate(5deg)!important}
.bs11{right:14.8%!important;bottom:3%!important;transform:rotate(-3deg)!important}
.bs12{right:3.1%!important;bottom:6%!important;transform:rotate(3deg)!important}
.bs13{right:18.1%!important;top:43%!important;transform:rotate(-4deg)!important}
.bs14{right:10.3%!important;top:66%!important;transform:rotate(5deg)!important}

.receipt-dried-flower{
  right:1.2%!important;
  top:54%!important;
  z-index:2!important;
}
.receipt-heart-doodle{
  left:5%!important;
  bottom:2%!important;
  z-index:2!important;
}

@media(max-height:800px) and (min-width:901px){
  .impact-receipt{
    width:min(940px,60vw)!important;
    height:calc(100% - 10px)!important;
    padding:12px 38px 14px!important;
  }
  .impact-receipt-header h2{font-size:31px!important}
  .impact-receipt-header p{font-size:12px!important}
  .thermal-divider{margin:4px 0!important}
  .receipt-meta,.brand-name-lines,.receipt-summary,.receipt-total-block{font-size:9.5px!important}
  .receipt-brand-list h3,.receipt-reviews h3{font-size:11.2px!important}
  .receipt-disclaimer{font-size:8px!important}
  .receipt-total-block div:first-child{font-size:16px!important}
  .receipt-total-block div:first-child b{font-size:24px!important}
  .receipt-barcode{height:20px!important;margin:3px auto 1px!important}
  .receipt-number{font-size:7px!important}
  .thermal-review{padding:4px 7px!important}
  .thermal-review-head img{width:25px!important;height:25px!important}
  .thermal-review-head strong{font-size:10px!important}
  .thermal-review-head span{font-size:9px!important}
  .thermal-review p{font-size:8.2px!important;line-height:1.18!important}
  .brand-sticker{width:68px!important}
}
@media(max-width:900px){
  .impact-receipt{
    width:88vw!important;
    overflow:auto!important;
  }
  .brand-sticker{
    width:54px!important;
    opacity:.88!important;
  }
  .bs4,.bs7,.bs11,.bs12,.bs14{display:none!important}
}
