.page-players { background: #f7f9fc; }
.companion-page { overflow: hidden; }
.companion-page .companion-hero { min-height: 700px; display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: clamp(40px, 7vw, 110px); padding-top: 92px; padding-bottom: 82px; }
.companion-copy { max-width: 570px; }
.companion-eyebrow, .companion-section-head p, .roster-toolbar > div > p, .companion-dialog-kicker { margin: 0 0 16px; color: #2b6ee9; font: 800 12px/1.2 system-ui, sans-serif; letter-spacing: .18em; }
.companion-copy h1 { margin: 0; color: #0b2a55; font: 900 clamp(54px, 6.2vw, 92px)/.96 GlacierDisplay, "Microsoft YaHei", sans-serif; letter-spacing: -.055em; transform: none; }
.companion-lead { max-width: 510px; margin: 28px 0 32px; color: #5c7190; font-size: 17px; line-height: 1.85; }
.companion-actions { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.companion-join-button { border-color: #bdd1ed; color: #214d82; background: rgba(255,255,255,.8); box-shadow: none; }
.companion-join-button:hover { border-color: #76a4e5; background: white; }
.companion-promises { display: flex; gap: 24px; margin: 34px 0 0; padding: 0; list-style: none; color: #7690b2; font-size: 13px; }
.companion-promises li { display: flex; align-items: center; gap: 8px; }
.companion-promises li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #2b6ee9; box-shadow: 0 0 0 5px #e8f0ff; }
.companion-showcase { position: relative; height: 520px; isolation: isolate; }
.companion-showcase::before { content: ""; position: absolute; inset: 4% 4% 4% 8%; z-index: -1; border-radius: 50%; background: radial-gradient(circle at 50% 50%, #dceaff 0, #eef5ff 48%, transparent 70%); }
.showcase-card { position: absolute; right: 0; top: 36px; width: 38%; overflow: hidden; border: 8px solid rgba(255,255,255,.9); border-radius: 18px; background: white; box-shadow: 0 24px 65px rgba(34,74,127,.16); transform: rotate(5deg); }
.showcase-card--lead { z-index: 2; left: 10%; top: 0; width: 55%; transform: rotate(-3deg); }
.showcase-card:nth-child(2) { z-index: 3; right: 2%; top: 218px; width: 36%; transform: rotate(3deg); }
.showcase-card img { display: block; width: 100%; height: 360px; object-fit: cover; object-position: center 20%; }
.showcase-card:not(.showcase-card--lead) img { height: 240px; }
.showcase-card span { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 14px 16px; color: #102d53; }
.showcase-card strong { font-size: 16px; }
.showcase-card small { color: #7d91ad; }

.companion-discovery { padding-top: 84px; padding-bottom: 64px; }
.companion-section-head, .roster-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 30px; }
.companion-section-head h2, .roster-toolbar h2 { margin: 0; color: #102d53; font: 900 clamp(32px, 4vw, 52px)/1.05 GlacierDisplay, "Microsoft YaHei", sans-serif; letter-spacing: -.035em; }
.companion-section-head > span, .roster-toolbar > p { margin: 0 0 5px; color: #788da9; font-size: 14px; }
.curator-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.curator-card { position: relative; min-height: 270px; display: grid; grid-template-columns: 1fr 48%; align-items: end; overflow: hidden; padding: 34px; border: 1px solid transparent; border-radius: 18px; text-align: left; cursor: pointer; box-shadow: 0 16px 36px rgba(38,75,125,.09); transition: transform .35s ease, box-shadow .35s ease, border-color .25s ease; }
.curator-card:hover, .curator-card:focus-visible { transform: translateY(-5px); box-shadow: 0 24px 52px rgba(38,75,125,.16); }
.curator-card.is-active { border-color: #2b6ee9; }
.curator-card--blue { color: white; background: linear-gradient(135deg, #123b72, #1b5fb9); }
.curator-card--apricot { color: #402513; background: linear-gradient(135deg, #fff6ec, #f4cda5); }
.curator-copy { position: relative; z-index: 3; display: flex; flex-direction: column; align-items: flex-start; }
.curator-copy small { margin-bottom: 14px; opacity: .7; font-size: 12px; letter-spacing: .12em; }
.curator-copy strong { font: 900 38px/1 GlacierDisplay, "Microsoft YaHei", sans-serif; }
.curator-copy em { margin-top: 18px; font-size: 13px; font-style: normal; opacity: .7; }
.curator-faces { position: absolute; right: 34px; bottom: -8px; width: 48%; height: 230px; }
.curator-faces img { position: absolute; bottom: 0; width: 54%; height: 205px; object-fit: cover; object-position: center 20%; border: 5px solid rgba(255,255,255,.74); border-radius: 14px 14px 0 0; box-shadow: 0 14px 30px rgba(10,37,74,.24); }
.curator-faces img:nth-child(1) { left: 0; transform: rotate(-5deg); }
.curator-faces img:nth-child(2) { z-index: 2; left: 24%; height: 225px; }
.curator-faces img:nth-child(3) { right: 0; transform: rotate(5deg); }
.curator-arrow { position: absolute; top: 25px; right: 27px; z-index: 4; font-size: 26px; }
.category-strip { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-top: 20px; }
.category-strip button { position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 14px; padding: 20px; border: 1px solid #dce6f3; border-radius: 14px; color: #16385f; background: rgba(255,255,255,.78); text-align: left; cursor: pointer; transition: transform .25s ease, border-color .25s ease, background .25s ease; }
.category-strip button:hover, .category-strip button:focus-visible, .category-strip button.is-active { transform: translateY(-3px); border-color: #74a5f5; background: white; }
.category-strip span { grid-row: 1 / 3; color: #9bb2cf; font-size: 11px; letter-spacing: .1em; }
.category-strip strong { font-size: 16px; }
.category-strip small { margin-top: 6px; color: #8498b2; }

.companion-roster { scroll-margin-top: 90px; padding-top: 74px; padding-bottom: 100px; }
.roster-toolbar > p span { color: #2b6ee9; font-weight: 800; }
.companion-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.companion-card { --rx:0deg;--ry:0deg;--mx:50%;--my:50%;position:relative;display:block;min-width:0;min-height:440px;overflow:hidden;padding:0;border:1px solid #b8c9dc;border-radius:14px;color:white;background:#0d223c;text-align:left;cursor:pointer;box-shadow:0 14px 32px rgba(18,43,72,.12);transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(0);transform-style:preserve-3d;transition:transform .22s ease-out,box-shadow .28s ease,border-color .28s ease;will-change:transform; }
.companion-card::before { content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.18),transparent 30%);opacity:0;transition:opacity .25s ease; }
.companion-card::after { content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(8,24,43,0) 38%,rgba(8,24,43,.3) 54%,#08192d 100%); }
.companion-card:hover,.companion-card:focus-visible { transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(-9px) scale(1.012);border-color:#7ca8e7;box-shadow:0 28px 55px rgba(16,43,75,.25); }
.companion-card:hover::before { opacity:1; }
.companion-card-image { position:absolute;inset:0;display:block;overflow:hidden;background:#162d48; }
.companion-card-image::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(58,119,214,.12),transparent 28%);mix-blend-mode:screen; }
.companion-card-image img { width:100%;height:100%;display:block;object-fit:cover;object-position:center 18%;filter:saturate(.9) contrast(1.04);transition:transform .55s cubic-bezier(.2,.75,.2,1),filter .4s ease; }
.companion-card:hover .companion-card-image img { transform:scale(1.055);filter:saturate(1.02) contrast(1.06); }
.companion-card.is-placeholder .companion-card-image img { object-fit:contain;padding:38px;background:linear-gradient(150deg,#142d4b,#264a72); }
.companion-card-scan { position:absolute;inset:0;z-index:2;opacity:.15;background:repeating-linear-gradient(180deg,transparent 0,transparent 4px,rgba(255,255,255,.08) 5px); }
.companion-card-code { position:absolute;z-index:4;top:17px;left:17px;padding-left:11px;border-left:2px solid #72a8f7;color:rgba(255,255,255,.74);font:800 10px/1.4 Arial,sans-serif;letter-spacing:.16em; }
.companion-card-body { position:absolute;z-index:4;inset:auto 0 0;display:block;padding:66px 20px 18px;transform:translateZ(28px); }
.companion-card-top,.companion-card-foot { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.companion-card-top strong { overflow:hidden;font:900 27px/1.05 GlacierDisplay,"Microsoft YaHei",sans-serif;letter-spacing:-.03em;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px 12px rgba(0,0,0,.35); }
.companion-card-top em { flex:none;padding:4px 7px;border:1px solid rgba(144,188,255,.55);border-radius:5px;color:#cce0ff;background:rgba(30,76,130,.45);font-size:10px;font-style:normal;font-weight:800;backdrop-filter:blur(7px); }
.companion-card-meta { display:flex;align-items:center;gap:8px;overflow:hidden;margin:9px 0 18px;color:#ced9e7;font-size:11px;white-space:nowrap;text-overflow:ellipsis; }
.companion-card-meta i { width:3px;height:3px;flex:0 0 auto;border-radius:50%;background:#77a9ed; }
.companion-card-foot { padding-top:12px;border-top:1px solid rgba(190,213,239,.22);color:#91a9c6; }
.companion-card-foot small { font:700 9px/1.3 Arial,sans-serif;letter-spacing:.11em; }
.companion-card-foot b { color:#c5dbf8;font:800 9px/1.3 Arial,sans-serif;letter-spacing:.08em; }
.companion-empty { padding: 80px 24px; border: 1px dashed #b9cbe1; border-radius: 15px; text-align: center; color: #6f84a1; background: white; }
.companion-empty strong { color: #183b65; font-size: 22px; }

.companion-cta { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 110px; padding: clamp(34px, 5vw, 64px); border-radius: 18px; color: white; background: #102f59; }
.companion-cta p { margin: 0 0 12px; color: #8ebaff; font-size: 13px; letter-spacing: .08em; }
.companion-cta h2 { margin: 0; font: 900 clamp(30px, 4vw, 52px)/1.08 GlacierDisplay, "Microsoft YaHei", sans-serif; letter-spacing: -.03em; }

.companion-dialog { width:min(1120px,calc(100% - 36px));max-height:min(760px,calc(100dvh - 36px));overflow:hidden;padding:0;border:1px solid rgba(125,164,211,.42);border-radius:16px;color:#dce9f8;background:#0b1d32;box-shadow:0 40px 110px rgba(2,13,28,.62); }
.companion-dialog::backdrop { background:rgba(4,15,29,.76);backdrop-filter:blur(10px) saturate(.72); }
.companion-dialog[open] { display:grid;grid-template-columns:55% 45%; }
.companion-dialog-close { position:absolute;z-index:7;top:17px;right:17px;width:42px;height:42px;border:1px solid rgba(153,187,228,.28);border-radius:8px;color:#d7e8fb;background:rgba(15,42,73,.82);font-size:27px;cursor:pointer;backdrop-filter:blur(9px); }
.companion-dialog-media { position:relative;min-height:650px;overflow:hidden;background:#122b48; }
.companion-dialog-media::after { content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 65%,#0b1d32 100%),linear-gradient(180deg,transparent 65%,rgba(4,17,31,.55)); }
.companion-dialog-media img,.companion-dialog-media video { width:100%;height:100%;position:absolute;inset:0;display:block;object-fit:cover;object-position:center 18%; }
.companion-placeholder-note { position:absolute;z-index:2;left:22px;bottom:22px;padding:8px 12px;border:1px solid rgba(151,190,237,.34);border-radius:6px;color:#d7e8fb;background:rgba(10,36,67,.78);font-size:11px; }
.companion-dialog-copy { position:relative;display:flex;flex-direction:column;justify-content:center;align-items:stretch;overflow:hidden;padding:58px 52px;background:linear-gradient(145deg,#0d223b,#09182b); }
.companion-dialog-copy::before { content:"";position:absolute;inset:0;pointer-events:none;opacity:.12;background-image:linear-gradient(rgba(132,174,224,.25) 1px,transparent 1px),linear-gradient(90deg,rgba(132,174,224,.25) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(90deg,transparent,#000); }
.dossier-header { position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px;padding-bottom:13px;border-bottom:1px solid rgba(137,175,219,.24); }
.dossier-header .companion-dialog-kicker { margin:0;color:#6fa4ec;font-size:10px; }
.dossier-header>span { color:#8098b5;font:700 9px/1.2 Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase; }
.companion-dialog-copy h2 { position:relative;margin:0;color:#f3f8ff;font:900 56px/1 GlacierDisplay,"Microsoft YaHei",sans-serif;letter-spacing:-.04em; }
.dossier-bio { position:relative;margin:21px 0 0;color:#9db1ca;font-size:14px;line-height:1.85; }
.companion-dialog-tags { position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:24px 0; }
.companion-dialog-tags span { overflow:hidden;padding:12px 10px;border:1px solid rgba(117,161,214,.23);border-radius:7px;color:#c5d8ef;background:rgba(25,62,101,.42);font-size:11px;text-align:center;white-space:nowrap;text-overflow:ellipsis; }
.companion-dialog-note { position:relative;margin:0 0 22px;color:#7188a4;font-size:11px;line-height:1.7; }
.companion-audio { position:relative;width:100%;margin-bottom:24px;padding:13px;border:1px solid rgba(116,158,209,.24);border-radius:8px;background:rgba(18,48,82,.5); }
.companion-audio span { display:block;margin-bottom:8px;color:#a9c7eb;font-size:10px;font-weight:800;letter-spacing:.1em; }
.companion-audio audio { width:100%;height:38px; }
.companion-dialog-copy .button { position:relative;align-self:flex-start;min-width:190px; }
.companion-audio audio { width: 100%; height: 42px; }

@media (max-width: 1040px) {
  .companion-page .companion-hero { min-height: auto; grid-template-columns: 1fr 1fr; gap: 30px; }
  .companion-showcase { height: 430px; }
  .showcase-card img { height: 290px; }
  .showcase-card:not(.showcase-card--lead) img { height: 190px; }
  .category-strip { grid-template-columns: repeat(3, 1fr); }
  .companion-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .companion-card-image { height: 290px; }
}

@media (max-width: 760px) {
  .companion-page .companion-hero { grid-template-columns: 1fr; padding-top: 58px; padding-bottom: 42px; }
  .companion-copy h1 { font-size: clamp(50px, 16vw, 74px); }
  .companion-showcase { height: 410px; margin-top: 12px; }
  .companion-section-head, .roster-toolbar { display: block; }
  .companion-section-head > span, .roster-toolbar > p { display: block; margin-top: 14px; }
  .curator-grid { grid-template-columns: 1fr; }
  .curator-card { min-height: 240px; }
  .category-strip { display: flex; overflow-x: auto; padding-bottom: 10px; scroll-snap-type: x mandatory; }
  .category-strip button { min-width: 165px; scroll-snap-align: start; }
  .companion-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .companion-card { min-height: 355px; }
  .companion-card-image { height: 240px; }
  .companion-card-body { padding: 16px; }
  .companion-card-meta { display: block; line-height: 1.7; white-space: normal; }
  .companion-card-meta i { display: none; }
  .companion-cta { align-items: flex-start; flex-direction: column; }
  .companion-dialog[open] { display: block; overflow-y: auto; }
  .companion-dialog-media { min-height: 48vh; }
  .companion-dialog-copy { padding: 34px 24px 40px; }
  .companion-dialog-copy h2 { font-size: 43px; }
  .companion-dialog-tags { grid-template-columns: 1fr 1fr 1fr; }
}

@media (max-width: 460px) {
  .companion-promises { gap: 14px; font-size: 11px; }
  .companion-showcase { height: 345px; }
  .showcase-card--lead { left: 2%; width: 62%; }
  .showcase-card img { height: 250px; }
  .showcase-card:not(.showcase-card--lead) img { height: 155px; }
  .curator-card { min-height: 215px; padding: 24px; }
  .curator-copy strong { font-size: 31px; }
  .curator-faces { right: 12px; width: 50%; height: 190px; }
  .curator-faces img { height: 165px; }
  .curator-faces img:nth-child(2) { height: 184px; }
  .companion-grid { grid-template-columns: 1fr 1fr; }
  .companion-card { min-height: 300px; }
  .companion-card-image { height: 190px; }
  .companion-card-top { align-items: flex-start; flex-direction: column; gap: 5px; }
  .companion-card-top strong { font-size: 19px; }
  .companion-card-foot small { font-size: 10px; }
  .companion-card-body { padding: 48px 13px 13px; }
  .companion-card-meta { margin-bottom: 11px; font-size: 10px; }
  .companion-card-foot b { display: none; }
  .companion-dialog-media { min-height: 43vh; }
  .companion-dialog-copy h2 { font-size: 39px; }
  .dossier-bio { font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .curator-card, .category-strip button, .companion-card, .companion-card-image img { transition: none; }
  .curator-card:hover, .category-strip button:hover, .companion-card:hover { transform: none; }
  html { scroll-behavior: auto; }
}

/* Youth esports character-select layer */
.companion-roster { position:relative; }
.companion-roster::before { content:"";position:absolute;z-index:-1;inset:2% -8% 5%;pointer-events:none;background:radial-gradient(circle at 8% 28%,rgba(54,173,255,.12),transparent 24%),radial-gradient(circle at 92% 62%,rgba(255,126,105,.11),transparent 22%); }
.companion-card { --accent:#397cff;--accent-rgb:57,124,255;min-height:458px;border-color:rgba(var(--accent-rgb),.55);border-radius:17px 5px 17px 17px;background:#dceaff;box-shadow:0 15px 30px rgba(var(--accent-rgb),.15),0 2px 0 rgba(255,255,255,.85) inset; }
.companion-card:nth-child(4n+2) { --accent:#17b9d4;--accent-rgb:23,185,212;margin-top:22px;margin-bottom:-22px; }
.companion-card:nth-child(4n+3) { --accent:#ff765f;--accent-rgb:255,118,95; }
.companion-card:nth-child(4n+4) { --accent:#8068ef;--accent-rgb:128,104,239;margin-top:22px;margin-bottom:-22px; }
.companion-card::before { z-index:5;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.46),transparent 26%),linear-gradient(115deg,transparent 36%,rgba(255,255,255,.22) 48%,transparent 59%);mix-blend-mode:screen; }
.companion-card::after { background:linear-gradient(180deg,transparent 32%,rgba(var(--accent-rgb),.08) 47%,rgba(9,27,52,.15) 56%,#0b2039 100%); }
.companion-card:hover,.companion-card:focus-visible { border-color:var(--accent);box-shadow:0 31px 58px rgba(var(--accent-rgb),.3),0 0 0 3px rgba(var(--accent-rgb),.1); }
.companion-card-image::after { background:linear-gradient(130deg,rgba(var(--accent-rgb),.25),transparent 30%,transparent 72%,rgba(var(--accent-rgb),.2));mix-blend-mode:color; }
.companion-card-scan { opacity:.18;background:linear-gradient(120deg,transparent 28%,rgba(255,255,255,.27) 43%,transparent 58%),repeating-linear-gradient(180deg,transparent 0,transparent 5px,rgba(255,255,255,.08) 6px);transform:translateX(-45%);transition:transform .65s cubic-bezier(.16,1,.3,1); }
.companion-card:hover .companion-card-scan { transform:translateX(38%); }
.companion-card-code { top:15px;left:15px;padding:6px 9px;border:0;border-radius:6px;color:white;background:var(--accent);box-shadow:0 8px 20px rgba(var(--accent-rgb),.34);letter-spacing:.12em; }
.companion-card-body { padding-top:76px; }
.companion-card-body::before { content:"";position:absolute;left:20px;right:20px;top:57px;height:2px;background:linear-gradient(90deg,var(--accent),transparent); }
.companion-card-top strong { font-size:29px; }
.companion-card-top em { border-color:rgba(var(--accent-rgb),.7);color:#fff;background:rgba(var(--accent-rgb),.72);box-shadow:0 6px 16px rgba(var(--accent-rgb),.2); }
.companion-card-meta i { background:var(--accent);box-shadow:0 0 9px var(--accent); }
.companion-card-foot b { color:#fff; }

.companion-dialog { border-color:rgba(66,120,206,.34);color:#18375f;background:#eef5ff;box-shadow:0 42px 120px rgba(25,64,112,.38); }
.companion-dialog::backdrop { background:rgba(23,45,74,.55);backdrop-filter:blur(12px) saturate(1.12); }
.companion-dialog-close { border-color:rgba(55,101,164,.2);color:#204875;background:rgba(255,255,255,.88);box-shadow:0 9px 26px rgba(24,64,108,.15); }
.companion-dialog-media { background:linear-gradient(145deg,#d7ebff,#edf6ff); }
.companion-dialog-media::before { content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(145deg,rgba(61,139,255,.15),transparent 35%,rgba(31,202,220,.12));mix-blend-mode:color; }
.companion-dialog-media::after { background:linear-gradient(90deg,transparent 70%,#eef5ff 100%),linear-gradient(180deg,transparent 72%,rgba(27,73,126,.12)); }
.companion-dialog-copy { color:#17385f;background:radial-gradient(circle at 92% 8%,rgba(128,104,239,.14),transparent 25%),radial-gradient(circle at 8% 92%,rgba(25,189,214,.14),transparent 28%),linear-gradient(145deg,#fafdff,#eaf3ff); }
.companion-dialog-copy::before { opacity:.22;background-image:linear-gradient(rgba(53,112,187,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(53,112,187,.18) 1px,transparent 1px); }
.dossier-header { border-color:rgba(66,115,176,.18); }
.dossier-header .companion-dialog-kicker { color:#3977da; }
.dossier-header>span { color:#7187a2; }
.companion-dialog-copy h2 { color:#102f57;text-shadow:0 8px 25px rgba(38,102,177,.12); }
.dossier-bio { color:#5d7592; }
.companion-dialog-tags span { border-color:rgba(58,112,182,.18);color:#285a98;background:rgba(255,255,255,.72);box-shadow:0 7px 18px rgba(40,83,136,.06); }
.companion-dialog-tags span:nth-child(2) { color:#087f95;background:rgba(218,250,255,.78); }
.companion-dialog-tags span:nth-child(3) { color:#b04e3f;background:rgba(255,234,229,.82); }
.companion-audio { border-color:rgba(54,112,185,.18);background:rgba(255,255,255,.72);box-shadow:0 8px 22px rgba(33,78,131,.07); }
.companion-audio span { color:#3970b3; }
.companion-dialog-note { color:#7187a0; }
.companion-placeholder-note { border-color:rgba(255,255,255,.6);color:#fff;background:rgba(43,100,178,.76); }

@media(max-width:760px){.companion-card:nth-child(4n+2),.companion-card:nth-child(4n+4){margin-top:0;margin-bottom:0}.companion-card{min-height:370px}}
@media(max-width:460px){.companion-card{min-height:310px}.companion-card-body{padding-top:55px}.companion-card-body::before{top:42px;left:13px;right:13px}.companion-card-code{top:11px;left:11px}.companion-card-top strong{font-size:21px}}

/* Physical card depth: bright frame, card edge and lifted shadow */
.companion-grid { perspective:1200px; }
.companion-card { border:6px solid rgba(255,255,255,.96);outline:1px solid rgba(var(--accent-rgb),.38);outline-offset:0;box-shadow:0 3px 0 rgba(var(--accent-rgb),.58),0 7px 12px rgba(18,47,82,.12),0 22px 42px rgba(25,61,103,.2),inset 0 1px 0 rgba(255,255,255,.95); }
.companion-card-image { inset:0;border-radius:11px 1px 11px 11px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.32); }
.companion-card:hover,.companion-card:focus-visible { box-shadow:0 7px 0 rgba(var(--accent-rgb),.68),0 15px 24px rgba(18,47,82,.18),0 38px 70px rgba(var(--accent-rgb),.3),inset 0 1px 0 #fff; }
.companion-card:active { transform:perspective(900px) rotateX(calc(var(--rx) * .45)) rotateY(calc(var(--ry) * .45)) translateY(-3px) scale(.995);box-shadow:0 3px 0 rgba(var(--accent-rgb),.6),0 12px 24px rgba(18,47,82,.18); }
.companion-card-body { left:0;right:0;bottom:0; }

@media(max-width:600px){.companion-card{border-width:4px;box-shadow:0 3px 0 rgba(var(--accent-rgb),.52),0 13px 26px rgba(25,61,103,.2)}.companion-card:hover{box-shadow:0 4px 0 rgba(var(--accent-rgb),.6),0 20px 36px rgba(var(--accent-rgb),.24)}}

/* Cinematic motion layer */
.page-players { position:relative;background:linear-gradient(180deg,#f8fbff 0,#f2f7ff 43%,#f8faff 100%); }
.page-players::before,.page-players::after { content:"";position:fixed;z-index:-1;width:34vw;height:34vw;border-radius:50%;pointer-events:none;filter:blur(12px);opacity:.42;animation:companion-ambient 16s ease-in-out infinite alternate; }
.page-players::before { top:8vh;left:-13vw;background:radial-gradient(circle,rgba(48,135,255,.2),transparent 68%); }
.page-players::after { right:-12vw;top:48vh;background:radial-gradient(circle,rgba(154,91,255,.16),transparent 68%);animation-delay:-7s; }
.companion-hero { position:relative; }
.companion-hero::after { content:"";position:absolute;left:49%;top:9%;width:1px;height:78%;pointer-events:none;background:linear-gradient(transparent,rgba(73,130,205,.2),transparent); }
.companion-eyebrow::before { content:"";display:inline-block;width:28px;height:2px;margin:0 10px 3px 0;background:#2b6ee9;animation:companion-pulse 2.4s ease-in-out infinite; }
.companion-showcase { --scene-x:0;--scene-y:0;transition:transform .7s cubic-bezier(.16,1,.3,1);transform:translate3d(calc(var(--scene-x) * -9px),calc(var(--scene-y) * -7px),0); }
.showcase-card { transition:transform .7s cubic-bezier(.16,1,.3,1),box-shadow .5s ease;will-change:transform; }
.showcase-card--lead:hover { transform:rotate(-1deg) translateY(-9px) scale(1.018)!important;box-shadow:0 34px 78px rgba(34,74,127,.24); }
.showcase-card:not(.showcase-card--lead):hover { transform:rotate(1deg) translateY(-7px) scale(1.018)!important;box-shadow:0 30px 70px rgba(34,74,127,.23); }
.showcase-card img { transition:transform 1s cubic-bezier(.16,1,.3,1),filter .5s ease; }
.showcase-card:hover img { transform:scale(1.045);filter:saturate(1.07); }
.motion-section { opacity:0;transform:translateY(42px);filter:blur(7px);transition:opacity .9s ease,transform .95s cubic-bezier(.16,1,.3,1),filter .9s ease; }
.motion-section.is-revealed { opacity:1;transform:none;filter:none; }
.curator-card::before { content:"";position:absolute;z-index:2;inset:-80% -25%;pointer-events:none;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.28) 49%,transparent 56%);transform:translateX(-55%) rotate(8deg);transition:transform .9s cubic-bezier(.16,1,.3,1); }
.curator-card:hover::before { transform:translateX(58%) rotate(8deg); }
.curator-card:hover .curator-faces img:nth-child(1) { transform:translateY(-6px) rotate(-7deg); }
.curator-card:hover .curator-faces img:nth-child(2) { transform:translateY(-12px); }
.curator-card:hover .curator-faces img:nth-child(3) { transform:translateY(-5px) rotate(7deg); }
.curator-faces img { transition:transform .65s cubic-bezier(.16,1,.3,1),filter .4s ease; }
.category-strip button { overflow:hidden; }
.category-strip button::after { content:"";position:absolute;left:16px;right:16px;bottom:0;height:3px;border-radius:4px;background:linear-gradient(90deg,#397cff,#22c5d8,#8b6cf5);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.16,1,.3,1); }
.category-strip button:hover::after,.category-strip button.is-active::after { transform:scaleX(1); }
.category-strip button.is-active { box-shadow:0 13px 28px rgba(48,103,186,.13); }
.companion-card-code { animation:companion-code-glow 2.8s ease-in-out infinite; }
.companion-card:nth-child(2n) .companion-card-code { animation-delay:-1.4s; }
.companion-card-foot b { transform:translateX(-5px);opacity:.55;transition:transform .35s ease,opacity .35s ease; }
.companion-card:hover .companion-card-foot b { transform:translateX(0);opacity:1; }
.companion-card:hover .companion-card-body::before { animation:companion-line-scan 1.25s ease-in-out infinite alternate; }
.companion-dialog-close { transition:transform .3s ease,background .3s ease; }
.companion-dialog-close:hover { transform:rotate(90deg);background:#fff; }

@keyframes companion-ambient { to { transform:translate3d(7vw,5vh,0) scale(1.16);opacity:.62; } }
@keyframes companion-pulse { 50% { width:44px;box-shadow:0 0 14px rgba(43,110,233,.55); } }
@keyframes companion-code-glow { 50% { box-shadow:0 8px 24px rgba(var(--accent-rgb),.56),0 0 14px rgba(var(--accent-rgb),.28); } }
@keyframes companion-line-scan { to { right:44%;filter:brightness(1.3); } }

@media(max-width:760px){.companion-hero::after{display:none}.page-players::before,.page-players::after{width:70vw;height:70vw}.showcase-card:hover,.showcase-card--lead:hover{transform:none!important}}
@media(prefers-reduced-motion:reduce){.page-players::before,.page-players::after,.companion-eyebrow::before,.companion-card-code{animation:none}.motion-section{opacity:1;transform:none;filter:none}.companion-showcase{transform:none}.curator-card::before{display:none}}
.companion-dialog-copy{justify-content:flex-start;overflow-y:auto}.companion-moments{margin-top:22px;padding-top:20px;border-top:1px solid rgba(31,72,119,.14)}.companion-moments-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:12px}.companion-moments-head span{color:#3970e5;font-size:8px;font-weight:900;letter-spacing:.18em}.companion-moments-head strong{color:#173b62;font-size:13px}.companion-moments-feed{display:grid;gap:10px}.companion-moment{padding:14px;border:1px solid #dae5f1;border-radius:11px;background:linear-gradient(145deg,#fff,#f7faff);box-shadow:0 8px 22px rgba(32,67,108,.06)}.companion-moment header{display:flex;align-items:center;justify-content:space-between;gap:10px}.companion-moment header strong{color:#254b73;font-size:11px}.companion-moment time{color:#95a5b7;font-size:8px}.companion-moment>p{margin:9px 0 0;color:#4f6883;font-size:11px;line-height:1.7;white-space:normal}.companion-moment-images{display:grid;gap:5px;margin-top:10px}.companion-moment-images.count-1{grid-template-columns:minmax(0,260px)}.companion-moment-images.count-2{grid-template-columns:repeat(2,1fr)}.companion-moment-images.count-3{grid-template-columns:repeat(3,1fr)}.companion-moment-images img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:7px;background:#e9eff6}.companion-moments-empty{margin:0;padding:24px 10px;border:1px dashed #cfdae7;border-radius:10px;color:#93a2b3;text-align:center;font-size:10px}
@media(max-width:760px){.companion-dialog-copy{overflow-y:visible}.companion-moment-images.count-3{grid-template-columns:repeat(3,1fr)}}
