/* The launch list and the holiday pre-order page. */
.howto{background:#fff;border:1px solid var(--warm);border-radius:var(--r);padding:18px 22px;max-width:36em}
.howto strong{display:block;color:var(--navy);margin-bottom:6px}
.howto ol{margin:0 0 8px 1.2em;padding:0}
.howto p{margin:0;color:var(--muted);font-size:15px}
.toggles{display:grid;gap:12px;margin-top:22px;max-width:820px}
.toggle{background:#fff;border:1px solid var(--warm);border-radius:var(--r);overflow:hidden}
.toggle summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;cursor:pointer;list-style:none;font-weight:800;color:var(--navy);font-size:18px}
.toggle summary::-webkit-details-marker{display:none}
.toggle summary::after{content:"+";font-size:24px;line-height:1;color:var(--cerulean-ink);margin-left:8px}
.toggle[open] summary::after{content:"\2212"}
.toggle summary:focus-visible{outline:3px solid var(--magenta);outline-offset:-3px}
.toggle .count{margin-left:auto;font-size:14px;font-weight:600;color:var(--muted)}
.qs{margin:0;padding:4px 20px 18px 42px;display:grid;gap:12px;font-size:16px}
.qs li{padding-left:4px}
.qs li.answered,.todo li.done{color:var(--ui-gray-500)}
.qs .ui-badge,.todo .ui-badge{margin-left:8px;vertical-align:1px}
.qs img{display:block;width:100%;max-width:320px;height:auto;border-radius:8px;margin-top:10px}
.todo{list-style:none;margin:0;padding:0 20px 14px;display:grid}
.todo li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;padding:10px 0;border-top:1px solid var(--warm)}
.todo li:first-child{border-top:0}
.todo .owner{color:var(--muted);font-size:14px}
.pre-list{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:12px;max-width:760px}
.pre-item{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px 18px;background:#fff;border-radius:12px;padding:16px 18px;box-shadow:var(--ui-shadow-xs),inset 0 0 0 1px var(--ui-gray-200);transition:box-shadow .1s linear}
.pre-item.picked{box-shadow:var(--ui-shadow-xs),inset 0 0 0 2px var(--ui-brand-500)}
.pre-item strong{display:block;color:var(--navy);font-weight:700}
.pre-size{font-size:14px;color:var(--ui-gray-600);margin-right:8px}
.pre-item .ui-badge{vertical-align:1px}
.pre-item p{margin:4px 0 0;font-size:14px;color:var(--ui-gray-600)}
.pre-price{font-weight:700;color:var(--navy);font-variant-numeric:tabular-nums}
.pre-group{font:800 22px/1.2 var(--sans);color:var(--navy);margin:36px 0 0}
.pre-promo{display:flex;gap:12px;align-items:flex-start;max-width:760px;margin-top:14px;background:var(--ui-brand-25);color:var(--ui-brand-700);border-radius:12px;padding:14px 16px;font-size:14px;font-weight:600;line-height:20px;box-shadow:var(--ui-shadow-xs),inset 0 0 0 1px var(--ui-brand-300)}
.pre-promo::before{content:"";flex:none;width:20px;height:20px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7h.01M2 5.2v4.475c0 .489 0 .733.055.963.05.204.13.4.24.579.123.201.296.374.642.72l7.669 7.669c1.188 1.188 1.782 1.782 2.467 2.004a3 3 0 0 0 1.854 0c.685-.222 1.28-.816 2.467-2.004l2.212-2.212c1.188-1.188 1.782-1.782 2.004-2.467a3 3 0 0 0 0-1.854c-.222-.685-.816-1.28-2.004-2.467L11.937 2.937c-.346-.346-.519-.519-.72-.642a2 2 0 0 0-.579-.24C10.409 2 10.165 2 9.676 2H5.2c-1.12 0-1.68 0-2.108.218a2 2 0 0 0-.874.874C2 3.52 2 4.08 2 5.2'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7h.01M2 5.2v4.475c0 .489 0 .733.055.963.05.204.13.4.24.579.123.201.296.374.642.72l7.669 7.669c1.188 1.188 1.782 1.782 2.467 2.004a3 3 0 0 0 1.854 0c.685-.222 1.28-.816 2.467-2.004l2.212-2.212c1.188-1.188 1.782-1.782 2.004-2.467a3 3 0 0 0 0-1.854c-.222-.685-.816-1.28-2.004-2.467L11.937 2.937c-.346-.346-.519-.519-.72-.642a2 2 0 0 0-.579-.24C10.409 2 10.165 2 9.676 2H5.2c-1.12 0-1.68 0-2.108.218a2 2 0 0 0-.874.874C2 3.52 2 4.08 2 5.2'/%3E%3C/svg%3E") center/contain no-repeat}
.pre-promo.soon{background:#fff;color:var(--ui-gray-700);box-shadow:var(--ui-shadow-xs),inset 0 0 0 1px var(--ui-gray-300)}
.pre-promo.soon::before{color:var(--ui-brand-500)}
.pre-how{max-width:760px}
.pre-form{display:grid;gap:20px;max-width:560px;margin-top:32px;background:#fff;border-radius:16px;padding:24px;box-shadow:var(--ui-shadow-lg),inset 0 0 0 1px var(--ui-gray-200)}
.pre-when{display:grid;gap:20px}
.pre-form .ui-label{font-size:14px;font-weight:600;color:var(--ui-gray-700)}
.pre-total{display:grid;gap:4px;padding-top:16px;border-top:1px solid var(--ui-gray-200);font-variant-numeric:tabular-nums}
.pre-total p{margin:0;font-weight:700;color:var(--navy);font-size:18px}
.pre-total .line{font-weight:500;color:var(--ui-gray-600);font-size:14px}
.pre-form > .btn{justify-content:center}
.pre-msg{min-height:1.4em;margin:-8px 0 0;color:var(--ui-error);font-weight:600;font-size:14px}
.pre-msg:empty{display:none}
@media (max-width:560px){.pre-item{grid-template-columns:1fr auto}.pre-item .qty{grid-column:1/-1;justify-self:start}.pre-form{padding:18px}}
.page-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:1040px;margin:0 0 24px}
.page-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--warm);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--navy);transition:box-shadow .2s ease,transform .2s ease}
.page-card:hover{box-shadow:0 10px 28px rgba(18,50,86,.12);transform:translateY(-2px)}
.page-card:focus-visible{outline:3px solid var(--magenta);outline-offset:3px}
.page-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.pc-text{display:flex;flex-direction:column;gap:4px;padding:14px 18px 18px}
.pc-tag{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--magenta)}
.pc-text strong{font-size:19px;font-weight:800}
.pc-text strong::after{content:"\00a0\2192";color:var(--cerulean-ink)}
.pc-text span:last-child{font-size:15px;color:var(--muted)}
.sc-art{display:grid;place-items:center;aspect-ratio:16/9;background:var(--navy)}
.sc-art img{width:46%;height:auto;opacity:.9}
@media (max-width:900px){.page-cards{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.page-cards{grid-template-columns:1fr}}
