/* Agent choice uses the existing ink, paper and native select interaction. */
.agent-picker{display:inline-flex;align-items:center;position:relative;gap:7px;max-width:100%;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:5px 10px;color:var(--ink);vertical-align:middle;}
.agent-picker [data-agent-mark]{display:flex;flex-shrink:0;pointer-events:none}
.agent-picker svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.agent-picker select{appearance:none;min-height:32px;max-width:100%;padding:0 20px 0 0;background:transparent;border:0;color:var(--ink);font:600 24px/1.2 var(--display);cursor:pointer;outline-offset:4px}
.agent-picker option{font:16px var(--font);background:var(--paper);color:var(--ink)}
.agent-picker-chevron{position:absolute;right:12px;pointer-events:none;font:20px var(--font)}
.agent-picker:focus-within{outline:2px solid var(--ink);outline-offset:3px}
.agent-picker select:focus-visible{outline:none}
.hero .codex-eyebrow{flex-wrap:wrap;gap:8px 12px}
.agent-setup{margin:20px 0 12px;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.agent-setup-heading{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:14px;color:var(--muted)}
.agent-setup p,.agent-package-note{font-size:14px;line-height:1.45;color:var(--muted);margin:10px 0 0}
.agent-package-note a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.guide-agent{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px}
.guide-agent+ p{max-width:660px}
.companion-settings .agent-picker{display:flex;margin-top:5px;max-width:100%;padding:3px 7px}
.companion-settings .agent-picker select{border:0;padding:0 20px 0 0;background:transparent;font:18px var(--font)}
.companion-settings .agent-picker svg{width:18px;height:18px}
.companion-popout{display:flex;align-items:center;gap:6px;font:14px var(--font);min-height:36px;margin-top:5px;text-decoration:underline;text-underline-offset:3px}
.companion-popout svg{width:15px;height:15px}
body[data-page=companion]{min-height:100dvh;overflow:hidden}
.companion-window-header{display:flex;align-items:center;justify-content:space-between;padding:18px;gap:10px}
.companion-window-header .brand{font-size:24px}
.companion-window-main{padding:0 20px;text-align:center;max-width:480px;margin:auto}
.companion-window-main h1{font-size:30px;margin:10px 0 6px;line-height:1.05}
.companion-window-main p{font-size:14px;line-height:1.4;margin:9px 0;color:var(--muted)}
.companion-window-footer{position:fixed;left:16px;bottom:14px;max-width:calc(100% - 84px);font-size:13px;color:var(--muted)}
.companion-window-footer a{text-decoration:underline;text-underline-offset:3px}
.agent-native-guide{font-size:14px;line-height:1.45;margin-top:12px}.agent-native-guide pre{padding:12px;background:var(--surface);overflow:auto}.agent-native-guide a{text-decoration:underline}
.notification-guide{padding:40px 0;border-top:1px solid var(--line);max-width:760px}.notification-guide h2{font:600 40px/1.1 var(--display);margin:8px 0}.notification-guide p,.notification-guide li{line-height:1.5}.notification-guide details{margin-top:18px}.notification-guide summary{cursor:pointer}.notification-guide a:not(.button){text-decoration:underline}.notification-guide code{overflow-wrap:anywhere;font-size:12px}.notification-guide li{margin:12px 0}
body[data-page=companion] .agent-picker{border:0;background:none;padding:0 6px}
body[data-page=companion] .agent-picker select{font-size:20px}
body[data-page=companion] .companion-window-header{padding:8px 12px}
body[data-page=companion] .companion-window-footer{left:12px;right:62px;bottom:12px;max-width:none}
body[data-page=companion] .pet-launcher{right:12px;bottom:12px}
.companion-detail-link{font-size:12px;color:var(--muted)}
.notification-status{display:flex;align-items:center;gap:6px;min-height:30px;font:14px var(--font);color:var(--muted)}
.notification-status svg{width:14px;height:14px}
[data-unread-count]{background:var(--ink);color:var(--paper);border-radius:50%;min-width:18px;padding:1px 4px;text-align:center}
#notification-drawer{position:absolute;bottom:62px;left:0;width:min(260px,calc(100vw - 28px));max-height:220px;overflow:auto;padding:12px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px #0002;z-index:120}
#notification-drawer header{display:flex;justify-content:space-between;gap:12px}#notification-drawer button{font:12px var(--font);text-decoration:underline}
#notification-drawer p,#notification-drawer li{font-size:13px;line-height:1.4}#notification-drawer ol{list-style:none;padding:0}#notification-drawer li{padding:4px 0}#notification-drawer [data-unread=true]{font-weight:bold}
@media(max-width:460px){.agent-picker select{font-size:22px}.agent-setup{padding:12px}.companion-window-header{padding:12px}.companion-window-main{padding-inline:14px}}
