/* Home page card: "Tell AgentGuard what to watch". Site palette: navy #07101E, panel #0C1828, teal #2ABCB4. */
.watch-card{width:100%;max-width:860px;text-align:left;background:#0C1828;border:1px solid rgba(42,188,180,.38);border-radius:14px;padding:22px 22px 18px;box-shadow:0 24px 72px rgba(0,0,0,.28);display:flex;flex-direction:column;gap:14px;min-width:0}
.watch-card h2{margin:0;font:600 20px/1.3 'DM Sans',system-ui,sans-serif;color:#E6EEF3}
.watch-form{display:flex;gap:10px;flex-wrap:wrap;margin:0}
.watch-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.watch-input{flex:1 1 360px;min-width:0;height:50px;padding:13px 14px;background:#07101E;border:1px solid rgba(230,238,243,.16);border-radius:10px;color:#E6EEF3;font:400 16px/22px 'DM Sans',system-ui,sans-serif;resize:none;overflow:hidden}
.watch-nw{white-space:nowrap}
.watch-input::placeholder{color:#6F7F8C}
.watch-input:focus{outline:2px solid #2ABCB4;outline-offset:1px;border-color:transparent}
.watch-go{flex:0 0 auto;height:50px}
.watch-chips{display:flex;flex-wrap:wrap;gap:8px}
.watch-chip{max-width:100%;padding:8px 12px;border:1px solid rgba(230,238,243,.18);border-radius:999px;background:transparent;color:#CFD8DF;font:500 13px/1.35 'DM Sans',system-ui,sans-serif;text-align:left;cursor:pointer}
.watch-chip:hover,.watch-chip:focus-visible{border-color:#2ABCB4;color:#E6EEF3;outline:none}
.watch-own{border-style:dashed;border-color:rgba(42,188,180,.55);color:#2ABCB4}
.watch-privacy{margin:0;font:400 12px/1.6 'JetBrains Mono',monospace;color:#94A3B0}
.watch-result{display:flex;flex-direction:column;gap:14px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
.watch-result[hidden]{display:none}
.watch-part{display:flex;flex-direction:column;gap:8px;min-width:0}
.watch-part h3{margin:0;font:600 12px/1.4 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:#2ABCB4}
.watch-plain{margin:0;font-size:15px;line-height:1.55;color:#E6EEF3}
.watch-note{margin:0;font-size:13px;line-height:1.55;color:#94A3B0}
.watch-fields{margin:0;padding-left:18px;font-size:13px;line-height:1.7;color:#94A3B0}
.watch-codewrap{position:relative}
.watch-code,.watch-prompt{margin:0;background:#07101E;font-size:12.5px}
.watch-code{padding-right:74px}
.watch-prompt{border-color:rgba(42,188,180,.45)}
.watch-copy{position:absolute;top:8px;right:8px;padding:5px 10px;border:1px solid rgba(230,238,243,.2);border-radius:6px;background:#0C1828;color:#CFD8DF;font:500 12px/1 'DM Sans',system-ui,sans-serif;cursor:pointer}
.watch-copy:hover{border-color:#2ABCB4}
.watch-table{width:100%;border-collapse:collapse;font:400 12px/1.5 'JetBrains Mono',monospace;color:#CFD8DF}
.watch-table th,.watch-table td{padding:4px 6px;border-bottom:1px solid rgba(255,255,255,.07);text-align:right;white-space:nowrap}
.watch-table th:first-child,.watch-table td:first-child{text-align:left;white-space:normal}
.watch-table th{color:#94A3B0;font-weight:500}
.watch-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;list-style:none;margin:0;padding:0;font:500 13px/1.4 'DM Sans',system-ui,sans-serif;color:#94A3B0}
.watch-trust li{display:flex;align-items:center;gap:7px}
.watch-trust li::before{content:"";width:7px;height:7px;border-radius:50%;background:#2ABCB4;flex:0 0 auto}
.watch-trust a{color:inherit;text-decoration:underline;text-decoration-color:rgba(148,163,176,.45);text-underline-offset:3px}
.watch-trust a:hover{color:#E6EEF3}
.recorded-hero .watch-exits{justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}
@media(max-width:560px){
  .watch-card{padding:16px 14px 14px;border-radius:12px}
  .watch-card h2{font-size:18px}
  .watch-input{flex-basis:100%;height:72px;overflow-y:auto}
  .watch-go{width:100%}
  .watch-code,.watch-prompt{font-size:11.5px}
  .watch-chip{font-size:12.5px}
  .watch-table{font-size:11px}
  .watch-table th,.watch-table td{padding:4px 3px}
  .watch-trust{justify-content:flex-start}
}
