/* NexBake product page (staging 2026-11-04): graphite, a little robotic, orange accent. No pixel effects. */
.nbp { --mono:'Michroma', 'Familjen Grotesk', sans-serif; --tick:#3a3a3a; --dim:#8f8b88; --ui:#1d1d1d; }
.nbp .mono { font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; }
.nbp .acc-c { color:var(--acc); }
.nbp button:focus-visible, .nbp summary:focus-visible, .nbp a:focus-visible { outline:2px solid var(--acc); outline-offset:3px; }
.nbp .dim { color:var(--dim); }
.nbp h2 span, .nbp h3 span, .nbp .acc-t { color:var(--acc); }
.nbp .tag { color:var(--dim); margin:0 0 18px; }
.nbp code { font-family:ui-monospace, Consolas, monospace; font-size:.92em; color:var(--bone); background:var(--p2); padding:1px 6px; border-radius:6px; }

/* corner ticks: the one "robotic" mark of the page, on media frames */
.nbp .frame, .nbp .scan-stage, .nbp .ba, .nbp .crop, .nbp .udim { position:relative; }
.nbp .frame::before, .nbp .frame::after, .nbp .scan-stage::before, .nbp .scan-stage::after, .nbp .ba::before, .nbp .ba::after {
  content:''; position:absolute; width:14px; height:14px; border:0 solid var(--tick); pointer-events:none; z-index:3; }
.nbp .frame::before, .nbp .scan-stage::before, .nbp .ba::before { left:-7px; top:-7px; border-left-width:1px; border-top-width:1px; }
.nbp .frame::after, .nbp .scan-stage::after, .nbp .ba::after { right:-7px; bottom:-7px; border-right-width:1px; border-bottom-width:1px; }

/* hero */
.nb-hero { padding:64px 0 24px; position:relative; overflow:hidden; }
.nb-hero::before { content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(var(--line) 1px, transparent 1px) 0 0 / 100% 64px, linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0 / 64px 100%;
  opacity:.28; -webkit-mask-image:radial-gradient(70% 80% at 70% 40%, #000, transparent 75%); mask-image:radial-gradient(70% 80% at 70% 40%, #000, transparent 75%); }
.nb-hero .wrap { position:relative; display:grid; grid-template-columns:minmax(0, .82fr) minmax(0, 1.18fr); gap:40px; align-items:center; }
.nb-hero .kicker { font-family:var(--mono); font-size:12px; letter-spacing:.32em; text-transform:uppercase; color:var(--dust); margin:0 0 18px; }
.nb-hero h1 { font-size:clamp(42px, 5.2vw, 72px); line-height:1.0; letter-spacing:-.03em; }
.nb-hero h1 span { color:var(--acc); }
.nb-hero .lead { margin:22px 0 32px; }
.nb-hero .cta { display:flex; gap:12px; flex-wrap:wrap; }

.scan { margin:0; }
.scan-stage { aspect-ratio:16 / 10; background:radial-gradient(60% 60% at 50% 45%, #161616, #0b0b0b 80%); border-radius:16px; overflow:visible; }
.scan-stage > img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; border-radius:16px; clip-path:inset(0 100% 0 0); }
.scan-stage > img.on { clip-path:inset(0 0 0 0); }
.scan-stage > img.in { transition:clip-path 1.1s cubic-bezier(.65,.05,.25,1); clip-path:inset(0 0 0 0); z-index:2; }
.scan-line { position:absolute; top:4%; bottom:4%; left:0; width:2px; background:var(--acc); opacity:0; z-index:4; pointer-events:none;
  box-shadow:0 0 0 1px color-mix(in srgb, var(--acc) 25%, transparent); }
.scan-line.go { animation:scanGo 1.1s cubic-bezier(.65,.05,.25,1) both; }
@keyframes scanGo { 0% { left:0; opacity:1; } 92% { opacity:1; } 100% { left:100%; opacity:0; } }
.scan-read { display:flex; align-items:baseline; gap:14px; margin:18px 0 12px; }
.scan-read b { font-size:18px; font-weight:600; }
.scan-read .mono:first-child { color:var(--acc); }
.scan-read .dim { margin-left:auto; }
.scan-chips { display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; -webkit-mask-image:linear-gradient(90deg, #000 90%, transparent); mask-image:linear-gradient(90deg, #000 90%, transparent); }
.scan-chips::-webkit-scrollbar { display:none; }
.scan-chips button { flex:none; font:500 13px/1 'Familjen Grotesk', sans-serif; color:var(--dust); background:transparent; border:1px solid var(--line-2); border-radius:10px; padding:7px 11px; cursor:pointer; transition:color .2s, border-color .2s, background .2s; }
.scan-chips button:hover { color:var(--bone); border-color:#4a4a4a; }
.scan-chips button[aria-selected=true] { color:var(--on-acc); background:var(--acc); border-color:var(--acc); }

/* sections */
.nb-sec { padding:80px 0; }
.sec-top { max-width:760px; margin-bottom:48px; }
.sec-top h2 { font-size:clamp(34px, 4.2vw, 56px); line-height:1.02; letter-spacing:-.03em; }
.sec-top p:not(.tag) { color:var(--dust); font-size:18px; margin:18px 0 0; max-width:560px; }

/* before / after */
.ba { aspect-ratio:16 / 10; border-radius:16px; background:#0c0c0c; user-select:none; touch-action:pan-y; --p:50%; }
.ba img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:16px; }
.ba-top { position:absolute; inset:0; clip-path:inset(0 calc(100% - var(--p)) 0 0); }
.ba-range { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:ew-resize; margin:0; z-index:5; }
.ba-handle { position:absolute; top:0; bottom:0; left:var(--p); width:2px; margin-left:-1px; background:var(--bone); z-index:4; pointer-events:none; }
.ba-handle .i { position:absolute; top:50%; left:50%; width:40px; height:40px; padding:10px; margin:-20px 0 0 -20px; border-radius:10px; background:var(--bone); color:#0b0b0c; }
.ba-range:focus-visible + .ba-handle .i { outline:2px solid var(--acc); outline-offset:3px; }
.ba-tag { position:absolute; top:18px; z-index:4; color:var(--bone); background:rgba(10,10,10,.6); backdrop-filter:blur(6px); padding:8px 12px; border-radius:10px; }
.ba-tag.l { left:18px; } .ba-tag.r { right:18px; }

/* maps grid: bakes in on scroll */
.mapgrid { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:14px; }
.mapgrid figure { margin:0; }
.mapgrid .m { position:relative; aspect-ratio:1; border-radius:12px; overflow:hidden; background:#0f0f0f; border:1px solid var(--line); }
.mapgrid .m img { width:100%; height:100%; object-fit:cover; opacity:.06; filter:grayscale(1); transition:opacity .5s, filter .5s; }
.mapgrid .m::after { content:''; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--acc); }
.mapgrid figure.baking .m::after { width:100%; transition:width var(--t, .3s) linear; }
.mapgrid figure.baked .m img { opacity:1; filter:none; }
.mapgrid figure.baked .m::after { opacity:0; transition:opacity .3s; }
.mapgrid figcaption { display:flex; flex-direction:column; gap:2px; padding:12px 2px 0; }
.mapgrid figcaption b { font-size:15px; font-weight:600; }
.mapgrid figcaption span { color:var(--dim); font-size:13px; line-height:1.35; }

/* engine: benchmark bars + accuracy */
.speed { display:grid; grid-template-columns:minmax(0, 1.5fr) minmax(0, 1fr); gap:24px; align-items:stretch; }
.bench, .acc-list { border:1px solid var(--line); border-radius:16px; background:var(--panel); padding:28px; }
.bench-head { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; color:var(--dim); margin-bottom:22px; font-size:13px; }
.bench-head .key { display:flex; align-items:center; gap:8px; }
.bench-head .key i { display:inline-block; width:10px; height:10px; border-radius:2px; margin-left:8px; }
.bench-head i.nb { background:var(--acc); } .bench-head i.sp { background:#4a4a4a; }
.bench .row { display:grid; grid-template-columns:150px minmax(0, 1fr); gap:18px; align-items:center; padding:14px 0; border-top:1px solid var(--line); }
.bench .lbl { font-weight:600; font-size:15px; }
.bench .lbl small { display:block; color:var(--dim); font-weight:400; font-size:13px; }
.bench .bars { display:grid; gap:6px; }
.bench .bars i { --w:calc(var(--v) / 200 * 82%); display:flex; align-items:center; gap:10px; height:22px; font-style:normal; }
.bench .bars i::before { content:''; flex:none; height:100%; width:0; border-radius:4px; transition:width 1.4s cubic-bezier(.2,.7,.1,1); }
.bench .bars i.nb::before { background:var(--acc); } .bench .bars i.sp::before { background:#4a4a4a; }
.bench.go .bars i::before { width:var(--w); }
.bench .bars em { font:600 13px/1 'Familjen Grotesk', sans-serif; font-style:normal; white-space:nowrap; color:var(--dust); font-variant-numeric:tabular-nums; }
.bench .bars i.nb em { color:var(--bone); }
.bench .foot, .acc-list .foot { margin:16px 0 0; color:var(--dim); font-size:13px; }
.acc-list { display:flex; flex-direction:column; justify-content:space-between; gap:18px; }
.acc-list div { display:flex; flex-direction:column; gap:4px; border-bottom:1px solid var(--line); padding-bottom:18px; }
.acc-list b { font-size:44px; line-height:1; font-weight:600; letter-spacing:-.03em; color:var(--bone); font-variant-numeric:tabular-nums; }
.acc-list span { color:var(--dust); font-size:15px; }
.acc-list .foot { margin:0; }

/* screenshots: the workspace wide, panels 1:1 on Blender's UI grey */
.frame { margin:0; border-radius:14px; background:#0d0d0d; border:1px solid var(--line); }
.frame img { width:100%; height:auto; border-radius:13px; }
.frame.wide { margin-bottom:24px; }
.frame.film video { width:100%; height:auto; aspect-ratio:1920 / 1000; display:block; border-radius:13px 13px 0 0; background:#0d0d0d; }
.frame.film figcaption { padding:11px 16px 12px; font-size:13px; color:var(--dust); border-top:1px solid var(--line); }
.frame.film figcaption span { color:var(--dim); }
.crop { margin:0; border-radius:14px; background:var(--ui); border:1px solid var(--line); display:grid; place-items:center; padding:20px; }
.crop img { max-width:100%; height:auto; border-radius:6px; }
.crop.tall img { max-height:640px; width:auto; }
.cards { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:24px; }
.card2 { display:flex; flex-direction:column; border:1px solid var(--line); border-radius:16px; background:var(--panel); padding:28px; }
.card2 h3 { font-size:clamp(24px, 2.4vw, 32px); line-height:1.06; letter-spacing:-.025em; }
.card2 > p { color:var(--dust); margin:12px 0 22px; max-width:460px; }
.card2 .crop { flex:1; padding:16px; }
.crop.views img { grid-area:1 / 1; opacity:0; transition:opacity .5s; }
.crop.views img.on { opacity:1; }
.crop.views .seg { position:absolute; top:12px; left:50%; transform:translateX(-50%); z-index:4; background:rgba(16,16,16,.88); }
.seg { display:inline-flex; gap:2px; padding:3px; border-radius:10px; background:var(--p2); border:1px solid var(--line); }
.seg button { font:600 13px/1 'Familjen Grotesk', sans-serif; color:var(--dust); background:none; border:0; padding:9px 16px; border-radius:10px; cursor:pointer; min-height:36px; }
.seg button.on { background:var(--bone); color:#0b0b0c; }

/* feature rows */
.feats .wrap { display:flex; flex-direction:column; gap:96px; }
.ft { display:grid; grid-template-columns:minmax(0, .8fr) minmax(0, 1.2fr); gap:56px; align-items:center; }
.ft.flip { grid-template-columns:minmax(0, 1.2fr) minmax(0, .8fr); }
.ft.flip > :first-child { order:2; }
.ft h3 { font-size:clamp(30px, 3.4vw, 46px); line-height:1.04; letter-spacing:-.03em; font-weight:650; }
.ft h3 span, .card2 h3 span { display:block; }
.nbp .ft h3 span, .nbp .card2 h3 span, .nbp .plain h2 span { color:var(--bone); }
.nbp .buy-sub { color:var(--dust); font-size:19px; margin:20px 0 0; }
.ft-copy p { color:var(--dust); font-size:17px; margin:20px 0 0; max-width:460px; }

/* sources */
.src { border:1px solid var(--line); border-radius:14px; background:var(--panel); padding:12px 28px 24px; }
.src-row { display:flex; justify-content:space-between; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); }
.src-row b { font-weight:600; font-size:17px; }
.src-row span { color:var(--acc); font-weight:500; text-align:right; }
.src-note { margin:18px 0 0; color:var(--dim); font-size:14px; }

/* udim demo */
.udim { border:1px solid var(--line); border-radius:14px; background:var(--panel); padding:24px; }
.udim .tiles { display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; }
.udim .tiles span { position:relative; isolation:isolate; aspect-ratio:1; display:grid; place-items:end start; padding:8px; border:1px solid var(--line-2); border-radius:6px; overflow:hidden;
  font:600 12px/1 'Familjen Grotesk', sans-serif; color:var(--dim); background:#121212; }
.udim .tiles span::before { content:''; position:absolute; inset:0; z-index:-1; background:var(--im) center / cover; clip-path:inset(100% 0 0 0); transition:clip-path .7s cubic-bezier(.2,.7,.1,1); }
.udim .tiles span.done::before { clip-path:inset(0 0 0 0); }
.udim .tiles span.done { color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.8); }
.udim .tiles span.skip { border-style:dashed; }
.udim .files { list-style:none; padding:0; margin:18px 0 0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px 16px; color:var(--dust); font:13px/1.4 ui-monospace, Consolas, monospace; }
.udim .files li { opacity:0; transform:translateY(4px); transition:opacity .4s, transform .4s; }
.udim .files li.on { opacity:1; transform:none; }

/* more */
.more { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.more li { background:var(--ink); padding:26px 24px; display:flex; flex-direction:column; gap:4px; }
.more .i { width:22px; height:22px; color:var(--acc); margin-bottom:14px; }
.more b { font-weight:600; font-size:16px; }
.more span { color:var(--dim); font-size:14px; line-height:1.4; }

.nbp #buy h2 { font-size:clamp(34px, 4.2vw, 56px); line-height:1.02; letter-spacing:-.03em; }
.nbp .card-line { color:var(--dust); margin:18px 0 28px; }

/* reveal */
.reveal { opacity:0; transform:translateY(24px); transition:opacity .8s cubic-bezier(.2,.7,.1,1), transform .8s cubic-bezier(.2,.7,.1,1); }
.reveal.seen { opacity:1; transform:none; }
.no-js .reveal { opacity:1; transform:none; }

@media (max-width: 1199px) {
  .more { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .nb-hero .wrap, .ft, .ft.flip, .speed, .cards { grid-template-columns:minmax(0, 1fr); }
  .ft.flip > :first-child { order:0; }
  .feats .wrap { gap:72px; }
  .nb-sec { padding:64px 0; }
}
@media (max-width: 699px) {
  .mapgrid { grid-template-columns:repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .card2 { padding:20px 12px 12px; }
  .card2 > h3, .card2 > p { padding:0 8px; }
  .card2 .crop, .ft .crop { padding:0; border:0; background:none; }
  .card2 .crop img, .ft .crop img { border-radius:8px; }
  .bench .row { grid-template-columns:minmax(0, 1fr); gap:10px; }
  .bench .bars i { --w:calc(var(--v) / 200 * 76%); }
  .more li { padding:20px 16px; }
  .scan-read .dim { display:none; }
  .card2, .bench, .acc-list, .src { padding:20px; }
  .crop { padding:12px; }
  .acc-list b { font-size:36px; }
  .udim .files { grid-template-columns:minmax(0, 1fr); }
}
@media (max-width: 479px) {
  .mapgrid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .src-row { flex-direction:column; gap:4px; }
  .src-row span { text-align:left; }
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity:1; transform:none; transition:none; }
  .scan-stage > img.in, .bench .bars i::before, .mapgrid .m img, .udim .tiles span::before { transition:none; }
  .scan-line.go { animation:none; }
}

/* before / after without a handle: the line wipes on its own */
.ba.auto .ba-handle { background:var(--acc); width:2px; }

/* bake guide: one idea per step, a real bake each, everything moves on its own */
.gd .sec-top { margin-bottom:28px; }
.gd-nav { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 56px; }
.gd-nav a { display:inline-flex; align-items:center; gap:8px; font:500 13px/1 'Familjen Grotesk', sans-serif; color:var(--dust); text-decoration:none;
  border:1px solid var(--line-2); border-radius:10px; padding:8px 12px 8px 8px; transition:color .2s, border-color .2s; }
.gd-nav a i { font:400 10px/1 var(--mono); font-style:normal; letter-spacing:.08em; color:var(--dim); background:var(--p2); border-radius:10px; padding:5px 6px; }
.gd-nav a:hover { color:var(--bone); border-color:#4a4a4a; }
.gd-nav a:hover i { color:var(--acc); }
.gd-step { display:grid; grid-template-columns:minmax(0, .62fr) minmax(0, 1.38fr); gap:40px; align-items:start; padding:44px 0; border-top:1px solid var(--line); scroll-margin-top:90px; }
.gd-copy { padding-top:6px; }
.gd-copy h3 { font-size:clamp(26px, 2.6vw, 36px); line-height:1.04; letter-spacing:-.025em; margin:10px 0 14px; }
.gd-copy p { color:var(--dust); margin:0 0 12px; max-width:440px; }
.gd-copy p b { color:var(--bone); font-weight:600; }
.gd-n { color:var(--acc); }
.gd-note { font-size:13px; color:var(--dim) !important; }

/* tiles: the picked one gets the orange rule and full brightness */
.gd-tiles { display:grid; gap:10px; }
.gd-tiles.t2 { grid-template-columns:repeat(2, minmax(0, 1fr)); }
.gd-tiles.t3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
.gd-tiles.t4 { grid-template-columns:repeat(4, minmax(0, 1fr)); }
.gd-tiles figure { margin:0; }
.gd-im { position:relative; aspect-ratio:1; border-radius:12px; overflow:hidden; background:#0e0e0f; border:1px solid var(--line); }
.gd-tiles.t4:not(.px) .gd-im { aspect-ratio:1 / 1.15; }
.gd-im img { width:100%; height:100%; object-fit:cover; display:block; opacity:.62; transform:scale(1.0); transition:opacity .6s, transform 2.4s cubic-bezier(.2,.7,.1,1); }
.gd-tiles.px .gd-im img { image-rendering:pixelated; }
.gd-im::after { content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--acc); transform:scaleX(0); transform-origin:left; transition:transform .6s cubic-bezier(.65,.05,.25,1); }
.gd-tiles figure.pick .gd-im img { opacity:1; transform:scale(1.04); }
.gd-tiles figure.pick .gd-im::after { transform:scaleX(1); }
.gd-tiles figcaption { display:flex; justify-content:space-between; gap:8px; align-items:baseline; padding:10px 2px 0; }
.gd-tiles figcaption b { font-size:15px; font-weight:600; transition:color .4s; }
.gd-tiles figcaption span { color:var(--dim); font-size:12px; font-variant-numeric:tabular-nums; text-align:right; }
.gd-tiles figure.pick figcaption b { color:var(--acc); }

/* A/B: the second image wipes in over the first, with an orange line, and back */
.gd-media { display:grid; gap:12px; }
.gd-swap { position:relative; aspect-ratio:16 / 9; border-radius:14px; overflow:hidden; background:#0e0e0f; border:1px solid var(--line); }
.gd-swap img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.gd-swap img.b { clip-path:inset(0 0 0 100%); transition:clip-path 1.2s cubic-bezier(.65,.05,.25,1); }
.gd-swap.on img.b { clip-path:inset(0 0 0 0); }
.gd-wipe { position:absolute; top:0; bottom:0; left:100%; width:2px; background:var(--acc); transition:left 1.2s cubic-bezier(.65,.05,.25,1), opacity .3s; opacity:0; }
.gd-swap.on .gd-wipe { left:0; }
.gd-swap.mv .gd-wipe { opacity:1; }
.gd-lab { position:absolute; top:14px; display:flex; flex-direction:column; gap:2px; padding:8px 12px; border-radius:10px; background:rgba(10,10,10,.62); backdrop-filter:blur(6px); transition:opacity .5s, color .5s; }
.gd-lab b { font-size:14px; font-weight:600; }
.gd-lab small { color:var(--dust); font-size:12px; font-variant-numeric:tabular-nums; }
.gd-lab.l { left:14px; } .gd-lab.r { right:14px; opacity:.35; }
.gd-swap.on .gd-lab.l { opacity:.35; }
.gd-swap.on .gd-lab.r { opacity:1; }
.gd-swap.on .gd-lab.r b { color:var(--acc); }
.gd-vid { aspect-ratio:16 / 9; border-radius:14px; overflow:hidden; background:#0e0e0f; border:1px solid var(--line); }
.gd-vid video { width:100%; height:100%; object-fit:cover; display:block; }

.gd-tab { width:100%; border-collapse:collapse; margin:14px 0 10px; font-variant-numeric:tabular-nums; font-size:14px; }
.gd-tab th, .gd-tab td { text-align:left; padding:9px 0; border-bottom:1px solid var(--line); }
.gd-tab th { color:var(--dim); font-weight:500; font-size:12px; }
.gd-tab td:nth-child(2) { color:var(--dust); }
.gd-tab td:nth-child(3) { color:var(--acc); font-weight:600; }

@media (max-width:960px) {
  .gd-step { grid-template-columns:1fr; gap:22px; padding:36px 0; }
  .gd-tiles.t4 { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:560px) {
  .gd-tiles.t3 { grid-template-columns:repeat(3, minmax(0, 1fr)); gap:6px; }
  .gd-tiles figcaption { flex-direction:column; gap:2px; }
  .gd-tiles figcaption span { text-align:left; }
}
@media (prefers-reduced-motion: reduce) {
  .gd-im img, .gd-swap img.b, .gd-wipe { transition:none; }
  .gd-im img { opacity:1; }
}

/* ---- hero v2 (staging 2026-11-07): the film's reveal on a loop behind the words, like marmoset.co / unwrella.com ---- */
.nb-hero2 { position:relative; min-height:clamp(560px, 86vh, 900px); display:flex; align-items:center; overflow:hidden; background:#0a0a0a; }
.nb-hero2 .bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:62% 50%; }
/* owner 2026-11-11: the MP7, cup and boot renders fill their 16:9 frame, so cover cut them and made them huge on a wide screen;
   on a computer they show whole, at the size of the film loop's model (lighten keeps their black from showing as a box; only the sides fade. They sit above the hero's bottom shade, which darkened the cup's foot,
   and nothing fades top or bottom: owner 2026-11-11, the tops and feet looked dark) */
@media (min-width: 861px) { .nb-hero2 .bg[data-fit=render] { inset:auto; top:50%; right:12%; left:auto; width:auto; height:84%; aspect-ratio:16 / 9; transform:translateY(-50%); object-fit:cover; z-index:1; mix-blend-mode:lighten; -webkit-mask-image:linear-gradient(90deg, transparent, #000 14%, #000 94%, transparent); mask-image:linear-gradient(90deg, transparent, #000 14%, #000 94%, transparent); } }
.nb-hero2::after { content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg, rgba(10,10,10,.92) 0%, rgba(10,10,10,.7) 30%, rgba(10,10,10,0) 58%), linear-gradient(0deg, #0a0a0a 0%, rgba(10,10,10,0) 22%); }
.nb-hero2 .wrap { position:relative; z-index:2; width:100%; }
.nb-hero2 .nb-hero-copy { max-width:560px; padding:48px 0 72px; }
.nb-hero2 h1 { font-size:clamp(42px, 5vw, 72px); line-height:.98; letter-spacing:-.04em; margin:22px 0 0; }
.nb-hero2 h1 span { color:var(--acc); }
.nb-hero2 .lead { color:var(--dust); font-size:19px; line-height:1.55; margin:22px 0 0; max-width:470px; }
.nb-hero2 .cta { display:flex; flex-wrap:wrap; gap:10px; margin:36px 0 0; }
.nb-hero2 .cta .btn { display:inline-flex; align-items:center; gap:8px; }
.nb-hero2 .cta .i { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }
.nb-hero2 .facts { display:flex; flex-wrap:wrap; gap:8px 20px; margin:28px 0 0; color:var(--dim); font-size:14px; }
/* for someone who owns it: the add-on's Update button lands here (NexBake 1.0.0, 2026-11-08) */
.nb-hero2 .owned { display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; margin:14px 0 0; font-size:14px; color:var(--dim); }
.nb-hero2 .owned a { display:inline-flex; align-items:center; gap:6px; color:var(--bone, #f2efe9); text-decoration:underline; text-underline-offset:3px; }
.nb-hero2 .owned .i { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width: 860px) {
  .nb-hero2 { min-height:0; display:block; }
  .nb-hero2 .bg { position:relative; height:auto; aspect-ratio:4 / 3; object-position:88% 50%; }   /* owner 2026-11-11: the model bigger on phones, whole */
  .nb-hero2::after { background:linear-gradient(0deg, #0a0a0a 0%, rgba(10,10,10,0) 40%); height:calc(100vw * 3 / 4); }
  .nb-hero2 .nb-hero-copy { padding:8px 0 40px; }
  /* the playlist's second video sits on the first, not under it (it made a tall empty gap); the video starts at the top */
  .nbp .nb-hero2 { padding-top:0; }
  .nb-hero2 .bg ~ .bg { position:absolute; left:0; top:0; width:100%; }
}
@media (prefers-reduced-motion: reduce) { .nb-hero2 .bg { display:none; } .nb-hero2 { background:#0a0a0a url(/assets/nexbake/film/hero-loop-v3.webp) 62% 50% / cover no-repeat; } }

/* the film */
.frame.film video[width="1920"][height="1080"] { aspect-ratio:16 / 9; }

/* docs teaser: four ways into the tutorial */
.learn { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; }
.learn a { display:flex; flex-direction:column; gap:6px; text-decoration:none; color:var(--bone); border:1px solid var(--line); border-radius:12px; padding:10px 10px 16px; background:var(--panel); transition:border-color .2s; }
.learn a:hover { border-color:var(--acc); }
.learn img { width:100%; height:auto; aspect-ratio:16 / 10; object-fit:cover; border-radius:8px; background:#0d0d0e; margin-bottom:8px; }
.learn b { font-size:18px; font-weight:600; padding:0 4px; }
.learn span { color:var(--dim); font-size:14px; padding:0 4px; }
@media (max-width: 860px) { .learn { grid-template-columns:repeat(2, minmax(0, 1fr)); } }

/* ---- product page v4 (owner 2026-11-08): full width, few boxes, little text; comparisons read at a glance ---- */
.v4 { padding:clamp(80px, 10vw, 150px) 0 0; }
.v4-h { font-size:clamp(44px, 6.2vw, 104px); line-height:.95; letter-spacing:-.045em; font-weight:700; margin:0 0 clamp(36px, 5vw, 72px); text-align:center; }
.v4-h span { color:var(--acc); }
/* speed: a bar per baker, longer = faster */
.vs4 { max-width:1600px; margin:0 auto; }
.vs4-t { margin:44px 0 6px; color:var(--dim); font-size:12px; }
.vs4-t:first-child { margin-top:0; }
.vs4-r { display:grid; grid-template-columns:minmax(150px, 280px) minmax(0, 1fr) 150px; gap:clamp(14px, 2.4vw, 36px); align-items:center; padding:20px 0; border-bottom:1px solid var(--line); }
.vs4-r .who { display:flex; align-items:center; gap:14px; font-size:clamp(16px, 1.6vw, 22px); font-weight:600; color:var(--dust); }
.vs4-r.nb .who { color:var(--bone); }
.vs4-r .who img, .vs4-r .sbk { width:34px; height:34px; flex:none; border-radius:8px; }
.vs4-r .sbk { display:grid; place-items:center; background:#2f6fd6; color:#fff; font:700 13px/1 'Familjen Grotesk', sans-serif; }
.vs4-r .bar { position:relative; height:16px; border-radius:6px; background:rgba(255,255,255,.04); overflow:hidden; }
.vs4-r .bar i { position:absolute; left:0; top:0; bottom:0; width:0; min-width:6px; border-radius:6px; background:#5d5a58; transition:width 1.6s cubic-bezier(.2,.7,.1,1); }
.vs4-r.nb .bar i { background:var(--acc); transition-duration:.7s; }
.vs4.seen .vs4-r .bar i { width:calc(var(--s) * 1%); }
.vs4-r b { font-size:clamp(22px, 2.4vw, 36px); font-weight:700; letter-spacing:-.02em; text-align:right; font-variant-numeric:tabular-nums; color:var(--dust); line-height:1; }
.vs4-r.nb b { color:var(--acc); }
.vs4-r b small { display:block; margin-top:6px; font-size:13px; font-weight:500; letter-spacing:0; color:var(--dim); }
.vs4-foot { margin:18px 0 0; color:var(--dim); font-size:13px; }
/* quality */
.ba.bleed { aspect-ratio:16 / 8; border-radius:18px; }
.ba.bleed img { object-fit:cover; }
.nums4 { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:24px; margin-top:44px; text-align:center; }
.nums4 b { display:block; font-size:clamp(40px, 4.6vw, 72px); font-weight:700; letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums; }
.nums4 span { color:var(--dust); font-size:15px; }
/* simple */
.simple4 { display:grid; grid-template-columns:minmax(0, .62fr) minmax(0, 1.38fr); gap:clamp(28px, 4vw, 72px); align-items:center; }
.simple4 .v4-h { text-align:left; margin-bottom:36px; }
.s4-steps { list-style:none; margin:0; padding:0; }
.s4-steps li { display:flex; align-items:baseline; gap:18px; padding:18px 0; border-top:1px solid var(--line); font-size:clamp(20px, 2vw, 28px); font-weight:600; }
.s4-steps .mono { color:var(--acc); font-size:12px; }
.s4-media video, .shot4 img { display:block; width:100%; height:auto; border-radius:14px; border:1px solid var(--line); background:#151515; }
.shot4 { margin:0; }
/* specs: plain columns */
.specs4 { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:clamp(20px, 3vw, 48px); border-top:1px solid var(--line); padding-top:32px; }
.specs4 h4 { margin:0 0 12px; font-size:12px; font-weight:400; color:var(--acc); }
.specs4 p { margin:0; color:var(--dust); font-size:15px; line-height:1.7; }
/* learn */
.learn4 { position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; min-height:clamp(260px, 30vw, 460px); padding:clamp(24px, 3vw, 44px); border-radius:18px; overflow:hidden; color:var(--bone); text-decoration:none; background:#111; }
.learn4 img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% 50%; transition:transform 1.2s cubic-bezier(.2,.7,.1,1); }
.learn4:hover img { transform:scale(1.03); }
.learn4::before { content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg, rgba(10,10,10,.85), rgba(10,10,10,0) 60%); }
.learn4 > span, .learn4 > .i { position:relative; z-index:2; }
.learn4 small { display:block; color:var(--acc); font-size:12px; margin-bottom:10px; }
.learn4 b { font-size:clamp(28px, 3.4vw, 52px); font-weight:700; letter-spacing:-.03em; }
.learn4 .i { width:34px; height:34px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
#buy { padding-top:clamp(80px, 10vw, 150px); }
@media (max-width:900px) {
  .vs4-r { grid-template-columns:1fr 92px; } .vs4-r .bar { grid-column:1 / -1; grid-row:2; }
  .nums4, .specs4 { grid-template-columns:1fr; } .simple4 { grid-template-columns:1fr; }
}
.ba.cup { aspect-ratio:16 / 10; }
.cap4 { margin:14px 0 0; color:var(--dim); font-size:14px; text-align:center; }

/* ---- sections from the Superhive description (owner 2026-11-11) ---- */
/* NexBake next to Blender's bake */
.vs4t { width:100%; max-width:860px; margin:0 auto; border-collapse:collapse; font-size:17px; }
.vs4t th, .vs4t td { padding:16px 14px; text-align:center; border-bottom:1px solid var(--line); }
.vs4t thead th { border-bottom-color:var(--line-2); }
.vs4t thead img { height:26px; width:auto; display:block; margin:0 auto; }
.vs4t thead th:last-child img { opacity:.8; }
.vs4t td:first-child { text-align:left; color:var(--dim); }
.vs4t .y { color:var(--acc); font-weight:800; }
.vs4t .n { color:var(--dust); }
/* the guide and support under the tutorial card */
.learn4-links { display:grid; grid-template-columns:1fr 1fr; margin-top:22px; border-top:1px solid var(--line); }
.learn4-links a { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:22px 24px 22px 0; color:var(--bone); text-decoration:none; }
.learn4-links a + a { padding:22px 0 22px 24px; border-left:1px solid var(--line); }
.learn4-links b { display:block; font-size:19px; font-weight:650; }
.learn4-links small { color:var(--dust); font-size:14px; }
.learn4-links .i { width:20px; height:20px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; color:var(--dim); transition:transform .2s, color .2s; }
.learn4-links a:hover .i { transform:translateX(4px); color:var(--acc); }
@media (max-width:640px) { .learn4-links { grid-template-columns:1fr; } .learn4-links a + a { padding:22px 0; border-left:0; border-top:1px solid var(--line); } }
/* sparks and smoke behind the price */
.buy-fx { position:relative; isolation:isolate; }
.buy-fx > .fx { position:absolute; inset:0; z-index:-1; pointer-events:none; }

/* ---- engine, features, first bake: made for this page, no panels (owner 2026-11-11) ---- */
/* the features: a muted loop that melts into the page at its edges, beside a few words; sides alternate */
.ft5 { display:grid; grid-template-columns:minmax(0, 660px) fit-content(340px); justify-content:center; align-items:center; gap:clamp(18px, 2.6vw, 40px); margin:0 auto clamp(56px, 7vw, 110px); }
.ft5.r { grid-template-columns:fit-content(340px) minmax(0, 660px); }
.ft5.r .ft5-m { order:2; }
.ft5-m { position:relative; will-change:transform; transform:translateY(var(--py, 0px)); }
.ft5-m video { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; background:transparent;
  -webkit-mask-image:radial-gradient(ellipse 72% 70% at 50% 50%, #000 58%, transparent 100%); mask-image:radial-gradient(ellipse 72% 70% at 50% 50%, #000 58%, transparent 100%); }
.ft5-t p { margin:0 0 12px; color:var(--acc); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.ft5-t h3, .ft5-end h3 { margin:0 0 18px; font-size:clamp(30px, 3vw, 46px); line-height:.98; letter-spacing:-.035em; font-weight:700; }
.ft5-t h3 span, .ft5-end h3 span { color:var(--acc); }
.ft5-t ul, .ft5-end ul { margin:0; padding:0; list-style:none; display:grid; gap:10px; }
.ft5-t li, .ft5-end li { position:relative; padding-left:28px; color:var(--dim); font-size:16px; }
.ft5-t li::before, .ft5-end li::before { content:''; position:absolute; left:2px; top:.42em; width:12px; height:6px; border-left:2px solid var(--acc); border-bottom:2px solid var(--acc); transform:rotate(-45deg); }
.ft5-t.reveal ul li { opacity:0; transform:translateX(-8px); transition:opacity .4s, transform .4s; }
.ft5-t.reveal.seen ul li { opacity:1; transform:none; }
.ft5-t.reveal.seen ul li:nth-child(2) { transition-delay:.12s; } .ft5-t.reveal.seen ul li:nth-child(3) { transition-delay:.24s; }
.ft5-end { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px, 5vw, 90px); max-width:1040px; margin:0 auto; padding-top:clamp(40px, 5vw, 70px); border-top:1px solid var(--line); }
.ft5-end p { margin:0 0 12px; color:var(--acc); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
@media (max-width:860px) { .ft5, .ft5.r, .ft5-end { grid-template-columns:1fr; } .ft5.r .ft5-m { order:0; } }
/* from ZIP to first bake: four steps on one line that fills as the section scrolls by */
.st5 { position:relative; display:grid; grid-template-columns:repeat(4, 1fr); gap:clamp(16px, 3vw, 40px); max-width:1240px; margin:0 auto; padding:34px 0 0; list-style:none; }
.st5::before, .st5::after { content:''; position:absolute; left:0; right:0; top:0; height:2px; background:var(--line); }
.st5::after { background:var(--acc); transform:scaleX(var(--fill, 0)); transform-origin:left; }
.st5 li { position:relative; display:grid; gap:8px; opacity:.35; transition:opacity .4s; }
.st5 li.on { opacity:1; }
.st5 li::before { content:''; position:absolute; top:-40px; left:0; width:12px; height:12px; border-radius:50%; background:var(--ink); border:2px solid var(--line-2); transition:background .3s, border-color .3s; }
.st5 li.on::before { background:var(--acc); border-color:var(--acc); }
.st5-n { font:600 13px/1 ui-monospace, Consolas, monospace; color:var(--acc); }
.st5 b { font-size:clamp(24px, 2.4vw, 34px); font-weight:700; letter-spacing:-.02em; }
.st5 small { color:var(--dim); font-size:16px; }
@media (max-width:760px) {
  .st5 { grid-template-columns:1fr; padding:0 0 0 30px; }
  .st5::before, .st5::after { top:0; bottom:0; left:5px; right:auto; width:2px; height:auto; }
  .st5::after { transform:scaleY(var(--fill, 0)); transform-origin:top; }
  .st5 li::before { top:8px; left:-31px; }
}
@media (prefers-reduced-motion: reduce) { .ft5-m { transform:none; } }

/* ---- speed and clean edges side by side, smaller (owner 2026-11-11) ---- */
.duo5-g { display:grid; grid-template-columns:repeat(2, minmax(0, 540px)); justify-content:center; align-items:start; gap:clamp(40px, 6vw, 100px); }
.duo5-h { margin:0 0 22px; font-size:clamp(30px, 3vw, 46px); line-height:.98; letter-spacing:-.04em; font-weight:700; }
.duo5-h span { color:var(--acc); }
.duo5-f { margin:14px 0 0; color:var(--dim); font-size:13px; line-height:1.5; }
.sp5-sw { display:inline-flex; gap:2px; margin:0 0 6px; padding:3px; border:1px solid var(--line); border-radius:10px; }
.sp5-sw button { padding:6px 14px; border:0; border-radius:7px; background:none; color:var(--dim); font-family:inherit; font-size:13px; font-weight:600; cursor:pointer; transition:background .2s, color .2s; }
.sp5-sw button:hover { color:var(--bone); }
.sp5-sw button[aria-pressed="true"] { background:var(--line-2); color:var(--bone); }
.sp5-sw button:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
.sp5-r { display:grid; grid-template-columns:1fr auto; align-items:center; gap:10px 12px; padding:14px 0; border-bottom:1px solid var(--line); }
.sp5-r .who { display:flex; align-items:center; gap:10px; font-size:15px; font-weight:600; color:var(--dust); }
.sp5-r.nb .who { color:var(--bone); }
.sp5-r .who img, .sp5-r .sbk { width:22px; height:22px; flex:none; border-radius:6px; }
.sp5-r .sbk { display:grid; place-items:center; background:#2f6fd6; color:#fff; font-size:9px; font-weight:700; }
.sp5-r b { font-size:20px; font-weight:700; letter-spacing:-.02em; color:var(--dust); font-variant-numeric:tabular-nums; text-align:right; }
.sp5-r.nb b { color:var(--acc); }
.sp5-r b small { margin-left:8px; font-size:12px; font-weight:500; letter-spacing:0; color:var(--dim); }
.sp5-r .bar { grid-column:1 / -1; position:relative; height:4px; border-radius:2px; background:rgba(255,255,255,.05); overflow:hidden; }
.sp5-r .bar i { position:absolute; left:0; top:0; bottom:0; width:0; border-radius:2px; background:#5d5a58; transition:width 1.2s cubic-bezier(.2,.7,.1,1); }
.sp5-r.nb .bar i { background:var(--acc); transition-duration:.6s; }
.sp5.seen .sp5-r .bar i { width:calc(var(--s4) * 1%); }
.sp5.seen[data-r="8"] .sp5-r .bar i { width:calc(var(--s8) * 1%); }
.sp5 .k8, .sp5[data-r="8"] .k4 { display:none; }
.sp5[data-r="8"] .k8 { display:inline; }
.ce5 .ba, .ce5 .ba img { border-radius:12px; }
.ce5 .ba-tag { top:10px; padding:5px 8px; font-size:11px; border-radius:8px; }
.ce5 .ba-tag.l { left:10px; } .ce5 .ba-tag.r { right:10px; }
#quality .ba.bleed, #quality .nums4 { max-width:1100px; margin-left:auto; margin-right:auto; }
@media (max-width:900px) { .duo5-g { grid-template-columns:minmax(0, 560px); } }

/* ---- the engine: words beside the guitar, which sweeps through its ten maps (owner 2026-11-11: smaller, minimal) ---- */
.eng6-g { display:grid; grid-template-columns:fit-content(380px) minmax(0, 640px); justify-content:center; align-items:center; gap:clamp(32px, 5vw, 80px); }
.eng6-t, .ft5-t { position:relative; z-index:1; }
.eng6-t h2 { margin:0 0 26px; font-size:clamp(34px, 3.6vw, 56px); line-height:.98; letter-spacing:-.04em; font-weight:700; }
.eng6-t h2 span { color:var(--acc); }
.eng6-t dl { margin:0; display:grid; gap:10px; }
.eng6-t dl div { display:grid; grid-template-columns:48px 1fr; align-items:baseline; }
.eng6-t dt { color:var(--acc); font-size:12px; letter-spacing:.1em; }
.eng6-t dd { margin:0; color:var(--dim); font-size:16px; }
.eng6 { overflow-x:clip; }
.eng6-v { position:relative; isolation:isolate; }
@media (max-width:860px) { .eng6-g { grid-template-columns:minmax(0, 640px); } }

/* ---- updates: the Blender window of the Superhive description, drawn and played by js/nexbake-update.js (owner 2026-11-11) ---- */
.upd { position:relative; aspect-ratio:16 / 9; overflow:hidden; border-radius:12px; border:1px solid rgba(255,255,255,.08); container-type:inline-size; background:#1d1d1d; font-family:inherit; color:#d8d8d8; user-select:none; }
.upd .bar { position:absolute; left:0; right:0; top:0; height:6.38cqw; background:#232323; display:flex; align-items:center; gap:3.04cqw; padding:0 2.03cqw; font-size:2.17cqw; color:#cfcfcf; }
.upd .bar .bl { height:3.33cqw; width:auto; display:block; margin-right:0.29cqw; }
.upd .bar .ws { display:flex; gap:0.58cqw; margin-left:1.45cqw; }
.upd .bar .ws span { padding:0.8cqw 1.59cqw; border-radius:0.87cqw; color:#a9a9a9; }
.upd .bar .ws .on { background:#3a3a3a; color:#f0f0f0; }
.upd .ns { position:absolute; right:1.74cqw; top:1.09cqw; height:4.21cqw; display:flex; align-items:center; gap:1.01cqw; padding:0 1.59cqw 0 1.16cqw;
  border-radius:0.87cqw; background:#2e2e2e; border:1px solid #3c3c3c; font-size:2.17cqw; color:#e6e6e6; transition:background .15s, transform .12s; }
.upd .ns.press { transform:scale(.95); background:#444; }
.upd .ns .mk { position:relative; width:2.75cqw; height:2.75cqw; }
.upd .ns .mk img { width:100%; height:100%; display:block; }
.upd .dot { position:absolute; right:-0.65cqw; top:-0.65cqw; width:1.52cqw; height:1.52cqw; border-radius:50%; background:#FF4A3D; box-shadow:0 0 0 0.32cqw #2e2e2e; transform:scale(0); }
.upd .ring { position:absolute; right:-0.65cqw; top:-0.65cqw; width:1.52cqw; height:1.52cqw; border-radius:50%; border:0.26cqw solid #FF4A3D; box-sizing:border-box; opacity:0; }
.upd .hd { position:absolute; left:0; right:0; top:6.38cqw; height:4.93cqw; background:#303030; display:flex; align-items:center; gap:2.9cqw; padding:0 2.03cqw; font-size:1.96cqw; color:#bdbdbd; border-bottom:1px solid #262626; }
.upd .hd .mode { padding:0.51cqw 1.3cqw; border-radius:0.72cqw; background:#3b3b3b; color:#e2e2e2; }
.upd .vp { position:absolute; left:0; right:0; top:11.31cqw; bottom:0; overflow:hidden; background:radial-gradient(120% 100% at 50% 40%, #434343, #353535); }
.upd .vp .grid { position:absolute; left:-30%; right:-30%; top:44%; height:120%; transform:perspective(58cqw) rotateX(62deg); transform-origin:50% 0;
  background:linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px) 0 0 / 5.8cqw 5.8cqw, linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px) 0 0 / 5.8cqw 5.8cqw; }
.upd .vp .ax { position:absolute; left:0; right:0; top:44%; height:0.23cqw; background:rgba(220,70,80,.75); }
.upd .vp .gtr { position:absolute; left:6%; top:-28%; height:150%; width:auto; transform:rotate(58deg); filter:drop-shadow(0 2.32cqw 2.32cqw rgba(0,0,0,.45)); }
.upd .menu { position:absolute; right:1.74cqw; top:6.09cqw; width:44.95cqw; padding:1.45cqw 0 0; border-radius:1.45cqw; background:#181818; border:1px solid #2a2a2a;
  box-shadow:0 2.32cqw 5.8cqw rgba(0,0,0,.55); font-size:2.32cqw; opacity:0; visibility:hidden; transform-origin:85% 0; z-index:3; }
.upd .menu .h { padding:0 2.17cqw 0.72cqw; font-size:1.89cqw; color:#9e9e9e; }
.upd .menu .r { position:relative; display:flex; align-items:center; gap:1.59cqw; height:5.8cqw; margin:0 1.01cqw; padding:0 1.16cqw; border-radius:1.01cqw; color:#ececec; }
.upd .menu .r.hov { background:#2a2a2a; }
.upd .menu .r > img { width:3.48cqw; height:3.48cqw; display:block; }
.upd .menu .r b { font-weight:600; }
.upd .menu .r b i { font-style:normal; }
.upd .menu .av { width:3.48cqw; height:3.48cqw; border-radius:50%; background:#2f2f2f; display:grid; place-items:center; position:relative; }
.upd .menu .av svg { width:2.17cqw; height:2.17cqw; fill:#d0d0d0; }
.upd .menu .av:after { content:''; position:absolute; right:-0.14cqw; bottom:-0.14cqw; width:1.16cqw; height:1.16cqw; border-radius:50%; background:#73D98C; box-shadow:0 0 0 0.26cqw #181818; }
.upd .menu .sg { margin-left:auto; color:#73D98C; font-size:2.03cqw; font-weight:600; }
.upd .menu .sep { height:1px; background:#2a2a2a; margin:0.87cqw 1.45cqw; }
.upd .pill { position:absolute; right:1.16cqw; top:1.01cqw; bottom:1.01cqw; width:11.89cqw; border-radius:0.87cqw; overflow:hidden; background:#3375E6;
  display:grid; place-items:center; font-size:1.89cqw; font-weight:600; color:#fff; transition:background .2s; }
.upd .pill i { position:absolute; left:0; top:0; bottom:0; width:0; background:#3375E6; }
.upd .pill span { position:relative; }
.upd .pill.busy { background:#3a3a3a; }
.upd .pill.done { background:#262626; color:#73D98C; }
.upd .pill.hov:not(.busy):not(.done) { background:#5590ee; }
.upd .ft { margin-top:0.72cqw; padding:1.45cqw 2.17cqw 1.74cqw; border-top:1px solid #2a2a2a; font-size:1.89cqw; color:#b3b3b3; white-space:nowrap; }
.upd .ft.ok { color:#73D98C; }
.upd .cur { position:absolute; left:0; top:0; width:3.77cqw; height:auto; z-index:5; filter:drop-shadow(0 0.29cqw 0.43cqw rgba(0,0,0,.5)); transform-origin:0 0; }
.upd .clk { position:absolute; left:0; top:0; width:4.93cqw; height:4.93cqw; margin:-2.46cqw 0 0 -2.46cqw; border-radius:50%; border:0.29cqw solid rgba(255,255,255,.85); box-sizing:border-box; opacity:0; z-index:4; }
.upd img { max-width:none; }
/* ---- coming soon: the NexBake mark over sparks and smoke, no box ---- */
.soon5 { position:relative; isolation:isolate; aspect-ratio:16 / 9; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; }
.soon5-fx { position:absolute; inset:-10% 0; z-index:-1; pointer-events:none; }
.soon5 img { width:clamp(56px, 6vw, 84px); height:auto; }
.soon5 b { font-family:var(--mono); font-size:clamp(24px, 2.6vw, 38px); font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.soon5 b i { font-style:normal; color:var(--acc); }
.soon5 span { color:var(--dim); font-size:12px; letter-spacing:.17em; }
/* the check table fits a phone */
@media (max-width:640px) { .vs4t { font-size:14px; } .vs4t th, .vs4t td { padding:12px 6px; } .vs4t thead img { height:18px; max-width:100%; } .ft5s { overflow-x:clip; } }
/* the label under the hero model, timed to the loop (js/nexbake-hero-cues.js) */
.nb-cue { position:absolute; z-index:1; display:flex; align-items:center; gap:8px; color:var(--dust); font-size:12px; white-space:nowrap; opacity:0; transform:translate(-50%, 4px); transition:opacity .35s, transform .35s; pointer-events:none; } /* centred on its point */
.nb-cue.on { opacity:1; transform:translate(-50%, 0); }
.nb-cue i { width:6px; height:6px; border-radius:50%; background:var(--dim); transition:background .3s; }
.nb-cue.go i { background:var(--acc); }
.nb-cue span { font-variant-numeric:tabular-nums; }
/* two ways to buy (owner 2026-11-11) */
.buy-btns { display:grid; gap:10px; margin-top:auto; }
.buy > .card .buy-btns .btn { margin-top:0; }
.btn[data-superhive] .i { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
/* the guitar bake (owner 2026-11-11, from the Superhive description; js/nexbake-bake.js) */
.bk6 { position:relative; aspect-ratio:4 / 3; overflow:hidden; }
.bk6-rig { position:absolute; left:50%; top:50%; height:122%; aspect-ratio:727 / 2000; transform:translate(-50%, -50%) rotate(58deg); z-index:1; pointer-events:none; }
.bk6-model { position:absolute; inset:0; will-change:transform, filter; animation:bk6-float 7.5s ease-in-out infinite; }
@keyframes bk6-float { 0%, 100% { translate:0 0; rotate:0deg; } 25% { translate:.1% -.35%; rotate:.18deg; } 50% { translate:0 -.6%; rotate:0deg; } 75% { translate:-.1% -.3%; rotate:-.18deg; } }
.bk6-model img { position:absolute; inset:0; width:100%; height:100%; display:block; user-select:none; -webkit-user-drag:none; }
.bk6-model img.low { filter:brightness(.8); }
.bk6-model, .bk6-model .lay, .bk6-heat, .bk6-view { --cx:46%; --cy:32%; }
.bk6-model .lay, .bk6-view { visibility:hidden;
  -webkit-mask-image:radial-gradient(circle at var(--cx) var(--cy), #000 calc(var(--r, 0) * 1% - 3.6%), transparent calc(var(--r, 0) * 1%));
          mask-image:radial-gradient(circle at var(--cx) var(--cy), #000 calc(var(--r, 0) * 1% - 3.6%), transparent calc(var(--r, 0) * 1%)); }
.bk6-heat { z-index:30; visibility:hidden; opacity:var(--h, 0); filter:sepia(1) saturate(9) hue-rotate(-32deg) brightness(1.15);
  -webkit-mask-image:radial-gradient(circle at var(--cx) var(--cy), transparent calc(var(--r, 0) * 1% - 17.5%), #000 calc(var(--r, 0) * 1% - 5.8%), transparent calc(var(--r, 0) * 1%));
          mask-image:radial-gradient(circle at var(--cx) var(--cy), transparent calc(var(--r, 0) * 1% - 17.5%), #000 calc(var(--r, 0) * 1% - 5.8%), transparent calc(var(--r, 0) * 1%)); }
.bk6-bar { display:flex; align-items:center; gap:14px; margin-top:6px; }
.bk6-bar .btn { height:38px; padding:0 18px; font-size:14px; min-width:104px; justify-content:center; }
.bk6-bar .btn:disabled { opacity:.6; cursor:default; }
.bk6-rule { position:relative; flex:1; height:2px; border-radius:1px; background:rgba(255,106,31,.2); overflow:hidden; }
.bk6-rule i { position:absolute; inset:0; background:var(--acc); transform-origin:left; transform:scaleX(var(--f, 0)); }
.bk6-bar .mono { color:var(--dim); white-space:nowrap; min-width:118px; text-align:right; }
.bk6-maps { display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:14px; }
.bk6-maps button { padding:2px 0; border:0; background:none; font-family:inherit; font-size:14px; color:var(--dim); cursor:pointer;
  text-decoration:underline dotted rgba(255,106,31,.8); text-underline-offset:.24em; transition:color .15s, opacity .3s; }
.bk6-maps button:disabled { opacity:.35; cursor:default; text-decoration-color:transparent; }
.bk6-maps button:not(:disabled):hover, .bk6-maps button.on { color:var(--acc); }
.bk6-maps button.on { text-decoration-style:solid; }
.bk6-maps button:focus-visible, .bk6-bar .btn:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
@media (prefers-reduced-motion: reduce) { .bk6-model { animation:none; } }