@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --ink:#1d2522; --muted:#6e7771; --line:#e7e6df; --paper:#f6f5f1; --surface:#fffefa; --accent:#d8f451; --accent-ink:#263400; --user:#e4efe8; --sidebar:#eeede7; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; min-height:100vh; background:var(--paper); color:var(--ink); font-family:Manrope, sans-serif; }
.splash{position:fixed;z-index:10;inset:0;display:grid;place-items:center;background:var(--ink);color:var(--surface);transition:opacity .5s ease,visibility .5s ease}.splash.is-done{opacity:0;visibility:hidden}.splash-inner{width:min(260px,70vw);text-align:center;animation:rise .5s ease-out}.splash-mark{width:58px;height:58px;display:grid;place-items:center;margin:0 auto 19px;border-radius:14px;background:var(--accent);color:var(--ink);font:500 31px "DM Mono",monospace}.splash p{margin:0;font-size:19px;font-weight:800;letter-spacing:.18em}.splash small{display:block;margin-top:12px;color:#aeb9af;font:500 9px "DM Mono",monospace;letter-spacing:.1em}.splash-line{display:block;height:2px;margin-top:21px;background:#3e4a42;overflow:hidden}.splash-line i{display:block;width:45%;height:100%;background:var(--accent);animation:load 1.05s ease-in-out infinite}
button, textarea { font:inherit; }
button { cursor:pointer; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:252px minmax(0, 1fr); }
.sidebar { background:var(--sidebar); padding:25px 15px 17px; display:flex; flex-direction:column; border-right:1px solid #deddd5; }
.brand { display:flex; align-items:center; gap:9px; font-weight:800; font-size:17px; letter-spacing:1px; padding:0 8px 28px; }
.brand-mark { width:28px; height:28px; border-radius:7px; background:var(--ink); color:var(--accent); display:grid; place-items:center; font-family:"DM Mono", monospace; font-size:15px; }
.new-chat { width:100%; border:1px solid #d5d5ce; color:var(--ink); background:transparent; border-radius:6px; padding:11px 12px; text-align:left; font-size:13px; font-weight:700; transition:.18s ease; }
.new-chat:hover { background:var(--surface); border-color:#bfc2b7; transform:translateY(-1px); }
.history { padding:27px 0; overflow:auto; }
.section-label, .eyebrow { margin:0; font:500 10px/1.2 "DM Mono", monospace; letter-spacing:.08em; color:var(--muted); }
.section-label { padding:0 9px 9px; }
.history-later { padding-top:23px; }
.history-item { width:100%; border:0; background:transparent; color:#58605a; padding:9px; border-radius:5px; text-align:left; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.history-item:hover, .history-item.active { color:var(--ink); background:#dfdfd8; }
.history-row{display:grid;grid-template-columns:minmax(0,1fr) 22px;align-items:center;border-radius:5px}.history-row:hover,.history-row.active{background:#dfdfd8}.history-row .history-item{width:auto}.history-row .history-item:hover,.history-row.active .history-item{background:transparent}.history-delete{width:22px;height:28px;padding:0;border:0;border-radius:4px;background:transparent;color:#8c938c;font:400 15px/1 "DM Mono",monospace}.history-delete:hover{background:#cad3c7;color:#883d34}
.sidebar-bottom { margin-top:auto; padding:10px 8px 0; }
.sidebar-actions{display:grid;justify-items:start;gap:1px;margin-bottom:14px}
.settings-button { border:0; padding:8px 0; color:var(--ink); background:transparent; font-size:12px; font-weight:700; }
.legal-sidebar { display:block; border:0; padding:0; color:#7d847e; background:transparent; font-size:10px; line-height:1.5; }
.legal-sidebar:hover { color:var(--ink); }
.local-note { color:#7d847e; font-size:10px; line-height:1.5; margin:11px 0 0; }
.workspace { min-height:100vh; display:grid; grid-template-rows:auto 1fr auto; }
.topbar { position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center; padding:16px 38px; border-bottom:1px solid var(--line); background:rgba(255,254,250,.75); }.topbar-context{display:flex;min-width:0;align-items:center;gap:9px}.topbar-context .eyebrow{white-space:nowrap}
.back-button { width:27px; height:27px; flex:none; margin:0; border:1px solid #d9d9d1; border-radius:5px; background:transparent; color:var(--ink); font-size:17px; line-height:1; }.back-button:hover{background:var(--surface)}.back-button[hidden]{display:none}.conversation-model{max-width:34vw;margin:0;overflow:hidden;color:#526058;font:500 9px "DM Mono",monospace;letter-spacing:.06em;text-overflow:ellipsis;white-space:nowrap;text-align:center}.conversation-model[hidden]{display:none}
.top-actions { display:flex;justify-self:end; align-items:center; margin-right:48px; }
.language-button { position:absolute;top:50%;right:38px;width:32px;transform:translateY(-50%);border:1px solid #d9d9d1; border-radius:5px; background:transparent; color:var(--ink); padding:5px 0; font:500 10px "DM Mono", monospace; }
.status { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:11px; }
.status i { display:block; width:7px; height:7px; border-radius:50%; background:#77b289; }
.chat { width:min(850px, 100%); margin:0 auto; overflow-y:auto; padding:48px 32px 28px; }
.welcome { min-height:100%; display:flex; flex-direction:column; justify-content:center; padding-bottom:75px; animation:rise .5s ease-out; }
.welcome[hidden] { display:none; }
.welcome-symbol { width:49px; height:49px; display:grid; place-items:center; background:var(--accent); border-radius:12px; font:500 26px "DM Mono", monospace; margin-bottom:26px; }
.welcome h2 { max-width:680px; margin:13px 0 11px; font-size:clamp(31px, 4vw, 47px); line-height:1.08; letter-spacing:0; }
.welcome > p:not(.eyebrow) { max-width:570px; margin:0; color:var(--muted); font-size:15px; line-height:1.65; }
.prompt-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); max-width:690px; gap:9px; margin-top:35px; }
.prompt-grid button { border:1px solid #dfdfd8; border-radius:7px; background:transparent; padding:16px; text-align:left; transition:.18s; }
.prompt-grid button:hover { background:var(--surface); border-color:#bdc3af; transform:translateY(-2px); box-shadow:0 7px 20px rgba(48,54,43,.06); }
.prompt-grid span { display:block; font-size:13px; font-weight:800; margin-bottom:5px; }
.prompt-grid small { color:var(--muted); font-size:11px; }
.message { display:grid; grid-template-columns:32px minmax(0,1fr); gap:13px; margin:0 auto 31px; animation:rise .25s ease-out; }
.avatar { width:31px; height:31px; border-radius:8px; display:grid; place-items:center; font:500 12px "DM Mono", monospace; background:var(--ink); color:var(--accent); }
.message.user .avatar { background:#cbdcd1; color:#385143; }
.message-content { max-width:710px; padding-top:4px; }
.message-role { margin:0 0 7px; font:500 10px "DM Mono", monospace; letter-spacing:.07em; color:var(--muted); }
.message-text { white-space:pre-wrap; font-size:14px; line-height:1.73; color:#28312c; }
.message-text strong { font-weight:800; }
.message-text .inline-code { padding:2px 5px; border-radius:3px; background:#e8ece7; color:#26342b; font:12px "DM Mono", monospace; }
.code-block { position:relative; display:block; max-width:100%; margin:12px 0; padding:34px 15px 15px; overflow:auto; border:1px solid #29342d; border-radius:7px; background:#1d2522; color:#e9f0ea; white-space:pre; font:12px/1.65 "DM Mono", monospace; tab-size:2; }.code-block code{font:inherit}.code-language{position:absolute;top:0;left:0;right:0;padding:9px 12px;border-bottom:1px solid #354139;color:#b7c3ba;background:#273129;font:500 9px "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase}
.message-media{display:block;max-width:min(100%,620px);margin:14px 0;overflow:hidden;border:1px solid #d4dbd2;border-radius:7px;background:#f4f6f1}.message-media img,.message-media video,.message-media model-viewer{display:block;width:100%;max-height:430px;background:#172019;object-fit:contain}.message-media img:not([src]){min-height:180px}.message-media.media-unavailable{background:#fff3ef;border-color:#e0b9ad}.message-media model-viewer{height:min(56vw,430px);min-height:260px}.message-media figcaption{padding:7px 10px;color:#647068;font:500 10px "DM Mono",monospace;white-space:normal}
.message-attachments{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.attachment-card{display:grid;grid-template-columns:26px minmax(0,1fr) auto auto;align-items:center;gap:7px;min-width:170px;max-width:260px;padding:5px 7px;border:1px solid #d4dbd2;border-radius:5px;background:#f6f8f3;color:#526058;font:500 9px "DM Mono",monospace}.attachment-preview{display:grid;width:26px;height:26px;place-items:center;overflow:hidden;border-radius:3px;background:#e0e6df;color:#476052;font-size:8px}.attachment-preview img{width:100%;height:100%;object-fit:cover}.attachment-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.attachment-card small{color:#8a948b;font-size:8px;white-space:nowrap}.attachment-card button{width:17px;height:17px;padding:0;border:0;border-radius:3px;background:transparent;color:#69736b;font-size:12px}.attachment-card button:hover{background:#e1e6df}.attachment-tray{display:flex;flex-wrap:wrap;gap:7px;margin:2px 0 8px}.attachment-tray[hidden]{display:none}
.typing { display:flex; gap:4px; padding:7px 0; }
.typing span { width:5px; height:5px; background:#89918b; border-radius:50%; animation:pulse 1s infinite; }.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}
.composer-wrap { padding:0 32px 19px; background:linear-gradient(transparent, var(--paper) 20%); }
.composer, .settings-panel, .disclaimer { width:min(790px, 100%); margin-left:auto; margin-right:auto; }
.composer { padding:13px 14px 10px; border:1px solid #d8d8d1; border-radius:9px; background:var(--surface); box-shadow:0 10px 30px rgba(34,43,36,.06); transition:.18s; }.composer.is-dropping{border-color:#6f9475;background:#f1f6ef}
.composer:focus-within { border-color:#aebaa0; box-shadow:0 12px 31px rgba(34,43,36,.09); }
textarea { display:block; resize:none; outline:0; border:0; width:100%; min-height:53px; max-height:180px; color:var(--ink); background:transparent; font-size:14px; line-height:1.55; }
textarea::placeholder { color:#989e99; }
.composer-footer { display:flex; align-items:center; justify-content:space-between; margin-top:4px; }
.composer-tools { display:flex; min-width:0; align-items:center; gap:10px; color:#939a94; font:400 10px "DM Mono", monospace; }.composer-actions{display:flex;flex:none;align-items:center;gap:7px}
.icon-button { width:24px; height:24px; padding:0; border:1px solid #dfdfd8; border-radius:4px; color:#69736b; background:transparent; font-size:14px; }.attach-button svg,.voice-button svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.voice-button.attach-button{width:34px;height:32px}.attach-button:hover{border-color:#879888;color:#33433a}.voice-button{display:grid;width:34px;height:32px;place-items:center;padding:0;border:1px solid #c9d0c8;border-radius:5px;color:#33433a;background:#f6f8f3;transition:.18s}.voice-button:hover{border-color:#879888;background:#edf2e9}.voice-button.is-listening{border-color:#b74e46;background:#fff0ed;color:#a53d36;animation:voice-pulse 1.25s ease-in-out infinite}.voice-status{min-width:0;max-width:245px;overflow:hidden;color:#a53d36;font-size:9px;line-height:1.3;white-space:nowrap;text-overflow:ellipsis}@keyframes voice-pulse{50%{box-shadow:0 0 0 4px rgba(183,78,70,.12)}}
.send-button { height:32px; border:0; border-radius:5px; padding:8px 10px; background:var(--ink); color:white; font-size:11px; font-weight:800; transition:.18s; }.send-button:hover{background:#33433a}.send-button:disabled{opacity:.5;cursor:wait}.send-button b{font:400 9px "DM Mono",monospace;opacity:.6;margin-left:4px}
.disclaimer { margin-top:9px; text-align:center; color:#929892; font-size:10px; }
.settings-panel { position:fixed;z-index:20;top:50%;left:50%;display:grid;width:min(620px,calc(100% - 32px));grid-template-columns:minmax(0,1fr) auto;gap:13px 20px;align-items:center;margin:0;padding:18px;transform:translate(-50%,-50%);border:1px solid #d8d8d1;border-radius:7px;background:var(--surface);box-shadow:0 18px 55px rgba(28,36,31,.24);font-size:11px; }.settings-close{position:absolute;z-index:1;top:-10px;right:-10px;display:grid;place-items:center;width:24px;height:24px;padding:0!important;border:0!important;border-radius:50%!important;background:var(--surface)!important;color:#59675d!important;box-shadow:none}.settings-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round}.settings-close:hover{background:#edf2e9!important;color:#33433a!important}.setting-label{font:500 9px "DM Mono",monospace;letter-spacing:.08em;color:var(--muted);margin:0 0 7px}.setting-main label{font-size:11px;font-weight:800}.setting-main select{display:block;width:min(100%,370px);margin-top:7px;padding:8px 28px 8px 9px;border:1px solid #d8d8d1;border-radius:5px;background:#fffefa;color:var(--ink);font-size:11px}.setting-main p:not(.setting-label),.download-info{margin:5px 0 0;color:var(--muted);font-size:10px;line-height:1.45}.setting-actions{display:grid;gap:7px}.settings-panel button{border:0;border-radius:5px;background:var(--accent);padding:8px 10px;color:var(--accent-ink);font-weight:800;font-size:10px;white-space:nowrap}.settings-panel .secondary-button{background:transparent;border:1px solid #d8d8d1;color:var(--ink)}.download-info{grid-column:1/-1;border-top:1px solid var(--line);padding-top:10px}.settings-panel button:disabled{opacity:.6;cursor:wait}
#model-select{display:none!important}
.settings-panel .danger-button{grid-column:1/-1;background:#fff5f2;border:1px solid #e4b6ac;color:#963c2f}.settings-panel .danger-button:hover{background:#fce8e3}
.model-picker-label{font-size:11px!important;font-weight:800}.model-picker{display:flex;align-items:center;justify-content:space-between;width:min(100%,430px);margin-top:7px;padding:10px 11px!important;border:1px solid #cbd4c8!important;border-radius:6px!important;background:#f5f8f0!important;color:var(--ink)!important;text-align:left}.model-picker:hover{border-color:#879888!important;background:#edf3e8!important}.model-picker span{display:block}#model-picker-name{font-size:12px}#model-picker-meta{color:var(--muted);font:500 9px "DM Mono",monospace}.model-required{max-width:510px;padding:15px;border:1px solid #cbd7c6;border-radius:7px;background:#f2f7ed}.model-required strong{font-size:13px}.model-required p{margin:6px 0 12px;color:#59675d;font-size:12px;line-height:1.55}.open-model-library{border:0;border-radius:5px;padding:8px 10px;background:var(--accent);color:var(--accent-ink);font-size:11px;font-weight:800}
.model-library{width:min(900px,calc(100% - 28px));max-height:min(760px,88vh);border:1px solid #d3d7cd;border-radius:8px;padding:20px;background:var(--surface);color:var(--ink);box-shadow:0 22px 65px rgba(28,36,31,.25)}.model-library::backdrop,.custom-model-dialog::backdrop{background:rgba(28,36,31,.38);backdrop-filter:blur(3px)}.model-library-header,.model-library-actions{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.model-library-header{gap:20px}.my-model-button{border:1px solid #9bb76c;border-radius:5px;background:var(--accent);padding:6px 9px;color:var(--accent-ink);font-size:10px;font-weight:800}.model-library h2{margin:7px 0 0;font-size:24px}.model-library-intro{max-width:630px;margin:11px 0 17px;color:var(--muted);font-size:12px;line-height:1.6}.model-filters{display:flex;gap:7px;overflow:auto;padding-bottom:11px;border-bottom:1px solid var(--line)}.model-filters button{flex:none;border:1px solid #d5d9d2;border-radius:4px;padding:7px 9px;background:transparent;color:#5c675f;font-size:10px;font-weight:800}.model-filters button.active{border-color:#b8cd83;background:var(--accent);color:var(--accent-ink)}.model-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:480px;overflow:auto;padding:14px 2px 2px}.model-card{display:flex;min-height:178px;flex-direction:column;justify-content:space-between;padding:15px;border:1px solid #d8ded5;border-radius:7px;background:#fffefa}.model-card.selected,.model-card.recommended{border-color:#9bb76c;box-shadow:inset 0 0 0 1px #c9df9a}.model-card.recommended{background:#f5f9ed}.model-category{margin:0 0 7px;color:#738165;font:500 9px "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase}.model-card h3{margin:0;font-size:14px}.model-card h3+p{margin:8px 0 0;color:#647068;font-size:11px;line-height:1.55}.model-card-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:15px;color:#738077;font:500 9px "DM Mono",monospace}.model-card-footer button{border:0;border-radius:5px;padding:7px 8px;background:var(--ink);color:#fff;font-size:10px;font-weight:800}.model-card.selected .model-card-footer button{background:#e8eee3;color:#52604f}
.custom-model-dialog{width:min(560px,calc(100% - 32px));border:1px solid #d8d8d1;border-radius:9px;padding:20px;background:var(--surface);color:var(--ink);box-shadow:0 18px 55px rgba(28,36,31,.2)}.custom-model-dialog h2{margin:15px 0 6px;font-size:22px}.custom-model-dialog p{margin:0 0 16px;color:var(--muted);font-size:12px;line-height:1.6}.custom-model-dialog label{display:block;margin:12px 0 5px;font-size:11px;font-weight:800}.custom-model-dialog input:not([type=file]),.custom-model-dialog select,.custom-model-dialog textarea{box-sizing:border-box;width:100%;border:1px solid #d8d8d1;border-radius:5px;padding:9px;background:#fffefa;color:var(--ink);font:11px "DM Mono",monospace}.custom-model-dialog textarea{resize:vertical}.custom-model-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.custom-model-actions button{border:0;border-radius:5px;padding:9px 10px;background:var(--accent);color:var(--accent-ink);font-size:10px;font-weight:800}.custom-model-actions .secondary-button{border:1px solid #d8d8d1;background:transparent;color:var(--ink)}
.settings-panel[hidden] { display:none; }
.legal-dialog{width:min(550px,calc(100% - 32px));max-height:min(700px,80vh);border:1px solid #d8d8d1;border-radius:9px;padding:20px;background:var(--surface);color:var(--ink);box-shadow:0 18px 55px rgba(28,36,31,.2)}.legal-dialog::backdrop{background:rgba(28,36,31,.32);backdrop-filter:blur(3px)}.legal-header{display:flex;align-items:center;justify-content:space-between}.legal-dialog h2{margin:15px 0;font-size:22px}.legal-dialog h3{margin:17px 0 5px;font-size:12px}.legal-dialog p{margin:0;color:var(--muted);font-size:12px;line-height:1.65}.legal-dialog a{color:var(--ink);font-weight:800}.legal-dialog .icon-button{background:transparent}
.export-dialog{width:min(470px,calc(100% - 32px));border:1px solid #d8d8d1;border-radius:9px;padding:20px;background:var(--surface);color:var(--ink);box-shadow:0 18px 55px rgba(28,36,31,.2)}.export-dialog::backdrop{background:rgba(28,36,31,.32);backdrop-filter:blur(3px)}.export-dialog h2{margin:15px 0 6px;font-size:22px}.export-dialog p{margin:0;color:var(--muted);font-size:12px;line-height:1.65}.export-actions{display:grid;gap:8px;margin-top:18px}.export-actions button{border:0;border-radius:5px;padding:10px;background:var(--accent);color:var(--accent-ink);font-size:11px;font-weight:800}.export-actions .secondary-button{border:1px solid #d8d8d1;background:transparent;color:var(--ink)}
@keyframes rise { from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)} } @keyframes pulse { 50%{transform:translateY(-3px);opacity:.35} } @keyframes load{0%{transform:translateX(-120%)}100%{transform:translateX(250%)}}
@media (max-width:720px) { .app-shell{display:block}.sidebar{display:none}.topbar{padding:18px 20px}.language-button{right:20px}.chat{padding:35px 20px 20px}.composer-wrap{padding:0 14px 14px}.welcome{padding-bottom:30px}.prompt-grid{grid-template-columns:1fr}.settings-panel{grid-template-columns:1fr;align-items:stretch}.setting-actions{grid-template-columns:1fr 1fr}.status{display:none}.model-library{padding:16px}.model-cards{grid-template-columns:1fr;max-height:55vh}.model-card{min-height:155px}.icon-button,.voice-button,.voice-button.attach-button{width:44px;height:44px}.send-button{height:44px;padding:10px 12px} }