/* Development-only app store concept. Source for the generated /explore-2. */
:root {
  color-scheme: light;
  --ink:#24262b; --ink2:#646870; --ink3:#777d87;
  --page:#f8f8f6; --wash:#eeefec; --card:#fff; --chipb:#e3e5e0;
  --line:#e6e7e3; --rule:#d6d8d1; --accent:#45634e; --radius:12px;
}
html[data-theme="dark"] {
  color-scheme:dark;
  --ink:#f0f1f4; --ink2:#a7abb4; --ink3:#9096a2;
  --page:#191a19; --wash:#222421; --card:#252724; --chipb:#333630;
  --line:#30322e; --rule:#42463d; --accent:#b8cbb0;
}
@media(prefers-color-scheme:dark) { html:not([data-theme="light"]) {
  color-scheme:dark;
  --ink:#f0f1f4; --ink2:#a7abb4; --ink3:#9096a2;
  --page:#191a19; --wash:#222421; --card:#252724; --chipb:#333630;
  --line:#30322e; --rule:#42463d; --accent:#b8cbb0;
}}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--page);color:var(--ink);font-family:"Schibsted Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px;letter-spacing:-.015em;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin:0} h1,h2,h3{font-weight:600} button,input,select{font:inherit;color:inherit} button,a,input,select{-webkit-tap-highlight-color:transparent} button{cursor:pointer} a{color:inherit;text-decoration:none} img{display:block;max-width:100%} button{border:0} [hidden]{display:none!important}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.u-in{max-width:1264px;width:100%;margin-inline:auto;padding-inline:32px}
.u-bar{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--page) 92%,transparent);backdrop-filter:blur(20px);border-bottom:1px solid var(--line)}
.u-bar-in{display:flex;align-items:center;gap:18px;height:80px}
.u-brand{display:flex;align-items:center;gap:9px;white-space:nowrap}.u-brand b{font-size:21px;letter-spacing:-.07em}.u-brand i{font-style:normal;font-size:15px;font-weight:500;margin-left:9px;padding-left:17px;border-left:1px solid var(--rule);color:var(--ink2)}
.u-find{display:flex;align-items:center;gap:10px;max-width:380px;width:100%;height:39px;padding:0 12px;margin-left:auto;background:var(--wash);border:1px solid var(--line);border-radius:10px;color:var(--ink3)}
.u-find:focus-within{border-color:var(--accent)}.u-find input{background:transparent;border:0;outline:0;width:100%;min-width:0;font-size:12px}.u-find input::placeholder{color:var(--ink3)}.u-find kbd{font-family:inherit;font-size:10px;white-space:nowrap;border:1px solid var(--rule);padding:2px 4px;border-radius:4px}.u-clear{background:var(--chipb);border-radius:50%;font-size:14px}
.u-scale{display:flex;background:var(--wash);border-radius:8px;padding:3px;flex:none;gap:2px}.u-scale button{height:30px;padding:0 11px;font-size:11px;border-radius:6px;background:transparent;color:var(--ink2)}.u-scale button[aria-pressed="true"]{background:var(--card);color:var(--ink);box-shadow:0 1px 4px #0002}
/* Five apps have no shelves to fill: the catalogue's editorial bands give way
   to one banner per Soba app, and the reverse in the full catalogue. */
[data-scale="soba"] .u-editorial:not(.u-soba-only),[data-scale="soba"] .u-browse-shelves,[data-scale="soba"] .u-collections,.u-soba-only{display:none}
[data-scale="soba"] .u-soba-only{display:block}
.u-moon{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--rule);border-radius:50%;background:transparent;flex:none;color:var(--ink2)}
.u-rail {
  position: sticky;
  top: 80px;
  z-index: 20;
  background: color-mix(in srgb, var(--page) 95%, transparent);
  backdrop-filter: blur(20px);
}
.u-rail-in {
  display: flex;
  align-items: center;
  gap: 5px;
  overflow-x: auto;
  scrollbar-width: none;
  min-height: 66px;
  padding-block: 13px;
}
.u-rail-in::-webkit-scrollbar { display: none; }
.u-chip {
  flex: none;
  white-space: nowrap;
  height: 36px;
  padding: 0 14px;
  border-radius: 7px;
  background: transparent;
  color: var(--ink2);
  font-size: 13px;
  font-weight: 500;
  transition: background .15s, color .15s;
}
.u-chip:hover { background: var(--wash); color: var(--ink); }
.u-chip[aria-pressed="true"] {
  color: var(--ink);
  background: var(--chipb);
}
.u-body{padding-top:25px;padding-bottom:40px}.u-intro{display:flex;justify-content:space-between;align-items:end;margin-bottom:25px;gap:20px}.u-intro h1{font-size:34px;letter-spacing:-.055em;line-height:1.15}.u-intro p{margin-top:8px;font-size:14px;color:var(--ink2)}.u-intro>span{font-size:12px;color:var(--ink3);padding-bottom:2px}
.u-features{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;margin-bottom:39px}.u-feature{position:relative;isolation:isolate;height:404px;overflow:hidden;border-radius:18px;text-align:left;padding:0;color:#fff;transition:box-shadow .18s}.u-feature:hover{box-shadow:0 6px 24px #0003}.u-feature-photos{background:#29313d}.u-feature-media{background:#22262e}.u-feature-copy{position:relative;z-index:2;padding:30px 30px 0;pointer-events:none}.u-feature-label{font-size:12px;font-weight:500;color:#fffC}.u-feature h2{font-size:32px;line-height:1.12;letter-spacing:-.045em;margin-top:11px}.u-feature-copy p{font-size:13px;color:#fffB;margin-top:12px}.u-feature-link{display:inline-flex;align-items:center;gap:9px;margin-top:18px;font-size:12px;font-weight:600}.u-feature-preview{position:absolute;top:221px;left:30px;width:calc(100% - 15px);max-width:none;border-radius:8px 0 0 0;box-shadow:0 10px 35px #0005;transform:rotate(-5deg);transform-origin:top left}.u-feature-media .u-feature-preview{transform:rotate(-5deg);top:222px}.u-feature-app{position:absolute;bottom:0;left:0;right:0;z-index:3;display:flex;align-items:center;gap:10px;height:67px;padding:0 24px;background:#222a35ed;backdrop-filter:blur(18px);border-top:1px solid #ffffff18}.u-feature-media .u-feature-app{background:#1c2028ed}.u-feature-app img{border-radius:9px;width:36px;height:36px}.u-feature-app b{font-size:12px;font-weight:600}.u-feature-app small{display:block;font-size:10px;color:#fffA;margin-top:3px}.u-feature-open{margin-left:auto;display:grid;place-items:center;width:28px;height:28px;font-size:26px;color:#fffB}
.u-sec{margin-bottom:38px}.u-sec[id]{scroll-margin-top:163px}.u-section-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.u-section-head h2{font-size:21px;letter-spacing:-.035em}.u-section-head p{font-size:12px;color:var(--ink3);margin-top:5px}.u-text-button{background:transparent;color:var(--accent);font-size:12px;padding:6px 0}.u-text-button span{margin-left:6px}
.u-hots,.u-list{list-style:none;margin:19px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:30px}.u-hot,.u-row{display:flex;align-items:center;gap:12px;min-width:0;position:relative;cursor:pointer;border-bottom:1px solid var(--line);padding:15px 0;border-radius:0}.u-hot:hover,.u-row:hover{background:var(--wash)}.u-hot img,.u-row-mark{flex:none;width:54px;height:54px;border-radius:13px;background:var(--wash);box-shadow:0 1px 3px #0001}.u-hot-id,.u-row-id{flex:1;min-width:0}.u-hot-name,.u-row-name{display:block;font-size:14px;font-weight:600;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.u-hot-what{display:block;font-size:12px;margin-top:5px;color:var(--ink2)}.u-view{flex:none;color:var(--ink2);background:var(--wash);padding:6px 13px;border-radius:7px;font-size:11px;font-weight:600}.u-hot:hover .u-view,.u-row:hover .u-view{background:var(--chipb)}
.u-collections{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:32px 0 42px}.u-collection{text-align:left;border-radius:13px;padding:25px;background:var(--card);border:1px solid var(--line);box-shadow:0 2px 4px #00000003;transition:border-color .15s}.u-collection:hover{border-color:var(--rule)}.u-collection-icons{display:flex;gap:8px;margin-bottom:23px}.u-collection-icons img{border-radius:10px;width:38px;height:38px;box-shadow:0 2px 5px #0001}.u-collection h3{font-size:18px;letter-spacing:-.035em}.u-collection p{font-size:12px;color:var(--ink2);margin-top:6px}.u-collection-link{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:500;color:var(--ink2);margin-top:23px}.u-collection-link>span{font-size:18px}
.u-sort{display:flex;align-items:center;gap:7px;color:var(--ink3);font-size:11px}.u-sort select{background:var(--wash);border:1px solid var(--line);border-radius:7px;padding:7px 10px;font-size:11px;color:var(--ink)}.u-list{margin-top:17px}.u-row{align-items:center;padding:17px 0}.u-row-top{display:flex;flex-direction:column;gap:4px}.u-tag{font-size:11px;color:var(--ink3)}.u-row-what{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.5;color:var(--ink2);margin-top:5px}.u-row-mark{width:55px;height:55px}.u-row .u-view{padding:6px 10px}.u-empty{padding:70px 20px;text-align:center;color:var(--ink2)}.u-browse{display:inline-flex;margin-top:18px;padding:10px 17px;border-radius:9px;background:var(--ink);color:var(--page);font-size:13px}.u-fine{border-top:1px solid var(--line);padding-top:22px;font-size:11px;line-height:1.7;color:var(--ink3);max-width:900px}.u-fine a{color:var(--accent)}.u-filtering .u-discovery,.u-filtering .u-curated,.u-filtering .u-collections{display:none}
.u-sheet {
  width: min(760px, calc(100vw - 32px)); max-height: min(88vh, 940px);
  padding: 0; border: 0; border-radius: 14px; overflow: hidden;
  background: var(--page); color: var(--ink);
  font-family: inherit;
  box-shadow: 0 0 0 1px var(--line), 0 40px 90px -24px rgb(9 9 11 / .4);
}
.u-sheet::backdrop { background: rgb(9 9 11 / .5); backdrop-filter: blur(4px); }
.u-sheet-in { max-height: inherit; overflow-y: auto; padding: 34px; }
.u-sheet-in:focus { outline: none; }
.u-x { position: sticky; top: 0; height: 0; z-index: 2; text-align: right; }
.u-x button {
  position: relative; top: 8px; right: 8px;
  width: 30px; height: 30px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--chipb); color: var(--ink2); font-size: 18px; line-height: 1;
}
.u-x button:hover { color: var(--ink); }

.u-prod { display: flex; align-items: flex-start; gap: 20px; }
.u-prod img { flex: none; width: 88px; height: 88px; border-radius: 19px; box-shadow: inset 0 0 0 1px var(--line); }
.u-prod > div { flex: 1; min-width: 0; }
.u-prod h2 { font-size: 26px; font-weight: 600; letter-spacing: -.02em; }
.u-prod-what { margin-top: 5px; font-size: 16px; line-height: 1.45; color: var(--ink2); }
.u-prod-meta { margin-top: 9px; font-size: 13.5px; color: var(--ink3); }
.u-get {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  height: 44px; padding: 0 22px; border-radius: 999px;
  background: var(--ink); color: var(--page); font-size: 15px; font-weight: 600;
}
.u-get:hover { opacity: .88; }

.u-shots { display: flex; gap: 14px; margin: 26px -34px 0; padding: 0 34px 4px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; scroll-padding-inline: 34px; }
.u-shots::-webkit-scrollbar { display: none; }
.u-shots img { flex: none; width: 430px; height: auto; border-radius: 14px; scroll-snap-align: start; box-shadow: inset 0 0 0 1px var(--line); }
.u-about { margin-top: 26px; font-size: 15.5px; line-height: 1.6; color: var(--ink2); }
.u-facts { margin: 28px 0 0; }
.u-facts > div { display: flex; gap: 24px; padding: 13px 0; border-top: 1px solid var(--line); font-size: 14.5px; }
.u-facts dt { flex: none; width: 130px; color: var(--ink3); }
.u-facts dd { margin: 0; flex: 1; min-width: 0; }
.u-facts a { color: var(--accent); }

.u-get{background:var(--accent);color:var(--page);text-decoration:none}.u-sheet{border-radius:20px}.u-prod h2{font-size:28px}.u-facts code{overflow-wrap:anywhere}
@media(min-width:1500px){.u-feature{height:430px}.u-feature-preview{top:225px}.u-feature-media .u-feature-preview{top:225px}}
@media(max-width:1000px){.u-scale{display:none}.u-rail-in{gap:4px}.u-hots,.u-list{grid-template-columns:repeat(2,minmax(0,1fr))}.u-feature h2{font-size:27px}.u-feature-copy{padding:25px 23px 0}.u-feature-copy p{max-width:240px;line-height:1.5}.u-feature{height:390px}.u-collections{gap:12px}.u-collection{padding:20px}.u-collection h3{font-size:16px}}
@media(max-width:640px){.u-in{padding-inline:20px}.u-bar-in{height:68px;gap:12px;flex-wrap:wrap}.u-brand i{display:none}.u-brand b{font-size:20px}.u-find{max-width:none;flex:1;height:36px;margin-left:8px}.u-find input{font-size:11px}.u-find kbd{display:none}.u-moon{width:30px;height:30px}.u-rail{top:68px}.u-rail-in{min-height:58px;gap:3px;padding-block:10px}.u-chip{height:34px;padding-inline:12px;font-size:12px}.u-body{padding-top:27px}.u-intro h1{font-size:30px}.u-intro>span{display:none}.u-intro p{font-size:12px}.u-features{grid-template-columns:minmax(0,1fr);gap:16px;margin-bottom:30px}.u-feature{height:365px}.u-feature h2{font-size:31px}.u-feature-copy{padding:25px}.u-feature-copy p{max-width:none}.u-feature-preview,.u-feature-media .u-feature-preview{top:219px}.u-feature-app{height:61px;padding-inline:20px}.u-hots,.u-list{grid-template-columns:minmax(0,1fr);gap:0}.u-hot,.u-row{padding:14px 0}.u-hot-name,.u-row-name{font-size:14px}.u-row-what{font-size:12px}.u-hot-what{font-size:12px}.u-hots{margin-top:10px}.u-collections{display:flex;overflow-x:auto;margin-inline:-20px;padding-inline:20px;scroll-snap-type:x mandatory;gap:12px;scrollbar-width:none}.u-collection{flex:0 0 80%;scroll-snap-align:center;padding:24px}.u-collection h3{font-size:20px}.u-section-head h2{font-size:20px}.u-sec[id]{scroll-margin-top:138px}.u-sort{font-size:0}.u-sort select{font-size:11px}.u-sheet-in{padding:30px 20px 22px}.u-prod{flex-wrap:wrap;gap:15px}.u-prod img{width:68px;height:68px}.u-prod h2{font-size:23px}.u-prod-what{font-size:14px}.u-shots{margin-inline:-20px;padding-inline:20px}.u-shots img{width:80vw}.u-facts>div{gap:14px;font-size:12px}.u-facts dt{width:70px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
::selection{background:color-mix(in srgb,var(--accent) 25%,transparent)}
/* Keep feature copy and cropped product artwork on independent layers. */
.u-feature{display:block}.u-feature-copy{position:absolute;left:0;right:0;top:0}.u-preview-window{position:absolute;top:225px;left:30px;right:-15px;height:240px;overflow:hidden;transform:rotate(-2deg);transform-origin:top left;border-radius:9px;box-shadow:0 10px 35px #0004}.u-feature .u-feature-preview{position:static;transform:translateY(-32%);width:100%;height:auto;border-radius:0;box-shadow:none}.u-feature-media .u-preview-window{top:225px}
@media(max-width:640px){.u-preview-window,.u-feature-media .u-preview-window{top:225px;left:25px;right:-15px}}
/* Storefront composition: a luminous hero, icon shelves, then editorial. */
:root {
  --page: #f5f6f8;
  --wash: #ebeef2;
  --chipb: #e0e4eb;
  --line: #e3e6ec;
  --rule: #d1d6df;
  --accent: #343c4b;
  --hero-start: #e9edf3;
  --hero-end: #fafbfc;
  --hero-glow: #d4dbe7;
}
html[data-theme="dark"] {
  --page: #101216;
  --wash: #1c2027;
  --chipb: #2b313c;
  --card: #191d24;
  --line: #282e38;
  --rule: #3b4452;
  --accent: #d9dfe9;
  --hero-start: #1a202b;
  --hero-end: #12161d;
  --hero-glow: #343f53;
}
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    --page: #101216;
    --wash: #1c2027;
    --chipb: #2b313c;
    --card: #191d24;
    --line: #282e38;
    --rule: #3b4452;
    --accent: #d9dfe9;
    --hero-start: #1a202b;
    --hero-end: #12161d;
    --hero-glow: #343f53;
  }
}
.u-bar { border-bottom: 0; }
.u-bar-in { height: 72px; }
.u-find { background: var(--card); border-color: transparent; border-radius: 30px; height: 40px; box-shadow: 0 3px 14px #00000003; }
.u-find input { font-size: 14px; }
.u-rail { top: 72px; }
.u-rail-in { gap: 7px; padding-block: 4px 13px; min-height: 58px; }
.u-chip { height: 38px; border: 1px solid var(--line); border-radius: 22px; background: color-mix(in srgb,var(--wash) 48%,transparent); font-size: 12px; padding-inline: 16px; }
.u-chip[aria-pressed="true"] { color: var(--accent); background: color-mix(in srgb,var(--accent) 12%,var(--page)); border-color: color-mix(in srgb,var(--accent) 35%,var(--rule)); box-shadow: 0 2px 5px #00000005; }
.u-body { padding-top: 42px; }
.u-store-hero { position: relative; overflow: hidden; background: radial-gradient(ellipse at 75% 50%,var(--hero-glow),transparent 55%),linear-gradient(110deg,var(--hero-end),var(--hero-start)); }
.u-hero-in { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; min-height: 395px; gap: 25px; }
.u-hero-copy { position: relative; z-index: 2; padding-block: 50px; }
.u-hero-copy h1 { font-size: clamp(36px,3.4vw,50px); line-height: 1.08; letter-spacing: -.055em; }
.u-hero-copy p { color: var(--ink2); font-size: 16px; line-height: 1.65; margin-top: 21px; }
.u-hero-copy>span { display: block; color: var(--ink3); font-size: 12px; margin-top: 23px; }
.u-hero-art { height: 360px; position: relative; perspective: 800px; }
.u-soba-tile {
  position: absolute;
  top: 80px;
  left: 140px;
  width: 200px;
  height: 200px;
  border-radius: 24%;
  transform: rotate(-12deg) rotateY(-17deg) rotateX(12deg);
  box-shadow: 16px 25px 42px -12px #070b1745;
}
.u-soba-tile img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
}
.u-orbit { position:absolute; padding: 11px; background: color-mix(in srgb,var(--card) 88%,transparent); border:1px solid #ffffff55; border-radius:24px; box-shadow:inset 0 1px 1px #fff9,0 13px 25px #24204013; }
.u-orbit img { width:54px; height:54px; border-radius:14px; }
.u-orbit-0 { top:13px;left:39px;transform:rotate(-17deg); }
.u-orbit-1 { top:263px;left:67px;transform:rotate(13deg); }
.u-orbit-2 { top:21px;right:24px;transform:rotate(14deg); }
.u-orbit-3 { top:270px;right:3px;transform:rotate(-12deg); }
.u-orbit-4 { top:157px;right:-66px;transform:rotate(19deg);opacity:.55; }
.u-orbit-5 { top:160px;left:-65px;transform:rotate(-13deg);opacity:.5; }
.u-section-head h2 { font-size:24px; letter-spacing:-.04em; }
.u-hots { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:13px; margin-top:21px; }
.u-hot { display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;padding:25px 8px 22px;border:1px solid color-mix(in srgb,var(--rule) 55%,var(--page));border-radius:18px;background:linear-gradient(145deg,var(--card),color-mix(in srgb,var(--card) 55%,var(--page)));box-shadow:0 9px 25px -12px #1e1c3820,inset 0 1px 0 #ffffff15; }
.u-hot:hover { background:var(--card);border-color:var(--rule); }
.u-hot img { width:66px;height:66px;border-radius:16px;margin-bottom:17px;box-shadow:0 3px 7px #0000000a; }
.u-hot-id { width:100%; }
.u-hot-name { font-size:13px; }
.u-hot-what { font-size:10px;margin-top:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.u-hot .u-view { display:none; }
.u-curated { margin-bottom:42px; }
.u-features { margin-bottom:44px;gap:22px; }
.u-feature { border-radius:22px; }
.u-feature-photos { background:#29313d; }
.u-feature-media { background:#22262e; }
.u-feature-media .u-feature-app { background:#1c2028ed; }
.u-browse-shelves { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px; }
.u-small-list { grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px; }
.u-small-list .u-row { border:0;padding-block:14px; }
.u-small-list .u-view,.u-small-list .u-tag { display:none; }
.u-small-list .u-row-what { -webkit-line-clamp:2;font-size:11px; }
.u-small-list .u-row-name { font-size:13px; }
.u-collection { border-radius:20px; box-shadow:0 9px 25px -12px #1e1c3815; }
.u-list:not(.u-small-list)>.u-row { border-bottom:0; padding-block:20px; }
.u-list:not(.u-small-list) .u-view { display:none; }
.u-row-mark { width:64px;height:64px;border-radius:15px; }
.u-row-name { font-size:15px; }
.u-row-what { font-size:13px; }
@media(max-width:1100px) {
  .u-hero-in { min-height:365px;grid-template-columns:1.1fr 1fr; }
  .u-hero-art { transform:scale(.85);transform-origin:center; }
  .u-soba-tile { left:90px; }
  .u-orbit-0 { left:0; }.u-orbit-1 { left:5px; }
  .u-hots { display:flex;overflow-x:auto;margin-inline:-32px;padding:0 32px 15px;scrollbar-width:none; }
  .u-hot { flex:0 0 137px; }
  .u-browse-shelves { gap:25px; }
  .u-small-list { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:640px) {
  .u-bar-in { height:68px; }
  .u-rail { top:68px; }
  .u-rail-in { min-height:53px;padding-block:3px 12px;gap:6px; }
  .u-chip { height:35px;font-size:12px;padding-inline:14px; }
  .u-find { height:36px; }.u-find input { font-size:12px; }
  .u-hero-in { grid-template-columns:minmax(0,1fr);gap:0;min-height:0; }
  .u-hero-copy { padding-block:34px 5px; }
  .u-hero-copy h1 { font-size:37px; }
  .u-hero-copy p { margin-top:16px;font-size:14px; }
  .u-hero-copy>span { margin-top:14px;font-size:11px; }
  .u-hero-art { height:245px;transform:scale(.75);transform-origin:top center;margin-bottom:-40px; }
  .u-soba-tile { top:42px;left:95px; }
  .u-orbit-0 { top:5px;left:-9px; }.u-orbit-1 { top:194px;left:-10px; }.u-orbit-2 { top:0;right:-30px; }.u-orbit-3 { top:197px;right:-32px; }.u-orbit-4,.u-orbit-5 { display:none; }
  .u-body { padding-top:30px; }
  .u-section-head h2 { font-size:21px; }
  .u-hots { margin-inline:-20px;padding-inline:20px;gap:11px; }
  .u-hot { flex-basis:132px;padding:23px 8px 20px; }
  .u-hot img { width:62px;height:62px; }
  .u-hot-name { font-size:13px; }.u-hot-what { font-size:10px; }
  .u-browse-shelves { grid-template-columns:minmax(0,1fr);gap:0; }
  .u-small-list { grid-template-columns:repeat(2,minmax(0,1fr));gap:0 15px; }
  .u-small-list .u-row { flex-direction:column;align-items:flex-start;gap:10px; }
  .u-small-list .u-row-mark { width:54px;height:54px;border-radius:13px; }
  .u-small-list .u-row-what { font-size:11px; }
  .u-feature { border-radius:18px; }
  .u-collections { margin-top:10px; }
}

/* Neutral editorial panels; crop the gallery's colored surround from Jellyfin. */
.u-feature-media .u-preview-window {
  right: 30px;
  background: #13171d;
}
.u-feature-media .u-feature-preview {
  width: 143%;
  max-width: none;
  transform: translate(-15%, -30%);
}
@media (max-width: 640px) {
  .u-feature-media .u-preview-window { right: 25px; }
}

/* Compact app spotlights, built from product previews and Soba typography. */
.u-spotlights { grid-template-columns: repeat(2,minmax(0,1fr)); gap:20px; }
.u-spotlight {
  position:relative;
  isolation:isolate;
  display:block;
  width:100%;
  aspect-ratio:2 / 1;
  overflow:hidden;
  padding:0;
  border-radius:16px;
  text-align:left;
  border:1px solid #dce1e8;
  background:linear-gradient(125deg,#f3f5f8,#dce3ed);
  color:#252b35;
  box-shadow:0 3px 8px #0b14200a;
}
.u-spotlight-media {
  color:#f3f5fa;
  background:radial-gradient(ellipse at 95% 80%,#394659,transparent 75%),#20252e;
  border-color:#343c48;
}
.u-spotlight-copy { position:absolute; z-index:2; inset:27px auto 24px 27px; width:40%; display:flex; flex-direction:column; align-items:flex-start; }
.u-spotlight-icon { width:46px; height:46px; border-radius:11px; box-shadow:0 2px 4px #0001; }
.u-spotlight-name { margin-top:11px; font-size:12px; opacity:.7; }
.u-spotlight h2 { font-size:27px;line-height:1.1;letter-spacing:-.045em;margin-top:8px; }
.u-spotlight-cta { margin-top:auto; padding-top:12px;font-size:11px;font-weight:500; }
.u-spotlight-cta>span { margin-left:8px; }
.u-spotlight-screen { position:absolute;top:34px;bottom:-35px;left:44%;right:-29%;overflow:hidden;border-radius:11px 0 0 0;transform:rotate(-3deg);transform-origin:bottom left;box-shadow:-6px 10px 25px #131a2c24; }
.u-spotlight-screen img { width:125%;max-width:none;height:auto;transform:translate(-4%,-32%); }
.u-spotlight-media .u-spotlight-screen img { width:160%;transform:translate(-16%,-32%); }
.u-spotlight:hover { box-shadow:0 5px 16px #0b14201c; }
/* Soba's banners carry site screenshots cropped to the part worth showing, so
   they sit in the frame as taken. */
.u-spotlight-site .u-spotlight-screen img,.u-spotlight-media.u-spotlight-site .u-spotlight-screen img { width:100%;transform:none; }

@media(max-width:1000px) and (min-width:641px) {
  .u-spotlight { aspect-ratio:1.6 / 1; }
  .u-spotlight-copy { left:21px;top:23px;bottom:21px; }
  .u-spotlight h2 { font-size:23px; }
  .u-spotlight-screen { left:47%;top:45px;right:-50%; }
}
@media(max-width:640px) {
  .u-spotlights { grid-template-columns:minmax(0,1fr);gap:15px; }
  .u-spotlight { aspect-ratio:1.65 / 1;border-radius:13px; }
  .u-spotlight-copy { inset:21px auto 20px 21px; }
  .u-spotlight-icon { width:36px;height:36px;border-radius:9px; }
  .u-spotlight-name { font-size:11px;margin-top:9px; }
  .u-spotlight h2 { font-size:23px; }
  .u-spotlight-cta { font-size:10px; }
  .u-spotlight-screen { left:46%;top:38px;right:-42%; }
}