/* lyknss hub-and-spoke bio page. Used by <slug>-hub.html and stub bios. */
    /* Hub-and-spoke person page (2026-10-08). Person at the centre, live.json spokes in orbit.
       Data: /people/<data-person>/hub.json (spoke list; "from" spokes are filled from live.json at load time).
       Falls back to live.json's own spokes when a person has no hub.json. */
    body { background:var(--paper); color:var(--ink); margin:0; font-family:"PT Serif", Georgia, serif; }
    .wrap { max-width:1100px; margin:0 auto; padding:28px 16px 48px; }
    @media (min-width:600px) { .wrap { padding:28px 4vw 48px; } }
    .who { text-align:center; }
    .kicker { font-family:"Space Mono", monospace; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--accent-text); margin:0 0 6px; }
    h1 { font-family:"Playfair Display", serif; font-weight:900; font-size:clamp(32px,5vw,52px); line-height:1.05; margin:0; }
    .tagline { margin:8px 0 0; font-style:italic; font-size:1.05rem; color:var(--ink-2); }
    .rule { border:0; border-top:4px solid var(--ink); margin:16px 0 4px; }
    .rule-thin { border:0; border-top:1px solid var(--rule); margin:0 0 22px; }

    .split { display:grid; grid-template-columns:minmax(280px,1.1fr) minmax(260px,.9fr); gap:36px; align-items:start; }
    @media (max-width:800px) { .split { grid-template-columns:1fr; gap:20px; } }
    .hint { font-family:"Space Mono", monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2); text-align:center; margin:10px 0 0; }

    #orbit { position:relative; width:min(100%,540px); aspect-ratio:1; margin:0 auto; touch-action:manipulation; }
    #orbit svg { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; overflow:visible; }
    #orbit line { stroke:var(--rule); stroke-width:.4; }
    #orbit line.on { stroke:var(--accent); stroke-width:1; }
    #orbit circle.track { fill:none; stroke:var(--rule); stroke-width:.25; stroke-dasharray:1 1.2; }

    /* The person: larger than the spokes so the eye lands there first. */
    #orbit .hub { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:3;
      box-sizing:border-box; width:var(--hw,28%); aspect-ratio:1; border-radius:50%; overflow:hidden;
      border:3px solid var(--ink); box-shadow:0 0 0 5px var(--paper), 0 0 0 6px var(--ink); background:var(--paper-2); }
    #orbit .hub img { width:100%; height:100%; object-fit:cover; display:block; }
    #orbit button.hub { padding:0; cursor:pointer; transition:box-shadow .15s; }
    #orbit button.hub:hover, #orbit button.hub:focus-visible { outline:none; box-shadow:0 0 0 5px var(--paper), 0 0 0 7px var(--ink-2); }
    #orbit button.hub.on { border-color:var(--accent); box-shadow:0 0 0 5px var(--paper), 0 0 0 8px var(--accent); }
    .panel .bio p { margin:12px 0 0; font-size:15.5px; line-height:1.55; }
    .panel .bio .src { font-family:"Space Mono", monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2); }
    .panel .bio .src a { color:var(--accent-text); }

    #orbit .spoke { position:absolute; transform:translate(-50%,-50%); z-index:4; box-sizing:border-box;
      width:var(--sw,16.5%); aspect-ratio:1; padding:0; border-radius:50%; border:1px solid var(--ink);
      background:var(--paper-2); cursor:pointer; overflow:visible; transition:box-shadow .15s; }
    #orbit .spoke img { width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; }
    /* Icon spokes: marigold line icon on a navy disc, same as the lyknss rail tiles (fixed colours, both themes). */
    #orbit .spoke.ic { background:#14213D; color:#F2A93B; }
    #orbit .spoke.ic svg { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:56%; height:56%; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; overflow:visible; }
    #orbit .spoke.ic:hover svg, #orbit .spoke.ic:focus-visible svg { color:#FFD08A; }
    #orbit .spoke .lbl { position:absolute; left:50%; top:calc(100% + 5px); transform:translateX(-50%);
      width:max-content; max-width:92px; text-align:center;
      font:700 10px/1.15 "Space Mono", monospace; letter-spacing:.04em; text-transform:uppercase;
      color:var(--ink-2); pointer-events:none; text-shadow:0 0 3px var(--paper), 0 0 3px var(--paper); }
    /* Item count: red disc with a white number, sitting inside the spoke's circle (lower right). */
    #orbit .spoke .n { position:absolute; right:9%; bottom:9%; z-index:1; min-width:17px; height:17px; padding:0 4px; box-sizing:border-box;
      border-radius:9px; background:#D62828; color:#FFFFFF; font:700 10px/17px "Space Mono", monospace; text-align:center;
      box-shadow:0 0 0 1.5px #14213D; }
    #orbit .spoke:hover, #orbit .spoke:focus-visible { z-index:20; box-shadow:0 0 0 3px var(--paper), 0 0 0 5px var(--ink-2); outline:none; }
    #orbit .spoke.on { border:3px solid var(--accent); box-shadow:0 0 0 3px var(--paper), 0 0 0 6px var(--accent); z-index:5; }
    #orbit .spoke.on .lbl { color:var(--ink); top:calc(100% + 10px); }
    @media (max-width:420px) { #orbit .spoke .lbl { font-size:8.5px; letter-spacing:.01em; max-width:64px; } }
    /* Phones: shorter spokes (same circle sizes), labels pushed outward so the tighter ring stays clear. */
    #orbit.m .spoke .lbl { max-width:62px; overflow-wrap:normal; word-break:keep-all; }
    #orbit.m .spoke.lr .lbl { left:calc(100% + 5px); top:50%; transform:translateY(-50%); text-align:left; }
    #orbit.m .spoke.ll .lbl { left:auto; right:calc(100% + 5px); top:50%; transform:translateY(-50%); text-align:right; }
    #orbit.m .spoke.lt .lbl { top:auto; bottom:calc(100% + 5px); }
    #orbit.m .spoke.on.lr .lbl, #orbit.m .spoke.on.ll .lbl { top:50%; }
    #orbit.m .spoke.on.lt .lbl { bottom:calc(100% + 10px); }
    /* Phones: once a spoke (or the photo) is tapped, the orbit pins to the top and the list scrolls under it. */
    @media (max-width:800px) {
      .orbit-wrap.pinned { position:sticky; top:0; z-index:30; background:var(--paper); padding:8px 0 6px; box-shadow:0 1px 0 var(--rule), 0 6px 12px -8px rgba(20,33,61,.25); }
      .orbit-wrap.pinned .hint { display:none; }
    }

    .panel { min-height:200px; }
    .panel .ph { display:flex; align-items:baseline; justify-content:space-between; gap:12px; border-bottom:3px solid var(--ink); padding-bottom:6px; }
    .panel h2 { font-family:"Playfair Display", serif; font-size:28px; margin:0; }
    .panel .c { font-family:"Space Mono", monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2); }
    .panel a.it, .panel .it { display:grid; grid-template-columns:64px 1fr; gap:12px; text-decoration:none; color:inherit; border-bottom:1px solid var(--rule); padding:12px 0; }
    .panel .it.noimg { grid-template-columns:1fr; }
    .panel a.it:hover .t, .panel a.it:focus-visible .t { text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:3px; }
    .panel .it > img { width:64px; height:64px; object-fit:cover; border-radius:50%; border:1px solid var(--ink); }
    .panel .t { font-family:"Playfair Display", serif; font-weight:700; font-size:17px; }
    .panel .d { font-family:"Space Mono", monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent-text); margin-top:2px; }
    .panel .syn { margin:4px 0 0; font-size:14px; line-height:1.45; color:var(--ink-2); }
    .panel .lv-media { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
    .panel .lv-media img { width:96px; height:96px; object-fit:cover; border-radius:6px; }
    .panel .empty { color:var(--ink-2); font-style:italic; margin:14px 0; }

    footer { margin-top:32px; font-family:"Space Mono", monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2); }
    footer a { color:inherit; }
    footer .note { display:block; margin-top:8px; letter-spacing:.02em; text-transform:none; }
  

/* Monogram when there's no photo yet. */
#orbit .hub .mono { display:none; position:absolute; inset:0; place-items:center; background:#14213D; color:#F2A93B; font:700 clamp(22px,7vw,40px)/1 "Playfair Display", serif; }
#orbit .hub.nopic img { display:none; }
#orbit .hub.nopic .mono { display:grid; }

/* Stub bios: not-finished notice + Invite button. */
.notice { border:1px solid var(--rule); border-left:4px solid var(--accent); background:var(--paper-2); border-radius:6px; padding:14px 16px; margin:0 0 22px; }
.notice .tag { margin:0 0 4px; font-family:"Space Mono", monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-text); }
.notice h2 { font-family:"Playfair Display", serif; font-size:20px; line-height:1.25; margin:0 0 6px; }
.notice p { margin:0 0 12px; line-height:1.5; font-size:15px; }
.notice .invite { font:700 15px/1.2 "PT Serif", Georgia, serif; color:#14213D; background:#F2A93B; border:0; border-radius:999px; padding:11px 20px; min-height:44px; cursor:pointer; }
.notice .invite:hover:not(:disabled) { background:#F5B54E; }
.notice .invite:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.notice .invite:disabled { opacity:.7; cursor:default; }
.notice .status { margin:8px 0 0; font-size:14px; color:var(--ink-2); min-height:1.2em; }
@media (min-width:801px) { .notice { display:flex; flex-wrap:wrap; align-items:center; gap:4px 18px; } .notice > p:not(.tag):not(.status) { flex:1 1 320px; margin:0; } .notice .tag, .notice h2 { flex:1 1 100%; } .notice .status { flex:1 1 100%; } }
.notice[hidden] { display:none !important; }

/* Bio panel: the centre photo, larger, at the top of the About text. */
.panel .bio .bio-pic { display:block; width:100%; max-width:360px; aspect-ratio:1; object-fit:cover; border-radius:8px; border:1px solid var(--ink); margin:14px 0 2px; }
@media (max-width:800px) { .panel .bio .bio-pic { max-width:280px; margin-left:auto; margin-right:auto; } }

/* Desktop: the hub stays put on the left while the right-hand panel (links or About) scrolls. */
@media (min-width:801px) and (min-height:560px) {
  .orbit-wrap { position:sticky; top:16px; align-self:start; }
}

/* Whole-hub search, above the right-hand panel. */
.rightcol { min-width:0; }
.find { padding:0 0 10px; background:var(--paper); }
.find input { box-sizing:border-box; width:100%; font:16px/1.3 "PT Serif", Georgia, serif; color:var(--ink); background-color:var(--paper);
  border:1px solid var(--rule); border-radius:999px; padding:9px 14px 9px 36px; min-height:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234B5670' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4.5 4.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:12px 50%; background-size:16px 16px; }
.find input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(242,169,59,.3); }
@media (min-width:801px) and (min-height:560px) { .find { position:sticky; top:0; z-index:5; padding-top:16px; margin-top:-16px; } }
.panel h3.grp { margin:18px 0 0; font-family:"Space Mono", monospace; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-text); }
.panel h3.grp span { color:var(--ink-2); }
.panel button.it { width:100%; text-align:left; background:none; border:0; border-bottom:1px solid var(--rule); font:inherit; color:inherit; cursor:pointer; }
#orbit .spoke.dim { opacity:.28; }
#orbit .spoke.dim .lbl { opacity:.6; }
#orbit .spoke.dim .n { visibility:hidden; }

/* Search stays until Clear. */
.find { display:flex; gap:8px; align-items:center; }
.find input { flex:1 1 auto; min-width:0; }
.find .clear { flex:0 0 auto; font:700 14px/1 "PT Serif", Georgia, serif; color:#14213D; background:#F2A93B; border:0; border-radius:999px; padding:0 16px; min-height:42px; cursor:pointer; }
.find .clear:hover { background:#F5B54E; }
.find .clear:focus-visible { outline:2px solid var(--ink); outline-offset:2px; }
.panel mark { background:rgba(242,169,59,.35); color:inherit; border-radius:2px; padding:0 1px; }
.panel h3.grp { scroll-margin-top:70px; }
@media (max-width:800px) {
  .orbit-wrap.pinned ~ .rightcol .find { position:sticky; top:var(--pinh, 0px); z-index:29; padding:8px 0; box-shadow:0 6px 10px -8px rgba(20,33,61,.25); }
}
.panel .it > img.logo { object-fit:contain; background:#FFFFFF; padding:4px; box-sizing:border-box; }

    .panel .bio .take { font-family:"Playfair Display",serif; font-style:italic; font-size:1.15rem; line-height:1.35; margin:10px 0 14px; }
    .panel .bio .take span { display:block; font-family:"Space Mono",monospace; font-style:normal; font-size:.72rem; letter-spacing:.04em; margin-top:4px; opacity:.7; }

/* Frank's own take on a person or place: same accent as the label line. */
.panel .syn.take, .panel .bio .take { color:var(--accent-text); }
.panel .bio .take span { color:var(--ink-2); }
/* Panel header icon: only shown in the classic panel style. */
.panel .ph .ico { display:none; }

/* Classic panel (data-panel="classic" on #hubpage): the classic view's cards, hub kept. */
.panel.classic .ph { align-items:center; background:var(--paper-2); border-bottom:1px solid var(--ink); padding:0 8px 8px 0; margin-bottom:12px; }
.panel.classic .ph h2 { display:flex; align-items:center; gap:10px; font-family:"PT Serif", serif; font-size:1.2rem; }
.panel.classic .ph .ico { display:flex; align-items:center; justify-content:center; width:56px; height:56px; box-sizing:border-box; border-radius:6px; border:3px solid var(--accent); background:var(--ink); box-shadow:0 4px 10px var(--rule); }
.panel.classic .ph .ico svg { width:30px; height:30px; fill:none; stroke:var(--accent); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.panel.classic a.it, .panel.classic .it, .panel.classic button.it { display:block; padding:0; margin:0 0 14px; border:1px solid var(--rule); border-radius:12px; overflow:hidden; background:var(--paper-2); }
.panel.classic .it > img { display:block; width:100%; height:auto; max-height:600px; aspect-ratio:auto; border:0; border-radius:0; object-fit:contain; background:var(--paper-2); }
.panel.classic .it > img.small { width:auto; max-width:100%; margin:14px 14px 0; border-radius:8px; }
.panel.classic .it > img.logo { width:100%; max-height:160px; padding:16px; background:#FFFFFF; }
.panel.classic .it > div { padding:12px 14px 14px; }
.panel.classic .t { font-family:"PT Serif", serif; font-size:1.05rem; line-height:1.25; }
.panel.classic .d { font-family:"PT Serif", serif; font-size:.62rem; letter-spacing:.03em; color:var(--ink); opacity:.7; margin:4px 0 0; }
.panel.classic .syn { font-size:.95rem; margin-top:6px; }
.panel.classic a.it:hover { box-shadow:0 0 0 2px var(--accent); }
.panel.classic .lv-media img { width:auto; height:auto; max-width:100%; max-height:300px; }

/* Site tag on outside links, like the bio picker's tag. */
.panel .it .site { display:inline-block; margin-top:8px; font-family:"Space Mono", monospace; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2); background:var(--paper-2); border:1px solid var(--rule); border-radius:3px; padding:2px 6px; }
.panel.classic .it .site { background:var(--paper); }

/* Desktop: the chosen spoke's line runs into the panel heading. */
.split { position:relative; }
.hub-link { position:absolute; left:0; top:0; pointer-events:none; overflow:visible; z-index:5; }
.hub-link path { fill:none; stroke:var(--accent); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.hub-link circle { fill:var(--accent); }
@media (min-width:801px) { #orbit .spoke.linked .lbl { visibility:hidden; } }

/* Search on phones: a button at the top of the screen opens a drop-down search bar; with a search on, the button
   shows the words and an × to cancel. Desktop keeps the bar above the panel. */
.find .done, .find-fab { display:none; }
@media (max-width:800px) {
  .rightcol .find { display:none; }
  .rightcol .find.open { display:flex; position:fixed; top:0; left:0; right:0; z-index:60; margin:0; padding:10px 12px;
    background:var(--paper); box-shadow:0 6px 18px -6px rgba(20,33,61,.35); }
  .find.open .done { display:block; flex:0 0 auto; font:700 14px/1 "PT Serif", Georgia, serif; color:var(--paper); background:var(--ink);
    border:0; border-radius:999px; padding:0 14px; min-height:42px; cursor:pointer; }
  .find-fab { display:flex; position:fixed; top:10px; right:10px; z-index:55; align-items:stretch; max-width:calc(100vw - 20px);
    border-radius:999px; background:var(--ink); box-shadow:0 4px 12px -4px rgba(20,33,61,.45); }
  .find-fab.away { display:none; }
  .find-fab button { border:0; background:none; color:#F2A93B; cursor:pointer; font:700 14px/1 "PT Serif", Georgia, serif; }
  .find-fab .go { display:flex; align-items:center; gap:6px; min-width:44px; min-height:44px; padding:0 12px; justify-content:center; }
  .find-fab .go svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; }
  .find-fab .q { color:var(--paper); max-width:44vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .find-fab.has .go { padding-right:4px; }
  .find-fab .x { font-size:22px; padding:0 14px 0 6px; min-height:44px; }
}

/* Optional looping clip in the centre circle (hub.json "video"); the photo stays underneath as the fallback. */
#orbit .hub video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:50%; }

.panel .bio .bio-pic.bio-vid { max-width:100%; aspect-ratio:16/9; object-fit:cover; background:#000; }

/* Spoke icons: navy on gold (Frank, 2026-10-08). The panel heading tile matches. */
#orbit .spoke.ic { background:#F2A93B; color:#14213D; }
#orbit .spoke.ic svg { stroke-width:1.8; }
#orbit .spoke.ic:hover, #orbit .spoke.ic:focus-visible { background:#F5B54E; }
#orbit .spoke.ic:hover svg, #orbit .spoke.ic:focus-visible svg { color:#0B1426; }
#orbit .spoke.ic.on { border-color:#14213D; }
.panel.classic .ph .ico { background:#F2A93B; border-color:#14213D; }
.panel.classic .ph .ico svg { stroke:#14213D; stroke-width:1.8; }
/* === Color Studio theme: Morning mist (2026-10-09; hub pages only) ===
   Pale sky page and panels, deep navy text and spokes, soft sky-blue accent and selection. */
:root, :root[data-theme] {
  --paper:#F5F8FB; --paper-2:#DCE8F3; --ink:#16283A; --ink-2:#45596E; --rule:#B7CCE0; --accent:#3A6E9E; --accent-ink:#FFFFFF; --accent-text:#2B5A85;
  --hub-badge:#C0453A; --hub-disc:#1F3E5C; --hub-icon:#DCE8F3; --hub-ring:#F5F8FB; --hub-sel:#5B8FC2;
  --hub-line:#5B8FC2; --hub-tile:#1F3E5C; --hub-tile-icon:#DCE8F3; --hub-tile-edge:#5B8FC2;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --paper:#F5F8FB; --paper-2:#DCE8F3; --ink:#16283A; --ink-2:#45596E; --rule:#B7CCE0; --accent:#3A6E9E; --accent-ink:#FFFFFF; --accent-text:#2B5A85; color-scheme:light; } }
body { background:var(--paper); color:var(--ink); }
#orbit .spoke .n { background:var(--hub-badge); }
#orbit .spoke.ic { background:var(--hub-disc); color:var(--hub-icon); }
#orbit .spoke.ic:hover, #orbit .spoke.ic:focus-visible { background:var(--hub-disc); filter:brightness(1.15); }
#orbit .spoke.ic:hover svg, #orbit .spoke.ic:focus-visible svg { color:var(--hub-icon); }
#orbit .spoke.on, #orbit .spoke.ic.on { border-color:var(--hub-ring); box-shadow:0 0 0 3px var(--paper), 0 0 0 6px var(--hub-sel); }
#orbit line.on { stroke:var(--hub-line); }
.hub-link path { stroke:var(--hub-line); }
.hub-link circle { fill:var(--hub-line); }
.panel.classic .ph .ico { background:var(--hub-tile); border-color:var(--hub-tile-edge); }
.panel.classic .ph .ico svg { stroke:var(--hub-tile-icon); }
.find .clear { background:var(--accent); color:var(--accent-ink); }

/* === Phone rail (test mode: #hubpage[data-mobile="rail"] or ?m=rail). Desktop unaffected. === */
.mrail-nav { display:none; }
@media (max-width:800px) {
  .mrail .split { grid-template-columns:56px minmax(0,1fr); gap:14px; }
  .mrail .orbit-wrap { display:none; }
  .mrail .mrail-nav { display:flex; flex-direction:column; gap:10px; position:sticky; top:12px; align-self:start;
    max-height:calc(100vh - 24px); overflow-y:auto; overscroll-behavior:contain; padding:4px 6px 8px 4px; margin:-4px -6px 0 -4px; scrollbar-width:none; }
  .mrail .mrail-nav::-webkit-scrollbar { display:none; }
  .mrail .rt { position:relative; flex:0 0 auto; width:48px; height:48px; padding:0; border:2px solid var(--hub-tile-edge, #F2A93B); border-radius:12px;
    background:var(--hub-disc, #14213D); color:var(--hub-icon, #F2A93B); cursor:pointer; box-shadow:0 3px 6px rgba(14,26,47,.22); overflow:visible; }
  .mrail .rt svg { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:58%; height:58%; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
  .mrail .rt img { width:100%; height:100%; object-fit:cover; border-radius:10px; display:block; }
  .mrail .rt.me { border-radius:50%; } .mrail .rt.me img { border-radius:50%; }
  .mrail .rt .n { position:absolute; right:-6px; bottom:-6px; min-width:18px; height:18px; padding:0 4px; box-sizing:border-box; border-radius:9px;
    background:var(--hub-badge, #C2392B); color:#fff; font:700 10px/18px "Space Mono", monospace; text-align:center; border:2px solid var(--paper); }
  .mrail .rt.on { box-shadow:0 0 0 3px var(--paper), 0 0 0 5px var(--hub-sel, #7a3419); }
  .mrail .rt:focus-visible { outline:3px solid var(--hub-sel, #7a3419); outline-offset:3px; }
  .mrail .panel.classic .ph h2 { font-size:22px; }
}

/* === Rules v2 pages (#hubpage.v2): index cards, no image files; generated source tile === */
.v2 .panel a.it.v2, .v2 .panel .it.v2 { display:grid; grid-template-columns:44px 1fr; gap:12px; align-items:start; padding:12px 0; border:0; border-bottom:1px solid var(--rule); border-radius:0; background:none; margin:0; }
.v2 .panel .it.v2 .tile { width:44px; height:44px; border-radius:8px; display:grid; place-items:center; background:var(--hub-tile, #14213D); color:var(--hub-tile-icon, #F2A93B);
  font:700 10px/1 "Space Mono", monospace; letter-spacing:.02em; text-align:center; overflow:hidden; }
.v2 .panel .it.v2 .site { margin-top:6px; }
.v2 footer .note a { color:inherit; }
.v2 .panel .it.v2 > img.thumb { width:44px; height:auto; max-height:66px; object-fit:cover; border-radius:4px; border:1px solid var(--rule); display:block; }
.panel .bio .credit, .panel .credit { font-size:12px; line-height:1.45; color:var(--ink-2); margin:6px 0 14px; }
.panel .credit a { color:inherit; }
footer .note.tmdb img { height:12px; width:auto; vertical-align:-1px; margin-right:4px; }