/* A continuous editorial list, using the same live setting artwork as the cards. */
body.list-variation{background:#f7faff;color:#172e4c}
.list-variation .settings-section{background:#f7faff;padding:0 4.2vw 80px}
.list-variation #mosaic{display:flex!important;flex-direction:column;gap:0;max-width:1760px;padding:0}
.list-variation #mosaic .mosaic-first-row,
.list-variation #mosaic .two-monitor-section,
.list-variation #mosaic .two-monitor-cards{display:contents!important}
.list-variation #mosaic .two-monitor-divider{display:none}
.list-variation #mosaic .mosaic-card{width:100%;height:auto;min-height:clamp(430px,43vw,630px)!important;display:grid!important;grid-template-columns:minmax(300px,39%) minmax(0,61%);grid-template-rows:auto 1fr auto;column-gap:clamp(24px,4vw,76px);padding:clamp(32px,4.1vw,76px) 0;overflow:visible;border:0;border-bottom:1px solid #b4cce6;border-radius:0;background:transparent;box-shadow:none;color:#172e4c}
.list-variation #mosaic .mosaic-card:hover{border-color:#b4cce6;box-shadow:none}
.list-variation #mosaic .mosaic-card:is([data-setting="hide"],[data-setting="hideOthers"]){background:transparent!important}
.list-variation #mosaic .card-heading{grid-column:1;grid-row:1;align-self:start}
.list-variation #mosaic .card-meta{font:600 11px/1.4 Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#2665ac;letter-spacing:.14em}
.list-variation #mosaic .serial{color:#7395bb}
.list-variation #mosaic .card-copy{grid-column:1;grid-row:2;align-self:center;padding:20px 0;max-width:560px}
.list-variation #mosaic .card-copy h2{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:clamp(38px,4.1vw,76px);line-height:1.02;letter-spacing:-.065em;font-weight:520;color:#172e4c;text-wrap:balance}
.list-variation #mosaic .card-copy p{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:clamp(16px,1.3vw,22px);line-height:1.48;font-weight:430;color:#56708e;max-width:480px;margin-top:20px}
.list-variation #mosaic .shortcut{grid-column:1;grid-row:3;justify-content:flex-start;text-align:left;border:0;padding:0;min-height:0;color:#1767cd;font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:clamp(16px,1.6vw,26px);font-weight:650;letter-spacing:-.04em}
.list-variation #mosaic .card-art,
.list-variation #mosaic .cursor-effects-art,
.list-variation #mosaic .studio-showcase{grid-column:2;grid-row:1 / 4;align-self:stretch;width:100%;height:100%;min-height:0;margin:0;padding:clamp(12px,1.8vw,28px)!important;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:24px;background:linear-gradient(145deg,#e1f0ff,#f2f8ff 55%,#d6eaff)}
.list-variation #mosaic .card-art img,.list-variation #mosaic .card-art canvas{max-width:100%;max-height:100%;object-fit:contain}
.list-variation #mosaic .mosaic-card[data-setting="downloads"] .card-art{overflow:hidden}
.list-variation #mosaic .mosaic-card[data-setting="downloads"] .art-image{transform:none}
.list-variation #mosaic .mosaic-card[data-setting="battery"] .art-image{transform:scale(1.18)}
.list-variation #mosaic .mosaic-card[data-setting="desktopIcons"] .art-image{transform:none}
.list-variation #mosaic .mosaic-card.application-studio{background:transparent!important}
.list-variation #mosaic .application-studio .studio-scrim{display:none}
.list-variation #mosaic .application-studio .card-meta,.list-variation #mosaic .application-studio .card-meta .serial{color:#2665ac}
.list-variation #mosaic .application-studio .card-copy p{color:#56708e;text-shadow:none}
.list-variation #mosaic .application-studio .studio-showcase{position:relative;inset:auto;z-index:1;background:#162d50}
.list-variation #mosaic .application-studio .studio-dock{width:100%;max-height:75%;object-fit:contain}
.list-variation #mosaic .application-studio .studio-theme-meta{position:relative;grid-column:2;grid-row:3;justify-self:end;align-self:end;right:auto;bottom:auto;margin:0 24px 24px;z-index:3}
.list-variation #mosaic .application-studio .studio-arrow{color:#1767cd;border-color:#9ebddd;background:#edf6ff}
.list-variation #mosaic .application-studio .studio-heading-row{align-items:flex-start;flex-wrap:wrap}
.list-variation #mosaic .application-studio .card-copy h2{white-space:normal;font-size:clamp(38px,4.1vw,76px)}
.list-variation #mosaic .cursor-effects-art{flex-direction:column;position:relative}
.list-variation #mosaic .cursor-effect-layer{grid-column:2;grid-row:1 / 4;pointer-events:none}
.list-variation #mosaic .mosaic-card[data-setting="cursorEffects"] .card-copy{z-index:4}
.list-variation .site-footer{display:none}
.list-variation .design-switcher a[href="homepage-list.html"]{background:#1767cd;color:#fff}
@media(max-width:800px){
  .list-variation .settings-section{padding:0 5vw 40px}
  .list-variation #mosaic .mosaic-card{min-height:0!important;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(280px,48vh) auto;gap:0;padding:48px 0}
  .list-variation #mosaic .card-heading{grid-column:1;grid-row:1}
  .list-variation #mosaic .card-copy{grid-column:1;grid-row:2;align-self:start;padding:12px 0 22px}
  .list-variation #mosaic .card-copy h2{font-size:clamp(34px,8vw,60px)}
  .list-variation #mosaic .card-copy p{font-size:16px;margin-top:12px}
  .list-variation #mosaic .card-art,.list-variation #mosaic .cursor-effects-art,.list-variation #mosaic .studio-showcase{grid-column:1;grid-row:3;height:100%}
  .list-variation #mosaic .shortcut{grid-column:1;grid-row:4;padding-top:18px}
  .list-variation #mosaic .cursor-effect-layer{grid-column:1;grid-row:3}
  .list-variation #mosaic .application-studio .studio-theme-meta{grid-column:1;grid-row:3}
}
