/* Persona blocks (app/blocks_more.php): release, player, streams, lookbook, drop, trust, projects, github, now, posts, videos, books, mediakit, postgrid.
   Every colour, font and radius comes from the theme variables, so each block looks native in every theme.
   Brand marks keep their own colour (--bc, ink on it --bci). Pictures carry their own dark overlay, so words on them are white. */
.bxo-rel,.bxo-pl,.bxo-st,.bxo-lb,.bxo-dr,.bxo-tr,.bxo-pj,.bxo-gh,.bxo-now,.bxo-po,.bxo-yt,.bxo-bk,.bxo-mk,.bxo-pg{
  --o-head:var(--bxb-head,inherit);--o-mono:var(--bx-mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);
  --o-rimg:var(--bx-r-img,min(18px,var(--bxb-radius,16px)));--o-rbtn:var(--bx-r-btn,999px);
  --o-ease:cubic-bezier(.2,.7,.2,1);--o-spring:cubic-bezier(.34,1.45,.64,1);
  container-type:inline-size}
:is(.bxo-rel,.bxo-pl,.bxo-st,.bxo-lb,.bxo-dr,.bxo-tr,.bxo-pj,.bxo-gh,.bxo-now,.bxo-po,.bxo-yt,.bxo-bk,.bxo-mk,.bxo-pg) :is(a,button,input):focus-visible{outline:2px solid var(--bxb-accent);outline-offset:3px}
:is(.bxo-rel,.bxo-pl,.bxo-st,.bxo-lb,.bxo-dr,.bxo-tr,.bxo-pj,.bxo-gh,.bxo-now,.bxo-po,.bxo-yt,.bxo-bk,.bxo-mk,.bxo-pg) a{text-decoration:none;color:inherit}
.bxo-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bxo-k{font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;opacity:.7}
.bxo-mute{opacity:.62}
/* the display type of the theme */
.bxo-rel-t,.bxo-pl-t,.bxo-lb-name,.bxo-lb-title,.bxo-dr-t,.bxo-pj-t,.bxo-pj-title,.bxo-now-card .bxo-now-t,.bxo-dr-u b{font-family:var(--o-head);font-weight:var(--bx-weight,800);letter-spacing:var(--bx-track,-.02em);text-transform:var(--bx-case,none)}
/* a state chip: Out now, Drops Fri, Live now */
.bxo-chip{display:inline-flex;align-items:center;gap:.45rem;align-self:flex-start;min-height:28px;padding:.25rem .75rem;border-radius:99px;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  background:color-mix(in srgb,var(--bxb-accent) 16%,transparent);color:var(--bxb-ink)}
.bxo-dot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--bxb-accent);box-shadow:0 0 0 0 color-mix(in srgb,var(--bxb-accent) 60%,transparent)}
.bxo-chip.is-soon .bxo-dot,.bxo-dr-wait .bxo-dot{animation:bxoPing 1.8s var(--o-ease) infinite}
@keyframes bxoPing{70%,100%{box-shadow:0 0 0 7px transparent}}
/* a cover with no picture: the initials on the accent */
.bxo-art-fb{display:grid;place-items:center;background:radial-gradient(120% 90% at 20% 10%,color-mix(in srgb,var(--bxb-accent) 55%,#fff),var(--bxb-accent) 60%,color-mix(in srgb,var(--bxb-accent) 60%,#000));
  color:var(--bxb-accent-ink);font-family:var(--o-head);font-weight:800;font-size:2.2em;letter-spacing:-.04em}

/* ---------- the vinyl: grooves that catch the light, a label made of the cover, a spindle ---------- */
.bxo-vinyl{position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 20deg,transparent 0 6%,rgba(255,255,255,.16) 11%,transparent 18% 50%,rgba(255,255,255,.1) 58%,transparent 66%),
    repeating-radial-gradient(circle,#101010 0 1.2px,#1d1d1d 1.6px 2.6px),#0d0d0d;
  box-shadow:inset 0 0 0 2px #050505,inset 0 0 0 7px #161616,0 0 0 1px rgba(255,255,255,.07),0 18px 40px -16px rgba(0,0,0,.7)}
.bxo-vinyl-label{position:absolute;inset:32%;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px #0a0a0a;animation:bxoSpin 5.5s linear infinite}
.bxo-vinyl-label::after{content:"";position:absolute;left:50%;top:50%;width:12%;height:12%;margin:-6%;border-radius:50%;background:#e8e6e1;box-shadow:inset 0 1px 2px rgba(0,0,0,.6)}
.bxo-vinyl-img{display:block;width:100%;height:100%;object-fit:cover;font-size:.9rem}
@keyframes bxoSpin{to{transform:rotate(1turn)}}

/* ---------- release: cover ---------- */
.bxo-rel{position:relative;overflow:hidden;border-radius:var(--bxb-radius)}
.bxo-cover{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--o-rimg)}
.bxo-rel-art{position:relative}
.bxo-rel-art .bxo-cover{position:relative;z-index:1;box-shadow:0 22px 44px -18px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.06)}
.bxo-rel-cover{padding:14px 14px 16px}
.bxo-rel-cover .bxo-rel-art{width:min(74%,380px);margin:4px 0 20px}
.bxo-rel-art .bxo-vinyl{inset:3%;transform:translateX(30%) rotate(0);transition:transform .9s var(--o-spring)}
.bxo-rel-cover:hover .bxo-vinyl,.bxo-rel-row:hover .bxo-vinyl{transform:translateX(44%)}
.bxo-rel-art>.bxo-chip{position:absolute;z-index:2;left:10px;top:10px;color:#fff;background:rgba(10,10,10,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.bxo-rel-art>.bxo-chip .bxo-dot{background:#fff}
.bxo-rel-body{display:flex;flex-direction:column;gap:.3rem;min-width:0}
.bxo-rel-t{font-size:clamp(1.6rem,8cqi,2.6rem);line-height:1.02}
.bxo-rel-by{font-size:1rem;color:var(--bxb-mute)}
.bxo-svc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:.9rem}
@container (max-width:300px){.bxo-svc{grid-template-columns:1fr}}
.bxo-svc-a{display:grid;grid-template-columns:auto minmax(0,1fr);align-content:center;column-gap:.65rem;min-height:54px;padding:.35rem .9rem;border-radius:var(--o-rbtn);background:var(--bxb-soft);border:1px solid var(--bxb-line);color:var(--bxb-ink)!important;
  transition:background-color .25s,color .25s,transform .35s var(--o-spring),border-color .25s}
.bxo-svc-a>svg{grid-row:span 2;align-self:center;color:var(--bc);transition:color .25s}
.bxo-svc-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:650;font-size:.88rem;line-height:1.2}
.bxo-svc-v{font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.6;line-height:1.3}
.bxo-svc-a:hover{background:var(--bc);border-color:var(--bc);color:var(--bci)!important;transform:translateY(-2px)}
.bxo-svc-a:hover>svg{color:var(--bci)}
/* compact row */
.bxo-rel-row{display:flex;align-items:center;gap:14px;padding:12px 14px 12px 12px}
.bxo-rel-row .bxo-rel-art{flex:none;width:clamp(84px,26cqi,120px);margin-right:clamp(26px,8cqi,38px)}
.bxo-rel-row .bxo-rel-t{font-size:clamp(1.1rem,4.6cqi,1.5rem)}
.bxo-rel-row .bxo-rel-by{font-size:.86rem}
.bxo-rel-row .bxo-chip{margin-bottom:.15rem}
.bxo-rel-row .bxo-svc{display:flex;flex-wrap:wrap;gap:6px;margin-top:.5rem}
.bxo-svc-i{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--bxb-soft);border:1px solid var(--bxb-line);color:var(--bc)!important;transition:background-color .25s,color .25s,transform .35s var(--o-spring)}
.bxo-svc-i:hover{background:var(--bc);color:var(--bci)!important;transform:translateY(-2px)}
/* poster: the art is the block, the words sit on it */
/* the art and the words share one grid cell: long words grow the poster instead of running up under the chip */
.bxo-rel-poster{display:grid;color:#fff;isolation:isolate}
.bxo-rel-poster>*{grid-area:1/1}
.bxo-rel-poster>.bxo-cover{aspect-ratio:4/5;min-height:100%;height:auto;border-radius:0}
.bxo-rel-poster::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(0,0,0,.3),transparent 22%,rgba(0,0,0,.2) 36%,rgba(0,0,0,.66) 58%,rgba(0,0,0,.9));pointer-events:none}
.bxo-rel-poster .bxo-rel-body{position:relative;z-index:1;justify-content:flex-end;padding:calc(clamp(14px,5cqi,22px) + 44px) clamp(16px,6cqi,28px) clamp(16px,6cqi,28px);--bxb-ink:#fff;--bxb-mute:rgba(255,255,255,.78)}
.bxo-rel-poster .bxo-chip{position:absolute;top:clamp(14px,5cqi,22px);left:clamp(14px,5cqi,22px);color:#fff;background:rgba(10,10,10,.42);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.bxo-rel-poster .bxo-chip .bxo-dot{background:#fff}
.bxo-rel-poster .bxo-rel-t{font-size:clamp(2.4rem,15cqi,5rem);line-height:.92;text-wrap:balance}
.bxo-rel-when{font-size:.82rem;opacity:.8}
.bxo-rel-poster .bxo-svc-a{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.bxo-rel-poster .bxo-cover.bxo-art-fb{font-size:5rem}

/* ---------- song preview ---------- */
.bxo-pl{position:relative;border-radius:var(--bxb-radius);--lv:0}
.bxo-pl audio{display:none}
.bxo-pl-words{display:flex;flex-direction:column;gap:.12rem;min-width:0}
.bxo-pl-t{font-size:1.2rem;line-height:1.1;overflow:hidden;text-overflow:ellipsis}
.bxo-pl-by{font-size:.86rem;color:var(--bxb-mute)}
.bxo-pl-btn{flex:none;display:grid;place-items:center;width:56px;height:56px;padding:0;border:0;border-radius:50%;cursor:pointer;background:var(--bxb-accent);color:var(--bxb-accent-ink);
  box-shadow:0 10px 24px -10px color-mix(in srgb,var(--bxb-accent) 80%,transparent);transition:transform .35s var(--o-spring)}
.bxo-pl-btn:hover{transform:scale(1.06)}
.bxo-pl-btn:active{transform:scale(.94)}
.bxo-pl-btn .bxo-i-pause,.bxo-pl-btn[aria-pressed=true] .bxo-i-play{display:none}
.bxo-pl-btn[aria-pressed=true] .bxo-i-pause{display:block}
.bxo-pl-time,.bxo-pl-now{font-family:var(--o-mono);font-size:.76rem;font-variant-numeric:tabular-nums;opacity:.7}
.bxo-pl-full{display:inline-flex;align-items:center;gap:.3rem;min-height:44px;font-size:.8rem;font-weight:650;opacity:.8}
.bxo-pl-full:hover{opacity:1}
.bxo-prog{display:block;height:4px;border-radius:4px;background:var(--bxb-line);overflow:hidden;cursor:pointer}
.bxo-prog i{display:block;height:100%;width:var(--p,0%);background:var(--bxb-accent);border-radius:inherit}
/* vinyl */
.bxo-pl-vinyl{display:grid;grid-template-columns:minmax(0,44%) minmax(0,1fr);align-items:center;gap:clamp(14px,5cqi,24px);padding:16px}
.bxo-pl-disc{position:relative;aspect-ratio:1}
.bxo-pl-disc .bxo-vinyl{transition:transform .3s,box-shadow .3s;transform:scale(calc(1 + var(--lv) * .035));
  box-shadow:inset 0 0 0 2px #050505,inset 0 0 0 7px #161616,0 18px 40px -16px rgba(0,0,0,.7),0 0 calc(var(--lv) * 46px) calc(var(--lv) * 6px) color-mix(in srgb,var(--bxb-accent) 55%,transparent)}
.bxo-pl .bxo-vinyl-label{animation-play-state:paused}
.bxo-pl.is-playing .bxo-vinyl-label{animation-play-state:running;animation-duration:1.8s}
.bxo-pl-disc .bxo-vinyl{inset:7% 14% 7% 0}
.bxo-arm{position:absolute;right:0;top:0;width:9%;height:62%;transform-origin:50% 7%;transform:rotate(-3deg);transition:transform .8s var(--o-spring);z-index:2;pointer-events:none}
.bxo-arm::before{content:"";position:absolute;left:50%;top:0;width:110%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle at 40% 35%,#f4f4f4,#9a9a9a 60%,#6b6b6b);box-shadow:0 3px 8px rgba(0,0,0,.35)}
.bxo-arm::after{content:"";position:absolute;left:50%;top:6%;bottom:0;width:22%;transform:translateX(-50%);border-radius:3px;background:linear-gradient(90deg,#8d8d8d,#e9e9e9 45%,#9b9b9b);box-shadow:0 2px 6px rgba(0,0,0,.35)}
.bxo-pl.is-playing .bxo-arm{transform:rotate(24deg)}
.bxo-pl-side{display:flex;flex-direction:column;gap:.75rem;min-width:0}
.bxo-pl-side .bxo-pl-t{font-size:clamp(1.15rem,5.4cqi,1.7rem)}
.bxo-pl-foot{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.bxo-pl-vinyl .bxo-pl-foot .bxo-pl-full{margin-left:auto}
/* waveform */
.bxo-pl-wave{padding:14px 16px 6px}
.bxo-pl-head{display:flex;align-items:center;gap:12px}
.bxo-pl-head .bxo-pl-words{flex:1}
.bxo-pl-cover{flex:none;width:56px;height:56px;border-radius:calc(var(--o-rimg) - 4px);object-fit:cover;font-size:1rem}
.bxo-bars{display:flex;align-items:center;gap:2px;height:72px;margin:16px 0 4px;cursor:pointer}
.bxo-bars i{flex:1;height:var(--h);min-width:2px;border-radius:2px;background:color-mix(in srgb,var(--bxb-ink) 20%,transparent);transform-origin:50% 50%;transition:background-color .2s,transform .12s linear}
.bxo-bars i.on{background:var(--bxb-accent)}
.bxo-pl-wave .bxo-pl-foot{justify-content:space-between}
/* no level from the music (the file's server does not allow it): the bars dance on their own */
.bxo-pl.is-playing.no-lv .bxo-bars i{animation:bxoBar .8s ease-in-out infinite alternate;animation-delay:calc(var(--i) * -97ms)}
@keyframes bxoBar{0%{transform:scaleY(.35)}100%{transform:scaleY(1.12)}}
/* minimal */
.bxo-pl-min{display:flex;align-items:center;gap:12px;padding:10px 16px 10px 10px}
.bxo-pl-min .bxo-pl-btn{width:48px;height:48px}
.bxo-pl-min .bxo-pl-words{flex:1}
.bxo-pl-min .bxo-k{display:none}
.bxo-pl-min .bxo-pl-t{font-size:1rem;white-space:nowrap}
.bxo-pl-min .bxo-pl-by{font-size:.8rem}
.bxo-pl-min .bxo-bars{flex:none;width:30px;height:24px;margin:0;gap:3px}
.bxo-pl-min .bxo-bars i{background:var(--bxb-accent);opacity:.35}
.bxo-pl-min.is-playing .bxo-bars i{opacity:1}

/* ---------- streaming and social marks ---------- */
.bxo-st{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.bxo-st-ico{display:grid;place-items:center;width:54px;height:54px;border-radius:50%!important;color:var(--bc)!important;transition:transform .4s var(--o-spring),background-color .25s,color .25s}
.bxo-st-ico:hover{background:var(--bc);color:var(--bci)!important;transform:translateY(-3px) scale(1.04)}
.bxo-st-pill{display:inline-flex;align-items:center;gap:.5rem;min-height:46px;padding:0 1.05rem 0 .85rem;border-radius:var(--o-rbtn)!important;font-weight:650;font-size:.9rem;transition:transform .35s var(--o-spring)}
.bxo-st-pill>svg{color:var(--bc)}
.bxo-st-pill:hover{transform:translateY(-2px)}
.bxo-st-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@container (min-width:620px){.bxo-st-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
.bxo-st-tile{display:flex;align-items:center;gap:12px;min-height:78px;padding:14px;border-radius:var(--bxb-radius);background:var(--bc);color:var(--bci)!important;
  box-shadow:0 14px 30px -18px color-mix(in srgb,var(--bc) 90%,transparent);transition:transform .4s var(--o-spring),box-shadow .3s}
.bxo-st-tile.is-ig{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.bxo-st-tile:hover{transform:translateY(-3px);box-shadow:0 20px 36px -18px color-mix(in srgb,var(--bc) 95%,transparent)}
.bxo-st-tile>svg:first-child{flex:none}
.bxo-st-tile>svg:last-child{margin-left:auto;opacity:.7;flex:none}
.bxo-st-words{display:flex;flex-direction:column;min-width:0}
.bxo-st-words b{font-size:.98rem;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bxo-st-words small{font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.75}

/* ---------- lookbook ---------- */
.bxo-lb-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0 2px 12px}
.bxo-lb-title{font-size:clamp(1.4rem,6cqi,2rem);line-height:1}
.bxo-lb-img{display:block;width:100%;height:100%;object-fit:cover}
.bxo-lb-no{font-size:.66rem;font-weight:700;letter-spacing:.32em;text-transform:uppercase}
.bxo-lb-no i{font-style:normal;opacity:.55;letter-spacing:.18em}
.bxo-lb-det{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.bxo-lb-price{font-size:.92rem;font-weight:650;font-variant-numeric:tabular-nums}
.bxo-lb-cta{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;padding:0 1.2rem;border-radius:var(--o-rbtn);background:#fff;color:#111!important;font-weight:700;font-size:.84rem;
  box-shadow:0 10px 24px -12px rgba(0,0,0,.6);transition:transform .35s var(--o-spring)}
.bxo-lb-cta:hover{transform:translateY(-2px)}
/* runway: one look fills the frame, scroll for the next */
.bxo-lb-runway .bxo-lb-track{display:grid;grid-auto-rows:100%;height:min(82svh,780px);overflow-y:auto;scroll-snap-type:y mandatory;border-radius:var(--o-rimg);scrollbar-width:none;
  box-shadow:0 24px 50px -28px rgba(0,0,0,.6)}
.bxo-lb-runway .bxo-lb-track::-webkit-scrollbar{display:none}
.bxo-lb-runway .bxo-look{position:relative;margin:0;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always;background:var(--bxb-soft)}
.bxo-lb-runway .bxo-lb-img{position:absolute;inset:0;transform:scale(1.06);transition:transform 1.4s var(--o-ease)}
.bxo-lb-runway .bxo-look.is-in .bxo-lb-img,.bxo-lb-runway .bxo-look:first-child .bxo-lb-img{transform:none}
.bxo-lb-runway figcaption{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:.3rem;padding:clamp(18px,6cqi,30px);color:#fff;
  background:linear-gradient(180deg,rgba(0,0,0,.32),transparent 22%,rgba(0,0,0,.12) 48%,rgba(0,0,0,.82))}
.bxo-lb-runway .bxo-lb-no{position:absolute;top:clamp(18px,6cqi,28px);left:clamp(18px,6cqi,30px)}
.bxo-lb-runway .bxo-lb-name{font-size:clamp(2.2rem,13cqi,4.4rem);line-height:.95}
.bxo-lb-runway .bxo-lb-cta{margin-top:.8rem}
/* the hint that there is more below: a thin line that grows */
.bxo-lb-runway .bxo-look:not(:last-child) figcaption::after{content:"";position:absolute;right:clamp(18px,6cqi,30px);bottom:clamp(22px,7cqi,34px);width:1px;height:42px;background:linear-gradient(transparent,#fff);animation:bxoDrip 2.2s var(--o-ease) infinite}
@keyframes bxoDrip{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* grid and strip: picture, then words; a tap on the picture shows the order button */
.bxo-lb-grid .bxo-lb-track{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px}
@container (min-width:720px){.bxo-lb-grid .bxo-lb-track{grid-template-columns:repeat(3,minmax(0,1fr))}}
.bxo-lb-strip .bxo-lb-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:2px}
.bxo-lb-strip .bxo-lb-track::-webkit-scrollbar{display:none}
.bxo-lb-strip .bxo-look{flex:0 0 68%;scroll-snap-align:start}
@container (min-width:560px){.bxo-lb-strip .bxo-look{flex-basis:40%}}
.bxo-lb-grid .bxo-look,.bxo-lb-strip .bxo-look{margin:0;min-width:0}
.bxo-lb-pic{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--o-rimg);background:var(--bxb-soft)}
.bxo-lb-pic .bxo-lb-img{transition:transform .9s var(--o-ease)}
.bxo-look:hover .bxo-lb-pic .bxo-lb-img{transform:scale(1.045)}
.bxo-lb-pic .bxo-lb-no{position:absolute;left:10px;top:10px;padding:.35rem .55rem;border-radius:6px;color:#fff;background:rgba(0,0,0,.38);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:.58rem;letter-spacing:.24em;pointer-events:none}
.bxo-lb-tap{display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer;color:inherit}
.bxo-lb-over{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:12px;background:linear-gradient(transparent 45%,rgba(0,0,0,.55));opacity:0;pointer-events:none;transition:opacity .3s}
.bxo-lb-over .bxo-lb-cta{width:100%;transform:translateY(12px);transition:transform .45s var(--o-spring)}
.bxo-look.is-open .bxo-lb-over{opacity:1;pointer-events:auto}
.bxo-look.is-open .bxo-lb-over .bxo-lb-cta{transform:none}
@media (hover:hover){.bxo-look:hover .bxo-lb-over{opacity:1;pointer-events:auto}.bxo-look:hover .bxo-lb-over .bxo-lb-cta{transform:none}}
.bxo-lb-grid figcaption,.bxo-lb-strip figcaption{display:flex;flex-direction:column;gap:.15rem;padding:.7rem 2px 0}
.bxo-lb-grid .bxo-lb-name,.bxo-lb-strip .bxo-lb-name{font-size:1.05rem;line-height:1.1}
.bxo-lb-grid .bxo-lb-det,.bxo-lb-strip .bxo-lb-det{font-size:.62rem;letter-spacing:.12em}

/* ---------- product drop ---------- */
.bxo-dr{position:relative;overflow:hidden;border-radius:var(--bxb-radius)}
.bxo-dr-t{font-size:clamp(1.6rem,9cqi,2.8rem);line-height:.98;text-wrap:balance}
.bxo-dr-price{font-size:1rem;font-weight:650;font-variant-numeric:tabular-nums}
.bxo-dr-clock{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:.6rem}
.bxo-dr-u{display:flex;flex-direction:column;align-items:center;padding:.55rem 0 .45rem;border-radius:calc(var(--o-rimg) - 4px);background:var(--bxb-soft)}
.bxo-dr-u b{font-size:clamp(1.7rem,9cqi,2.7rem);line-height:1;font-variant-numeric:lining-nums tabular-nums;letter-spacing:-.02em;text-transform:none}
.bxo-dr-u small{margin-top:.25rem;font-size:.56rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;opacity:.65}
.bxo-dr-form{display:flex;gap:6px;padding:5px;border-radius:var(--o-rbtn);background:var(--bxb-soft);border:1px solid var(--bxb-line)}
.bxo-dr-field{flex:1;min-width:0;display:flex}
.bxo-dr-field input{flex:1;min-width:0;min-height:44px;padding:0 .9rem;border:0;background:none;color:inherit;font:inherit;font-size:.95rem;outline-offset:-2px}
.bxo-dr-field input::placeholder{color:inherit;opacity:.5}
.bxo-dr-go{flex:none;min-height:44px;padding:0 1.15rem;border:0;border-radius:var(--o-rbtn);background:var(--bxb-accent);color:var(--bxb-accent-ink);font:inherit;font-weight:700;font-size:.9rem;cursor:pointer;transition:transform .3s var(--o-spring)}
.bxo-dr-go:hover{transform:scale(1.03)}
.bxo-dr-wait{display:flex;align-items:center;gap:.5rem;margin-top:.6rem;font-size:.8rem;color:var(--bxb-mute)}
.bxo-dr-wait b{color:var(--bxb-ink);font-variant-numeric:tabular-nums}
.bxo-dr-buy{display:flex;align-items:center;justify-content:center;gap:.6rem;min-height:56px;padding:0 1.3rem;border-radius:var(--o-rbtn);background:var(--bxb-accent);color:var(--bxb-accent-ink)!important;font-weight:750;font-size:1rem;
  box-shadow:0 14px 30px -14px color-mix(in srgb,var(--bxb-accent) 85%,transparent);transition:transform .35s var(--o-spring)}
.bxo-dr-buy:hover{transform:translateY(-2px)}
.bxo-dr-bp{opacity:.75;font-variant-numeric:tabular-nums}
.bxo-dr-bp::before{content:"·";margin-right:.6rem}
.bxo-dr-sold{display:flex;align-items:center;justify-content:center;min-height:56px;border-radius:var(--o-rbtn);border:1.5px dashed currentColor;font-weight:750;letter-spacing:.2em;text-transform:uppercase;font-size:.85rem;opacity:.75}
/* hero: the picture with the name and the clock on it, the waitlist under it */
.bxo-dr-top{position:relative;color:#fff;isolation:isolate}
.bxo-dr-top .bxo-dr-img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.bxo-dr-top::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(0,0,0,.28),transparent 22%,rgba(0,0,0,.18) 38%,rgba(0,0,0,.66) 62%,rgba(0,0,0,.9));pointer-events:none}
.bxo-dr-over{position:absolute;z-index:1;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:.3rem;padding:clamp(16px,6cqi,28px);--bxb-ink:#fff;--bxb-mute:rgba(255,255,255,.75);--bxb-soft:rgba(255,255,255,.12)}
.bxo-dr-over .bxo-chip{position:absolute;top:clamp(14px,5cqi,22px);left:clamp(14px,5cqi,22px);color:#fff;background:rgba(10,10,10,.42);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.bxo-dr-over .bxo-chip .bxo-dot{background:#fff}
.bxo-dr-over .bxo-dr-t{font-size:clamp(2.2rem,13cqi,4.4rem);line-height:.92}
.bxo-dr-over .bxo-dr-u{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.16)}
.bxo-dr-top.no-img{color:var(--bxb-accent-ink);background:var(--bxb-accent)}
.bxo-dr-top.no-img::after{display:none}
.bxo-dr-top.no-img .bxo-dr-over{position:relative;padding-top:64px;--bxb-ink:var(--bxb-accent-ink);--bxb-mute:var(--bxb-accent-ink)}
.bxo-dr-panel{padding:14px}
/* card */
.bxo-dr-card{display:grid;gap:0}
@container (min-width:460px){.bxo-dr-card{grid-template-columns:minmax(0,42%) minmax(0,1fr)}}
.bxo-dr-pic{position:relative;min-height:100%;background:var(--bxb-soft)}
.bxo-dr-pic .bxo-dr-img{display:block;width:100%;height:100%;aspect-ratio:16/11;object-fit:cover}
@container (min-width:460px){.bxo-dr-pic .bxo-dr-img{position:absolute;inset:0;aspect-ratio:auto}}
.bxo-dr-card .bxo-dr-body{display:flex;flex-direction:column;gap:.35rem;padding:clamp(14px,4cqi,22px)}
.bxo-dr-card .bxo-dr-t{font-size:clamp(1.4rem,6cqi,2rem)}
.bxo-dr-card .bxo-dr-u b{font-size:clamp(1.3rem,5.5cqi,1.9rem)}
.bxo-dr-card .bxo-dr-wl,.bxo-dr-card .bxo-dr-after{margin-top:.5rem}
/* ticker: a running strip, the clock and the form in one line */
.bxo-dr-run{overflow:hidden;background:var(--bxb-accent);color:var(--bxb-accent-ink);font-family:var(--o-head);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:.82rem;white-space:nowrap}
.bxo-dr-run>div{display:inline-flex;padding:.7rem 0;animation:bxoRun 26s linear infinite}
.bxo-dr-run span{padding-right:2.4rem}
.bxo-dr-run span::after{content:"✦";margin-left:2.4rem;opacity:.6}
@keyframes bxoRun{to{transform:translateX(-50%)}}
.bxo-dr-ticker .bxo-dr-body{display:flex;flex-direction:column;gap:.6rem;padding:14px}
@container (min-width:600px){.bxo-dr-ticker .bxo-dr-body{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px}.bxo-dr-ticker .bxo-dr-after{grid-column:1/-1}}
.bxo-dr-ticker .bxo-dr-clock{margin:0;gap:4px}
.bxo-dr-ticker .bxo-dr-u{padding:.4rem .55rem .3rem;min-width:58px}
.bxo-dr-ticker .bxo-dr-u b{font-size:1.5rem}
.bxo-dr-ticker .bxo-dr-wait{margin-top:.4rem}

/* ---------- trust badges ---------- */
ul.bxo-tr,.bxo-tr ul{list-style:none;margin:0;padding:0}
.bxo-tr-i{display:flex;align-items:center;gap:.7rem;min-width:0}
.bxo-tr-ico{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:color-mix(in srgb,var(--bxb-accent) 14%,transparent);color:var(--bxb-accent)}
.bxo-tr-w{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.bxo-tr-w b{font-size:.86rem;font-weight:700}
.bxo-tr-w small{font-size:.74rem;color:var(--bxb-mute);margin-top:.12rem}
ul.bxo-tr-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:8px}
ul.bxo-tr-row .bxo-tr-i{padding:10px}
@container (min-width:620px){ul.bxo-tr-row{grid-template-columns:repeat(4,minmax(0,1fr))}}
@container (max-width:300px){ul.bxo-tr-row{grid-template-columns:1fr}}
ul.bxo-tr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:8px}
ul.bxo-tr-grid .bxo-tr-i{flex-direction:column;align-items:flex-start;gap:.9rem;padding:16px;border-radius:calc(var(--bxb-radius) - 6px);background:var(--bxb-soft)}
ul.bxo-tr-grid .bxo-tr-ico{width:46px;height:46px;border-radius:calc(var(--o-rimg) - 4px);background:var(--bxb-accent);color:var(--bxb-accent-ink)}
ul.bxo-tr-grid .bxo-tr-w b{font-size:.95rem}
.bxo-tr-marquee{display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.bxo-tr-marquee .bxo-tr-run{flex:none;display:flex;gap:2rem;padding:14px 2rem 14px 0;animation:bxoMarq 30s linear infinite}
.bxo-tr-marquee .bxo-tr-i{flex:none}
.bxo-tr-marquee .bxo-tr-ico{width:32px;height:32px}
.bxo-tr-marquee .bxo-tr-w b{white-space:nowrap}
.bxo-tr-marquee:hover .bxo-tr-run{animation-play-state:paused}
@keyframes bxoMarq{to{transform:translateX(-100%)}}

/* ---------- projects ---------- */
.bxo-pj-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0 2px 12px}
.bxo-pj-title{font-size:clamp(1.4rem,6cqi,2rem);line-height:1}
.bxo-pj-img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--o-ease)}
/* bento: the first project big, the rest around it; the words slide up on hover */
.bxo-pj-bento .bxo-pj-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.bxo-pj-tile{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:var(--o-rimg);background:var(--bxb-soft);isolation:isolate}
.bxo-pj-tile:first-child{grid-column:span 2;aspect-ratio:16/10}
.bxo-pj-tile:last-child:nth-child(even){grid-column:span 2;aspect-ratio:16/9}
@container (min-width:620px){.bxo-pj-bento .bxo-pj-items{grid-template-columns:repeat(3,minmax(0,1fr))}.bxo-pj-tile:first-child{grid-row:span 2;aspect-ratio:auto}
  .bxo-pj-tile:last-child:nth-child(even){grid-column:auto;aspect-ratio:1}.bxo-pj-tile:last-child:nth-child(3n+4){grid-column:1/-1;aspect-ratio:21/8}.bxo-pj-tile:last-child:nth-child(3n+5){grid-column:span 2;aspect-ratio:auto}}
.bxo-pj-tile:hover .bxo-pj-img{transform:scale(1.07)}
.bxo-pj-cap{position:absolute;z-index:1;left:8px;right:8px;bottom:8px;display:flex;flex-direction:column;gap:.1rem;padding:.6rem .8rem;border-radius:calc(var(--o-rimg) - 6px);
  background:color-mix(in srgb,var(--bxb-solid,#fff) 86%,transparent);color:var(--bxb-ink);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:transform .5s var(--o-spring),opacity .35s}
.bxo-pj-cap .bxo-pj-t{font-size:.98rem;line-height:1.15}
.bxo-pj-cap small{font-size:.72rem;color:var(--bxb-mute)}
.bxo-pj-tile:first-child .bxo-pj-cap .bxo-pj-t{font-size:clamp(1.05rem,4.4cqi,1.5rem)}
@media (hover:hover) and (pointer:fine){.bxo-pj-cap{transform:translateY(calc(100% + 12px));opacity:0}.bxo-pj-tile:hover .bxo-pj-cap,.bxo-pj-tile:focus-visible .bxo-pj-cap{transform:none;opacity:1}}
/* case list: big numbers, the picture follows the cursor */
.bxo-pj-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:clamp(10px,4cqi,20px);min-height:76px;padding:16px 2px;border-top:1px solid color-mix(in srgb,currentColor 16%,transparent);transition:padding .4s var(--o-ease)}
.bxo-pj-row:last-child{border-bottom:1px solid color-mix(in srgb,currentColor 16%,transparent)}
.bxo-pj-no{align-self:start;padding-top:.45rem;font-family:var(--o-mono);font-size:.74rem;opacity:.5;font-variant-numeric:tabular-nums}
.bxo-pj-w{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.bxo-pj-row .bxo-pj-t{font-size:clamp(1.35rem,7cqi,2.4rem);line-height:1;transition:transform .45s var(--o-ease)}
.bxo-pj-row small{font-size:.76rem;opacity:.62}
.bxo-pj-thumb{width:58px;height:44px;overflow:hidden;border-radius:6px}
.bxo-pj-go{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid color-mix(in srgb,currentColor 22%,transparent);transition:transform .45s var(--o-spring),background-color .25s,color .25s,border-color .25s}
.bxo-pj-row:hover .bxo-pj-t{transform:translateX(8px)}
.bxo-pj-row:hover .bxo-pj-go{transform:rotate(45deg);background:var(--bxb-accent);border-color:var(--bxb-accent);color:var(--bxb-accent-ink)}
@media (hover:hover) and (pointer:fine){.bxo-pj-follow-on .bxo-pj-thumb{display:none}}
.bxo-pj-float{position:fixed;left:0;top:0;z-index:50;width:min(300px,40vw);aspect-ratio:4/3;border-radius:var(--o-rimg);overflow:hidden;pointer-events:none;opacity:0;
  transform:translate(var(--x,0),var(--y,0)) translate(-50%,-50%) scale(.85) rotate(var(--r,0deg));transition:opacity .3s,transform .5s var(--o-ease);box-shadow:0 30px 60px -20px rgba(0,0,0,.55)}
.bxo-pj-float.on{opacity:1;transform:translate(var(--x,0),var(--y,0)) translate(-50%,-50%) scale(1) rotate(var(--r,0deg))}
.bxo-pj-float img{display:block;width:100%;height:100%;object-fit:cover}
/* cards */
.bxo-pj-cards .bxo-pj-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@container (max-width:340px){.bxo-pj-cards .bxo-pj-items{grid-template-columns:1fr}}
.bxo-pj-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;overflow:hidden;border-radius:var(--bxb-radius)!important;color:var(--bxb-ink)!important}
.bxo-pj-pic{grid-column:1/-1;display:block;aspect-ratio:4/3;overflow:hidden;margin:6px 6px 0;border-radius:calc(var(--bxb-radius) - 6px)}
.bxo-pj-card .bxo-pj-w{padding:.75rem 0 .85rem .9rem}
.bxo-pj-card .bxo-pj-t{font-size:1rem;line-height:1.15}
.bxo-pj-card small{font-size:.72rem;color:var(--bxb-mute)}
.bxo-pj-card .bxo-pj-go{width:36px;height:36px;margin-right:.6rem;border-color:var(--bxb-line)}
.bxo-pj-card:hover .bxo-pj-img{transform:scale(1.05)}
.bxo-pj-card:hover .bxo-pj-go{transform:translateX(3px);background:var(--bxb-accent);border-color:var(--bxb-accent);color:var(--bxb-accent-ink)}

/* ---------- GitHub ---------- */
.bxo-gh{padding:16px;border-radius:var(--bxb-radius)}
.bxo-gh-who{display:flex;align-items:center;gap:12px}
.bxo-gh-av{flex:none;width:48px;height:48px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px var(--bxb-line)}
.bxo-gh-id{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.bxo-gh-id b{font-size:1.05rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bxo-gh-id small{font-family:var(--o-mono);font-size:.76rem;color:var(--bxb-mute)}
.bxo-gh-follow{flex:none;display:inline-flex;align-items:center;gap:.4rem;margin-left:auto;min-height:44px;padding:0 1rem;border-radius:var(--o-rbtn);background:var(--bxb-soft);border:1px solid var(--bxb-line);font-weight:650;font-size:.84rem;transition:background-color .25s,color .25s}
.bxo-gh-follow:hover{background:var(--bxb-ink);color:var(--bxb-solid,#fff)}
.bxo-gh-scroll{margin:16px 0 8px;overflow-x:auto;direction:rtl;scrollbar-width:none}
.bxo-gh-scroll::-webkit-scrollbar{display:none}
.bxo-gh-cal{direction:ltr;display:grid;grid-template-rows:repeat(7,auto);grid-auto-flow:column;grid-auto-columns:max(9px,calc((100cqi - 32px - 52 * 3px) / 53));gap:3px;width:max-content}
.bxo-gh-cal i,.bxo-gh-legend i{display:block;aspect-ratio:1;border-radius:2px;background:color-mix(in srgb,var(--bxb-ink) 8%,transparent)}
.bxo-gh-cal i.is-pad{background:none}
:is(.bxo-gh-cal,.bxo-gh-legend) .l1{background:color-mix(in srgb,var(--bxb-accent) 32%,transparent)}
:is(.bxo-gh-cal,.bxo-gh-legend) .l2{background:color-mix(in srgb,var(--bxb-accent) 55%,transparent)}
:is(.bxo-gh-cal,.bxo-gh-legend) .l3{background:color-mix(in srgb,var(--bxb-accent) 78%,transparent)}
:is(.bxo-gh-cal,.bxo-gh-legend) .l4{background:var(--bxb-accent);box-shadow:0 0 6px color-mix(in srgb,var(--bxb-accent) 50%,transparent)}
.bx-cell.in .bxo-gh-cal{animation:bxoWipe 1.6s var(--o-ease) both .15s}
@keyframes bxoWipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
.bxo-gh-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:.78rem;color:var(--bxb-mute)}
.bxo-gh-foot b{color:var(--bxb-ink);font-variant-numeric:tabular-nums}
.bxo-gh-legend{display:inline-flex;align-items:center;gap:3px;font-size:.7rem}
.bxo-gh-legend i{width:10px}
.bxo-gh-legend i:first-child{margin-left:4px}.bxo-gh-legend i:last-child{margin-right:4px}
.bxo-gh-nums{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px;padding-top:12px;border-top:1px solid var(--bxb-line);font-size:.8rem;color:var(--bxb-mute)}
.bxo-gh-nums b{color:var(--bxb-ink);font-size:1rem;font-variant-numeric:tabular-nums;margin-right:.15rem}
.bxo-gh-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
@container (max-width:400px){.bxo-gh-grid{grid-template-columns:1fr}}
.bxo-gh-repo{display:flex;flex-direction:column;gap:.35rem;padding:12px 13px;border-radius:calc(var(--bxb-radius) - 6px);background:var(--bxb-soft);border:1px solid var(--bxb-line);transition:border-color .25s,transform .35s var(--o-spring)}
.bxo-gh-repo:hover{border-color:var(--bxb-accent);transform:translateY(-2px)}
.bxo-gh-rn{display:flex;align-items:center;gap:.45rem;font-family:var(--o-mono);font-size:.84rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bxo-gh-rn svg{flex:none;opacity:.55}
.bxo-gh-rd{font-size:.76rem;color:var(--bxb-mute);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bxo-gh-rm{display:flex;gap:12px;margin-top:auto;font-size:.72rem;color:var(--bxb-mute)}
.bxo-gh-rm>span{display:inline-flex;align-items:center;gap:.3rem}
.bxo-gh-rm i{width:9px;height:9px;border-radius:50%}
.bxo-gh-fb{justify-content:center}
/* terminal */
.bxo-gh-term,.bxo-now-term{font-family:var(--o-mono);font-size:.82rem;line-height:1.65}
.bxo-gh-term{padding:0;overflow:hidden}
.bxo-term-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;border-bottom:1px solid var(--bxb-line);background:var(--bxb-soft)}
.bxo-term-bar i{width:11px;height:11px;border-radius:50%;background:#ff5f57}
.bxo-term-bar i:nth-child(2){background:#febc2e}.bxo-term-bar i:nth-child(3){background:#28c840}
.bxo-term-bar span{flex:1;text-align:center;margin-right:45px;font-size:.72rem;color:var(--bxb-mute)}
.bxo-term-body{padding:14px 16px 16px;overflow-wrap:anywhere}
.bxo-term-body p{margin:0}
.bxo-term-out{margin:0 0 .7rem!important;color:var(--bxb-ink);opacity:.86}
.bxo-term-out b{color:var(--bxb-accent);font-weight:700}
.bxo-term-out a{display:inline-block;min-height:28px;color:var(--bxb-accent)!important;text-decoration:underline!important;text-underline-offset:3px;margin-right:.4rem}
.bxo-term-p{color:var(--bxb-accent);font-weight:700}
.bxo-nw{white-space:nowrap}
.bxo-caret{display:inline-block;width:.6em;height:1.15em;margin-left:.15em;vertical-align:text-bottom;background:var(--bxb-accent);animation:bxoBlink 1.1s steps(1) infinite}
@keyframes bxoBlink{50%{opacity:0}}
.bxo-typing .bxo-term-out,.bxo-typing .bxo-term-cmd{visibility:hidden}
.bxo-typing .bxo-term-cmd.on,.bxo-typing .bxo-term-out.on{visibility:visible}

/* ---------- currently ---------- */
.bxo-pulse{position:relative;flex:none;width:8px;height:8px;border-radius:50%;background:var(--o-dot,#22c55e)}
.bxo-pulse::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:bxoPulse 2s var(--o-ease) infinite}
.bxo-pulse.is-busy{--o-dot:#f59e0b}
.bxo-pulse.is-off{--o-dot:color-mix(in srgb,currentColor 40%,transparent)}
.bxo-pulse.is-off::after{display:none}
@keyframes bxoPulse{0%{transform:scale(1);opacity:.7}80%,100%{transform:scale(3);opacity:0}}
.bxo-now-time{font-family:var(--o-mono);font-size:.78em;font-variant-numeric:tabular-nums;white-space:nowrap;opacity:.75}
.bxo-now-pill{display:flex;justify-content:center}
.bxo-now-in{display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:.4rem .6rem;max-width:100%;min-height:44px;padding:.5rem 1.05rem .5rem .9rem;border-radius:var(--o-rbtn)!important;font-size:.88rem;line-height:1.3}
.bxo-now-l{font-weight:700}
.bxo-now-l::after{content:"·";margin-left:.55rem;opacity:.4}
.bxo-now-sep{width:1px;height:14px;background:currentColor;opacity:.2}
.bxo-now-card{display:flex;flex-direction:column;gap:.6rem;padding:16px 18px 18px;border-radius:var(--bxb-radius)}
.bxo-now-top{display:flex;align-items:center;gap:.6rem}
.bxo-now-top .bxo-now-time{margin-left:auto}
.bxo-now-card .bxo-now-t{font-size:clamp(1.35rem,6.5cqi,2.1rem);line-height:1.08;text-wrap:balance}
.bxo-now-term{padding:12px 16px;border-radius:var(--bxb-radius)}
.bxo-now-term .bxo-now-time{font-size:1em;opacity:1}

/* ---------- people who prefer less motion ---------- */
@media (prefers-reduced-motion:reduce){
  .bxo-vinyl-label,.bxo-pl.is-playing .bxo-vinyl-label,.bxo-pl.is-playing.no-lv .bxo-bars i,.bxo-chip .bxo-dot,.bxo-dr-wait .bxo-dot,.bxo-pulse::after,.bxo-caret,.bx-cell.in .bxo-gh-cal,
  .bxo-lb-runway .bxo-look figcaption::after{animation:none!important}
  .bxo-dr-run>div{animation:none;flex-wrap:wrap;white-space:normal}
  .bxo-tr-marquee{flex-wrap:wrap;-webkit-mask-image:none;mask-image:none}
  .bxo-tr-marquee .bxo-tr-run{animation:none;flex-wrap:wrap;gap:.6rem 1.4rem;padding:14px}
  .bxo-tr-marquee .bxo-tr-run[aria-hidden]{display:none}
  .bxo-rel-art .bxo-vinyl,.bxo-pj-float,.bxo-lb-runway .bxo-lb-img,.bxo-pj-img,.bxo-lb-img{transition:none!important}
  .bxo-lb-runway .bxo-lb-img{transform:none}
  .bxo-pj-float{display:none}
}
/* the pill keeps to one line: no label, no place name (the card and terminal show them) */
.bxo-now-pill :is(.bxo-now-l,.bxo-now-time>span){display:none}
.bxo-rel-poster .bxo-rel-body,.bxo-dr-over,.bxo-lb-runway figcaption{text-shadow:0 1px 18px rgba(0,0,0,.35)}
.bxo-st-words b{white-space:normal;overflow-wrap:anywhere}
@container (max-width:420px){.bxo-st-tile>svg:last-child{display:none}.bxo-st-tile{gap:10px;padding:12px}}

/* =====================================================================
   Writers, video creators, authors, creators and news pages: posts, videos, books, mediakit, postgrid
   ===================================================================== */
.bxo-po-t,.bxo-po-name,.bxo-bk-t,.bxo-bk-title,.bxo-mk-name,.bxo-mk-n,.bxo-mk-total b,.bxo-pg-title,.bxo-pg-t{font-family:var(--o-head);font-weight:var(--bx-weight,800);letter-spacing:var(--bx-track,-.02em);text-transform:var(--bx-case,none)}
.bxo-clamp2,.bxo-po-x,.bxo-yt-t{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
/* the editor's note when a feed cannot be read (never on the live page) */
.bxo-hint{display:flex;align-items:center;gap:.75rem;padding:14px 16px;font-size:.88rem;line-height:1.4;color:var(--bxb-mute)!important;border:1.5px dashed var(--bxb-line)!important;box-shadow:none!important}
.bxo-hint svg{flex:none;color:var(--bxb-accent)}

/* ---------- latest posts ---------- */
.bxo-po{padding:clamp(14px,4.5cqi,24px);border-radius:var(--bxb-radius)}
.bxo-po-head{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;margin-bottom:.5rem}
.bxo-po-mark{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--bc,var(--bxb-accent));color:var(--bci,var(--bxb-accent-ink))}
.bxo-po-name{flex:1 1 8rem;min-width:0;font-size:1.08rem;line-height:1.15}
.bxo-po-sub{flex:none;display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:0 1.05rem;border-radius:var(--o-rbtn);background:var(--bxb-accent);color:var(--bxb-accent-ink)!important;font-weight:700;font-size:.86rem;
  transition:transform .35s var(--o-spring)}
.bxo-po-sub:hover{transform:translateY(-2px)}
.bxo-po-meta{display:flex;flex-wrap:wrap;gap:.2rem .55rem;font-family:var(--o-mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bxb-mute)}
.bxo-po-meta>*+*::before{content:"·";margin-right:.55rem;opacity:.6}
.bxo-po-x{font-size:.88rem;line-height:1.5;color:var(--bxb-mute)}
.bxo-po-img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--o-ease)}
.bxo-po-fb{display:grid;place-items:center;background:linear-gradient(140deg,color-mix(in srgb,var(--bxb-accent) 22%,var(--bxb-soft)),var(--bxb-soft));color:var(--bxb-accent);font-family:var(--o-head);font-weight:800;font-size:2.4rem}
/* list: an editorial index, a hairline between posts */
.bxo-po-list .bxo-po-row{position:relative;display:flex;flex-direction:column;gap:.4rem;padding:16px 52px 16px 0;border-top:1px solid var(--bxb-line)}
.bxo-po-list .bxo-po-t{font-size:clamp(1.12rem,4.6cqi,1.45rem);line-height:1.18;text-wrap:pretty;transition:color .25s}
.bxo-po-go{position:absolute;right:0;top:50%;display:grid;place-items:center;width:40px;height:40px;margin-top:-20px;border-radius:50%;border:1px solid var(--bxb-line);transition:transform .45s var(--o-spring),background-color .25s,color .25s,border-color .25s}
.bxo-po-list .bxo-po-row:hover .bxo-po-go{transform:rotate(-45deg);background:var(--bxb-accent);border-color:var(--bxb-accent);color:var(--bxb-accent-ink)}
/* cards */
.bxo-po-cards .bxo-po-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:.4rem}
@container (min-width:600px){.bxo-po-cards .bxo-po-items{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}}
.bxo-po-card{display:flex;flex-direction:column;overflow:hidden;border-radius:calc(var(--bxb-radius) - 4px);background:var(--bxb-soft);border:1px solid var(--bxb-line);transition:transform .4s var(--o-spring),border-color .25s}
.bxo-po-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--bxb-accent) 40%,var(--bxb-line))}
.bxo-po-card:hover .bxo-po-img{transform:scale(1.05)}
.bxo-po-pic{display:block;overflow:hidden;aspect-ratio:16/10;background:var(--bxb-soft)}
.bxo-po-card .bxo-po-w{display:flex;flex-direction:column;gap:.35rem;padding:.75rem .8rem .9rem}
.bxo-po-card .bxo-po-t{font-size:.98rem;line-height:1.22;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.bxo-po-card .bxo-po-x{font-size:.8rem}
@container (max-width:460px){.bxo-po-card .bxo-po-x{display:none}.bxo-po-card .bxo-po-meta>span{display:none}}
/* magazine: the latest big, the rest as a column of small rows */
.bxo-po-mag .bxo-po-items{display:grid;gap:0;margin-top:.4rem}
@container (min-width:640px){.bxo-po-mag .bxo-po-items{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);column-gap:24px}.bxo-po-lead{grid-row:span 8}}
.bxo-po-lead{display:flex;flex-direction:column;gap:.45rem;padding-bottom:14px}
.bxo-po-lead .bxo-po-w{display:flex;flex-direction:column;gap:.45rem}
.bxo-po-card:last-child:nth-child(odd){grid-column:1/-1}
.bxo-po-card:last-child:nth-child(odd) .bxo-po-pic{aspect-ratio:2/1}
.bxo-po-lead .bxo-po-pic{aspect-ratio:16/10;border-radius:var(--o-rimg);margin-bottom:.45rem}
.bxo-po-lead:hover .bxo-po-img{transform:scale(1.04)}
.bxo-po-lead .bxo-k{color:var(--bxb-accent);opacity:1}
.bxo-po-lead .bxo-po-t{font-size:clamp(1.45rem,7cqi,2.2rem);line-height:1.06;text-wrap:balance}
.bxo-po-lead .bxo-po-x{-webkit-line-clamp:3}
.bxo-po-mag .bxo-po-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;padding:13px 0;border-top:1px solid var(--bxb-line)}
.bxo-po-mag .bxo-po-row .bxo-po-w{display:flex;flex-direction:column;gap:.35rem}
.bxo-po-mag .bxo-po-row .bxo-po-t{font-size:1rem;line-height:1.25;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.bxo-po-thumb{display:block;width:72px;height:72px;overflow:hidden;border-radius:calc(var(--o-rimg) - 6px)}
.bxo-po-thumb .bxo-po-fb{font-size:1.4rem}
.bxo-po-mag .bxo-po-row:hover .bxo-po-t,.bxo-po-list .bxo-po-row:hover .bxo-po-t{color:var(--bxb-accent)}

/* ---------- latest videos ---------- */
.bxo-yt .bxo-po-head{margin-bottom:.8rem}
.bxo-yt-v{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.bxo-yt-pic{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:var(--o-rimg);background:color-mix(in srgb,currentColor 10%,transparent);box-shadow:0 14px 30px -20px rgba(0,0,0,.6)}
.bxo-yt-img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--o-ease)}
.bxo-yt-play{position:absolute;right:8px;top:8px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(10,10,10,.62);color:#fff;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .4s var(--o-spring),background-color .25s}
.bxo-yt-play svg{margin-left:2px}
.bxo-yt-v:hover .bxo-yt-img{transform:scale(1.05)}
.bxo-yt-v:hover .bxo-yt-play{transform:scale(1.12);background:#ff0033}
.bxo-yt-w{display:flex;flex-direction:column;gap:.2rem;padding:0 2px}
.bxo-yt-t{font-weight:650;font-size:.88rem;line-height:1.3}
.bxo-yt-w small{font-size:.72rem;opacity:.65;font-variant-numeric:tabular-nums}
/* grid */
.bxo-yt-grid .bxo-yt-items,.bxo-yt-featured .bxo-yt-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px}
@container (min-width:620px){.bxo-yt-grid .bxo-yt-items{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 14px}}
/* featured: the newest across the top, bigger */
.bxo-yt-featured .is-lead{grid-column:1/-1}
.bxo-yt-featured .is-lead .bxo-yt-t{font-family:var(--o-head);font-weight:var(--bx-weight,800);letter-spacing:var(--bx-track,-.02em);font-size:clamp(1.1rem,5cqi,1.5rem);line-height:1.15}
.bxo-yt-featured .is-lead .bxo-yt-play{left:50%;top:50%;bottom:auto;width:64px;height:64px;margin:-32px 0 0 -32px;background:#ff0033}
.bxo-yt-featured .is-lead .bxo-yt-play svg{width:26px;height:26px}
@container (min-width:620px){.bxo-yt-featured .bxo-yt-items{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* rail: one row that scrolls sideways */
.bxo-yt-rail .bxo-yt-items,.bxo-yt-shorts{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px;overscroll-behavior-x:contain}
:is(.bxo-yt-rail .bxo-yt-items,.bxo-yt-shorts)::-webkit-scrollbar{display:none}
.bxo-yt-rail .bxo-yt-items>*{flex:0 0 78%;scroll-snap-align:start}
@container (min-width:620px){.bxo-yt-rail .bxo-yt-items>*{flex-basis:44%}}
/* shorts: tall tiles in a row of their own */
.bxo-yt-sh{margin-top:20px}
.bxo-yt-sh>.bxo-k{display:block;margin:0 2px 8px}
.bxo-yt-shorts>*{flex:0 0 clamp(118px,31cqi,170px);scroll-snap-align:start}
.bxo-yt-v.is-short .bxo-yt-pic{aspect-ratio:9/16}
.bxo-yt-v.is-short .bxo-yt-t{font-size:.8rem}
/* a video that was tapped plays where its tile was */
.bxo-yt-items>.bx-embed{grid-column:span 1;min-width:0;max-width:none!important}
.bxo-yt-featured .bxo-yt-items>.bx-embed:first-child{grid-column:1/-1}
.bxo-yt-shorts>.bx-embed{aspect-ratio:9/16!important;max-width:none!important}

/* ---------- books ---------- */
.bxo-bk{padding:clamp(14px,4.5cqi,24px);border-radius:var(--bxb-radius)}
.bxo-bk-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0 2px 6px}
.bxo-bk-title{font-size:clamp(1.3rem,5.6cqi,1.8rem);line-height:1}
/* a cover, uploaded or drawn; the spine is a shade down its left edge */
.bxo-bk-cover{position:relative;display:block;aspect-ratio:2/3;overflow:hidden;border-radius:3px 7px 7px 3px;background:var(--bxb-soft);container-type:inline-size;
  box-shadow:0 1px 1px rgba(0,0,0,.12),0 16px 28px -14px rgba(0,0,0,.55)}
.bxo-bk-cover::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.34) 0,rgba(255,255,255,.22) 3.5%,rgba(0,0,0,.14) 6%,transparent 10%,transparent 88%,rgba(255,255,255,.08))}
.bxo-bk-img{display:block;width:100%;height:100%;object-fit:cover}
.bxo-bk-cover.is-drawn{display:flex;flex-direction:column;padding:16% 12% 12% 15%;color:#f7f2e8;text-align:left;
  background:radial-gradient(120% 70% at 85% 0%,hsl(var(--hue) 48% 46% / .9),transparent 60%),linear-gradient(165deg,hsl(var(--hue) 42% 32%),hsl(calc(var(--hue) + 28) 46% 17%))}
.bxo-bk-dt{font-family:var(--o-head);font-weight:700;font-size:clamp(.7rem,19cqi,2.6rem);line-height:1;letter-spacing:-.01em;text-wrap:balance;overflow-wrap:anywhere}
.bxo-bk-cover.is-drawn i{display:block;width:30%;height:2px;margin-top:auto;margin-bottom:8%;background:currentColor;opacity:.55}
.bxo-bk-da{font-size:clamp(.42rem,7.2cqi,.9rem);font-weight:700;letter-spacing:.18em;text-transform:uppercase;opacity:.86}
.bxo-bk-cover.is-3d{transform:perspective(900px) rotateY(16deg);transform-origin:left center;transition:transform .7s var(--o-spring),box-shadow .5s;
  box-shadow:1px 0 0 #efe9dc,2px 0 0 #d9d2c3,3px 1px 0 #ece6d8,4px 1px 0 #d2cab9,5px 2px 0 #e6dfcf,0 22px 34px -16px rgba(0,0,0,.6)}
/* the words about a book */
.bxo-bk-t{display:block;font-size:clamp(1.3rem,6cqi,1.9rem);line-height:1.08}
.bxo-bk-meta{display:block;margin-top:.3rem;font-size:.84rem;color:var(--bxb-mute)}
.bxo-bk-rate{display:inline-flex;align-items:center;gap:.35rem;margin-top:.6rem;padding:.3rem .65rem;border-radius:99px;background:var(--bxb-soft);font-size:.78rem;font-weight:650}
.bxo-bk-rate svg{color:#f5a524}
.bxo-bk-blurb{margin:.75rem 0 0;font-size:.94rem;line-height:1.58;text-wrap:pretty}
.bxo-bk-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:1rem}
.bxo-bk-buy,.bxo-bk-shop{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;padding:0 1.1rem;border-radius:var(--o-rbtn);font-weight:700;font-size:.86rem;
  transition:transform .35s var(--o-spring),background-color .25s,border-color .25s}
.bxo-bk-buy{flex:1 1 100%;background:var(--bxb-accent);color:var(--bxb-accent-ink)!important;box-shadow:0 12px 26px -14px color-mix(in srgb,var(--bxb-accent) 80%,transparent)}
@container (min-width:520px){.bxo-bk-buy{flex:0 1 auto;padding:0 1.5rem}}
.bxo-bk-shop{background:var(--bxb-soft);border:1px solid var(--bxb-line);font-weight:650}
.bxo-bk-shop>i{width:8px;height:8px;border-radius:50%}
.bxo-bk-buy:hover,.bxo-bk-shop:hover{transform:translateY(-2px)}
.bxo-bk-shop:hover{border-color:color-mix(in srgb,currentColor 35%,transparent)}
/* shelf: covers standing on a ledge, the open one lifted and turned to face you */
.bxo-bk-ledge{position:relative;margin:4px -4px 0;padding:18px 4px 0}
.bxo-bk-ledge::after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:12px;border-radius:3px;
  background:linear-gradient(color-mix(in srgb,var(--bxb-ink) 16%,var(--bxb-bg)),color-mix(in srgb,var(--bxb-ink) 8%,var(--bxb-bg)));box-shadow:0 10px 18px -10px rgba(0,0,0,.45)}
.bxo-bk-spots{display:flex;align-items:flex-end;gap:clamp(14px,5cqi,26px);overflow-x:auto;scrollbar-width:none;padding:18px 12px 0 6px;margin-top:-12px;scroll-snap-type:x proximity}
.bxo-bk-spots::-webkit-scrollbar{display:none}
.bxo-bk-spot{flex:none;width:clamp(86px,27cqi,150px);padding:0;border:0;background:none;color:inherit;cursor:pointer;scroll-snap-align:start;transition:transform .55s var(--o-spring)}
.bxo-bk-spot[aria-expanded=true]{transform:translateY(-10px)}
.bxo-bk-spot[aria-expanded=true] .is-3d,.bxo-bk-spot:hover .is-3d{transform:perspective(900px) rotateY(0)}
.bxo-bk-spot[aria-expanded=false] .bxo-bk-cover{filter:saturate(.85)}
.bxo-bk-panel{padding:26px 2px 2px}
.bxo-bk-panel:not([hidden]){animation:bxoRise .5s var(--o-ease)}
@keyframes bxoRise{from{opacity:0;transform:translateY(8px)}}
/* feature: one book big */
.bxo-bk-hero{display:grid;gap:18px}
@container (min-width:540px){.bxo-bk-hero{grid-template-columns:minmax(0,40%) minmax(0,1fr);align-items:center;gap:28px}}
.bxo-bk-stage{display:grid;place-items:center;padding:22px 10px 26px;border-radius:calc(var(--bxb-radius) - 4px);
  background:radial-gradient(70% 60% at 50% 45%,color-mix(in srgb,var(--bxb-accent) 16%,transparent),transparent 70%),var(--bxb-soft)}
.bxo-bk-stage .bxo-bk-cover{width:min(56%,230px)}
@container (min-width:540px){.bxo-bk-stage .bxo-bk-cover{width:min(72%,240px)}}
.bxo-bk-feature .bxo-bk-w>.bxo-k{display:block;margin-bottom:.45rem;color:var(--bxb-accent);opacity:1}
.bxo-bk-feature .bxo-bk-t{font-size:clamp(1.7rem,8cqi,2.6rem);line-height:1}
.bxo-bk-feature:hover .is-3d{transform:perspective(900px) rotateY(4deg)}
.bxo-bk-also{margin-top:20px;padding-top:14px;border-top:1px solid var(--bxb-line)}
.bxo-bk-mrow{display:flex;gap:12px;margin-top:10px;overflow-x:auto;scrollbar-width:none}
.bxo-bk-more{flex:0 0 78px;display:flex;flex-direction:column;gap:.4rem}
.bxo-bk-mt{font-size:.74rem;font-weight:650;line-height:1.25}
.bxo-bk-more:hover .bxo-bk-cover{transform:translateY(-3px)}
.bxo-bk-more .bxo-bk-cover{transition:transform .4s var(--o-spring)}
/* list */
.bxo-bk-row{display:grid;grid-template-columns:clamp(68px,20cqi,96px) minmax(0,1fr);gap:16px;align-items:start;padding:16px 0;border-top:1px solid var(--bxb-line)}
.bxo-bk-head+.bxo-bk-row{border-top:0}
.bxo-bk-list .bxo-bk-t{font-size:clamp(1.1rem,4.8cqi,1.35rem)}
.bxo-bk-list .bxo-bk-rate{margin-top:.45rem}
.bxo-bk-list .bxo-bk-btns{margin-top:.75rem}
.bxo-bk-list .bxo-bk-buy{flex:0 1 auto}

/* ---------- media kit ---------- */
.bxo-mk{padding:clamp(16px,5cqi,28px);border-radius:var(--bxb-radius)}
.bxo-mk-head{display:flex;flex-direction:column;gap:.3rem}
.bxo-mk-head .bxo-k{color:var(--bxb-accent);opacity:1}
.bxo-mk-name{font-size:clamp(1.7rem,8.5cqi,2.8rem);line-height:1}
.bxo-mk-line{font-size:.92rem;line-height:1.45;color:var(--bxb-mute);text-wrap:pretty}
.bxo-mk-total{display:flex;align-items:baseline;flex-wrap:wrap;gap:.3rem .7rem;margin-top:18px}
.bxo-mk-total b{font-size:clamp(2.8rem,16cqi,5rem);line-height:.9;font-variant-numeric:lining-nums tabular-nums;letter-spacing:-.04em;text-transform:none}
.bxo-mk-total span{font-size:.86rem;color:var(--bxb-mute)}
.bxo-mk-pm{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:color-mix(in srgb,var(--bc,var(--bxb-accent)) 14%,transparent);color:var(--bc,var(--bxb-accent))}
.bxo-mk-h{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;font-weight:650}
.bxo-mk-n{font-variant-numeric:lining-nums tabular-nums;text-transform:none;line-height:1}
.bxo-k+ul,.bxo-k+.bxo-mk-split{margin-top:.6rem}
.bxo-mk :is(.bxo-mk-auds,.bxo-mk-brands,.bxo-mk-rates,.bxo-mk-btns,.bxo-mk-tiles,.bxo-mk-table,.bxo-mk-list){margin-top:22px}
.bxo-mk ul{list-style:none;margin:0;padding:0}
/* dashboard: a tile a platform */
.bxo-mk-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
@container (min-width:640px){.bxo-mk-tiles{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}}
.bxo-mk-tile{display:flex;flex-direction:column;min-width:0;padding:14px;border-radius:calc(var(--bxb-radius) - 6px);background:var(--bxb-soft);border:1px solid var(--bxb-line);transition:transform .4s var(--o-spring),border-color .25s}
a.bxo-mk-tile:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--bc,var(--bxb-accent)) 50%,var(--bxb-line))}
.bxo-mk-top{display:flex;align-items:center;gap:.5rem;min-width:0;margin-bottom:14px}
.bxo-mk-tile .bxo-mk-n{font-size:clamp(1.8rem,9cqi,2.5rem)}
.bxo-mk-u{margin-top:.3rem;font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--bxb-mute)}
.bxo-mk-small{display:flex;flex-wrap:wrap;gap:.15rem .7rem;margin-top:.7rem;padding-top:.6rem;border-top:1px solid var(--bxb-line);font-size:.72rem;color:var(--bxb-mute)}
.bxo-mk-small b{color:var(--bxb-ink);font-variant-numeric:tabular-nums}
/* audience */
.bxo-mk-auds{display:grid;gap:20px}
@container (min-width:640px){.bxo-mk-auds{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}
.bxo-mk-aud li{display:grid;grid-template-columns:minmax(0,6.5em) minmax(0,1fr) 2.8em;align-items:center;gap:10px;min-height:26px;font-size:.82rem}
.bxo-mk-aud li>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bxo-mk-aud li b{text-align:right;font-variant-numeric:tabular-nums;font-size:.8rem}
.bxo-mk-bar{height:6px;border-radius:6px;background:var(--bxb-soft);overflow:hidden}
.bxo-mk-bar i{display:block;height:100%;border-radius:inherit;background:var(--bxb-accent);transform-origin:left;animation:bxoGrow 1s var(--o-ease) both .2s}
@keyframes bxoGrow{from{transform:scaleX(0)}}
.bxo-mk-split{display:flex;gap:3px;height:12px;border-radius:12px;overflow:hidden}
.bxo-mk-split i,.bxo-mk-keys i{display:block;background:var(--bxb-accent)}
:is(.bxo-mk-split,.bxo-mk-keys) .g1{background:color-mix(in srgb,var(--bxb-accent) 45%,var(--bxb-soft))}
:is(.bxo-mk-split,.bxo-mk-keys) .g2{background:color-mix(in srgb,var(--bxb-ink) 25%,transparent)}
.bxo-mk-keys{display:flex;flex-wrap:wrap;gap:.3rem 1rem;margin-top:.6rem;font-size:.8rem}
.bxo-mk-keys>span{display:inline-flex;align-items:center;gap:.4rem}
.bxo-mk-keys i{width:9px;height:9px;border-radius:50%}
.bxo-mk-keys b{font-variant-numeric:tabular-nums}
/* brands and rates */
.bxo-mk-brands ul{display:flex;flex-wrap:wrap;gap:6px}
.bxo-mk-brands li{display:flex;align-items:center;min-height:36px;padding:0 .85rem;border-radius:var(--o-rbtn);border:1px solid var(--bxb-line);font-size:.8rem;font-weight:650}
.bxo-mk-logo{display:block;height:22px;width:auto;max-width:110px;object-fit:contain}
.bxo-mk-rates li{display:flex;align-items:baseline;gap:.6rem;padding:.55rem 0;font-size:.9rem}
.bxo-mk-rates li>i{flex:1;min-width:1rem;border-bottom:1.5px dotted color-mix(in srgb,var(--bxb-ink) 30%,transparent);transform:translateY(-.25em)}
.bxo-mk-rates li>b{font-variant-numeric:tabular-nums;white-space:nowrap}
.bxo-mk-btns{display:flex;flex-wrap:wrap;gap:8px}
.bxo-mk-go,.bxo-mk-pdf{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:50px;padding:0 1.3rem;border-radius:var(--o-rbtn);font-weight:700;font-size:.92rem;transition:transform .35s var(--o-spring)}
.bxo-mk-go{flex:1 1 12rem;background:var(--bxb-accent);color:var(--bxb-accent-ink)!important;box-shadow:0 14px 28px -16px color-mix(in srgb,var(--bxb-accent) 85%,transparent)}
.bxo-mk-pdf{flex:1 1 12rem;border:1.5px solid var(--bxb-line);background:var(--bxb-soft)}
.bxo-mk-go:hover,.bxo-mk-pdf:hover{transform:translateY(-2px)}
/* sheet: a printed one-page rate card */
.bxo-mk-sheet .bxo-mk-head{padding-bottom:16px;border-bottom:2px solid var(--bxb-ink)}
.bxo-mk-sheet .bxo-mk-total{margin-top:14px}
.bxo-mk-sheet .bxo-mk-total b{font-size:clamp(2rem,10cqi,3rem)}
.bxo-mk-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:.86rem}
.bxo-mk-table th,.bxo-mk-table td{padding:.5rem .2rem;border-bottom:1px solid var(--bxb-line);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bxo-mk-table thead th{font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--bxb-mute)}
.bxo-mk-table :is(th,td):first-child{width:44%;text-align:left}
.bxo-mk-table tbody th{font-weight:650}
.bxo-mk-table td:nth-child(2){font-weight:750}
.bxo-mk-ph{display:flex;align-items:center;gap:.5rem;min-height:40px;min-width:0}
.bxo-mk-ph>span:last-child{overflow:hidden;text-overflow:ellipsis}
.bxo-mk-ph .bxo-mk-pm{width:26px;height:26px}
.bxo-mk-sheet .bxo-mk-rates li{border-bottom:1px solid var(--bxb-line)}
.bxo-mk-sheet .bxo-mk-rates li>i{visibility:hidden}
.bxo-mk-sheet .bxo-mk-bar i{background:var(--bxb-ink)}
/* compact */
.bxo-mk-crow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;min-height:60px;padding:8px 0;border-top:1px solid var(--bxb-line)}
.bxo-mk-crow:first-child{border-top:0}
.bxo-mk-cw{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.bxo-mk-cw small{display:flex;flex-wrap:wrap;gap:0 .6rem;font-size:.72rem;color:var(--bxb-mute)}
.bxo-mk-cw small b{color:var(--bxb-ink)}
.bxo-mk-cn{display:flex;flex-direction:column;align-items:flex-end}
.bxo-mk-cn .bxo-mk-n{font-size:1.45rem}
.bxo-mk-cn small{font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bxb-mute)}
.bxo-mk-compact .bxo-mk-list{margin-top:12px}
.bxo-mk-from{margin:14px 0 0;font-size:.88rem;color:var(--bxb-mute)}
.bxo-mk-from b{color:var(--bxb-ink);font-variant-numeric:tabular-nums}
.bxo-mk-compact .bxo-mk-btns{margin-top:14px}

/* ---------- post grid ---------- */
.bxo-pg [hidden]{display:none!important}
.bxo-pg-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0 2px 12px}
.bxo-pg-title{font-size:clamp(1.25rem,5.4cqi,1.7rem);line-height:1.05}
.bxo-pg-find{display:flex;align-items:center;gap:.55rem;min-height:48px;margin-bottom:12px;padding:0 6px 0 16px;border-radius:var(--o-rbtn)!important;cursor:text}
.bxo-pg-find svg{flex:none;opacity:.6}
.bxo-pg-find input{flex:1;min-width:0;min-height:44px;border:0;background:none;color:inherit;font:inherit;font-size:.95rem;outline:0}
.bxo-pg-find input::placeholder{color:inherit;opacity:.5}
.bxo-pg-find:focus-within{outline:2px solid var(--bxb-accent);outline-offset:2px}
.bxo-pg-none{margin:14px 2px 0;font-size:.88rem;opacity:.7}
.bxo-pg-img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--o-ease)}
.bxo-pg-fb{display:grid;place-items:center;padding:10px;background:var(--bxb-accent);color:var(--bxb-accent-ink);font-family:var(--o-head);font-weight:700;font-size:.8rem;line-height:1.2;text-align:center}
.bxo-pg-tag{align-self:flex-start;font-size:.58rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
/* grid: three across and square, like a profile */
.bxo-pg-grid .bxo-pg-items,.bxo-pg-mosaic .bxo-pg-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;border-radius:var(--o-rimg);overflow:hidden}
.bxo-pg-mosaic .bxo-pg-items{grid-auto-flow:dense;gap:4px}
.bxo-pg-tile{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:color-mix(in srgb,currentColor 10%,transparent);isolation:isolate}
.bxo-pg-tile:hover .bxo-pg-img{transform:scale(1.06)}
.bxo-pg-over{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;gap:.3rem;padding:10px;color:#fff;
  background:linear-gradient(transparent 30%,rgba(0,0,0,.78));opacity:0;transition:opacity .3s}
.bxo-pg-tile:hover .bxo-pg-over,.bxo-pg-tile:focus-visible .bxo-pg-over{opacity:1}
.bxo-pg-cap{font-size:.76rem;font-weight:650;line-height:1.25;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.bxo-pg-over .bxo-pg-tag{padding:.2rem .45rem;border-radius:4px;background:var(--bxb-accent);color:var(--bxb-accent-ink)}
.bxo-pg-when{position:absolute;z-index:2;left:6px;top:6px;padding:.18rem .4rem;border-radius:5px;background:rgba(10,10,10,.55);color:#fff;font-size:.56rem;font-weight:700;letter-spacing:.04em;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:none}
@container (max-width:340px){.bxo-pg-when{display:none}}
/* mosaic: a big tile every six, left then right; the big ones keep their words showing */
.bxo-pg-mosaic .bxo-pg-tile{border-radius:calc(var(--o-rimg) - 8px)}
.bxo-pg-mosaic .bxo-pg-tile:nth-child(6n+1){grid-column:span 2;grid-row:span 2}
.bxo-pg-mosaic .bxo-pg-tile:nth-child(6n+4){grid-column:2/span 2;grid-row:span 2}
.bxo-pg-mosaic .bxo-pg-tile:is(:nth-child(6n+1),:nth-child(6n+4)) .bxo-pg-over{opacity:1;padding:14px}
.bxo-pg-mosaic .bxo-pg-tile:is(:nth-child(6n+1),:nth-child(6n+4)) .bxo-pg-cap{font-family:var(--o-head);font-weight:var(--bx-weight,800);letter-spacing:var(--bx-track,-.02em);font-size:clamp(.95rem,4.6cqi,1.4rem);line-height:1.1}
/* headlines: a news list, picture beside the headline */
.bxo-pg-headlines{padding:6px clamp(14px,4.5cqi,22px);border-radius:var(--bxb-radius)}
.bxo-pg-headlines .bxo-pg-head{margin:14px 0 4px}
.bxo-pg-headlines .bxo-pg-find{margin:10px 0 6px;background:var(--bxb-soft)!important;box-shadow:none!important;border:1px solid var(--bxb-line)!important}
.bxo-pg-row{display:grid;grid-template-columns:clamp(76px,24cqi,104px) minmax(0,1fr);align-items:center;gap:14px;padding:12px 0;border-top:1px solid var(--bxb-line)}
.bxo-pg-items>.bxo-pg-row:first-child{border-top:0}
.bxo-pg-thumb{display:block;aspect-ratio:1;overflow:hidden;border-radius:calc(var(--o-rimg) - 6px)}
.bxo-pg-row:hover .bxo-pg-img{transform:scale(1.06)}
.bxo-pg-w{display:flex;flex-direction:column;gap:.3rem;min-width:0}
.bxo-pg-w .bxo-pg-tag{color:var(--bxb-accent)}
.bxo-pg-t{font-size:clamp(1rem,4.3cqi,1.2rem);line-height:1.2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;transition:color .25s}
.bxo-pg-row:hover .bxo-pg-t{color:var(--bxb-accent)}
.bxo-pg-w small{font-size:.74rem;color:var(--bxb-mute)}
.bxo-pg-headlines .bxo-pg-none{margin:6px 0 14px}

@media (prefers-reduced-motion:reduce){
  .bxo-bk-cover,.bxo-bk-spot,.bxo-po-img,.bxo-yt-img,.bxo-pg-img{transition:none!important}
  .bxo-bk-panel:not([hidden]),.bxo-mk-bar i{animation:none}
}

/* projects bento on a wide screen: the big first tile fills its two rows; its photo no longer decides the row height */
@container (min-width:620px){.bxo-pj-bento .bxo-pj-tile:first-child .bxo-pj-img{position:absolute;inset:0}}