/* AI testers: shared by /ai-testers and /strangers. Needs the page :root colour tokens. */
.ai{background:var(--ink);color:var(--paper);border-radius:16px;padding:30px;position:relative;overflow:hidden}
.ai::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(243,244,239,.06) 1px,transparent 1px);background-size:20px 20px;pointer-events:none}
.ai>*{position:relative}
.ai h2{font-size:clamp(26px,3.4vw,38px);letter-spacing:-.02em;margin:8px 0 10px}
.ai .eyebrow{color:var(--amber)}
.ai p.sub{color:#C9D0D8;font-size:17px;max-width:62ch}
.aiform{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;margin-top:20px}
.aiform input,.aiform textarea{width:100%;font:inherit;font-size:16px;padding:12px 14px;border-radius:8px;border:1px solid rgba(243,244,239,.25);background:#162A3E;color:var(--paper)}
.aiform input::placeholder,.aiform textarea::placeholder{color:#7F8C99}
.aiform .go{font:inherit;font-weight:600;font-size:16px;background:var(--amber);color:var(--ink);border:0;border-radius:8px;padding:12px 22px;cursor:pointer;white-space:nowrap}
.aiform .go[disabled]{opacity:.6;cursor:wait}
.slider{grid-column:1/-1;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;background:#162A3E;border:1px solid rgba(243,244,239,.15);border-radius:10px;padding:14px 16px}
.slider label{font-size:14px;color:#C9D0D8}
.slider input[type=range]{width:100%;accent-color:var(--amber);padding:0;border:0;background:none}
.slider .n{font-family:var(--mono);font-size:15px;text-align:right;min-width:150px}
.slider .n b{font-size:22px;color:var(--amber);font-family:var(--sans)}
.aimore{grid-column:1/-1;display:none;gap:12px;grid-template-columns:1fr 1fr}
.aimore.show{display:grid}
.aimore textarea{min-height:46px;resize:vertical}
.aitoggle{grid-column:1/-1;background:none;border:0;color:#AEB8C3;font:inherit;font-size:14px;text-align:left;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.keyrow{grid-column:1/-1;display:none}
.keyrow.show{display:block}
.keyrow .hint{font-size:13px;color:#AEB8C3;margin-top:5px}
.keyrow a,.ai .hint a{color:var(--amber)}
.ai .note{font-size:13px;color:#93A0AE;margin-top:12px}
#aiout{margin-top:22px}
.ai .err{color:#FFB3B3}
.loading{display:flex;gap:10px;align-items:center;color:#C9D0D8;font-size:15px}
.loading i{width:10px;height:10px;border-radius:50%;background:var(--amber);animation:pulse 1s infinite ease-in-out}
.loading i:nth-child(2){animation-delay:.15s}.loading i:nth-child(3){animation-delay:.3s}
@keyframes pulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}
.res{background:var(--paper);color:var(--ink);border-radius:12px;overflow:hidden}
.res .head{padding:16px 20px;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline}
.res .head b{font-size:17px}.res .head span{font-family:var(--mono);font-size:12.5px;color:var(--ink-2)}
.res .kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--rule)}
.res .kpis>div{padding:14px 18px;border-right:1px solid var(--rule)}
.res .kpis>div:last-child{border-right:0}
.res .kpis .k{font-family:var(--mono);font-size:11.5px;color:var(--ink-2);text-transform:uppercase;letter-spacing:.04em}
.res .kpis .v{font-size:28px;font-weight:700;letter-spacing:-.02em}
.res .body{padding:18px 20px}
.res h4{font-size:14px;font-family:var(--mono);font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-2);margin:4px 0 10px}
.res .verdict{font-size:16.5px;margin-bottom:16px}
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:8px}
.person{border:1px solid var(--rule);border-radius:10px;padding:14px;background:var(--card);font-size:14.5px}
.person .top{display:flex;gap:10px;align-items:center;margin-bottom:8px}
.person .av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:600;flex:none}
.person .who b{display:block;font-size:15px}.person .who span{font-size:12px;color:var(--ink-2)}
.person q{display:block;font-style:italic;margin:6px 0 8px}
.person .row{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.person .chip{font-family:var(--mono);font-size:11.5px;border-radius:999px;padding:1px 8px;background:var(--paper-2)}
.person ul{margin:4px 0 0;padding-left:16px;color:var(--ink-2)}
.person details{margin-top:8px}.person summary{cursor:pointer;font-size:13.5px;color:var(--blue)}
.morebtn{margin-top:14px;font:inherit;font-size:14.5px;background:none;border:1.5px solid var(--ink);border-radius:6px;padding:7px 14px;cursor:pointer}
.agents{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin-top:22px}
.agents pre{background:#0A1622;color:#DDE3E9;border:1px solid rgba(243,244,239,.12);border-radius:8px;padding:14px 16px;overflow:auto;font-family:var(--mono);font-size:13px;line-height:1.55;margin:6px 0 0}
.agents>div{min-width:0}.agents code{word-break:break-all}.agents h3{font-size:16px;color:var(--paper)}
.agents p{font-size:14.5px;color:#C9D0D8;margin:4px 0 0}
.plans.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:920px){.plans.three{grid-template-columns:minmax(0,1fr)}.agents{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){
  .ai{padding:22px 16px;border-radius:12px}
  .aiform{grid-template-columns:1fr}
  .slider{grid-template-columns:1fr;gap:8px}.slider .n{text-align:left}
  .aimore.show{grid-template-columns:1fr}
  .res .kpis{grid-template-columns:1fr 1fr}
  .res .kpis>div:nth-child(2){border-right:0}.res .kpis>div:nth-child(-n+2){border-bottom:1px solid var(--rule)}
}
.res .issue{display:grid;grid-template-columns:54px minmax(0,1fr);gap:12px;padding:12px 0;border-top:1px solid var(--rule)}
.res .issue:first-of-type{border-top:0;padding-top:0}
.res .issue .n{font-family:var(--mono);font-weight:500;font-size:15px;background:var(--paper-2);border-radius:6px;display:grid;place-items:center;height:40px}
.res .issue.hot .n{background:#F6DEDE;color:var(--red)}
.res .issue b{display:block;font-size:16px}
.res .issue span{font-size:14.5px;color:var(--ink-2)}
.res .fix{margin-top:16px;background:var(--ink);color:var(--paper);border-radius:8px;padding:14px 16px;font-size:15.5px}
.res .fix b{color:var(--amber)}
.ai .lang{display:grid;grid-template-columns:1fr 1fr;gap:12px;grid-column:1/-1}
.ai select{width:100%;font:inherit;font-size:16px;padding:12px 14px;border-radius:8px;border:1px solid rgba(243,244,239,.25);background:#162A3E;color:var(--paper)}
@media (max-width:640px){.ai .lang{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.loading i{animation:none}}
/* QA report */
.qa-score{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin:8px 0}
.qa-score .big{font-size:44px;font-weight:700;line-height:1;color:#B7791F}
.qa-score .big.good{color:#2F855A}.qa-score .big.poor{color:#C53030}
.qa-score .big small{font-size:15px;font-weight:400;color:var(--ink-2)}
.qa-score .areas{flex:1;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:6px 18px}
.area{display:grid;grid-template-columns:92px minmax(0,1fr) 28px;align-items:center;gap:8px;font-size:13px}
.area i{display:block;height:6px;border-radius:3px;background:rgba(127,127,127,.2);overflow:hidden}
.area i b{display:block;height:100%;background:#F2B544}
.area em{font-style:normal;text-align:right;color:var(--ink-2)}
.qa-meta{font-size:13px;color:var(--ink-2);margin:6px 0 12px}
.bugs{display:grid;gap:8px}
.bug{border:1px solid rgba(127,127,127,.25);border-radius:10px;padding:10px 12px}
.bug summary{cursor:pointer;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.bug summary b{flex:1;min-width:0}
.bug .ar{font-size:12px;color:var(--ink-2)}
.sev{font:500 11px/1 'IBM Plex Mono',monospace;text-transform:uppercase;padding:4px 6px;border-radius:4px;background:#E2E8F0;color:#2D3748}
.sev.critical{background:#C53030;color:#fff}.sev.high{background:#F6AD55;color:#3a2200}.sev.medium{background:#FAF089;color:#3a3300}
.bug dl{display:grid;grid-template-columns:80px minmax(0,1fr);gap:4px 10px;margin:10px 0 0;font-size:14px}
.bug dt{color:var(--ink-2)}.bug dd{margin:0}
.checks{margin-top:12px}.checks summary{cursor:pointer;font-weight:600}
.chk{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid rgba(127,127,127,.15);font-size:14px}
.chk>span{width:18px;flex:none;font-weight:700}.chk.fail>span{color:#C53030}.chk.warn>span{color:#B7791F}
.chk em{font-style:normal;font-size:12px;color:var(--ink-2)}.chk small{color:var(--ink-2)}
