:root { color-scheme:light; --paper:#faf9f7; --ink:#28262d; --muted:#827b87; --line:#eae6e3; --accent:#bb593c; --purple:#8a719c; --sidebar:#191b25; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-size:14px; -webkit-font-smoothing:antialiased; }
button,input,textarea,select { font:inherit; } button,a { -webkit-tap-highlight-color:transparent; touch-action:manipulation; } button { cursor:pointer; color:inherit; background:none; border:0; } button:disabled { cursor:default; opacity:.45; } a { color:inherit; text-decoration:none; } h1,h2,h3,p { margin:0; } svg { width:20px; height:20px; stroke:currentColor; stroke-width:1.6; fill:none; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; vertical-align:middle; } [hidden] { display:none!important; } .icon-defs { display:none; } button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:2px solid #b29bc6; outline-offset:3px; } ::selection { background:#ead9ef; } .sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap; } .skip-link { position:fixed;top:-60px;left:20px;z-index:100;background:white;padding:12px; } .skip-link:focus { top:10px; }
.chat-app { height:100dvh; display:grid; grid-template-columns:238px minmax(0,1fr); overflow:hidden; }
.privacy-open .chat-app { grid-template-columns:238px minmax(0,1fr)322px; }
.sidebar { background:var(--sidebar); color:#c6c3ce; padding:27px 16px 16px; display:flex; flex-direction:column; min-height:0; }
.sidebar-brand { display:flex; align-items:center; gap:10px; padding:0 7px; }
.brand { display:flex; align-items:center; gap:9px; font-size:23px; letter-spacing:-1px; font-weight:650; color:#f3f0f3; }
.brand img { vertical-align:middle; }.brand>span>span { color:#e3a18b; }.chat-tag { font-size:8px; letter-spacing:1px; background:#ffffff08; border:1px solid #ffffff13; border-radius:3px; padding:3px 5px; color:#868594; margin-top:4px; }
.new-chat { display:flex; align-items:center; gap:10px; width:100%; border:1px solid #49414b; background:linear-gradient(110deg,#373039,#292732); border-radius:7px; padding:11px 10px; color:#e0d5dc; font-size:12px; font-weight:500; margin:31px 0 29px; transition:background .2s; }.new-chat:hover { background:#3c323c; }.new-chat svg { width:17px; height:17px; color:#c9a294; }.new-chat kbd { margin-left:auto; font:9px inherit; font-size:9px; color:#8e8192; }
.session-label { display:flex; justify-content:space-between; padding:0 10px; font-size:9px; letter-spacing:1.2px; color:#737482; }.session-label>span { font-size:10px; letter-spacing:0; }.conversation-list { margin-top:13px; overflow-y:auto; flex:1; padding-bottom:20px; }.conversation-link { width:100%; text-align:left; padding:12px 10px; display:flex; gap:10px; align-items:center; border-radius:6px; color:#8e8b9a; margin-bottom:4px; font-size:12px; }.conversation-link svg { width:16px; height:16px; }.conversation-link>span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.conversation-link:hover { background:#ffffff04; color:#c1b9c9; }.conversation-link[aria-current="page"] { color:#ded5e4; background:#b5a2c50e; }.conversation-link[aria-current="page"] svg { color:#b49dbe; }
.sidebar-bottom { margin-top:auto; }.allowance-card { border:1px solid #ffffff0d; background:#ffffff03; border-radius:8px; padding:12px; margin-bottom:20px; }.allowance-heading { display:flex; align-items:center; justify-content:space-between; color:#a5a0b0; font-size:11px; }.allowance-heading .icon-button { width:23px; height:23px; color:#77717f; }.allowance-heading svg { width:13px; height:13px; }.allowance-value { margin:9px 0 13px; display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; }.allowance-value strong { color:#e4d9e9; font-size:22px; font-weight:500; letter-spacing:-.6px; }.allowance-value>span { font-size:9px; color:#7e768b; } progress { display:block; width:100%; height:4px; border:0; background:#35303f; border-radius:8px; overflow:hidden; accent-color:#ab8eae; } progress::-webkit-progress-bar { background:#35303f; border-radius:8px; } progress::-webkit-progress-value { background:#ab8eae; border-radius:8px; } progress::-moz-progress-bar { background:#ab8eae; }.allowance-detail { display:flex; align-items:center; gap:8px; justify-content:space-between; font-size:9px; margin-top:12px; color:#84798f; }.allowance-detail span { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }.allowance-detail button { font-size:9px; color:#b49cbe; padding:0; flex-shrink:0; }
.sidebar-link { display:flex; align-items:center; gap:10px; padding:10px; font-size:11px; color:#8e8799; }.sidebar-link svg { width:16px; height:16px; }.sidebar-link>span { margin-left:auto; color:#655c70; }.sidebar-link:hover { color:#d1c4d9; }.account { border-top:1px solid #ffffff0c; padding-top:17px; margin-top:17px; display:flex; align-items:center; gap:4px; }.account-button { display:flex; gap:10px; align-items:center; text-align:left; padding:0 4px; min-width:0; flex:1; }.account-avatar { width:31px; height:31px; display:grid; place-items:center; border-radius:8px; background:#3a303d; color:#c9a9cb; font-size:12px; flex-shrink:0; }.account-button>span:last-child { min-width:0; }.account-button strong { display:block; font-size:11px; font-weight:500; color:#d2c4d9; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.account-button small { display:block; font-size:9px; color:#8b7897; margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.account .icon-button { color:#86718e; width:28px; height:28px; }.account svg { width:16px; height:16px; }
.workspace { min-width:0; min-height:0; display:flex; flex-direction:column; position:relative; }.chat-toolbar { height:82px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; padding:0 29px; gap:15px; flex-shrink:0; }.toolbar-left,.toolbar-right { display:flex; align-items:center; gap:15px; min-width:0; }.model-button { display:flex; align-items:center; gap:11px; text-align:left; min-width:0; padding:5px; border-radius:7px; }.model-button:hover { background:#eee9e6; }.model-avatar { display:grid; place-items:center; width:33px; height:33px; background:#eae6ef; color:#7b668b; border:1px solid #e2dbe9; border-radius:9px; font-size:23px; flex-shrink:0; }.model-button>span:nth-child(2) { min-width:0; }.model-button strong { font-size:13px; font-weight:600; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:260px; }.model-button small { display:block; color:#988a9a; font-size:10px; margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:240px; }.model-button>svg { width:14px; height:14px; color:#8e7f96; }.session-indicator { font-size:10px; color:#9d8f9e; display:flex; align-items:center; gap:6px; white-space:nowrap; }.session-indicator i { width:4px; height:4px; border-radius:50%; background:#9da995; }.icon-button { display:grid; place-items:center; padding:0; width:30px; height:30px; border-radius:6px; color:#a295a6; flex-shrink:0; }.icon-button:hover { background:#8e729910; color:#766080; }.icon-button svg { width:17px; height:17px; }.privacy-toggle { display:flex; align-items:center; gap:6px; font-size:10px; color:#7e6c8b; border:1px solid #e1d8e6; border-radius:6px; padding:7px 9px; background:#f0ebf4; }.privacy-toggle svg { width:14px; height:14px; }.privacy-toggle b { background:#e0d4e8; border-radius:3px; min-width:15px; text-align:center; font-size:9px; font-weight:500; padding:0 2px; }.menu-button,.mobile-close { display:none; }
.chat-scroll { flex:1; overflow-y:auto; min-height:0; scroll-behavior:smooth; padding:0 32px 26px; overscroll-behavior:contain; }.welcome { max-width:690px; margin:0 auto; text-align:center; padding:clamp(35px,8vh,90px) 0 25px; }.welcome-mark { position:relative; margin:0 auto 27px; display:grid; place-items:center; width:62px; height:65px; border-radius:20px; color:#aa7b6f; background:linear-gradient(145deg,#fff7ee,#e9dacf); box-shadow:3px 5px 0 #e5d8d0,6px 12px 22px #88634c0e; transform:rotate(-7deg); }.welcome-mark>svg { width:30px; height:30px; stroke-width:1.25; transform:rotate(7deg); }.welcome-spark { position:absolute; right:-13px; top:-13px; font-size:26px; color:#a897b6; }.welcome-eyebrow { font-size:8px; letter-spacing:1.5px; color:#ac98a4; }.welcome h1 { font-size:clamp(30px,2.8vw,45px); line-height:1.18; letter-spacing:-1.7px; font-weight:500; margin:16px 0 19px; }.welcome h1>span { color:#9c889c; }.welcome>p { color:#a08e9d; font-size:13px; line-height:1.8; }.starter-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:11px; margin-top:37px; }.starter-grid button { text-align:left; border:1px solid #e6dfdf; border-radius:9px; background:linear-gradient(145deg,#ffffff9c,#f4f0ed); padding:16px 13px; position:relative; transition:transform .2s,border-color .2s; }.starter-grid button:hover { transform:translateY(-3px); border-color:#cdbcca; }.starter-icon { font-size:19px; color:#ac8176; display:block; height:30px; }.starter-grid strong { display:block; font-size:11px; font-weight:500; line-height:1.5; letter-spacing:-.1px; color:#6c586b; }.starter-grid small { display:block; font-size:9px; color:#ac96a7; margin-top:5px; }.starter-arrow { position:absolute; right:13px; top:17px; color:#b9a5b7; font-size:13px; }.welcome-footnote { margin-top:25px; font-size:9px; color:#b4a0b0; display:flex; align-items:center; justify-content:center; gap:7px; }.welcome-footnote>span { width:4px; height:4px; background:#a99aaf; border-radius:50%; }
.messages { max-width:770px; margin:0 auto; }.message { padding-top:30px; }.message-meta { display:flex; align-items:center; gap:9px; font-size:11px; color:#9a849b; margin-bottom:12px; }.message-avatar { display:grid; place-items:center; width:24px; height:24px; border-radius:7px; font-size:10px; color:#aa7a70; background:#eee0d9; }.message-meta img { width:24px; height:24px; border-radius:7px; }.message-meta strong { font-weight:550; color:#70566f; }.message-time { color:#b7a2b5; font-size:9px; margin-left:auto; }.message-content { font-size:14px; line-height:1.85; color:#574553; overflow-wrap:anywhere; }.message.user .message-content { background:#f0ebef; padding:15px 18px; border:1px solid #e8dfe8; border-radius:0 10px 10px 10px; color:#705c71; font-size:13px; white-space:pre-wrap; }.message.assistant .message-content { padding:0 4px; }.message-content p { margin:0 0 12px; white-space:pre-wrap; }.message-content h3 { font-size:17px; margin:17px 0 10px; font-weight:600; }.message-content ul,.message-content ol { padding-left:23px; margin:10px 0 16px; }.message-content li { padding-left:3px; margin:5px 0; }.message-content pre { background:#24212b; color:#d6c3dc; padding:17px; border-radius:8px; white-space:pre; overflow:auto; font-size:11px; line-height:1.8; margin:13px 0; }.message-content code { font-family:"SFMono-Regular",Consolas,monospace; font-size:.88em; }.message-content :not(pre)>code { color:#866b94; background:#eee5f1; padding:2px 4px; border-radius:3px; }.message-content strong { font-weight:600; }.pii-marker { color:#aa6c51; background:#f2e0d3; border:1px solid #ead0bf; border-radius:3px; padding:1px 3px; font:10px "SFMono-Regular",Consolas,monospace; white-space:normal; overflow-wrap:anywhere; }.message-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:10px; font-size:9px; color:#ad98ab; }.message-actions button { display:flex; align-items:center; gap:4px; font-size:9px; padding:3px 0; color:#98809e; }.message-actions svg { width:12px; height:12px; }.message-actions button:hover { color:#6e497d; }.receipt-chip { display:flex; gap:4px; align-items:center; color:#8e8398; }.receipt-chip i { font-style:normal; color:#a28bac; }.finish-note { font-size:10px; color:#ab866d; margin-top:12px; }.thinking-card { display:flex; align-items:center; gap:10px; font-size:12px; color:#a28aa8; margin:30px 0 0; padding:15px 0; }.thinking-dots { display:flex; gap:3px; }.thinking-dots i { width:4px; height:4px; border-radius:50%; background:#ae96b7; animation:thinking 1.4s ease infinite; }.thinking-dots i:nth-child(2) { animation-delay:.2s; }.thinking-dots i:nth-child(3) { animation-delay:.4s; }.thinking-time { color:#baa6c1; font-size:10px; }.chat-error { max-width:770px; margin:25px auto 0; border:1px solid #e8d0c6; border-radius:8px; padding:17px 19px; background:#fff3ed; font-size:12px; line-height:1.7; color:#a56d58; }.chat-error strong { display:block; color:#8c594a; margin-bottom:3px; font-weight:600; }.chat-error button { color:#8f5d4c; text-decoration:underline; margin-top:6px; padding:0; font-size:11px; }
.composer-region { padding:10px 32px 21px; flex-shrink:0; background:linear-gradient(0deg,var(--paper) 93%,transparent); }.composer { max-width:770px; margin:0 auto; background:#fff; border:1px solid #ddd3da; border-radius:12px; box-shadow:0 6px 20px #583c5e04,0 1px 3px #583c5e03; transition:box-shadow .2s,border-color .2s; }.composer:focus-within { border-color:#baa3c2; box-shadow:0 0 0 3px #ad91ba09; }.composer textarea { display:block; resize:none; border:0; padding:19px 19px 8px; outline:none; background:transparent; width:100%; min-height:80px; max-height:165px; font-size:13px; line-height:1.7; color:#69536a; }.composer textarea::placeholder { color:#b6a3b4; }.composer textarea:focus-visible { outline:none; }.composer-bottom { padding:7px 12px 11px 17px; display:flex; align-items:center; justify-content:space-between; gap:10px; }.composer-privacy { display:flex; align-items:center; gap:6px; color:#9b859c; font-size:10px; padding:6px 0; min-width:0; }.composer-privacy svg { width:14px; height:14px; }.composer-privacy>span { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }.composer-actions { display:flex; align-items:center; gap:9px; flex-shrink:0; }.output-label { font-size:9px; color:#ad97ab; }.composer select { border:0; color:#99839d; background:#f4f0f5; border-radius:5px; padding:6px 4px; font-size:10px; max-width:100px; }.send-button,.stop-button { height:33px; width:33px; display:grid; place-items:center; background:#ba634b; color:white; border-radius:8px; box-shadow:0 1px 0 #d18a74 inset; }.send-button:not(:disabled):hover { background:#a7543e; }.send-button:disabled { background:#d7c4bd; box-shadow:none; opacity:.7; }.send-button svg { width:18px; height:18px; }.stop-button { background:#8e718c; box-shadow:none; }.stop-button>span { width:10px; height:10px; border-radius:2px; background:white; }.composer-note { display:flex; justify-content:space-between; gap:10px; max-width:770px; margin:11px auto 0; color:#b09aad; font-size:8px; line-height:1.6; }.composer-note strong { font-weight:400; color:#967d97; }.keyboard-hint { white-space:nowrap; }.keyboard-hint>span { margin:0 5px; }.context-limit { max-width:770px; margin:0 auto 12px; font-size:11px; color:#ab785b; }
.privacy-panel { display:none; flex-direction:column; min-height:0; background:#fff; border-left:1px solid var(--line); }.privacy-open .privacy-panel { display:flex; }.privacy-heading { display:flex; gap:10px; align-items:center; padding:25px 23px 23px; height:99px; flex-shrink:0; }.privacy-heading-icon { display:grid; place-items:center; width:32px; height:35px; background:#f3eef6; color:#9c83ac; border:1px solid #ebe1f0; border-radius:9px; }.privacy-heading-icon svg { width:19px; height:19px; }.privacy-heading h2 { font-size:13px; font-weight:550; color:#6a506e; }.privacy-heading p { font-size:10px; color:#b196b5; margin-top:4px; }.privacy-close { margin-left:auto; }.privacy-scroll { padding:0 23px 25px; overflow-y:auto; min-height:0; flex:1; }.privacy-status { padding:15px; border:1px solid #eae2ee; border-radius:8px; background:#faf8fc; color:#a38dad; }.privacy-status-dot { display:inline-block; width:5px; height:5px; border-radius:50%; background:#b6a3c2; vertical-align:middle; margin-right:5px; }.privacy-status strong { font-size:11px; font-weight:500; color:#8f769b; }.privacy-status p { font-size:10px; line-height:1.75; color:#b098ba; margin-top:6px; }.privacy-status[data-state="ready"] { background:#f1f6f1; border-color:#dfe9df; }.privacy-status[data-state="ready"] strong { color:#6f8b73; }.privacy-status[data-state="ready"] p { color:#8b9f8d; }.privacy-status[data-state="ready"] .privacy-status-dot { background:#86a58a; }.privacy-status[data-state="redacted"] { background:#fcf3ee; border-color:#efdfd3; }.privacy-status[data-state="redacted"] strong { color:#aa7c5f; }.privacy-status[data-state="redacted"] p { color:#b69883; }.privacy-status[data-state="redacted"] .privacy-status-dot { background:#c28f68; }.privacy-status[data-state="error"] { background:#fff0ec; border-color:#f0d1c5; }.privacy-status[data-state="error"] strong { color:#ba735c; }.privacy-status[data-state="error"] p { color:#b78f80; }
.inspector-label { font-size:8px; letter-spacing:1px; color:#b29aba; margin:26px 0 14px; display:flex; align-items:center; justify-content:space-between; }.inspector-label>span { color:#a98bb4; background:#f3edf7; min-width:17px; padding:2px 4px; text-align:center; border-radius:4px; font-size:9px; letter-spacing:0; }.redaction-categories>div { display:flex; align-items:center; gap:8px; padding:9px 0; font-size:10px; color:#9c82a3; }.category-symbol { display:grid; place-items:center; width:21px; height:21px; border:1px solid #eee6f2; border-radius:5px; font-size:12px; color:#a78bb3; background:#fbf9fd; }.redaction-categories b { font-weight:500; font-size:10px; min-width:20px; text-align:center; margin-left:auto; color:#b49bbe; }.redaction-categories .has-count b { color:#ad7856; background:#fbefe3; border-radius:4px; padding:3px; }.preview-heading { display:flex; justify-content:space-between; align-items:center; border-top:1px solid #f0e9f3; padding-top:23px; margin:20px 0 12px; font-size:8px; letter-spacing:1px; color:#ad92b6; }.preview-heading>span:last-child { letter-spacing:0; font-size:9px; color:#b8a2bf; }.preview-tabs { display:flex; border:1px solid #e9dfef; padding:3px; border-radius:6px; background:#f8f4fa; gap:4px; }.preview-tabs button { flex:1; font-size:9px; color:#b49abc; padding:7px 5px; border-radius:4px; }.preview-tabs button[aria-selected="true"] { background:white; color:#8b6d98; box-shadow:0 1px 4px #49254d09; }.preview-text { min-height:140px; max-height:300px; overflow:auto; margin-top:11px; padding:14px; border:1px solid #eee6f2; background:#fcfafd; border-radius:7px; font:11px/1.95 "SFMono-Regular",Consolas,monospace; color:#95749f; white-space:pre-wrap; overflow-wrap:anywhere; }.preview-text.empty { color:#b9a2c1; font:11px/1.9 inherit; font-size:11px; line-height:1.9; }.preview-text .pii-marker { font-size:9px; }.request-context { margin-top:13px; color:#a186ad; font-size:10px; }.request-context summary { cursor:pointer; padding:4px 0; }.request-context-content { max-height:200px; overflow:auto; }.request-context-content p { margin:9px 0; font:10px/1.7 monospace; white-space:pre-wrap; overflow-wrap:anywhere; }.request-context-content strong { font-size:9px; text-transform:uppercase; color:#80648a; }.inspection-receipt { margin-top:20px; padding-top:1px; border-top:1px solid #eee6f1; }.inspection-receipt .inspector-label { margin-top:18px; }.inspection-receipt dl { margin:0; font-size:10px; }.receipt-row { display:flex; justify-content:space-between; gap:10px; margin:9px 0; }.receipt-row dt { color:#ad92b7; }.receipt-row dd { color:#896295; margin:0; text-align:right; overflow-wrap:anywhere; min-width:0; max-width:160px; }.receipt-row:last-child dd { font:8px/1.5 monospace; }.privacy-explainer { margin-top:28px; display:flex; gap:8px; padding-top:21px; border-top:1px solid #eee6f3; }.privacy-explainer>svg { width:15px; height:15px; margin-top:1px; color:#b299bc; }.privacy-explainer strong { font-size:10px; color:#a086ab; font-weight:500; }.privacy-explainer p { color:#b49cbe; font-size:9px; line-height:1.8; margin-top:8px; }.privacy-bottom { display:flex; gap:8px; align-items:flex-start; padding:18px 23px; border-top:1px solid #f1eaf4; font-size:9px; line-height:1.7; color:#b19abb; flex-shrink:0; }.small-dot { display:inline-block; width:5px; height:5px; border-radius:50%; background:#a18baa; flex-shrink:0; }.privacy-bottom .small-dot { margin-top:5px; }
dialog { border:1px solid #ddd2e1; padding:0; border-radius:15px; box-shadow:0 35px 120px #18101b45; color:var(--ink); background:#fdfbff; max-height:calc(100dvh - 35px); overflow:auto; } dialog::backdrop { background:#17162277; backdrop-filter:blur(5px); }.connect-dialog { width:440px; max-width:calc(100vw - 30px); padding:33px 34px 25px; text-align:center; }.dialog-close { position:absolute; right:14px; top:13px; }.connection-emblem { width:60px; height:60px; border:1px solid #ebdfe5; background:#f6eef1; border-radius:17px; display:grid; place-items:center; margin:0 auto 23px; }.dialog-eyebrow { font-size:8px; letter-spacing:1.4px; color:#a48aad; margin-bottom:12px; }.connect-dialog h2 { font-size:27px; letter-spacing:-1px; font-weight:500; color:#503a58; }.dialog-description { font-size:12px; line-height:1.8; color:#a089aa; margin-top:13px; }.connection-address { margin:23px 0; display:flex; align-items:center; gap:7px; padding:9px 11px; border:1px solid #eae1ee; border-radius:6px; font-family:"SFMono-Regular",Consolas,monospace; font-size:9px; color:#8e719d; background:#f7f2fa; }.connection-address>span:last-child { margin-left:auto; font-size:7px; letter-spacing:.7px; color:#b3a0be; }.connect-dialog form { text-align:left; }.connect-dialog label:not(.file-button) { display:block; font-size:11px; color:#94789f; margin-bottom:8px; }.key-input-wrap { display:flex; align-items:center; border:1px solid #dfd1e6; border-radius:6px; background:white; padding:0 11px; gap:9px; }.key-input-wrap svg { width:14px; height:14px; color:#baa3c5; }.key-input-wrap input { width:100%; padding:12px 0; border:0; font-size:12px; background:transparent; color:#695075; outline:none; }.key-input-wrap:focus-within { outline:2px solid #b89bc6; outline-offset:2px; }.key-input-wrap input::placeholder { color:#b8a3c2; }.primary-button { display:flex; justify-content:space-between; align-items:center; background:#bc634b; color:#fff7f1; border-radius:6px; padding:12px 15px; width:100%; margin-top:13px; font-size:12px; font-weight:500; }.primary-button:hover { background:#a8553f; }.or-divider { display:flex; align-items:center; gap:13px; font-size:9px; color:#b4a1bf; margin:20px 0 15px; }.or-divider:before,.or-divider:after { content:""; height:1px; background:#ede3f2; flex:1; }.file-button { display:flex; align-items:center; justify-content:center; gap:8px; font-size:11px; color:#9677a6; padding:11px; border:1px dashed #d9c7e3; border-radius:6px; cursor:pointer; }.file-button:hover { background:#f3ecf7; }.file-button:focus-within { outline:2px solid #b79ac7; outline-offset:3px; }.file-button svg { width:15px; height:15px; }.dialog-error { font-size:11px; color:#b06d59; margin-top:12px; line-height:1.6; }.dialog-error:empty { display:none; }.key-help { text-align:left; margin-top:18px; font-size:10px; color:#a288b0; }.key-help summary { cursor:pointer; }.key-help p { line-height:1.8; margin-top:10px; color:#9b7aaa; }.key-help code { font-size:10px; overflow-wrap:anywhere; }.connection-note { display:flex; align-items:center; justify-content:center; gap:5px; margin-top:22px; font-size:9px; color:#b29abc; }.connection-note svg { width:12px; height:12px; }
.model-dialog,.usage-dialog { width:470px; max-width:calc(100vw - 30px); padding:25px; }.dialog-title-row { display:flex; justify-content:space-between; align-items:center; gap:15px; }.dialog-title-row h2 { font-size:22px; letter-spacing:-.5px; font-weight:500; color:#62416e; }.dialog-title-row .dialog-eyebrow { margin-bottom:8px; }.model-search { display:block; border:1px solid #e3d3ec; border-radius:7px; width:100%; padding:12px; margin:23px 0 14px; font-size:12px; color:#916aa2; background:white; }.model-search::placeholder { color:#b59ac5; }.model-options { max-height:330px; overflow-y:auto; }.model-option { display:flex; align-items:center; gap:12px; width:100%; text-align:left; border:1px solid transparent; border-radius:7px; padding:13px 10px; margin-bottom:5px; }.model-option:hover { background:#f4edf8; }.model-option[aria-pressed="true"] { background:#f0e7f5; border-color:#e3d2ec; }.model-option>span:first-child { width:34px; height:34px; background:#e9def0; display:grid; place-items:center; border-radius:8px; font-size:23px; color:#9b79ab; flex-shrink:0; }.model-option .model-option-copy { flex:1; min-width:0; }.model-option strong { display:block; font-weight:500; font-size:12px; color:#80618e; overflow-wrap:anywhere; }.model-option small { display:block; font-size:10px; color:#b298bf; margin-top:5px; line-height:1.6; overflow-wrap:anywhere; }.model-option .model-tag { font-size:8px; padding:4px 6px; border:1px solid #e4d9eb; border-radius:4px; color:#a890b3; flex-shrink:0; }.model-dialog-note { font-size:10px; color:#aa8fb5; line-height:1.8; margin-top:17px; }.no-models { padding:25px 10px; font-size:12px; color:#a58bb0; }.usage-block { margin-top:23px; border:1px solid #eadced; border-radius:8px; padding:18px; }.usage-block h3 { font-size:12px; color:#8b679b; font-weight:500; }.usage-block p { margin-top:9px; font-size:22px; color:#81528e; letter-spacing:-.5px; }.usage-block p small { font-size:11px; letter-spacing:0; color:#b297bc; }.usage-block progress { margin:15px 0 11px; height:5px; }.usage-block>small { font-size:10px; color:#a78ab4; }.usage-reset { font-size:10px; color:#a08aad; margin-top:17px; }
.toast { position:fixed; bottom:25px; left:50%; transform:translateX(-50%); background:#362c40; color:#ecdef0; padding:12px 18px; font-size:12px; border-radius:8px; z-index:100; box-shadow:0 10px 40px #0002; max-width:90vw; }.drawer-scrim { position:fixed; inset:0; background:#21172555; backdrop-filter:blur(2px); z-index:40; }
/* Keep secondary text readable: muted should not mean faint. */
.welcome>p { color:#827283; }.welcome-eyebrow,.welcome-footnote { color:#968496; }.starter-grid small { color:#937b8e; }.composer-note { color:#938094; }.model-button small { color:#87798e; }.privacy-heading p,.privacy-status p { color:#8f789e; }.inspector-label,.preview-heading { color:#92759e; }.redaction-categories>div { color:#866991; }.privacy-explainer strong { color:#876693; }.privacy-explainer p,.privacy-bottom { color:#92769f; }.preview-text.empty { color:#a187ac; }.privacy-status[data-state="ready"] p { color:#768d79; }.privacy-status[data-state="redacted"] p { color:#a27f64; }.dialog-description,.key-help,.connection-note,.model-dialog-note { color:#91769e; }.dialog-eyebrow { color:#8e719a; }.privacy-status-description { line-height:1.8; }
@keyframes thinking { 0%,80%,100% { opacity:.3;transform:translateY(0); }40% { opacity:1;transform:translateY(-3px); } }
@media(min-width:1600px) { .chat-app { grid-template-columns:252px minmax(0,1fr); }.privacy-open .chat-app { grid-template-columns:252px minmax(0,1fr)350px; }.privacy-scroll { padding-left:27px; padding-right:27px; }.privacy-heading,.privacy-bottom { padding-left:27px; padding-right:27px; }.welcome { padding-top:10vh; }.starter-grid strong { font-size:12px; }.starter-grid small { font-size:10px; } }
@media(max-width:1390px) and (min-width:1280px) { .chat-app { grid-template-columns:218px minmax(0,1fr); }.privacy-open .chat-app { grid-template-columns:218px minmax(0,1fr)300px; }.sidebar { padding-left:13px; padding-right:13px; }.sidebar-brand { gap:7px; }.brand { font-size:21px; }.brand img { width:26px; height:26px; }.chat-tag { font-size:7px; }.chat-toolbar { padding:0 22px; }.toolbar-right { gap:9px; }.session-indicator { display:none; }.privacy-scroll { padding:0 19px 22px; }.privacy-heading,.privacy-bottom { padding-left:19px; padding-right:19px; }.chat-scroll { padding-left:25px; padding-right:25px; }.composer-region { padding-left:25px; padding-right:25px; }.composer-note { font-size:7px; }.keyboard-hint { display:none; }.starter-grid { gap:8px; }.starter-grid button { padding:15px 11px; }.starter-grid strong { font-size:10px; }.output-label { display:none; }.welcome h1 { font-size:36px; } }
@media(max-width:1279px) { .chat-app,.privacy-open .chat-app { grid-template-columns:224px minmax(0,1fr); }.privacy-panel { position:fixed; right:0; top:0; bottom:0; width:340px; max-width:calc(100vw - 30px); z-index:50; box-shadow:-15px 0 60px #20112525; }.privacy-heading { height:90px; }.session-indicator { display:none; }.welcome { max-width:690px; }.welcome h1 { font-size:40px; }.chat-toolbar { padding:0 24px; }.chat-scroll,.composer-region { padding-left:28px; padding-right:28px; }.keyboard-hint { display:none; }.sidebar-brand { gap:8px; }.brand { font-size:22px; }.chat-tag { font-size:7px; }.model-button strong { max-width:250px; }.starter-grid strong { font-size:11px; } }
@media(max-width:950px) and (min-width:761px) { .chat-app,.privacy-open .chat-app { grid-template-columns:208px minmax(0,1fr); }.sidebar { padding:24px 12px 14px; }.brand { font-size:20px; gap:7px; }.brand img { width:26px; height:26px; }.chat-tag { display:none; }.new-chat { font-size:11px; padding:11px 9px; }.new-chat kbd { display:none; }.chat-scroll,.composer-region { padding-left:22px; padding-right:22px; }.chat-toolbar { padding:0 20px; }.model-button strong { max-width:200px; }.model-button small { max-width:180px; }.toolbar-right { gap:8px; }.welcome h1 { font-size:35px; }.welcome>p { font-size:12px; }.welcome-eyebrow { font-size:7px; letter-spacing:1px; }.starter-grid { grid-template-columns:1fr; gap:9px; margin-top:25px; }.starter-grid button { padding:12px 14px 12px 44px; }.starter-icon { position:absolute; left:15px; top:15px; }.starter-grid small { margin-top:3px; }.starter-grid strong { font-size:11px; }.welcome { padding-top:35px; }.welcome-footnote { font-size:8px; margin-top:18px; }.output-label { display:none; }.composer-privacy { font-size:9px; }.composer select { font-size:9px; }.composer-note { font-size:8px; }.allowance-detail { font-size:8px; }.allowance-value>span { font-size:8px; } }
@media(max-width:760px) { .chat-app,.privacy-open .chat-app { grid-template-columns:minmax(0,1fr); }.sidebar { display:none; position:fixed; inset:0 auto 0 0; width:270px; z-index:60; padding:24px 18px 18px; box-shadow:15px 0 70px #120a1833; }.sidebar-open .sidebar { display:flex; }.mobile-close { display:grid; margin-left:auto; }.chat-tag { display:none; }.menu-button { display:grid; }.chat-toolbar { height:73px; padding:0 14px; gap:8px; }.toolbar-left { gap:7px; }.toolbar-right { gap:7px; }.model-button { gap:8px; padding:3px; }.model-avatar { width:29px; height:29px; font-size:21px; border-radius:8px; }.model-button strong { max-width:180px; font-size:12px; }.model-button small { max-width:180px; font-size:9px; }.model-button>svg { width:12px; height:12px; }.privacy-toggle { padding:7px; gap:4px; }.privacy-toggle>span { display:none; }.toolbar-right>.icon-button { width:27px; }.chat-scroll { padding:0 22px 22px; }.welcome { padding-top:48px; max-width:450px; }.welcome-mark { width:53px; height:56px; border-radius:16px; margin-bottom:26px; }.welcome-mark>svg { width:27px; height:27px; }.welcome-eyebrow { font-size:7px; letter-spacing:1.1px; }.welcome h1 { font-size:35px; letter-spacing:-1.4px; margin-top:15px; margin-bottom:17px; }.welcome>p { font-size:12px; line-height:1.8; }.starter-grid { grid-template-columns:1fr; gap:9px; margin-top:28px; text-align:left; }.starter-grid button { padding:13px 15px 13px 47px; }.starter-icon { position:absolute; top:15px; left:16px; font-size:19px; }.starter-grid strong { font-size:11px; }.starter-grid small { font-size:9px; margin-top:3px; }.starter-arrow { top:22px; right:17px; }.welcome-footnote { font-size:8px; line-height:1.7; margin-top:23px; }.composer-region { padding:8px 14px max(13px,env(safe-area-inset-bottom)); }.composer textarea { padding:15px 14px 7px; font-size:13px; min-height:70px; max-height:130px; }.composer-bottom { padding:6px 9px 9px 12px; gap:7px; }.composer-privacy { font-size:9px; gap:4px; }.composer-privacy svg { width:12px; height:12px; }.composer select { font-size:9px; padding:6px 3px; max-width:86px; }.composer-actions { gap:7px; }.output-label { display:none; }.send-button,.stop-button { width:31px; height:31px; }.composer-note { font-size:8px; line-height:1.6; padding:0 3px; margin-top:8px; }.composer-note>span:first-child { max-width:370px; }.context-limit { font-size:10px; }.message { padding-top:25px; }.message-content { font-size:13px; }.message.user .message-content { font-size:12px; padding:13px 15px; }.message-actions { font-size:9px; gap:10px; }.message-meta { margin-bottom:11px; }.message-content pre { font-size:10px; padding:13px; }.pii-marker { font-size:9px; }.chat-error { padding:14px; font-size:11px; }.connect-dialog { padding:29px 25px 22px; }.connect-dialog h2 { font-size:25px; }.dialog-description { font-size:12px; }.connection-address { font-size:8px; }.connection-address>span:last-child { font-size:6px; }.model-dialog,.usage-dialog { padding:22px; }.model-option { padding-left:8px; padding-right:8px; }.model-option strong { font-size:11px; }.privacy-panel { width:340px; }.privacy-scroll { padding:0 20px 20px; }.privacy-heading,.privacy-bottom { padding-left:20px; padding-right:20px; }.desktop-only { display:none; } }
@media(max-width:390px) { .chat-toolbar { padding:0 9px; }.toolbar-right { gap:3px; }.toolbar-left { gap:4px; }.model-button strong,.model-button small { max-width:145px; }.model-avatar { width:26px; height:26px; font-size:19px; }.model-button { gap:6px; }.model-button strong { font-size:11px; }.privacy-toggle { padding:6px; }.welcome h1 { font-size:31px; }.welcome>p { font-size:11px; }.welcome-eyebrow { font-size:6px; }.welcome { padding-top:35px; }.welcome-mark { margin-bottom:24px; }.chat-scroll { padding-left:19px; padding-right:19px; }.composer-privacy { font-size:8px; }.composer-note { font-size:7px; }.starter-grid { margin-top:23px; }.welcome-footnote { font-size:7px; } }
@media(max-height:760px) and (min-width:761px) { .welcome { padding-top:30px; }.welcome-mark { width:48px; height:50px; border-radius:15px; margin-bottom:20px; }.welcome h1 { font-size:35px; }.starter-grid { margin-top:24px; }.welcome-footnote { margin-top:18px; }.sidebar { padding-top:21px; }.new-chat { margin:24px 0 23px; } }
@media(prefers-reduced-motion:reduce) { *,*:before,*:after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

/* The inspector is a reading surface, not decorative telemetry. */
.privacy-heading h2 { font-size:14px; color:#60466b; }
.privacy-heading p { font-size:11px; color:#8f789b; }
.privacy-status strong { font-size:12px; }
.privacy-status p { font-size:11px; line-height:1.75; }
.privacy-status[data-state="redacted"] strong { color:#946044; }
.privacy-status[data-state="redacted"] p { color:#98745c; }
.inspector-label,.preview-heading { font-size:9px; color:#856390; }
.redaction-categories>div { font-size:11px; color:#7f618c; }
.redaction-categories b { font-size:11px; color:#90749c; }
.preview-tabs button { font-size:11px; color:#957ba3; }
.preview-tabs button[aria-selected="true"] { color:#795388; }
.preview-text { font-size:12px; line-height:1.9; color:#7c588a; }
.preview-text.empty { font-family:inherit; font-size:12px; color:#9981a4; }
.preview-text .pii-marker { font-size:10px; }
.privacy-explainer strong { font-size:11px; color:#805b8f; }
.privacy-explainer p { font-size:10px; color:#8d709b; }
.privacy-bottom { font-size:10px; color:#8e729d; }
.receipt-row { font-size:11px; }
.receipt-row dt { color:#9878a7; }
.request-context { font-size:11px; }
.request-context-content p { font-size:11px; }
.composer textarea { font-size:14px; }
.composer-note { font-size:9px; color:#92798f; }
.composer-privacy { font-size:11px; color:#8b708d; }
.message-content { font-size:15px; color:#584a56; }
.message.user .message-content { font-size:14px; }
.message-actions,.message-actions button { font-size:10px; }
.welcome>p { font-size:14px; color:#89778a; }
.starter-grid strong { font-size:12px; }
.starter-grid small { font-size:10px; color:#95798e; }
.welcome-footnote { font-size:10px; }
.connect-dialog .dialog-description { font-size:13px; }
.connect-dialog label:not(.file-button),.file-button { font-size:12px; }
.connection-address { font-size:10px; }
.connection-note,.key-help { font-size:11px; }
.model-option strong { font-size:13px; }.model-option small { font-size:11px; }
@media(max-width:1390px) and (min-width:1280px) { .starter-grid strong { font-size:11px; }.starter-grid small { font-size:9px; }.composer-privacy { font-size:10px; }.composer-note { font-size:8px; } }
@media(max-width:950px) { .composer-privacy { font-size:10px; }.composer-note { font-size:8px; }.welcome>p { font-size:13px; }.welcome-footnote { font-size:9px; } }
@media(max-width:760px) { .composer textarea { font-size:14px; }.message-content { font-size:14px; }.message.user .message-content { font-size:13px; }.composer-privacy { font-size:9px; }.composer-note { font-size:8px; }.starter-grid strong { font-size:12px; }.starter-grid small { font-size:10px; }.connection-address { font-size:9px; } }
@media(max-width:390px) { .composer-privacy { font-size:8px; }.composer-note { font-size:7px; }.welcome>p { font-size:12px; }.welcome-footnote { font-size:8px; } }