/* T15 Tools index - page layout only; visual tokens come from css/v2 */
.tl [hidden] { display: none !important; }
.tl .psb-hero--pine .psb-crumbs { color: var(--cream-200); }
.tl .psb-hero--pine .psb-hero__lead { color: var(--cream-100); }
.tl-filters { margin-top: 28px !important; }
.tl-top .psb-tool { gap: 6px; text-decoration: none; transition: transform 120ms var(--ease-spring), box-shadow 120ms var(--ease-spring); }
.tl-top .psb-tool:hover { transform: translate(-2px, -2px); box-shadow: var(--shadow-card); }
.tl-tool__h { font: 700 var(--fs-h5)/1.4 var(--font-body) !important; margin-top: 4px !important; }
.tl-open { margin-top: 8px; font-weight: 700; font-size: var(--fs-body-s); }
.tl-top .psb-tool:hover .tl-open { text-decoration: underline; }

.tl-links { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tl-links .tl-wide { grid-column: 1 / -1; }
.tl-link { display: grid; grid-template-columns: 44px 1fr auto; gap: 16px; align-items: center; padding: 14px 20px 14px 14px; background: var(--bg-surface); border: var(--stroke); border-radius: var(--radius-row); color: var(--text-primary) !important; text-decoration: none; transition: transform 120ms var(--ease-spring), box-shadow 120ms var(--ease-spring); }
.tl-link::after { content: "→"; font-weight: 700; }
.tl-link:hover { transform: translate(-2px, -2px); box-shadow: var(--shadow-row); }
.tl-link i { width: 44px; height: 44px; border: 2px solid var(--ink-900); border-radius: 12px; background: var(--media-bg); }
.tl-link span { display: grid; gap: 2px; }
.tl-link strong { font-weight: 700; font-size: 15px; line-height: 1.3; }
.tl-link small { font-size: var(--fs-caption); color: var(--text-muted); }

.tl-embed { background: var(--sky-100); padding-block: 40px; }
.tl-embed__row { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: space-between; }
.tl-embed__h { font-size: var(--fs-h4) !important; }
@media (max-width: 900px) { .tl-links { grid-template-columns: 1fr; } }
@media (max-width: 600px) { main .psb-sechead { flex-direction: column; align-items: flex-start; gap: 12px; } }