/* Ground truth (/ground-truth) · page-only classes, prefix .gt- · tokens only
   The first viewport is the moment: a dark field of sources that are tabs, a white block that
   answers for the one picked. Then the structural point, the connection list, FAQ, CTA. */

/* ---- hero ---- */
.gt-hero{padding:72px 0 96px}
.gt-hero-t{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:end;margin-bottom:44px}
.gt-hero-t>*{min-width:0}
.gt-hero-t .display{max-width:14ch}
.gt-hero-r .btns{margin-top:24px}
.gt-src{margin-top:16px}

/* ---- the desk: the sources on the dark field are the tabs, the answer sits on white ---- */
.gt-desk{display:grid;grid-template-columns:minmax(0,4.2fr) minmax(0,7.8fr);gap:var(--gap);align-items:stretch}
.gt-desk>*{min-width:0}
.gt-srcs{display:flex;flex-direction:column;padding:26px 22px 22px;border-radius:var(--r-blk);background:var(--primary);color:var(--on-primary);--focus:var(--on-primary)}
.gt-srcs-h{padding:0 6px 18px}
.gt-pick{font-size:17px;font-weight:500;letter-spacing:-.015em;line-height:1.2}
.gt-pick-s{margin-top:6px;font-size:13px;line-height:1.45;color:var(--on-primary-2);text-wrap:pretty}

.gt-tabs{display:grid;gap:7px}
.gt-tab{display:grid;grid-template-columns:10px minmax(0,1fr) auto 16px;grid-template-rows:auto auto;column-gap:12px;align-items:center;width:100%;min-height:64px;padding:11px 12px 11px 16px;border:0;border-radius:var(--r-card);background:transparent;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--paper) 18%,var(--primary));color:var(--on-primary);font:400 14px var(--sans);text-align:left;text-decoration:none;cursor:pointer;transition:background-color .24s var(--ease),box-shadow .24s var(--ease),color .24s var(--ease),transform .34s var(--ease-out)}
.gt-tab i{grid-column:1;grid-row:1/3;width:10px;height:10px;border-radius:50%;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--paper) 55%,var(--primary));transition:background-color .24s var(--ease),box-shadow .24s var(--ease),transform .24s var(--ease)}
.gt-tab b{grid-column:2;grid-row:1;font-size:15px;font-weight:500;letter-spacing:-.01em;line-height:1.25}
.gt-tab-desc{grid-column:2;grid-row:2;font-size:12px;line-height:1.35;color:var(--on-primary-2);transition:color .24s var(--ease)}
.gt-tab-cue{grid-column:3;grid-row:1/3;display:inline-flex;align-items:center;justify-content:center;min-width:48px;height:26px;padding:0 9px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--paper) 24%,var(--primary));color:var(--on-primary-2);font-size:11px;font-weight:500;line-height:1;transition:background-color .24s var(--ease),box-shadow .24s var(--ease),color .24s var(--ease)}
.gt-tab svg{grid-column:4;grid-row:1/3;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.62;transition:opacity .24s var(--ease),transform .34s var(--ease-out)}
.gt-tab:hover{background:var(--on-primary-3);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--paper) 34%,var(--primary));transform:translateX(4px)}
.gt-tab:hover svg{opacity:1;transform:translateX(2px)}
.gt-tab:hover i{background:color-mix(in srgb,var(--accent) 55%,var(--primary));box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,var(--primary))}
.gt-tab:hover .gt-tab-cue{color:var(--on-primary);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--paper) 46%,var(--primary))}
/* Selected: the source becomes the paper edge of the answer and names its state. */
.gt-tab[aria-selected=true]{background:var(--paper);color:var(--ink);box-shadow:0 12px 28px -15px color-mix(in srgb,var(--ink) 82%,transparent),inset 0 0 0 2px var(--paper);transform:translateX(8px)}
.gt-tab[aria-selected=true] i{background:var(--accent);box-shadow:0 0 0 4px var(--t1);transform:scale(1.08)}
.gt-tab[aria-selected=true] .gt-tab-desc{color:var(--ink-2)}
.gt-tab[aria-selected=true] .gt-tab-cue{background:var(--primary);box-shadow:none;color:var(--on-primary)}
.gt-tab[aria-selected=true] svg{opacity:1;color:var(--ink)}
.gt-tab[aria-selected=true]:hover{transform:translateX(8px)}
.gt-tab:active{transform:translateX(2px) scale(.985)}
.gt-tab[aria-selected=true]:active{transform:translateX(8px) scale(.985)}
.gt-tab:focus-visible{outline:2px solid var(--on-primary);outline-offset:3px;box-shadow:inset 0 0 0 2px var(--primary)}
.gt-tab[aria-selected=true]:focus-visible{outline-color:var(--on-primary);box-shadow:0 12px 28px -15px color-mix(in srgb,var(--ink) 82%,transparent),inset 0 0 0 2px var(--ink)}
.gt-tab.is-hot:not([aria-selected=true]){background:var(--on-primary-3);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent) 68%,var(--primary))}
.gt-tab.is-hot:not([aria-selected=true]) i{background:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,var(--primary))}

.gt-room{margin:auto 0 0;padding:22px 6px 0;font-size:13px;line-height:1.55;color:var(--on-primary-2);text-wrap:pretty}
.gt-room span{display:block;margin-bottom:2px;font-size:12px}
.gt-room em{font-style:normal;font-weight:500;color:var(--on-primary);padding:1px 4px;margin:0 -4px;border-radius:6px;transition:background-color .25s var(--ease)}
.gt-room em.is-hot{background:var(--on-primary-3);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 60%,var(--primary))}

.gt-ask{display:grid;padding:26px 28px 24px;border-radius:var(--r-blk);background:var(--white);box-shadow:var(--shadow)}
.gt-a{display:flex;flex-direction:column;min-width:0;outline-offset:6px}
.gt-a:focus-visible{outline:2px solid var(--ink);outline-offset:6px;border-radius:18px}
.gt-a-h{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.gt-a-h>div{min-width:0}
.gt-a-t{font-size:var(--fs-h3);letter-spacing:-.03em;line-height:1.2}
.gt-a-h p{margin-top:6px;font-size:14px;line-height:1.5;color:var(--ink-2);max-width:52ch;text-wrap:pretty}
.gt-a-h .tag,.gt-tags{flex:none;margin-top:2px}
.gt-tags{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.gt-break{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1.7fr);gap:14px;align-items:center;margin-top:16px;padding:14px 16px;border-radius:var(--r-row);background:var(--warn-t);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--warn) 24%,var(--warn-t));color:var(--ink)}
.gt-break>svg{width:28px;height:18px;fill:none;stroke:var(--warn-ink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.gt-break-src,.gt-break-result{display:grid;gap:2px;min-width:0}
.gt-break span{font-size:11px;font-weight:500;letter-spacing:.03em;text-transform:uppercase;color:var(--warn-ink)}
.gt-break-src b,.gt-break-result b{font-weight:500}
.gt-break-src small{font-size:12px;line-height:1.35;color:var(--ink-2)}
.gt-break-result p{font-size:13px;line-height:1.45;color:var(--ink-2);text-wrap:pretty}
.gt-break-result p b{color:var(--ink)}
.chat.gt-chat{padding:18px 0 0;box-shadow:none;background:transparent;border-radius:0}
.gt-break+.gt-chat{padding-top:14px}
.gt-chat .bub.ai{background:var(--paper);max-width:94%}
.gt-chat .bub{font-size:14.5px}
.gt-cite{border-radius:4px;text-decoration:underline;text-decoration-style:dotted;text-decoration-color:var(--line-2);text-underline-offset:3px;transition:background-color .2s var(--ease),text-decoration-color .2s var(--ease)}
.gt-cite.is-hot{background:var(--t1);text-decoration-color:var(--accent-ink)}
.gt-stop{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:baseline;margin-top:auto;padding-top:18px;font-size:13.5px;line-height:1.5;color:var(--ink-2);text-wrap:pretty}
.gt-stop b{font-weight:500;color:var(--ink);white-space:nowrap}
.gt-chat+.gt-stop{margin-top:20px}
/* a scripted page shows one panel; without script every panel stays on the page */
@media (scripting:enabled){
  .gt-a:not(.is-on){display:none}
}
@media (scripting:none){
  .gt-ask{gap:28px}
  .gt-a+.gt-a{padding-top:28px;border-top:1px solid var(--line)}
}
.gt-a.is-in{animation:gt-in .5s var(--ease-out)}
@keyframes gt-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---- the structural point ---- */
.gt-why{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:start}
.gt-why>*{min-width:0}
.gt-why h2{max-width:22ch}
.gt-tbl{border-top:1px solid var(--line-2)}
.gt-tr{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,4fr) minmax(0,4fr);gap:20px;padding:15px 0;border-bottom:1px solid var(--line);font-size:14.5px;color:var(--ink-2)}
.gt-tr b{font-weight:500;color:var(--ink)}
.gt-tr span:last-child{color:var(--ink)}
.gt-th{font-size:var(--fs-xs);font-weight:500;color:var(--ink-3);padding:10px 0}
.gt-th span:last-child{color:var(--ink-3)}
.gt-why .sub a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}

/* ---- every connection ---- */
.gt-list-g{display:grid;grid-template-columns:minmax(0,3.5fr) minmax(0,8.5fr);gap:56px;align-items:start}
.gt-list-g>*{min-width:0}
.gt-list-t{position:sticky;top:104px}
.gt-list-t h2{max-width:14ch}
.gt-list-t .sub{margin-top:18px}
.gt-list-hint{margin-top:24px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;line-height:1.45;color:var(--ink-2)}
.gt-directory{overflow:hidden;border-radius:var(--r-blk);background:var(--white);box-shadow:var(--shadow)}
.gt-source-group+.gt-source-group{border-top:8px solid var(--paper)}
.gt-group-h{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;background:var(--primary);color:var(--on-primary)}
.gt-group-h h3{font-size:15px;font-weight:500;letter-spacing:-.01em}
.gt-group-h span{font-size:11px;font-weight:500;letter-spacing:.03em;text-transform:uppercase;color:var(--on-primary-2)}
.gt-conn{position:relative;display:grid;grid-template-columns:minmax(0,2.5fr) minmax(0,3.2fr) minmax(0,3.5fr);gap:20px;align-items:start;padding:18px 20px;border-top:1px solid var(--line);color:var(--ink-2);font-size:13.5px;line-height:1.45}
.gt-group-h+.gt-conn{border-top:0}
.gt-conn-link{grid-template-columns:minmax(0,2.5fr) minmax(0,3.2fr) minmax(0,3.5fr) auto;color:var(--ink-2);text-decoration:none;cursor:pointer;transition:background-color .24s var(--ease),box-shadow .24s var(--ease),transform .3s var(--ease-out)}
.gt-conn-name{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.gt-conn-name b{color:var(--ink);font-size:14.5px;font-weight:500;line-height:1.3}
.gt-conn-name .tag{flex:none;font-style:normal}
.gt-conn-stop{display:grid;gap:3px;min-width:0}
.gt-conn-stop>span{font-size:11px;font-weight:500;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-3)}
.gt-conn-action{display:inline-flex;align-items:center;align-self:center;justify-content:center;gap:6px;min-width:88px;height:34px;padding:0 10px;border-radius:var(--r-btn);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink);font-size:12px;font-weight:500;white-space:nowrap;transition:background-color .24s var(--ease),box-shadow .24s var(--ease),color .24s var(--ease)}
.gt-conn-action svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--ease-out)}
.gt-conn-link.is-current{background:var(--t1);box-shadow:inset 0 0 0 2px var(--t3)}
.gt-conn-link.is-current .gt-conn-stop>span,.gt-conn-link:focus-visible .gt-conn-stop>span{color:var(--ink-2)}
.gt-conn-link.is-current .gt-conn-action{background:var(--primary);box-shadow:none;color:var(--on-primary)}
.gt-conn-link:hover{z-index:1;background:var(--t1);box-shadow:inset 0 0 0 2px var(--t3);transform:translateX(-4px)}
.gt-conn-link:hover .gt-conn-action{background:var(--primary);box-shadow:none;color:var(--on-primary)}
.gt-conn-link:hover .gt-conn-action svg{transform:translateX(2px)}
.gt-conn-link:active{transform:scale(.992)}
.gt-conn-link:focus-visible{z-index:2;outline:2px solid var(--ink);outline-offset:-4px;background:var(--t1)}

/* ---- responsive ---- */
@media (max-width:1100px){
  .gt-hero-t{grid-template-columns:1fr;gap:24px}
  .gt-desk{grid-template-columns:minmax(0,1fr)}
  .gt-srcs{padding:22px 20px 20px}
  .gt-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gt-tab:hover,.gt-tab[aria-selected=true],.gt-tab[aria-selected=true]:hover,.gt-tab:active,.gt-tab[aria-selected=true]:active{transform:none}
  .gt-room{margin-top:18px;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--paper) 14%,var(--primary))}
  .gt-room span{display:inline;margin:0 4px 0 0}
  .gt-why{grid-template-columns:1fr;gap:32px}
  .gt-list-g{grid-template-columns:1fr;gap:32px}
  .gt-list-t{position:static}
  .gt-list-t h2{max-width:18ch}
  .gt-list-t .sub{max-width:62ch}
  .gt-list-hint{max-width:62ch;margin-top:18px}
}
@media (max-width:860px){
  .gt-hero{padding:48px 0 72px}
  .gt-hero-t{margin-bottom:28px}
  .gt-srcs{padding:18px 16px 16px}
  .gt-srcs-h{padding:0 2px 12px}
  .gt-pick{font-size:16px}
  .gt-room{margin-top:12px;padding:12px 2px 0;font-size:12.5px}
  .gt-ask{padding:20px 18px 18px}
  .gt-a-h{flex-direction:column;gap:10px}
  .gt-a-h .tag,.gt-tags{margin-top:0}
  .gt-tags{justify-content:flex-start}
  .gt-break{grid-template-columns:minmax(0,1fr) 24px minmax(0,1.65fr);gap:10px;padding:13px 14px}
  .gt-break>svg{width:24px}
  .gt-chat .bub.ai{max-width:100%}
  .gt-stop{grid-template-columns:1fr;gap:4px}
  .gt-tr{grid-template-columns:1fr 1fr;gap:4px 16px}
  .gt-tr>:first-child{grid-column:1/-1}
  .gt-th>:first-child{display:none}
  .gt-conn,.gt-conn-link{grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;padding:16px 18px}
  .gt-conn>p,.gt-conn-stop{grid-column:1/-1}
  .gt-conn-action{grid-column:2;grid-row:1;min-width:88px}
}
@media (max-width:600px){
  .gt-tabs{display:flex;gap:7px;margin:0 -16px;padding:0 16px 5px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;scroll-padding-inline:16px}
  .gt-tabs::-webkit-scrollbar{display:none}
  .gt-tab{flex:none;display:grid;grid-template-columns:9px auto auto 14px;grid-template-rows:1fr;width:auto;min-height:44px;padding:0 10px 0 13px;border-radius:var(--r-pill);scroll-snap-align:start}
  .gt-tab i,.gt-tab b,.gt-tab-cue,.gt-tab svg{grid-row:1}
  .gt-tab i{grid-column:1}
  .gt-tab b{grid-column:2;font-size:13.5px}
  .gt-tab-desc{display:none}
  .gt-tab-cue{grid-column:3;min-width:42px;height:24px;padding:0 7px}
  .gt-tab svg{grid-column:4;width:14px;height:14px}
  .gt-break{grid-template-columns:1fr;gap:8px}
  .gt-break>svg{transform:rotate(90deg);margin:0 0 0 4px}
  .gt-directory{margin-inline:calc(var(--gutter) * -.35);border-radius:var(--r-card)}
  .gt-group-h{padding:13px 16px}
  .gt-group-h span{font-size:10px}
  .gt-conn,.gt-conn-link{padding:15px 16px}
  .gt-conn-name{padding-right:2px}
  .gt-conn-action{min-width:84px;height:36px}
}
@media (prefers-reduced-motion:reduce){
  .gt-tab,.gt-tab i,.gt-tab svg,.gt-tab-desc,.gt-tab-cue,.gt-room em,.gt-cite,.gt-conn-link,.gt-conn-action,.gt-conn-action svg{transition:none}
  .gt-a.is-in{animation:none}
}
