.chat-page [hidden]{display:none!important}
.profile-menu{position:relative;font-size:14px;color:var(--text)}
.profile-menu>summary{list-style:none;display:flex;align-items:center;gap:10px;border-radius:10px;padding:10px;cursor:pointer}
.profile-menu>summary::-webkit-details-marker{display:none}
.profile-menu>summary:hover,.profile-menu[open]>summary{background:var(--hover)}
.profile-avatar{display:grid;place-items:center;flex-shrink:0;width:29px;height:29px;border-radius:50%;background:var(--raised);font-size:12px}
.profile-identity{min-width:0;flex:1;display:flex;align-items:baseline;gap:6px}
.profile-identity strong{font-weight:500;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-identity small{color:var(--text-faint);font-size:11px}
.profile-popup{position:absolute;bottom:calc(100% + 8px);left:0;width:280px;max-width:calc(100vw - 28px);padding:8px;border:1px solid var(--line-strong);border-radius:14px;background:var(--panel-solid);box-shadow:0 15px 50px #0005;z-index:80;max-height:75dvh;overflow:auto}
.profile-email{margin:5px 10px 10px;color:var(--text-faint);font-size:12px;overflow-wrap:anywhere}
.profile-popup :is(button,a){display:flex;align-items:center;gap:10px;width:100%;box-sizing:border-box;padding:9px 10px;border:0;border-radius:7px;background:transparent;color:var(--text);text-align:left;text-decoration:none;font:14px/1.5 var(--imitri-font);cursor:pointer}
.profile-popup :is(button,a):hover{background:var(--hover)}
.profile-popup hr{border:0;border-top:1px solid var(--line);margin:7px 4px}
.profile-logout{display:flex;align-items:center;gap:10px;padding-left:10px;border-radius:7px}.profile-logout:hover{background:var(--hover)}.profile-logout button{padding-left:0}
.profile-popup kbd{margin-left:auto;font:11px var(--imitri-font);color:var(--text-faint)}
:is(.profile-popup,.preferences-nav,.preferences-panel,.artifact-gallery,.workspace-nav) svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.chat-page .sidebar-footer{padding:6px 10px}
dialog.chat-settings{width:min(1220px,calc(100vw - 32px));max-width:none;height:min(860px,calc(100dvh - 32px));max-height:none;padding:0;border-radius:12px;overflow:hidden;background:var(--panel);font:14px/1.6 var(--imitri-font)}
.chat-settings>header{height:68px;box-sizing:border-box;padding:16px 28px;border-bottom:1px solid var(--line)}
.chat-settings>header h2{font-size:19px;font-weight:600;letter-spacing:-.01em}
.chat-settings>header button{padding:0;width:36px;height:36px;font-size:22px;border:0;border-radius:10px;background:transparent;transition:background .16s ease}.chat-settings>header button:hover{background:var(--hover)}
.preferences-layout{display:grid;grid-template-columns:264px minmax(0,1fr);height:calc(100% - 104px)}
.preferences-nav{display:flex;flex-direction:column;gap:4px;padding:20px 14px;border-right:1px solid var(--line);background:var(--sidebar);overflow:auto}
.preferences-nav input{box-sizing:border-box;width:100%;padding:11px 13px;margin:0 0 16px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);transition:border-color .16s ease;font:14px var(--imitri-font)}
.preferences-nav button{display:flex;align-items:center;gap:12px;padding:11px 13px;border:0;border-radius:10px;background:transparent;text-align:left;color:var(--text-soft);font-size:15px;font-weight:450;transition:background .16s ease,color .16s ease}
.preferences-nav button[aria-current=page],.preferences-nav button:hover{background:var(--hover);color:var(--text)}
.preferences-content{overflow:auto;min-width:0;padding:40px 56px}
.preferences-panel{max-width:720px;margin:0 auto;animation:settings-panel .26s cubic-bezier(.2,.7,.2,1) backwards}
.chat-settings section.preferences-panel{padding:0;border:0}
.preferences-panel h3{font-size:24px;font-weight:600;letter-spacing:-.015em;line-height:1.25;margin:0 0 20px}
.preferences-panel .preference-row{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:22px 0;border-bottom:1px solid var(--line);font-size:16px}
.preference-row small{display:block;color:var(--text-soft);font-size:14px;line-height:1.45;max-width:380px;margin-top:4px}
.preference-row select{max-width:260px;min-width:190px;min-height:42px;padding:9px 13px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);cursor:pointer;transition:border-color .16s ease,background .16s ease;font:15px var(--imitri-font)}
.preferences-panel>a{display:flex;align-items:center;gap:10px;color:var(--text);padding:14px 0;text-decoration:none;border-bottom:1px solid var(--line)}
.chat-settings .preferences-note{font-size:14px;color:var(--text-soft);margin-top:24px}
.chat-settings #service-settings-status{margin:0;border-top:1px solid var(--line);padding:12px 28px;font-size:14px;line-height:22px;height:48px;box-sizing:border-box;overflow:auto}
.preferences-panel .usage-summary{grid-template-columns:1fr 1fr}
.preferences-panel .usage-dialog-head>div>h2,.preferences-panel .usage-dialog-head .eyebrow{display:none}
.preferences-panel .usage-dialog-head p{font-size:14px}
.preferences-panel .account-card{padding:0 0 24px!important;border-bottom:1px solid var(--line)!important;margin-bottom:20px!important}
.preferences-panel .credit-row{font-size:15px}.preferences-panel .account-card-actions{font-size:15px}
.preferences-panel .usage-table-wrap{overflow:auto}.preferences-panel .usage-table{min-width:560px}
.preferences-panel .usage-table td[colspan]{display:table-cell;text-align:left}
.artifact-gallery{width:min(920px,calc(100vw - 28px));max-height:85dvh;box-sizing:border-box;padding:22px;border:1px solid var(--line-strong);border-radius:16px;background:var(--panel);color:var(--text)}
.artifact-gallery::backdrop{background:#0009}.artifact-gallery header{display:flex;align-items:center;justify-content:space-between}
.artifact-gallery header button{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text)}
.artifact-gallery p{color:var(--text-soft);font-size:13px}.artifact-gallery details{border-top:1px solid var(--line);padding:15px 0}.artifact-gallery summary{cursor:pointer}
html[data-chat-font=sans] .chat-page .message--assistant .message-prose{font-family:var(--imitri-font)}
.usage-view-tabs{display:flex;gap:5px;margin:0 0 32px}
.usage-load-status{font-size:14px;color:var(--text-soft);margin:0 0 20px}
.chat-settings .preferences-intro{margin:-12px 0 28px;color:var(--text-soft);font-size:15px}
.settings-profile{display:flex;gap:16px;align-items:center;padding:0 0 28px;border-bottom:1px solid var(--line)}
.settings-profile-avatar{width:52px;height:52px;display:grid;place-items:center;border-radius:10px;background:var(--accent-soft);color:var(--accent-ink);font-size:22px;font-weight:600;flex-shrink:0}
.settings-profile strong{font-size:20px;font-weight:600}.settings-profile p{margin:4px 0 0;color:var(--text-soft);font-size:15px;overflow-wrap:anywhere}.settings-profile>div{min-width:0}
.settings-account-row{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line)}
.settings-account-row small{display:block;color:var(--text-soft);margin-top:4px;font-size:14px}
.settings-account-row a{color:var(--text);background:var(--raised);padding:10px 15px;border-radius:10px;text-decoration:none;font-size:14.5px;transition:background .16s ease,color .16s ease}
.chat-settings .settings-account-action{display:flex;align-items:center;gap:10px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:var(--text);padding:18px 0;width:100%;text-align:left;font:inherit;cursor:pointer}
.chat-settings[open]{display:flex;flex-direction:column}.chat-settings>header{flex-shrink:0}
.chat-settings .preferences-layout{height:auto;flex:1;min-height:0}
.chat-settings #service-settings-status{flex-shrink:0}.chat-settings #service-settings-status:empty{display:none}
.settings-account-action:hover,.settings-account-row a:hover{color:var(--accent-ink)}
.settings-weekly-quota:has(.credit-row:not([hidden])){padding:16px 0 0}.settings-weekly-quota .credit-row{font-size:14px;margin:5px 0}
.chat-settings .usage-view-tabs button{border:0;border-radius:20px;padding:8px 16px;background:transparent;color:var(--text-soft);font-size:15px;transition:background .16s ease,color .16s ease}
.chat-settings .usage-view-tabs button[aria-pressed=true]{background:var(--hover);color:var(--text)}
.preferences-panel[data-panel=billing]>h3{display:none}
.chat-settings .usage-section{padding:0;margin:0 0 30px;border:0}
.usage-section h4{margin:0 0 6px;font-size:18px;font-weight:600;letter-spacing:0}
.chat-settings .usage-section p{font-size:14.5px;line-height:1.6;color:var(--text-soft);margin:4px 0 12px}
.usage-limit-card,.usage-activity-list{border:1px solid var(--line);border-radius:14px;padding:16px 18px;background:transparent}
.usage-card-line{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:15px}
.usage-card-line strong{font-weight:600}.usage-card-line>span{font-size:14px;color:var(--text-soft)}
.chat-settings .usage-limit-card p{font-size:14px;margin:5px 0 10px}
.usage-limit-card progress{appearance:none;display:block;width:100%;height:5px;border:0;border-radius:5px;overflow:hidden;background:var(--hover);margin-top:12px}
.usage-limit-card progress::-webkit-progress-bar{background:var(--hover)}.usage-limit-card progress::-webkit-progress-value{background:var(--text-soft)}.usage-limit-card progress::-moz-progress-bar{background:var(--text-soft)}
.usage-plan-link{color:var(--text);background:var(--raised);text-decoration:none;white-space:nowrap;padding:8px 14px;border-radius:18px;font-size:14px}
.usage-held-line{border-top:1px solid var(--line);padding-top:12px;margin-top:8px;font-size:14px;color:var(--text-soft)}
.usage-activity-row{display:flex;justify-content:space-between;gap:20px;padding:13px 0;font-size:15px}
.usage-activity-row+.usage-activity-row{border-top:1px solid var(--line)}
.usage-activity-row strong{font-weight:500;overflow-wrap:anywhere}.usage-activity-row small{display:block;font-size:13px;color:var(--text-soft);margin-top:5px}
.usage-activity-row>div:last-child{text-align:right;flex-shrink:0}
.usage-analytics .usage-summary{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:20px 0}
.usage-analytics .usage-summary article{background:var(--panel)}
@media(max-width:700px){
 dialog.chat-settings{width:calc(100vw - 16px);height:calc(100dvh - 24px);border-radius:14px}
 .preferences-layout{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}
 .preferences-nav{flex-direction:row;flex-wrap:wrap;gap:4px;padding:10px;border-right:0;border-bottom:1px solid var(--line)}
 .preferences-nav input{margin:0 0 4px}.preferences-nav button{font-size:14px;padding:8px 10px;gap:7px}.preferences-nav svg{width:15px;height:15px}
 .preferences-content{padding:20px 16px}.preferences-panel .preference-row{align-items:flex-start;flex-direction:column;gap:12px;padding:18px 0}
 .preference-row select{width:100%;max-width:none}.profile-popup{width:260px}
 .usage-card-line{align-items:flex-start;flex-wrap:wrap}.usage-plan-link{display:inline-block}
 .usage-activity-row{gap:12px;font-size:14px}.usage-limit-card,.usage-activity-list{padding:14px}
}

/* Settings motion. The dialog is a top-layer element, so its close needs overlay and display to stay discrete. */
dialog.chat-settings{font-size:15px;opacity:0;transform:translateY(10px) scale(.985);transition:opacity .2s ease,transform .26s cubic-bezier(.2,.7,.2,1),overlay .26s allow-discrete,display .26s allow-discrete}
dialog.chat-settings[open]{opacity:1;transform:none}
dialog.chat-settings::backdrop{background:rgb(0 0 0 / 0);transition:background .22s ease,overlay .26s allow-discrete,display .26s allow-discrete}
dialog.chat-settings[open]::backdrop{background:rgb(0 0 0 / 62%)}
@starting-style{
  dialog.chat-settings[open]{opacity:0;transform:translateY(10px) scale(.985)}
  dialog.chat-settings[open]::backdrop{background:rgb(0 0 0 / 0)}
}
@keyframes settings-panel{from{opacity:0;transform:translateY(6px)}}
.chat-settings :is(button,a,input,select):focus{outline:0}
.chat-settings :is(button,a,input,select):focus-visible{outline:0;box-shadow:0 0 0 2px var(--line-strong)}
.preferences-nav input:focus{border-color:var(--line-strong)}
.preference-row select:hover,.preference-row select:focus-visible{border-color:var(--line-strong)}

/* Selects open as a designed list where the browser allows it; elsewhere the native list remains. */
@supports (appearance:base-select){
  .preference-row select,.preference-row select::picker(select){appearance:base-select}
  .preference-row select::picker(select){margin-block:8px;padding:6px;border:1px solid var(--line-strong);border-radius:14px;background:var(--panel-solid);box-shadow:var(--shadow-menu);opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top;transition:opacity .16s ease,transform .22s cubic-bezier(.2,.7,.2,1),overlay .22s allow-discrete,display .22s allow-discrete}
  .preference-row select:open::picker(select){opacity:1;transform:none}
  @starting-style{.preference-row select:open::picker(select){opacity:0;transform:translateY(-6px) scale(.98)}}
  .preference-row select::picker-icon{color:var(--text-soft);transition:transform .2s cubic-bezier(.2,.7,.2,1)}
  .preference-row select:open::picker-icon{transform:rotate(180deg)}
  .preference-row option{padding:10px 12px;border-radius:9px;color:var(--text);font-size:15px;transition:background .14s ease}
  .preference-row option:hover,.preference-row option:focus{outline:0;background:var(--hover)}
  .preference-row option::checkmark{order:1;margin-left:auto}
}
@media (prefers-reduced-motion:reduce){
  dialog.chat-settings,dialog.chat-settings::backdrop,.preferences-panel,.preference-row select::picker(select){transition:none;animation:none}
}

dialog.chat-settings>header button:focus-visible{outline:0;box-shadow:none;background:var(--hover)}