/* Shared neutral theme, matched to the public ChatGPT reference on 2026-09-18.
   Product names, logo, permissions, tools and billing remain Lonifa's. */
:root {
  color-scheme:light;
  font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial,sans-serif;
  --surface:#fff;--card:#fff;--panel:#fff;--soft:#f4f4f4;--hover:#ececec;
  --text:#0d0d0d;--muted:#686868;--line:#e5e5e5;
  --accent:#0d0d0d;--accent-hover:#333;--accent-text:#fff;
  --teal-ink:var(--text);--teal-soft:var(--soft);--focus:#969696;
  --brand-turquoise:#3687f5;--elevation:0 2px 10px #0000000c;--overlay:#0006;
  --danger:#a42a28;--danger-soft:#fff1f0;--danger-line:#ecc4c2;
  --composer-border:#c7c7c7;
  color:var(--text);background:var(--surface);
}
:root[data-theme=dark] {
  color-scheme:dark;
  --surface:#000;--card:#171717;--panel:#000;--soft:#212121;--hover:#303030;
  --text:#fff;--muted:#aaa;--line:#2c2c2c;
  --accent:#fff;--accent-hover:#dedede;--accent-text:#0d0d0d;
  --teal-ink:var(--text);--teal-soft:var(--soft);--focus:#777;
  --brand-turquoise:#60a5fa;--elevation:0 2px 12px #0003;--overlay:#0009;
  --danger:#ffb4ad;--danger-soft:#341c1c;--danger-line:#69403d;
  --composer-border:#4d4d4d;
  color:var(--text);background:var(--surface);
}
body{background:var(--surface);color:var(--text);font-family:inherit}
button,input,select,textarea{font-family:inherit}
button,a,input,select,textarea,summary{outline-offset:4px}
.brand-mark,.brand img{width:28px;height:28px;object-fit:contain}
:root[data-theme=dark] .brand-mark,:root[data-theme=dark] .brand img{background:#fff;border-radius:8px;padding:3px}
/* The chat uses the language-aware sidebar, centered canvas and neutral message rail. */
.topbar{direction:inherit;min-height:56px;padding:8px 18px;gap:10px}
.topbar-start{gap:6px}.topbar .brand{font-size:19px;letter-spacing:0;flex-shrink:0;gap:8px}
.topbar .brand>span{overflow:visible}.topbar .brand-mark{width:26px;height:26px}
.topbar .plan-badge{display:none}
.balance-pill{direction:inherit;background:var(--surface);border-color:var(--line);color:var(--text);border-radius:24px;min-height:38px;padding:6px 13px}
.balance-copy{text-align:center}.account-chip-name{display:none}.balance-pill.signed-in #balance-label{font-size:12px}
.topbar .icon-button{width:36px;height:36px;color:var(--text)}
.welcome{padding:0 24px 34px}.welcome h1{font-size:28px;line-height:1.6;font-weight:500;letter-spacing:0}
.welcome-mark{display:block;width:88px;height:88px;object-fit:contain;margin:0 auto 20px}
@media(max-width:600px){.welcome-mark{width:72px;height:72px;margin-bottom:16px}}
@media(max-height:520px){.welcome-mark{width:44px;height:44px;margin-bottom:10px}}
.empty .chat-scroll{margin-top:auto}.empty .composer-area{margin-bottom:auto}
.composer-area{width:min(100%,816px);padding:12px 24px 4px}
.composer{border:1px solid var(--composer-border);border-radius:28px;padding:14px 14px 10px;background:var(--surface);box-shadow:var(--elevation)}
:root[data-theme=dark] .composer{background:#212121}
.composer:focus-within{border-color:var(--composer-border);box-shadow:var(--elevation)}
.composer textarea{min-height:40px;padding:0 6px;line-height:1.65;font-size:16px}
.composer-bottom{direction:inherit;gap:8px}.composer-actions{margin-inline-start:auto;gap:8px}
.chat-tool-picker{margin-inline-end:0;min-height:34px;border:0;background:transparent;color:var(--muted);font-size:12px}
.power-picker{direction:inherit;border:0;background:transparent;color:var(--muted);padding:6px 10px;min-height:34px}
.power-picker:hover:enabled,.chat-tool-picker:hover{background:var(--hover)}
.power-picker[aria-expanded=true]{border-color:transparent;background:var(--hover)}
.power-picker .power-bolt{color:var(--muted)}
#send{width:36px;height:36px;background:var(--accent);color:var(--accent-text)}
#send:disabled{background:#b8b8b8;color:#fff}
:root[data-theme=dark] #send:disabled{background:#555;color:#aaa}
.chat-suggestions{margin:24px 0 4px;gap:9px}
.chat-suggestions button{background:transparent;border-color:var(--line);border-radius:24px;padding:9px 15px;color:var(--text);min-height:38px;font-size:12px}
main:not(.empty) .chat-suggestions,main:not(.empty) .composer-incentives{display:none}
.composer-incentives{text-align:center}.composer-incentives .welcome-gift{font-size:11px;margin-top:9px;color:var(--muted)}
.messages{max-width:816px;padding:30px 24px 8px}.message{line-height:1.85;margin-bottom:32px}
.message.user{background:var(--soft);border-radius:22px;padding:10px 18px;max-width:82%}
.message.assistant{padding:0}.chat-job{background:transparent;border-color:var(--line);box-shadow:none}
.chat-job-status{background:var(--soft);color:var(--muted)}
.sidebar{inset:0;inset-inline-start:0;inset-inline-end:auto;padding:12px;border:0;border-inline-end:1px solid var(--line);background:var(--panel)}
.sidebar .panel-heading{direction:inherit;margin:0 0 14px;padding:0 4px;min-height:38px}
.sidebar .panel-heading .brand>span{display:none}.sidebar .panel-heading .brand{margin:0}
.sidebar .new-chat{min-height:38px;font-size:14px;padding:8px 10px;gap:10px;border-radius:10px}
.sidebar #sidebar-new-chat{background:transparent;color:var(--text);margin:0}
.sidebar #sidebar-new-chat:hover:enabled,.sidebar .new-chat:hover{background:var(--hover)}
.history-heading{padding:28px 10px 9px;font-size:12px}.history-select{font-size:14px;padding:10px}
.history-item.active,[dir=ltr] .history-item.active{background:var(--soft);box-shadow:none}
.history-delete{opacity:0}.history-item:hover .history-delete,.history-delete:focus-visible{opacity:1}
.sidebar-bottom{padding:12px 8px 4px;border-top:1px solid var(--line);margin-top:10px;gap:10px}
.sidebar-bottom .avatar{background:var(--soft);width:34px;height:34px;border-radius:50%;padding:7px}
.sidebar-bottom .avatar img{display:block;width:100%;height:100%;object-fit:contain}
:root[data-theme=dark] .sidebar-bottom .avatar{background:#fff}
.sidebar-bottom strong{font-size:13px;font-weight:500}.sidebar-bottom small{font-size:11px;color:var(--muted)}
.footer-note{font-size:11px;color:var(--muted);margin:9px 16px 10px}
.primary-button,.secondary-button,.reward-link,.survey-card{border-radius:14px}
.power-popover{box-shadow:0 8px 30px #0002}.power-slider input::-webkit-slider-thumb{border:0;background:#fff}.power-slider input::-moz-range-thumb{border:0;background:#fff}
.sources{border-color:var(--line)}.status-row.ready .status-dot{background:#35a66c}
@media(min-width:1000px){body.sidebar-visible main{margin:0;margin-inline-start:260px}.sidebar{width:260px}.sidebar:not(:modal) #close-history{display:grid}.topbar #menu{display:grid}}
@media(max-width:600px){.power-picker [data-i18n=power]{display:none}.chat-tool-picker{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar{padding:8px 10px;gap:7px;min-height:56px}.topbar .brand{font-size:17px;gap:7px}.topbar .brand-mark{width:25px;height:25px}.topbar #new-chat{display:none}.topbar-start{flex:1;min-width:0}.balance-pill{max-width:132px;font-size:11px;padding:6px 10px}.balance-pill.signed-in{max-width:132px}.balance-pill.signed-in #balance-label{font-size:10px}.topbar #model-details{width:30px}.welcome{padding:0 18px 25px}.welcome h1{font-size:25px}.composer-area{padding:10px 12px 4px}.composer{padding:12px 10px 9px;border-radius:26px}.composer textarea{min-height:40px}.chat-suggestions{gap:6px;margin-top:20px}.chat-suggestions button{padding:8px 12px;font-size:11px}.messages{padding:24px 18px 8px}.message{font-size:16px}.message.user{max-width:90%}.power-picker{font-size:11px;gap:5px;padding:6px}.chat-tool-picker{font-size:11px;padding:6px}.history-delete{opacity:1}}
@media(max-width:360px){.topbar .brand{font-size:15px;gap:5px}.topbar .brand-mark{width:23px;height:23px}.topbar-start{gap:2px}.topbar .icon-button{width:30px}.balance-pill{max-width:114px}.balance-pill.signed-in{max-width:114px}.balance-pill.signed-in #balance-label{font-size:9px}.topbar{gap:4px}.power-picker [data-i18n=power]{display:none}}
@media(max-height:520px){.empty .chat-scroll{margin-top:30px}.empty .composer-area{margin-bottom:24px}.welcome{padding-bottom:16px}.chat-suggestions{margin-top:12px}}
/* Consistent neutral account, developer, advertising and management pages. */
.shell{max-width:1280px}.top .brand{letter-spacing:0}.top .brand img{width:32px;height:32px}
@media(min-width:700px){
  .empty .composer{display:grid;grid-template-columns:36px 66px minmax(0,1fr) auto;align-items:center;gap:8px;direction:inherit;padding:8px 10px;border-radius:28px}
  .empty .composer textarea{grid-column:3;grid-row:1;min-height:36px;padding:4px 2px}
  .empty .composer-bottom{display:contents}
  .empty #upload{grid-column:1;grid-row:1;width:36px;height:36px}
  .empty #chat-tools-open{grid-column:2;grid-row:1;padding:6px}
  .empty .composer-actions{grid-column:4;grid-row:1;margin:0}
  .empty .power-picker [data-i18n=power]{display:none}
  .empty .welcome{padding-bottom:42px}
}

.message.user{margin-left:auto;margin-right:0}

/* Approved black-and-gold emblem from the API design task; preserve the original artwork. */
img[src*="/brand/lonifa-mark-gold-v2.png"]{border-radius:8px}
.welcome-mark[src*="/brand/lonifa-mark-gold-v2.png"]{border-radius:22px}
:root[data-theme=dark] img[src*="/brand/lonifa-mark-gold-v2.png"]{padding:0}
.sidebar-bottom .avatar:has(img[src*="/brand/lonifa-mark-gold-v2.png"]){padding:0;overflow:hidden;background:#fff}

/* Only the transcript scrolls; the shell never extends below the viewport. */
body.chat-page{position:fixed;inset:0;overflow:hidden;overscroll-behavior:none}
.chat-page .workspace{position:absolute;left:0;right:0;top:var(--chat-view-top,0px);height:var(--chat-view-height,100dvh);min-height:0;overflow:hidden}
.chat-page #main{height:100%;min-height:0;overflow:hidden}
.chat-page .topbar,.chat-page .project-bar,.chat-page .composer-area,.chat-page .footer-note{flex-shrink:0}
.chat-page #main:not(.empty) #chat-scroll{flex:1 1 0;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.chat-page #main.empty #chat-scroll{min-height:0;flex-shrink:1;overflow-y:auto}
.chat-page .footer-note{margin-bottom:max(8px,env(safe-area-inset-bottom))}

.message-copy{display:flex;align-items:center;justify-content:center;width:36px;height:36px;margin-top:6px;padding:6px;border:0;border-radius:8px;background:transparent;color:var(--muted,#777);cursor:pointer}.message-copy:hover,.message-copy:focus-visible{background:var(--surface-hover,rgba(128,128,128,.14));color:inherit}.message.user .message-copy{margin-inline-start:auto}
