.ri-tt {
    --tt-ink: #211a22;
    --tt-copy: #453a45;
    --tt-muted: #706571;
    --tt-line: #ddcdd5;
    --tt-paper: #fffafc;
    --tt-card: #fff;
    --tt-rose: #7e3154;
    --tt-safe: #e4f3ea;
    --tt-stop: #fae4e4;
    max-width: 980px;
    margin-inline: auto;
    color: var(--tt-ink);
    font: 16px/1.6 "Schibsted Grotesk", Arial, sans-serif;
}
.ri-tt * { box-sizing: border-box; }
.ri-tt-panel {
    margin-block: 20px;
    padding: 24px;
    border: 1px solid var(--tt-line);
    border-radius: 14px;
    background: var(--tt-card);
}
.ri-tt-panel h2 { margin: 0 0 8px; font: 400 31px/1.15 "DM Serif Display", Georgia, serif; }
.ri-tt label { display: block; font-weight: 600; }
.ri-tt input[type="search"],
.ri-tt select {
    width: 100%;
    min-height: 48px;
    margin: 8px 0 18px;
    padding: 10px 12px;
    border: 1px solid var(--tt-line);
    border-radius: 9px;
    background: #fff;
    color: var(--tt-ink);
    font: inherit;
}
.ri-tt-meta,
.ri-tt-status,
.ri-tt-disclosure { color: var(--tt-muted); font-size: 14px; }
.ri-tt-traits { display: flex; flex-wrap: wrap; gap: 9px; margin-block: 18px; }
.ri-tt-trait,
.ri-tt-reset {
    min-height: 40px;
    padding: 8px 12px;
    border: 1px solid var(--tt-line);
    border-radius: 999px;
    background: #fff;
    color: var(--tt-copy);
    cursor: pointer;
    font: 600 13px/1.2 "Schibsted Grotesk", Arial, sans-serif;
}
.ri-tt-trait[data-state="keep"] { border-color: #79a98a; background: var(--tt-safe); color: #28563a; }
.ri-tt-trait[data-state="avoid"] { border-color: #c98e8e; background: var(--tt-stop); color: #7a3030; }
.ri-tt-specialists { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 15px; }
.ri-tt-specialists label { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border: 1px solid var(--tt-line); border-radius: 999px; }
.ri-tt-specialists input { accent-color: var(--tt-rose); }
.ri-tt-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-top: 18px; }
.ri-tt-card { min-height: 245px; padding: 20px; border: 1px solid var(--tt-line); border-radius: 13px; display: flex; flex-direction: column; }
.ri-tt-card h3 { margin: 8px 0 3px; font: 400 24px/1.15 "DM Serif Display", Georgia, serif; }
.ri-tt-card p { margin: 5px 0; color: var(--tt-copy); }
.ri-tt-card-label { color: var(--tt-rose) !important; font: 500 10px/1.2 "IBM Plex Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.ri-tt-card-reason { font-size: 14px; }
.ri-tt-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 18px; }
.ri-tt-card-actions a { padding: 8px 10px; border: 1px solid var(--tt-rose); border-radius: 8px; color: var(--tt-rose); font-size: 13px; font-weight: 600; text-decoration: none; }
.ri-tt-card-actions a:last-child { background: var(--tt-rose); color: #fff; }
.ri-tt-empty { grid-column: 1 / -1; padding: 20px; border: 1px dashed var(--tt-line); border-radius: 12px; color: var(--tt-muted); }
.ri-tt :focus-visible { outline: 3px solid #005fcc; outline-offset: 3px; }
@media (max-width: 760px) {
    .ri-tt-results { grid-template-columns: 1fr; }
    .ri-tt-panel { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .ri-tt * { scroll-behavior: auto !important; transition: none !important; }
}
