/* identity: four settings edge to edge across the stage, full height (client tokens only) */
.id{ position:absolute; left:var(--vx); right:0; top:0; bottom:0; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr;
  font-family:var(--c-body); transition:left .7s var(--ease); }
.id-panel{ position:relative; min-width:0; min-height:0; overflow:clip; display:grid; grid-template-rows:auto 1fr auto; padding:28px 33px 30px; }
.id-1, .id-3{ padding-left:var(--fl); }   /* the left panels clear the edge tab */
.id-1{ background:var(--c-background); color:var(--c-text); }
.id-2{ background:var(--c-brand-1); color:var(--c-on-brand-1); }
.id-3{ background:var(--c-brand-4); color:var(--c-on-brand-4); }
.id-4{ color:var(--c-on-photo); }
.id-photo{ position:absolute; inset:0; z-index:0; }
.id-photo .ph{ position:absolute; inset:0; }
.id-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.28), transparent 30%, transparent 62%, rgba(0,0,0,.42)); }
.id-photo .ph-label{ left:auto; right:12px; bottom:auto; top:12px; }
.id-label, .id-art, .id-note{ position:relative; z-index:1; }
.id-label{ font:500 11px/1 var(--c-body); opacity:.7; white-space:pre; font-feature-settings:"tnum"; }
.id-art{ display:grid; place-items:center; min-height:0; }
.id-art > .lg{ width:62%; height:46%; }
.id-2 .id-art > .lg{ width:44%; height:62%; }
.id-note{ margin:0; max-width:330px; font:400 12px/1.5 var(--c-body); opacity:.75; text-wrap:pretty; }

/* the contained symbol: an app tile and where it lives */
.id-contained{ display:flex; align-items:center; gap:28px; }
.id-tile{ width:112px; height:112px; border-radius:26px; background:var(--c-brand-1); color:var(--c-on-brand-1); display:grid; place-items:center;
  box-shadow:0 1px 2px rgba(0,0,0,.12), 0 18px 34px -18px rgba(0,0,0,.4); }
.id-tile svg{ width:56%; height:56%; fill:currentColor; } .id-tile svg path{ fill:currentColor; }
.id-contained ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; font:500 13px/1.3 var(--c-body); }