:root{--bg:#faf6ee;--ink:#182044;--green:#182044;--orange:#182044;--aqua:#c6eee6;--lilac:#ded2f4;--lime:#d0f650;--paper:#fffdf8}
body{background:var(--bg);color:var(--ink)}
.waiting,main{max-width:850px}
.waitbrand,header{position:sticky;top:0;z-index:4;background:var(--bg);border-bottom:1px solid #18204424}
.waitbrand,.brand{font:750 20px/1.2 var(--app-font);letter-spacing:-.5px}
.waitbrand span{transform:none;background:var(--lilac);border:0;border-radius:20px;color:var(--ink)}
.privatebar{background:var(--ink);border:0}
.privatebar button{background:var(--paper);color:var(--ink)}
.waitlayout{gap:32px;padding-top:32px}
.waitlayout h1,h1{font:800 clamp(37px,6vw,60px)/1.05 var(--app-font);letter-spacing:-.055em}
.waitlayout h1 em,h1 em{color:var(--ink);text-decoration:none}
.waitlayout .tag,.waitcards article>span{background:none;border:0;box-shadow:none;transform:none;padding:0;font-weight:750}
.birthdayletter,.waitcards p,.notice,.intro,.muted{color:#48516c}
.birthdayletter{padding:18px;background:var(--aqua);border-radius:20px}
.birthdayletter strong{color:var(--ink);background:none;box-shadow:none}
.signature{color:var(--ink);transform:none;font:italic 21px Georgia}
.waitart{height:310px;background:radial-gradient(ellipse at 75% 30%,var(--lilac) 0 45%,transparent 46%),var(--paper);border:0;border-radius:26px;box-shadow:none;transform:none;margin-top:40px;overflow:hidden}
.waitart:before{z-index:0;left:15%;right:15%;bottom:33px;height:69px;border:0;border-radius:9px;background:linear-gradient(145deg,#ddfaf3,#8dc8c0);transform:none;box-shadow:0 14px 25px #18204418}
.waitgift{z-index:1;width:145px;height:132px;margin-top:-25px;background:linear-gradient(120deg,#ece2fc,#a896cf);border:0;box-shadow:8px 12px 18px #18204433;transform:rotate(-5deg)}
.waitgift:before{left:59px;width:26px;border:0;background:linear-gradient(90deg,#b4d82e,var(--lime))}
.waitlid{background:#c8b6ec;border:0;top:-12px;height:31px}
.waitlid:after{inset:0 72px;background:var(--lime)}
.waitgift span{font:800 25px var(--app-font);color:var(--ink);border:0;padding:10px}
.waitsun{color:var(--lime);text-shadow:none;font-size:56px}
.waitorb,.popsticker,.pop-mini{display:none}
.waitcaption{z-index:2;bottom:51px;transform:none;background:var(--paper);border:0;color:var(--ink)}
.birthdayteaser,.waitcards article,.extras,.simbar,.experiment,.demoend{background:var(--aqua);border:0;border-radius:20px;box-shadow:none;transform:none}
.waitcards article:nth-child(2){background:var(--lilac);transform:none}
.waitcards article:nth-child(3){background:var(--aqua)}
.birthdayteaser h2,.waitcards h2,.sectionhead h2,dialog h2,.giftstage h2{font:800 clamp(24px,4vw,33px)/1.15 var(--app-font);letter-spacing:-.035em}
.solid,.birthdayteaser .solid,.pill,.choice,.favoriteitem{background:var(--paper);color:var(--ink);border:1px solid #18204422;border-radius:13px;box-shadow:none}
.solid,.birthdayteaser .solid{background:var(--lime);border:0;border-radius:999px}
.solid:hover,.pill:hover,.choice:hover:not(:disabled){box-shadow:0 4px 12px #18204418}
.countdown{padding:12px;background:var(--aqua);border-radius:18px}
.countdown>div,.countdown>div:nth-child(1),.countdown>div:nth-child(3){background:var(--paper);border:0;box-shadow:none;transform:none;flex:1;min-width:0;padding:10px 3px}
.countdown strong{font:800 clamp(24px,5vw,36px) var(--app-font);letter-spacing:-.04em}
.waitfooter{border-color:#18204424}
.scene{background:var(--aqua)!important;border:0;box-shadow:none;height:220px}
.months button{background:var(--paper);color:var(--ink);border:0;border-radius:999px}
.months button.active{background:var(--lilac);box-shadow:none;transform:none}
.grid{background:var(--aqua);padding:10px;border-radius:20px;gap:5px}
.day,.day:disabled,.day.today{border:0;border-radius:11px;box-shadow:none;text-align:center;min-height:58px;padding:5px 1px}
.day,.day.opened{background:var(--paper)}
.day:disabled{background:var(--lilac);opacity:1}
.day.today{background:var(--lime)}
.day strong{font:750 18px var(--app-font)}
.day .icon{font-size:13px;margin:0}
.day small{display:none}
dialog{border:0;background:var(--paper);box-shadow:0 18px 80px #18204433;color:var(--ink)}
.close,.source,.textbutton{color:var(--ink)}
.gift{background:linear-gradient(120deg,#e9dcfb,#a896cf);border:0;box-shadow:8px 12px 18px #18204433}
.gift:before{background:var(--lime)}
.gift:after{border:0;background:linear-gradient(90deg,#c9b5ee 0 44%,var(--lime) 44% 57%,#c9b5ee 57%)}
.gift span{border:0;color:var(--ink)}
@media(max-width:700px){.waitlayout{grid-template-columns:1fr;gap:20px}.waitart{position:relative;top:auto;width:100%;margin:0;height:250px;grid-row:2}.waitgift{margin-top:-30px}.waitlayout h1{font-size:clamp(36px,10vw,49px);letter-spacing:-.05em}.waitbrand{font-size:17px;padding:10px 0}.waitbrand span{white-space:nowrap}.scene{height:170px}.scene canvas{height:160px}.grid{padding:7px;gap:4px}.day,.day:disabled,.day.today{min-height:44px}.birthdayteaser{margin:20px 0}.birthdayteaser .solid{width:100%}}

/* Smartphone layout from the selected B mockup. */
:root { --lime:#cbf800; --lilac:#e2cdfa; --aqua:#c9f3e9; }
.waiting, main { max-width:650px; }
.waitlayout { display:block; }
.waitlayout h1 { text-align:center; margin:18px 0; }
.waitlayout > div > .tag { display:block; text-align:center; margin-bottom:12px; }
.birthdayletter { max-width:none; }
.signature { display:block; text-align:right; }
.app-gift {
  display:grid;
  place-items:center;
  min-height:190px;
  padding:32px 0 10px;
}
.app-gift .waitgift { width:154px; height:130px; margin:0; animation:none; }
.app-gift .waitlid { top:-4px; }
.app-gift .waitgift::after {
  content:"";
  position:absolute;
  top:-36px;
  left:30px;
  width:94px;
  height:36px;
  background:radial-gradient(ellipse at 25% 55%, #91ae00 0 17%, transparent 19%),radial-gradient(ellipse at 75% 55%, #91ae00 0 17%, transparent 19%),linear-gradient(145deg,#eaff6b,#9cc400);
  border-radius:70% 70% 38% 38%;
}
.app-gift .waitgift span { position:absolute; right:2px; bottom:19px; transform:rotate(-12deg); }
.birthdayteaser { padding:0; background:none; max-width:none; margin:0 0 18px; }
.birthdayteaser > :not(button) { display:none; }
.birthdayteaser .solid { width:100%; }
.waitcards { grid-template-columns:1fr; }
#museumapp .hero { display:none; }
.months { background:#e5fa9b; padding:7px; border-radius:20px; margin-top:14px; }
.today-card { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px; background:var(--aqua); border-radius:18px; margin-top:12px; }
.app-tabs { position:sticky; bottom:0; z-index:3; display:flex; justify-content:space-around; gap:4px; background:var(--bg); border-top:1px solid #18204424; padding:8px 0; }
.app-tabs a,.app-tabs button { font:700 13px var(--app-font); color:var(--ink); text-decoration:none; border:0; border-radius:12px; background:transparent; padding:10px 7px; }
.app-tabs a:first-child { background:var(--lilac); }
@media(max-width:420px) { .today-card { flex-wrap:wrap; } .today-card button { width:100%; } }

/* Compact composition of the selected mobile reference. */
.waiting, #museumapp main { max-width:520px; }
.waitlayout { padding-top:22px; }
.waitlayout h1 { font-size:clamp(34px,9vw,51px); margin:12px 0 23px; }
.birthdayletter { font-style:italic; font-weight:600; padding:17px 21px 10px; box-shadow:0 4px 9px #18204415; }
.birthdayletter p { margin:0; }
.birthdayletter .signature { margin-top:2px; }
.gift-b { display:block; width:min(100%,320px); height:auto; margin:0 auto; }
.opening { background:var(--aqua); border-radius:19px 19px 0 0; margin-top:0; padding:12px 8px 0; text-align:center; }
.countdown { margin:0; border-radius:0 0 19px 19px; }
.today-card { flex-wrap:nowrap; justify-content:flex-start; }
.today-card img { flex:0 0 auto; width:80px; height:auto; }
.today-card div { flex:1; border-left:1px solid #18204428; padding-left:10px; }
.today-card strong { display:block; margin-bottom:7px; }
.today-card button { width:100%; padding:9px; }
.day { box-shadow:0 2px 3px #18204414; }
.day:disabled { background:linear-gradient(#ead9ff,#dcc5f7); }

/* Display the original illustrations through a viewport onto the mockup. */
.original-gift {
  background-image:url("reference-b.png");
  background-repeat:no-repeat;
  background-size:554.375% auto;
  background-position:65.34% 61.58%;
  aspect-ratio:320 / 205;
}
.gift-b.original-gift { width:min(100%,320px); }
.original-gift.mini-gift {
  flex:0 0 80px;
  aspect-ratio:105 / 112;
  background-size:1689.524% auto;
  background-position:81.84% 76.13%;
}
:root { --bg:#faf3eb; }

/* Shared typography and touch targets for the phone layout. */
body, button, input, select { font-family:var(--app-font); }
.waitlayout h1 { font-size:clamp(32px,8vw,48px); letter-spacing:-.045em; }
.waitlayout h1 em { font-style:normal; }
.birthdayletter { font-style:normal; font-weight:450; line-height:1.55; }
.birthdayletter p + p { margin-top:12px; }
.birthdayletter .signature { font:700 16px/1.4 var(--app-font); }
.gift-b { width:min(82%,280px); }
.app-tabs { padding-bottom:max(8px,env(safe-area-inset-bottom)); }
.app-tabs a,.app-tabs button { min-height:44px; display:inline-flex; align-items:center; gap:4px; }
.grid { grid-template-columns:repeat(7,minmax(0,1fr)); }
.day:focus-visible,.app-tabs :focus-visible,.solid:focus-visible { outline:3px solid var(--ink); outline-offset:2px; }
.today-card img { object-fit:contain; }

.birthday-package { position:relative; width:min(100%,320px); margin:0 auto; }
.birthday-tag {
  position:absolute; right:7%; bottom:23%; transform:rotate(12deg);
  background:#fff5d5; color:var(--ink); border:2px solid var(--ink);
  border-radius:9px; padding:10px 13px; font-weight:850;
  box-shadow:3px 4px 0 var(--ink);
}
.birthday-tag::before {
  content:""; position:absolute; width:24px; height:18px;
  left:7px; bottom:100%; border:2px solid var(--ink);
  border-bottom:0; border-radius:50% 50% 0 0; transform:rotate(-24deg);
}

.birthday-package .gift-b { width:100%; }
.gift-hangtag { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }

.catalog-wordmark {
  display: inline-block;
  font-size: clamp(1.15rem, 5vw, 1.55rem);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.035em;
}
.catalog-wordmark small {
  display: block;
  margin-top: .25em;
  font-size: .58em;
  font-weight: 650;
  letter-spacing: .015em;
  text-transform: none;
}

.catalog-lockup {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
}
.catalog-lockup .catalog-icon {
  flex: none;
  width: 2.4rem;
  height: 2.4rem;
}
.waitbrand > .catalog-lockup {
  padding: 0;
  background: none;
  color: inherit;
}

.mystery-object { display:block; max-width:100%; height:auto; margin:1rem auto; }

.idea-card { display: grid; gap: .25rem; text-align: left; }
.idea-card span { font-weight: 500; }
.idea-card.idea-selected { background: #d2fa36; color: #191d43; }

.simbar[hidden] { display: none; }
