/* DW: compact introduction, graphite surfaces, and a conversation-first layout. */
.chat-page{--chat-bg:#0b0f14;--chat-surface:#10161e;--chat-line:#28313d;--chat-text:#e7edf5;--chat-muted:#a0acbb;--chat-accent:#b4d9f5;min-height:100vh;background:var(--chat-bg);color:var(--chat-text)}
.chat-page .shell{width:min(1120px,calc(100% - 48px))}
.chat-page .subpage-header{background:#0b0f14;border-bottom:1px solid #202833}
.chat-page .subpage-header .header-inner{height:72px}
.chat-page .subpage-header .subpage-nav-cta{border-color:#344352;color:#d7e8f5;border-radius:8px}
.chat-page .subpage-menu>summary{border-color:#344352}
.chat-page .subpage-menu .subpage-nav{background:#111820;border-color:#344352}
.chat-page .subpage-nav a:hover{color:#b4d9f5}
.chat-page .chat-hero{padding:32px 0 22px;background:none;border:0}
.chat-page .chat-hero .subpage-hero-grid{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;max-width:920px;margin-inline:auto}
.chat-page .chat-hero .eyebrow{margin:0 0 10px;color:#9caabd;font:12px/1.5 var(--mono);letter-spacing:.12em}
.chat-page .chat-hero .eyebrow>span{background:#b4d9f5;box-shadow:none}
.chat-page .chat-hero h1{max-width:none;margin:0;font:550 clamp(25px,3vw,32px)/1.3 var(--sans);letter-spacing:-.035em;text-wrap:initial}
.chat-page .chat-hero .subpage-lede{max-width:none;margin:0 0 3px;color:var(--chat-muted);font-size:13px;line-height:1.7}
.chat-page .chat-section{padding:0 0 22px;background:none}
.chat-panel{position:relative;max-width:920px;margin:0 auto;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--chat-line);border-radius:18px;background:linear-gradient(140deg,#141c26,#10161e 48%);box-shadow:0 24px 70px #0003}
.chat-panel [hidden]{display:none!important}
.chat-head{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:10px 24px;box-sizing:border-box;border-bottom:1px solid #242e3a;background:#10161e80}
.chat-status{display:flex;align-items:center;gap:9px;min-width:0;margin:0;color:var(--chat-muted);font:12px/1.6 var(--sans);letter-spacing:.025em;overflow-wrap:anywhere}
.chat-dot{width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:#758295;box-shadow:0 0 0 3px #75829514}
.chat-dot.is-online{background:#9ec9ce;box-shadow:0 0 0 3px #9ec9ce14}
.chat-dot.is-mock{background:#dcc694;box-shadow:0 0 0 3px #dcc69414}
.chat-dot.is-error{background:#eea49d;box-shadow:0 0 0 3px #eea49d14}
.chat-clear,.chat-msg-tools button{min-height:44px;padding:7px 11px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--chat-muted);font:12px/1.5 var(--sans);cursor:pointer;transition:color .15s,background .15s,border-color .15s}
.chat-clear{flex-shrink:0}
.chat-clear:hover,.chat-msg-tools button:hover{border-color:#364454;background:#ffffff05;color:#eaf2fb}
.chat-log{display:flex;flex-direction:column;gap:26px;min-height:280px;height:clamp(330px,47svh,520px);padding:30px 28px;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#3e4d60 transparent;box-sizing:border-box}
.chat-empty{width:100%;max-width:620px;margin:auto;padding:6px 0}
.chat-empty-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.chat-core{display:block;flex:0 0 36px;width:36px;height:36px;border-radius:10px;filter:saturate(.65)}
.chat-empty-kicker{margin:0;color:#d8e4f1;font:600 13px/1.55 var(--sans);letter-spacing:.02em}
.chat-empty-kicker span{display:block;margin-top:2px;color:#8493a6;font:12px/1.5 var(--mono);letter-spacing:.07em}
.chat-empty-title{margin:0;color:#f0f4fa;font:500 clamp(21px,2.8vw,26px)/1.4 var(--sans);letter-spacing:-.025em}
.chat-empty-lede{margin:9px 0 0;color:var(--chat-muted);font-size:13px;line-height:1.75}
.chat-suggest{display:grid;gap:8px;margin-top:22px}
.chat-suggest button{display:grid;grid-template-columns:68px minmax(0,1fr) 16px;align-items:center;gap:13px;min-height:48px;padding:11px 14px;border:1px solid #293644;border-radius:9px;background:#ffffff02;color:#d8e3ef;font:13px/1.6 var(--sans);text-align:left;cursor:pointer;transition:border-color .15s,background .15s}
.chat-suggest button>*{min-width:0;overflow-wrap:anywhere}
.chat-suggest button:hover{border-color:#58718a;background:#b4d9f508}
.chat-suggest-tag{color:#92a7bc;font-size:12px}
.chat-suggest-arrow{color:#b4d9f5;font-size:16px}
.chat-suggest-note{margin:10px 0 0;color:#8998aa;font-size:12px;line-height:1.65}
.chat-msg{display:grid;grid-template-columns:30px minmax(0,1fr);gap:14px;width:100%;max-width:780px;margin-inline:auto}
.chat-msg-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;font:600 12px/1 var(--sans);color:#d4e4f6}
.chat-msg.is-user .chat-msg-mark{background:#293443}
.chat-msg-mark img{display:block;width:100%;height:100%;border-radius:9px;filter:saturate(.65)}
.chat-msg-body{min-width:0;padding-top:3px;color:#dbe4ef;font-size:14px;line-height:1.85;overflow-wrap:anywhere}
.chat-msg.is-user .chat-msg-body{padding:10px 14px;border:1px solid #2a3746;border-radius:4px 12px 12px;background:#1a253280;color:#e3ecf7;white-space:pre-wrap}
.chat-msg-body>*:first-child{margin-top:0}.chat-msg-body>*:last-child{margin-bottom:0}
.chat-msg-body p{margin:0 0 .8em}
.chat-msg-body ul,.chat-msg-body ol{margin:0 0 .8em;padding-left:1.5em}
.chat-msg-body li{margin:.3em 0}
.chat-msg-body a{color:#b4d9f5;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.chat-msg-body strong{color:#f1f5fb;font-weight:600}
.chat-msg-body code{padding:.1em .35em;border:1px solid #314052;border-radius:4px;background:#b4d9f508;font:12px/1.6 var(--mono)}
.chat-msg-body pre{max-width:100%;margin:0 0 .8em;padding:13px 15px;overflow-x:auto;border:1px solid #293644;border-radius:10px;background:#090d12}
.chat-msg-body pre code{padding:0;border:0;border-radius:0;background:transparent;font-size:12px;line-height:1.7}
.chat-msg-body h1,.chat-msg-body h2,.chat-msg-body h3{margin:.8em 0 .45em;color:#f1f5fb;font:600 15px/1.5 var(--sans)}
.chat-cursor{display:inline-block;width:.5em;height:1em;margin-left:3px;vertical-align:-.15em;background:#b4d9f5;animation:chat-blink 1s steps(2) infinite}
@keyframes chat-blink{to{opacity:0}}
.chat-msg-tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.chat-msg-tools button{padding-inline:9px}
.chat-msg-error{margin-top:8px;color:#edb1a9;font-size:12px;line-height:1.7}
.chat-form{position:relative;display:flex;flex-direction:column;gap:10px;padding:18px 24px 16px;border-top:1px solid #293441;background:#0d131bc9;scroll-margin-block:16px}
.chat-form textarea{display:block;width:100%;min-height:52px;max-height:180px;padding:13px 15px;box-sizing:border-box;border:1px solid #344456;border-radius:11px;outline:0;background:#161f2b;color:#eff5fc;font:16px/1.55 var(--sans);resize:none;overflow-y:auto;scroll-margin-block:20px;transition:border-color .15s,box-shadow .15s}
.chat-form textarea:focus{border-color:#7598b7;box-shadow:0 0 0 3px #b4d9f50b}
.chat-form textarea::placeholder{color:#8b9aab}.chat-form textarea:disabled{opacity:.6}
.chat-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.chat-hint{display:flex;gap:12px;flex-wrap:wrap;min-width:0;margin:0 auto 0 0;color:#8d9dae;font:12px/1.6 var(--sans)}
.chat-count.is-near{color:#dfc08a}
.chat-send,.chat-stop{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;min-width:76px;padding:0 17px;border:1px solid transparent;border-radius:9px;font:600 13px/1.5 var(--sans);cursor:pointer;transition:background .15s,border-color .15s,opacity .15s}
.chat-send{background:#b4d9f5;color:#0a1824}.chat-send:hover:not(:disabled){background:#cbe7fb}.chat-send:disabled{opacity:.38;cursor:not-allowed}
.chat-stop{border-color:#435165;background:transparent;color:#dfebf7}.chat-stop:hover{border-color:#6d879f;background:#ffffff05}
.chat-error{margin:0;color:#edb1a9;font-size:13px;line-height:1.65}.chat-error a{color:#b4d9f5;text-decoration:underline;text-underline-offset:3px}
.chat-starter-feedback{margin:0;color:#a8bfd4;font-size:12px;line-height:1.7}
.chat-composer-notice{margin:0;color:#8d9dad;font-size:12px;line-height:1.75}
.chat-composer-notice a{color:#b5c8da;text-decoration:underline;text-underline-offset:3px}
.chat-panel button:focus-visible,.chat-page a:focus-visible,.chat-privacy summary:focus-visible{outline:2px solid #b4d9f5;outline-offset:3px}
.chat-page .subpage-cta{padding:12px 0 30px;background:none}
.chat-page .subpage-cta .shell{max-width:920px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.chat-page .subpage-cta h2{max-width:none;margin:0;font:500 19px/1.5 var(--sans);letter-spacing:-.01em}
.chat-page .subpage-cta p{max-width:none;margin:6px 0 0;color:#93a3b4;font-size:12px;line-height:1.8}
.chat-next-actions{display:flex;align-items:center;gap:18px;flex-shrink:0}
.chat-next-actions [hidden]{display:none}
.chat-page .chat-next-actions .button{min-height:44px;margin:0;padding:10px 14px;border:1px solid #405268;border-radius:9px;background:#1a2633;color:#dcecf8;font:600 12px/1.5 var(--sans)}
.chat-next-actions .text-link{display:inline-flex;align-items:center;min-height:44px;color:#b4cadc;font-size:12px}
.chat-page .subpage-footer{padding:22px 0;background:#0b0f14;border-color:#25303c;color:#8b99a9}
.chat-page .subpage-footer a{color:#b3c7d9}
.chat-privacy{max-width:920px;margin:0 auto;padding:8px 0 22px;color:#91a1b3;font-size:12px;line-height:1.85;scroll-margin-top:24px;overflow-wrap:anywhere}
.chat-privacy summary{width:fit-content;min-height:44px;display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none;color:#a8bace}
.chat-privacy summary::after{content:'＋';font-size:16px}.chat-privacy[open] summary::after{content:'−'}
.chat-privacy summary::-webkit-details-marker{display:none}.chat-privacy summary::marker{content:''}
.chat-privacy-content{max-width:820px;padding-top:4px}.chat-privacy p{margin:0 0 9px}.chat-privacy a{color:#b4d9f5;text-decoration:underline;text-underline-offset:3px}
.chat-handoff-dialog{width:min(680px,calc(100% - 32px));max-height:calc(100dvh - 48px);overflow:auto;padding:28px;border:1px solid #415269;border-radius:14px;background:#111923;color:#e3edf8;box-shadow:0 24px 90px #0008}
.chat-handoff-dialog::backdrop{background:#070b12cc;backdrop-filter:blur(5px)}
.chat-handoff-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.chat-handoff-head h2{margin:0;font:550 22px/1.4 var(--sans)}
.chat-handoff-dialog p{font-size:13px;line-height:1.8;color:#a9b9ca}.chat-handoff-dialog label{display:block;margin:18px 0 9px;font-size:13px;font-weight:600}
.chat-handoff-dialog textarea{width:100%;min-height:180px;padding:14px;box-sizing:border-box;border:1px solid #405268;border-radius:9px;background:#0b121b;color:#eef6ff;font:16px/1.7 var(--sans);resize:vertical}
.chat-handoff-dialog button:not(.button){min-width:44px;min-height:44px;padding:8px 12px;border:1px solid #35465a;border-radius:8px;background:transparent;color:#dbe9f5;font:13px/1.5 var(--sans);cursor:pointer}
.chat-handoff-dialog textarea:focus-visible,.chat-handoff-dialog button:focus-visible{outline:2px solid #b4d9f5;outline-offset:3px}
.chat-handoff-actions{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:18px}.chat-handoff-actions .button{min-height:44px;margin:0;border-radius:8px;background:#b4d9f5;color:#0a1824;font-size:13px}
.chat-welcome{position:absolute;z-index:3;top:-48px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 24px);padding:9px 16px;border:1px solid #55718b;border-radius:999px;background:#1b2a3b;color:#dcefff;font:12px/1.6 var(--sans);pointer-events:none;box-shadow:0 8px 30px #0003;animation:welcome-arrive 5.2s ease both}
.chat-panel.is-welcoming{border-color:#65849d}
@keyframes welcome-arrive{0%,100%{opacity:0;transform:translate(-50%,5px)}12%,85%{opacity:1;transform:translate(-50%,0)}}
@media(max-width:700px){
 .chat-page .shell{width:calc(100% - 32px)}
 .chat-page .chat-hero{padding:24px 0 18px}.chat-page .chat-hero .subpage-hero-grid{display:block}.chat-page .chat-hero .subpage-lede{margin-top:8px;font-size:12px}
 .chat-page .chat-hero h1{font-size:26px}.chat-page .chat-hero .eyebrow{margin-bottom:7px;letter-spacing:.07em}
 .chat-panel{border-radius:14px}.chat-head{min-height:58px;padding:7px 14px;gap:8px}
 .chat-log{height:clamp(280px,40svh,390px);min-height:250px;padding:22px 15px;gap:22px}
 .chat-empty-brand{gap:10px;margin-bottom:14px}.chat-core{width:32px;height:32px;flex-basis:32px}.chat-empty-kicker{font-size:12px}.chat-empty-kicker span{font-size:12px}
 .chat-empty-title{font-size:22px}.chat-empty-lede{font-size:12px;margin-top:7px}.chat-suggest{gap:7px;margin-top:17px}
 .chat-suggest button{grid-template-columns:56px minmax(0,1fr) 12px;gap:8px;padding:10px 11px;font-size:12px}.chat-suggest-tag{font-size:12px}
 .chat-msg{grid-template-columns:24px minmax(0,1fr);gap:10px}.chat-msg-mark{width:24px;height:24px}.chat-msg-body{font-size:14px;line-height:1.8}.chat-msg.is-user .chat-msg-body{padding:9px 11px}
 .chat-form{padding:14px 14px calc(12px + env(safe-area-inset-bottom));gap:9px}.chat-form textarea{font-size:16px;padding:12px;min-height:50px}
 .chat-hint-keys{display:none}.chat-hint{font-size:12px}.chat-send,.chat-stop{min-width:70px;padding-inline:13px}
 .chat-composer-notice{font-size:12px;line-height:1.8}.chat-suggest-note{font-size:12px}
 .chat-page .subpage-cta{padding:6px 0 24px}.chat-page .subpage-cta .shell{display:block}.chat-page .subpage-cta h2{font-size:18px}
 .chat-next-actions{gap:18px;flex-wrap:wrap;margin-top:12px}.chat-page .chat-next-actions .button{width:auto;font-size:12px}
 .chat-page .subpage-footer .shell{flex-direction:row;flex-wrap:wrap;gap:12px 20px;font-size:12px;letter-spacing:0}
 .chat-page .subpage-footer .shell>span{width:100%}.chat-privacy{padding-bottom:20px}
 .chat-handoff-dialog{padding:20px}.chat-handoff-head h2{font-size:20px}.chat-handoff-actions>*{width:100%;text-align:center}.chat-handoff-actions .button{justify-content:center}
}
@media(max-width:380px){.chat-log{padding-inline:12px}.chat-form{padding-inline:12px}.chat-suggest button{grid-template-columns:52px minmax(0,1fr) 12px;gap:6px;padding-inline:9px}.chat-actions{gap:8px}}
@media(prefers-reduced-motion:reduce){.chat-log{scroll-behavior:auto}.chat-cursor,.chat-welcome{animation:none}.chat-panel *{transition:none!important}}
/* Keep the initial suggestions fully visible; only an actual conversation scrolls. */
.chat-log:has(.chat-empty:not([hidden])){height:auto;min-height:330px;overflow:visible}
.chat-empty{flex-shrink:0}
.chat-welcome{top:70px}
@media(max-width:700px){.chat-log:has(.chat-empty:not([hidden])){min-height:0}.chat-welcome{top:64px}}
