:root{--sidebar-width:316px;--rail-width:56px;--motion-ease:cubic-bezier(.2,.7,.2,1)}
main{padding-top:max(76px,calc(50dvh - 180px))}.ui-icon.ref-icon{stroke:none;fill:currentColor}.ref-icon path{stroke:none}.ref-icon{width:16px;height:16px}i .ref-icon{width:16px;height:16px}
.ui-icon{width:18px;height:18px;display:inline-block;flex:none;vertical-align:middle;stroke-width:1.5}.ui-icon.previous{transform:rotate(90deg)}.ui-icon.next{transform:rotate(-90deg)}
aside{width:var(--sidebar-width);transform:translateX(0);transition:transform 220ms var(--motion-ease),visibility 220ms;will-change:transform}main{transition:margin-left 220ms var(--motion-ease);margin-left:var(--sidebar-width)}.collapsed aside{transform:translateX(-100%);visibility:hidden;pointer-events:none}.collapsed main{margin-left:var(--rail-width)}.hide:before,.sidebar-open:before{content:none}.sidebar-open{display:none!important}
#sidebar-rail{position:fixed;inset:0 auto 0 0;width:56px;background:var(--bg);border-right:1px solid var(--line);z-index:9;display:flex;flex-direction:column;align-items:center;padding-top:10px;gap:8px;opacity:0;visibility:hidden;transform:translateX(-12px);transition:opacity 140ms,transform 220ms var(--motion-ease),visibility 220ms}#sidebar-rail>.icon{width:36px;height:36px;margin-bottom:0}#sidebar-rail>.icon:first-child{margin-bottom:2px}.collapsed #sidebar-rail{opacity:1;visibility:visible;transform:none}.rail-new{background:#292929;border-radius:50%}.rail-bottom{margin-top:auto;display:flex;flex-direction:column;gap:10px;padding-bottom:10px}.rail-bottom button{height:32px;width:36px}.collapsed #sidebar-rail .icon:hover{background:#292929}
#sidebar-backdrop{display:none}header .hide{width:30px;height:30px}nav button{height:44px;margin-bottom:0;gap:10px}nav button i{width:18px;height:18px}nav button:first-child i{padding:5px}footer button{gap:10px}footer .ui-icon{width:17px;height:17px}
#popover{padding:8px;border:0;background:#242424;box-shadow:0 8px 24px #0005,0 0 0 1px #ffffff04;min-width:240px;width:max-content;max-width:min(320px,calc(100vw - 16px));max-height:calc(100dvh - 16px);overflow:auto;border-radius:22px;animation:none;opacity:0;transform:translateY(4px) scale(.97);transition:opacity 120ms ease,transform 150ms var(--motion-ease);z-index:60}#popover[data-placement=bottom]{transform:translateY(-4px) scale(.97)}#popover.menu-in{opacity:1;transform:translateY(0) scale(1)}#popover.menu-out{opacity:0;transform:translateY(3px) scale(.98);pointer-events:none}#popover button{min-height:40px;gap:12px;border-radius:16px;padding:11px 13px;font-size:13px;line-height:18px}#popover button span{flex:1}#popover button .ui-icon{color:#aaa;width:19px;height:19px}#popover button .check{flex:none;margin-left:auto}#popover button:hover,#popover button:focus-visible{background:#3b3b3b;outline:none}#popover small{font-size:12px;line-height:16px;margin-top:0;color:#b8b8b8}#popover h4{font-size:12px;font-weight:normal;margin:5px 12px 8px}#popover[data-menu=models]{width:280px}#popover[data-menu=models] h4{display:none}#popover[data-menu=models] button{min-height:43px}#popover[data-menu=models] button:has(.check){background:#494949}#popover[data-menu=models] .check{display:none}#popover[data-menu=reason]{width:280px}#popover[data-menu=more]{width:284px;border-radius:16px}#popover[data-menu=more] button{border-radius:8px}#popover[data-menu=tools]{width:255px;border-radius:16px}
#overlay{animation:overlayIn 140ms ease;background:#0009}#dialog{animation:dialogIn 180ms var(--motion-ease)}#overlay.dialog-out{animation:overlayOut 140ms ease forwards;pointer-events:none}#overlay.dialog-out #dialog{animation:dialogOut 140ms ease forwards}.dialog-close{width:30px;height:30px;right:16px;top:15px}.dialog-close .ui-icon{width:19px;height:19px}
.chatting main{padding:22px max(32px,calc((100vw - var(--sidebar-width) - 760px)/2)) 10px}.collapsed.chatting main{padding-left:max(32px,calc((100vw - var(--rail-width) - 760px)/2));padding-right:max(32px,calc((100vw - var(--rail-width) - 760px)/2))}.chatting #conversation{width:100%;max-width:900px;padding:0 16px 20px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#555 transparent}.chat-heading{padding:0 20px 12px}.chat-heading h2{font-size:18px;line-height:24px;font-weight:600}.chat-private{display:flex;gap:9px;align-items:center;font-size:13px;line-height:20px}.chat-private>.ui-icon{width:17px;height:17px}.chat-private button{display:inline}.message.assistant{padding:12px 20px 20px;animation:none}.message.assistant .label{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:600;margin-bottom:19px}.message .label .ui-icon{width:17px;height:17px}.message.user{animation:messageIn 180ms ease-out!important}.message.user .message-content{font-size:14px;line-height:23px}.message-content p{margin:0 0 18px;font-size:14px;line-height:24px}.message-content ul,.message-content ol{margin:0 0 18px;padding-left:38px}.message-content li{padding-left:6px;margin:0 0 12px;line-height:24px}.message-content li::marker{color:#777}.message-content .numbered{margin-left:18px}.message-content h3{font-size:17px;margin:15px 0}.message .actions{gap:2px;align-items:center}.message .actions button{width:30px;height:30px;padding:6px;color:#929292;border-radius:7px}.message .actions .ui-icon{width:17px;height:17px}.message .actions button:last-child{width:auto;padding:6px 9px;font-size:12px;gap:6px}.user-actions{gap:4px;bottom:-35px}.user-actions button{width:30px;height:30px}.user-actions .ui-icon{width:17px;height:17px}.followups{animation:messageIn 200ms ease-out;margin-top:18px}.followups button{font-size:12px;font-weight:normal;line-height:17px;padding:8px 12px}.sent-files{display:flex;gap:6px;margin-top:8px}.sent-files .file-chip{margin:0}.chatting .toolbar #ask{font-size:0;width:32px;height:32px;padding:6px;position:relative}.chatting .toolbar #ask:after{content:'';position:absolute;width:18px;height:18px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21V3m-7 7 7-7 7 7' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}.chatting .toolbar #ask[data-state=stop]:after{mask:none;width:12px;height:12px;border-radius:2px}.chatting #entry{max-width:640px}.chatting .composer{padding:15px 16px 13px}.chatting .privacy{font-size:10px}.chatting #promo{max-width:640px}.demo-badge{opacity:.65}
button .ui-icon,button i svg{transition:transform 150ms ease,opacity 150ms ease}button:hover .ui-icon{opacity:1}button[data-action=sidebar]:hover .ui-icon{transform:scale(1.06)}button[data-action=image]:hover svg{transform:translateY(-1px)}button[data-action=voice]:hover svg{animation:iconWave 650ms ease-in-out}button[data-action=more][aria-expanded=true] i:last-child svg{transform:rotate(90deg)}button[aria-expanded=true] .model svg,button.model[aria-expanded=true] svg{transform:rotate(180deg)}button[data-action=reason]:hover svg{transform:rotate(-8deg)}.light #popover{background:#fff;box-shadow:0 8px 25px #0002}.light #popover button:hover{background:#eee}.light #popover[data-menu=models] button:has(.check){background:#e4e4e4}.light .rail-new{background:#eee}
@keyframes overlayIn{from{background:#0000}to{background:#0009}}@keyframes overlayOut{to{background:#0000}}@keyframes dialogIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}@keyframes dialogOut{to{opacity:0;transform:translateY(5px) scale(.985)}}@keyframes messageIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}@keyframes iconWave{25%{transform:scaleY(.75)}50%{transform:scaleY(1.1)}75%{transform:scaleY(.9)}}
@media(max-width:900px){aside{width:min(316px,85vw);z-index:31;box-shadow:none}.collapsed aside{transform:translateX(-100%)}main,.collapsed main{margin-left:0;transition:none}#sidebar-rail{width:48px;height:48px;bottom:auto;border:0;background:transparent;padding:8px;z-index:20;opacity:1;visibility:visible;transform:none}#sidebar-rail>button:not(:first-child),#sidebar-rail .rail-bottom{display:none}body:not(.collapsed) #sidebar-rail{visibility:hidden}.collapsed #sidebar-rail{visibility:visible}body:not(.collapsed) main:after{display:none}#sidebar-backdrop{display:block;position:fixed;inset:0;border-radius:0;background:#0008;z-index:30;opacity:0;visibility:hidden;transition:opacity 200ms ease,visibility 200ms}body:not(.collapsed) #sidebar-backdrop{opacity:1;visibility:visible}.chatting main,.collapsed.chatting main{padding:53px 10px 8px}.chat-heading{padding:0 6px 12px}.chatting #conversation{padding:0 2px 14px}.message.assistant{padding:12px 6px 18px}.chat-private{font-size:11px;line-height:17px}.chat-heading h2{font-size:16px}.message-content p,.message-content li{font-size:14px;line-height:23px}.message-content ul,.message-content ol{padding-left:26px}#overlay{padding:14px}.settings-content{max-height:65dvh}#popover{max-width:calc(100vw - 16px)}#entry .toolbar{gap:0}.toolbar button[data-action=tools]{padding:7px 6px}.toolbar button[data-action=reason] span{display:inline}.toolbar button[data-action=reason]{font-size:12px}.toolbar .model{font-size:12px}.demo-badge{top:8px;font-size:8px}}
@media(prefers-reduced-motion:reduce){aside,main,#sidebar-rail,#popover,#dialog,#overlay,#sidebar-backdrop{transition:none!important;animation:none!important}button:hover svg{animation:none!important;transform:none!important}}