/* NuvoMilo room puzzle (puzzle pages only): band, room + 3x3 frosted tiles, sheet (bottom sheet, card from 700 px), no-JS list, 3D mode. */
.pz{--h1:#12b886;--h2:#1971c2;--w1:#ffb020;--w2:#d6336c}
@keyframes pz-pop{0%{transform:scale(.86)}60%{transform:scale(1.05)}100%{transform:none}}
@keyframes pz-shine{from{transform:translateX(-110%)}to{transform:translateX(110%)}}
.pz-hero{position:relative;isolation:isolate;overflow:hidden;padding:24px 0 36px;color:#fff;border-radius:0 0 clamp(28px,5vw,64px) clamp(28px,5vw,64px)}
.pz-hero:before{content:'';position:absolute;inset:-40% -60%;z-index:-1;background:linear-gradient(110deg,#c2255c,#7048e8 40%,#1971c2 70%,#0c8599);animation:gdrift 18s ease-in-out infinite alternate}
.pz-hero-in{display:grid;gap:18px;align-items:center}
.pz-hero .text-link{color:#fff}
.pz-hero .eyebrow{margin:6px 0 10px}
.pz-hero h1{font-size:clamp(36px,10vw,64px)}
.pz-hero .lead{margin:14px 0 0;color:#fff;opacity:.92;max-width:32em}
.pz-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}
.pz-count{font-size:clamp(20px,5.4vw,26px);font-weight:800;letter-spacing:-.02em;line-height:1.2}
.pz-legend{display:flex;gap:14px;margin:0;padding:0;list-style:none;font-size:14px;font-weight:700}
.pz-legend li:before{content:'';display:inline-block;width:14px;height:14px;margin-right:6px;border-radius:4px;vertical-align:-2px;background:linear-gradient(145deg,var(--h1),var(--h2));box-shadow:0 0 0 2px #fff}
.pz-legend .k-want:before{background:linear-gradient(145deg,var(--w1),var(--w2))}
.pz-stage{position:relative;width:100%;max-width:560px;margin:0 auto;aspect-ratio:1;border-radius:24px;overflow:hidden;background:#15aabf;box-shadow:0 30px 60px -30px rgba(20,10,60,.8)}
.pz-room,.pz-3d{position:absolute;inset:0;width:100%;height:100%}
.pz-room{display:block}
.pz-grid{position:absolute;inset:0;margin:0;padding:8px;list-style:none;display:grid;grid-template:repeat(3,minmax(0,1fr))/repeat(3,minmax(0,1fr));gap:8px}
.pz-grid li{display:grid;min-width:0;min-height:0}
.pz-tile{position:relative;display:grid;align-content:center;justify-items:center;gap:6px;min-width:0;min-height:44px;padding:6px 4px;border:1.5px solid rgba(255,255,255,.75);border-radius:16px;background:rgba(255,255,255,.34);-webkit-backdrop-filter:blur(5px) saturate(1.3);backdrop-filter:blur(5px) saturate(1.3);color:var(--ink);font:inherit;font-size:13px;font-weight:800;line-height:1.15;text-align:center;cursor:pointer;transition:background-color .3s,border-color .3s}
.pz-tile:hover{background:rgba(255,255,255,.5)}
.pz-tile:focus-visible{outline:3px solid #fff;outline-offset:-6px}
.pz-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff}
.pz-ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pz-name{max-width:100%;padding:2px 6px;border-radius:8px;background:rgba(255,255,255,.88);overflow-wrap:anywhere}
.pz-mark{position:absolute;top:6px;right:6px;display:none;place-items:center;width:22px;height:22px;border-radius:50%;background:#fff;font-size:13px;line-height:1}
.pz-tile.is-have{border-color:transparent;background:linear-gradient(145deg,var(--h1),var(--h2));-webkit-backdrop-filter:none;backdrop-filter:none;color:#fff}
.pz-tile.is-want{border-color:transparent;background:linear-gradient(145deg,var(--w1),var(--w2));-webkit-backdrop-filter:none;backdrop-filter:none;color:#fff;outline:2px dashed rgba(255,255,255,.9);outline-offset:-7px}
.pz-tile.is-have .pz-name,.pz-tile.is-want .pz-name{background:none;color:#fff}
.pz-tile.is-have .pz-ico,.pz-tile.is-want .pz-ico{background:rgba(255,255,255,.22)}
.pz-tile.is-have .pz-mark,.pz-tile.is-want .pz-mark{display:grid}
.pz-tile.is-have .pz-mark:before{content:'✓';color:var(--h2)}
.pz-tile.is-want .pz-mark:before{content:'♥';color:var(--w2)}
.pz-tile.pop{animation:pz-pop .3s cubic-bezier(.3,1.4,.5,1)}
/* 9 of 9: tiles clear so the kitchen shows; marks and borders keep have/want apart */
.pz.is-done .pz-tile{background:rgba(255,255,255,.1)}
.pz.is-done .pz-tile.is-have{border:2px solid var(--h1)}
.pz.is-done .pz-tile.is-want{border:2px solid var(--w1)}
.pz.is-done .pz-name{background:rgba(29,27,24,.72)}
.pz.is-done .pz-stage:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.6) 50%,transparent 65%);transform:translateX(110%);animation:pz-shine 1s var(--ease) .2s 1}
/* 3D: the canvas takes the square; the same 9 buttons become chips under it */
.button.pz-3d-btn{min-height:44px;padding:8px 18px;font-size:14px}
.pz.is-3d .pz-stage{aspect-ratio:auto;overflow:visible;background:none;box-shadow:none}
.pz.is-3d .pz-room{display:none}
.pz.is-3d .pz-3d{position:relative;display:block;height:auto;aspect-ratio:1;border-radius:24px;overflow:hidden;background:#15aabf;box-shadow:0 30px 60px -30px rgba(20,10,60,.8);touch-action:pan-y;cursor:grab}
.pz-3d canvas{display:block;width:100%;height:100%}
.pz.is-3d .pz-grid{position:static;padding:10px 0 0;gap:6px;grid-template:auto/repeat(3,minmax(0,1fr))}
.pz.is-3d .pz-tile{gap:2px;padding:5px 4px;border-radius:12px;font-size:12px;color:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
.pz.is-3d .pz-tile:not(.is-have):not(.is-want){background:rgba(255,255,255,.16)}
.pz.is-3d .pz-ico{width:26px;height:26px}
.pz.is-3d .pz-ico svg{width:16px;height:16px}
.pz.is-3d .pz-name{padding:0;background:none;color:#fff;overflow-wrap:normal}
.pz.is-3d .pz-mark{top:-5px;right:-5px;width:18px;height:18px;font-size:11px}
.pz-main{padding-top:28px;padding-bottom:72px}
.pz-done{display:grid;justify-items:start;gap:12px;margin-bottom:24px;padding:24px;border-radius:var(--radius);color:#fff;background:linear-gradient(110deg,#1d1b18,#7048e8 55%,#1d1b18)}
.pz-done h2{font-size:clamp(26px,6vw,38px)}
.pz-done-acts{display:flex;flex-wrap:wrap;gap:10px}
.pz-done .button{color:var(--ink)}
.pz-url{width:100%;min-height:44px;padding:0 14px;border:0;border-radius:12px;font-size:16px;color:var(--ink);background:#fff}
.pz-list h2{font-size:clamp(26px,5vw,36px);margin:4px 0 16px}
.pz-list ol{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.pz-list li[data-piece]{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;padding:16px;border:1px solid var(--line);border-radius:22px;background:#fff}
.pz-list .pz-ico{width:44px;height:44px}
.pz-list h3{font-size:20px;margin-bottom:6px}
.pz-why{font-size:15px}
.pz-look-h{margin-top:10px;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pz-look{margin:6px 0 0;padding-left:20px;font-size:15px}
.pz-look li+li{margin-top:4px}
.button.pz-link,.button.pz-sh-link{width:100%;margin-top:12px;font-size:14px;text-align:center}
.pz-disc{margin-top:8px;font-size:12px;color:var(--muted)}
.pz-sheet{position:fixed;inset:auto 0 0;width:auto;max-width:none;max-height:88vh;max-height:88svh;margin:0;padding:0;overflow-y:auto;overscroll-behavior:contain;border:0;border-radius:24px 24px 0 0;background:#fff;color:var(--ink);box-shadow:0 -20px 50px -20px rgba(20,27,38,.7)}
.pz-sheet::backdrop{background:rgba(20,27,38,.55)}
.pz-sh-in{position:relative;padding:18px max(20px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left))}
.pz-sh-n{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pz-sheet h2{margin:4px 48px 8px 0;font-size:clamp(24px,6vw,30px)}
.pz-x{position:absolute;top:6px;right:6px;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:none;color:var(--ink);font-size:30px;line-height:1}
.pz-amz{margin-top:14px;padding:12px 14px 14px;border-radius:18px;background:#edf2ff}
.pz-amz .button{margin-top:0}
.pz-acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.pz-act{min-height:48px;padding:8px 12px;border:2px solid var(--h2);border-radius:100px;background:#fff;color:var(--ink);font:inherit;font-size:15px;font-weight:800;line-height:1.2}
.pz-act.a-want{border-color:var(--w2)}
.pz-act.a-have[aria-pressed=true]{border-color:transparent;background:linear-gradient(145deg,var(--h1),var(--h2));color:#fff}
.pz-act.a-want[aria-pressed=true]{border-color:transparent;background:linear-gradient(145deg,var(--w1),var(--w2));color:#fff}
.pz-act[aria-pressed=true]:before{content:'✓ ';content:'✓ ' / ''}
.pz-act.a-skip{grid-column:1/-1;border-color:var(--line);color:var(--muted)}
@media(min-width:700px){.pz-list ol{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.pz-sheet{inset:0;width:min(460px,calc(100vw - 48px));height:fit-content;max-height:min(88svh,760px);margin:auto;border-radius:24px}.pz-tile{font-size:15px}.pz-ico{width:48px;height:48px}}
@media(min-width:900px){.pz-hero{padding:36px 0 56px}.pz-hero-in{grid-template-columns:minmax(0,1fr) minmax(0,540px);grid-template-areas:"copy stage" "status stage";gap:20px 48px}.pz-copy{grid-area:copy;align-self:end}.pz-status{grid-area:status;align-self:start}.pz-stage{grid-area:stage}}
@media(prefers-reduced-motion:reduce){*,:before,:after{animation:none!important;transition:none!important}}
