.attachment-action>.ui-icon{width:22px;height:22px;color:var(--ui-ink)}.composer-spacer{flex:1;min-width:4px}
.attachment-box{min-width:0;border-radius:12px;transition:background .15s}.attachment-box.drag-over{background:var(--ui-hover)}.attachment-list{display:flex;flex-wrap:nowrap;gap:8px;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:2px 0 8px;margin:0 0 8px;scrollbar-width:thin;scrollbar-color:var(--ui-line) transparent}.attachment-list[hidden]{display:none}.attachment-card{flex:0 0 216px;min-width:0;display:grid;grid-template-columns:44px minmax(0,1fr) 22px;align-items:center;gap:8px;scroll-snap-align:start;padding:8px;border:1px solid var(--ui-line);border-radius:14px;font-size:12px}.attachment-card img{width:44px;height:44px;object-fit:cover;border-radius:8px}.attachment-file-info{min-width:0}.attachment-file-info span,.attachment-file-info small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-file-info small{color:var(--ui-muted);font-size:11px;margin-top:4px}.attachment-card button{align-self:start;display:grid;place-items:center;width:22px;height:22px;padding:3px;border:0;border-radius:50%;background:var(--ui-page);color:var(--ui-ink);cursor:pointer}.attachment-card button .ui-icon{width:15px;height:15px}.document-icon{width:44px;height:44px;display:grid;place-items:center;background:var(--ui-page);border-radius:8px;color:var(--ui-muted)}.document-icon .ui-icon{width:25px;height:25px}.input-status{font-size:11px;line-height:1.5;color:var(--ui-muted);overflow-wrap:anywhere}.input-status:empty{display:none}.voice-input{display:flex;align-items:center;flex:none;position:relative}.voice-input button[hidden]{display:none}.voice-input .listening{background:var(--ui-ink);color:var(--ui-page)}.attachment-history{display:flex;flex-wrap:nowrap;max-width:100%;overflow-x:auto;gap:6px;margin:6px 0 16px}.attachment-saved{display:flex;align-items:center;gap:6px;flex:none;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid var(--ui-line);border-radius:10px;background:none;padding:7px 10px;color:inherit;font:11px var(--ui-font);cursor:pointer}.attachment-history-preview{width:100%}.attachment-history-preview img{max-width:100%;max-height:300px;border-radius:10px}.attachment-mode{font-size:12px;margin:8px 0}.attachment-mode select{font:inherit;padding:7px;max-width:100%}
@media(max-width:600px){.attachment-card{flex-basis:190px}.composer-spacer{min-width:0}}
@media(prefers-reduced-motion:reduce){.attachment-box{transition:none}}
.attachment-history{display:block;overflow:visible}.attachment-history-row{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;max-width:100%;padding-bottom:4px}.attachment-history-preview:empty{display:none}.attachment-history-preview:not(:empty){margin-top:10px}.attachment-card img{background:var(--ui-page)}

.attachment-transfers{display:grid;gap:8px}.transfer-progress{display:grid;gap:5px;font-size:12px;color:var(--ui-muted);margin:8px 0}.transfer-progress progress{width:100%;height:8px;accent-color:var(--ui-ink)}.transfer-error{padding:10px;border:1px solid var(--ui-line);border-radius:9px;font-size:12px;overflow-wrap:anywhere}.transfer-error p{margin:0 0 6px;line-height:1.5}.transfer-error button{margin-right:16px;min-height:32px}.attachment-file-info [role=alert]{white-space:normal;color:var(--ui-muted);line-height:1.4}@media(max-width:900px){.transfer-error button{min-height:44px}}

.voice-panel{position:absolute;right:0;bottom:calc(100% + 14px);z-index:70;box-sizing:border-box;width:340px;max-width:calc(100vw - 40px);padding:18px;border:1px solid var(--ui-line);border-radius:20px;background:var(--ui-page);color:var(--ui-ink);box-shadow:0 12px 36px #0003;font:13px/1.5 var(--ui-font)}
.voice-panel[hidden]{display:none}.voice-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:600}.voice-panel time{color:var(--ui-muted);font-weight:400;font-variant-numeric:tabular-nums}
.dictation-wave{display:flex;align-items:center;justify-content:center;gap:5px;height:48px;margin:12px 0}.dictation-wave i{display:block;flex:0 0 4px;height:3px;border-radius:4px;background:var(--ui-ink);transition:height .1s linear}
.voice-status{position:static;width:auto;max-width:none;margin:0;min-height:36px;padding:0;font-size:13px;line-height:1.5;color:var(--ui-ink);white-space:normal}.voice-note{margin:10px 0 16px;color:var(--ui-muted);font-size:11px;white-space:normal;line-height:1.5}.voice-panel-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.voice-panel-actions button{min-height:40px;margin:0}
.voice-input[data-state=loading] .dictation-wave,.voice-input[data-state=permission] .dictation-wave,.voice-input[data-state=error] .dictation-wave{display:none}.voice-input[data-state=error] time{display:none}
@media(max-width:900px){.attachment-card{grid-template-columns:44px minmax(0,1fr) 44px}.attachment-card button{width:44px;height:44px;padding:12px}.voice-panel{position:fixed;left:12px;right:12px;bottom:max(110px,calc(env(safe-area-inset-bottom) + 110px));width:auto;max-width:none;max-height:calc(var(--usable-height,100dvh) - 160px);overflow:auto;overscroll-behavior:contain}.voice-panel-actions button{min-height:44px}}
@media(prefers-reduced-motion:reduce){.dictation-wave i{transition:none}}
.attachment-pdf-warning{white-space:normal!important;line-height:1.4}.attachment-saved>span{overflow:hidden;text-overflow:ellipsis;text-align:left;min-width:0}.attachment-saved small{display:block;font-size:10px;color:var(--ui-muted);margin-top:3px}.attachment-saved>.ui-icon{width:19px;height:19px;flex:none}
.ai-composer .attachment-readable{flex:0 0 min(340px,100%);box-sizing:border-box}.attachment-card .attachment-model-choice{display:block;width:auto;height:auto;min-height:28px;padding:4px 0;border-radius:0;background:transparent;color:var(--ui-ink);font:inherit;text-align:left;text-underline-offset:3px}.attachment-card .attachment-model-choice:focus-visible{outline:2px solid var(--ui-ink);outline-offset:2px}.attachment-card .attachment-model-choice:disabled{opacity:.5;cursor:default}
@media(max-width:900px),(pointer:coarse){.attachment-card .attachment-model-choice{min-height:44px;padding:8px 0}}
.attachment-card .reference-badge{display:inline-flex;align-items:center;width:max-content;max-width:100%;height:auto;min-height:24px;padding:3px 5px;border-radius:5px;background:var(--ui-soft);color:var(--ui-accent-text);font:600 11px/1.3 var(--ui-font);white-space:nowrap}
.attachment-card .reference-badge:focus-visible{outline:2px solid var(--ui-accent);outline-offset:2px}
@media(max-width:900px),(pointer:coarse){.attachment-card .reference-badge{min-height:44px}}

.media-submit-actions{display:flex;align-items:center;gap:8px}.media-submit-actions .media-generate{flex:1;min-width:0}.media-submit-actions .voice-input{flex:none}.media-submit-actions [data-mobile-mic]{display:flex;align-items:center;justify-content:center;min-width:0}.media-submit-actions [data-mobile-mic]:empty{display:none}.is-guest .media-submit-actions{display:none!important}
.prompt-with-voice{position:relative;display:block;min-width:0}
.prompt-with-voice textarea{width:100%;box-sizing:border-box}
.prompt-with-voice:has(>.voice-at-prompt:not(:empty)) textarea{padding-right:52px!important;padding-bottom:52px!important}
.prompt-with-voice>.voice-at-prompt{position:absolute;right:8px;bottom:8px;z-index:4}
.generation-ack{display:flex;align-items:flex-start;gap:10px;min-height:44px;padding:10px 0;color:var(--ui-muted);font-size:12px;line-height:1.5;cursor:pointer;text-align:left}
.generation-ack input{appearance:none;flex:0 0 20px;width:20px;height:20px;margin:2px 0 0;border:1px solid var(--ui-line);border-radius:6px;background:var(--ui-page);cursor:pointer}
.generation-ack input:checked{background:#278c61 url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"%3E%3Cpath d="M3 8l3 3 7-7" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E') center/14px 14px no-repeat;border-color:#278c61}
.generation-ack input:focus-visible{outline:2px solid #43a777;outline-offset:3px}
.generation-ack input:disabled{opacity:.5;cursor:default}
.generation-ack>span{flex:1;min-width:0}
.generation-ack-star{color:#359b6f;font-weight:700;margin-right:5px}
.ai-chat .prompt-with-voice .voice-input{grid-column:auto;grid-row:auto;justify-self:auto}

.reference-move-down{transform:rotate(180deg)}
.attachment-transfer{display:grid;gap:5px;padding:10px;border:1px solid var(--ui-line);border-radius:9px;background:var(--ui-soft);font:11px/1.4 var(--ui-font);min-width:0}
.attachment-transfer>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.attachment-transfer>span{color:var(--ui-muted)}
.attachment-transfer>progress{width:100%;height:5px;accent-color:var(--ui-accent-text,var(--ui-ink))}
/* Shared compact material picker, including the Mini App. */
.attachment-tiles{--material-size:72px;padding:0;min-width:0}
.material-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--material-size),1fr));gap:8px;align-items:start;min-width:0}
.attachment-tiles .attachment-list,.attachment-tiles .attachment-transfers{display:contents;margin:0;padding:0;overflow:visible}
.attachment-tiles .attachment-list[hidden]{display:none}
.material-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;min-width:0;width:100%;min-height:154px;padding:20px 14px;border:1px dashed var(--ui-line);border-radius:var(--ui-radius-card,14px);background:var(--ui-sidebar);color:var(--ui-ink);font:13px/1.5 var(--ui-font);text-align:center;cursor:pointer;transition:border-color .18s,background-color .18s,color .18s}
.material-add strong{font-weight:500;max-width:24ch;text-wrap:balance}
.material-add small{color:var(--ui-muted);font-size:11px}
.material-symbol{position:relative;display:flex;gap:5px;align-items:center;transition:transform .22s cubic-bezier(.16,1,.3,1)}
.material-symbol>.ui-icon{width:34px;height:34px;stroke-width:1.3}
.material-symbol>.material-plus{width:17px;height:17px;align-self:flex-end}
.attachment-tiles[data-has-files=false] .material-add{grid-column:1/-1}
.attachment-tiles[data-has-files=true] .material-add{aspect-ratio:1;min-height:0;gap:0;padding:10px}
.attachment-tiles[data-has-files=true] .material-add :is(strong,small){display:none}
.attachment-tiles[data-has-files=true] .material-symbol>.ui-icon{width:23px;height:23px}
.attachment-tiles[data-has-files=true] .material-symbol>.material-plus{width:14px;height:14px}
.attachment-tiles .material-file{position:relative;display:block;box-sizing:border-box;aspect-ratio:1;width:100%;min-width:0;padding:0;overflow:hidden;border:1px solid var(--ui-line);border-radius:var(--ui-radius-control,9px);background:var(--ui-sidebar)}
.attachment-tiles .material-file .material-preview{display:grid;place-items:center;width:100%;height:100%;padding:0;border:0;border-radius:0;background:transparent;color:var(--ui-ink);cursor:zoom-in}
.attachment-tiles .material-file img{width:100%;height:100%;object-fit:cover;border-radius:0;transition:filter .18s}
.attachment-tiles .material-file .material-remove{position:absolute;top:2px;right:2px;width:28px;height:28px;min-height:0;padding:5px;border:0;border-radius:7px;background:var(--ui-sidebar);color:var(--ui-ink);box-shadow:0 2px 5px rgb(0 0 0 / .15);z-index:1}
.material-expand{position:absolute;left:5px;bottom:5px;display:grid;place-items:center;width:23px;height:23px;border-radius:5px;background:var(--ui-sidebar);color:var(--ui-ink);pointer-events:none}
.material-expand .ui-icon{width:14px;height:14px}
.attachment-tiles .attachment-file-info{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.attachment-tiles .attachment-transfer{position:relative;display:grid;align-content:center;box-sizing:border-box;aspect-ratio:1;min-width:0;padding:10px;border:1px solid var(--ui-line);border-radius:var(--ui-radius-control,9px);background:var(--ui-sidebar);overflow:hidden}
.attachment-tiles .attachment-transfer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
.attachment-tiles .attachment-transfer :is(strong,span),.attachment-tiles .transfer-progress{display:none}
.attachment-tiles .attachment-transfer progress{position:relative;width:100%;height:5px;accent-color:var(--ui-accent)}
.attachment-tiles .transfer-error{grid-column:1/-1;margin:0}
.attachment-tiles .input-status{margin:8px 0 0}
.material-add:focus-visible,.material-preview:focus-visible,.material-remove:focus-visible{outline:2px solid var(--ui-focus);outline-offset:-3px}
.material-add:disabled{opacity:.5;cursor:default}
.material-add:active:not(:disabled){background:var(--ui-soft);border-color:var(--ui-accent)}
@media(hover:hover){.material-add:hover:not(:disabled){border-color:var(--ui-accent);background:var(--ui-soft);color:var(--ui-accent-text,var(--ui-ink))}.material-add:hover:not(:disabled) .material-symbol{transform:translateY(-4px)}.material-preview:hover img{filter:brightness(.82)}}
@media(pointer:coarse){.attachment-tiles .material-file .material-remove{width:44px;height:44px;padding:13px;background:transparent;box-shadow:none}.material-remove::before{content:'';position:absolute;inset:8px;background:var(--ui-sidebar);border-radius:7px;z-index:-1}}
@media(prefers-reduced-motion:reduce){.material-add,.material-symbol,.material-file img{transition:none}.material-add:hover:not(:disabled) .material-symbol{transform:none}}
[data-template-slot]:has(.attachment-tiles)>.attachment-action,.video-role-card:has(.attachment-tiles)>.video-role-upload,.video-frame-slot:has(.attachment-tiles)>.video-frame-upload{display:none}

/* Dictation remains next to its editable draft on every screen size. */
.voice-panel.is-inline{position:static;inset:auto;box-sizing:border-box;width:100%;max-width:none;max-height:none;margin:8px 0 0;padding:10px 12px;border-radius:10px;box-shadow:none;background:var(--ui-soft);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 16px}
.voice-panel.is-inline[hidden]{display:none}
.voice-panel.is-inline .voice-panel-heading{grid-column:1;justify-content:flex-start;gap:12px}
.voice-panel.is-inline .dictation-wave{grid-column:1;height:24px;margin:0;justify-content:flex-start;gap:3px}
.voice-panel.is-inline .dictation-wave i{flex-basis:3px;max-height:24px}
.voice-panel.is-inline .voice-status{grid-column:1;min-height:0;font-size:12px}
.voice-panel.is-inline .voice-note{display:none}
.voice-panel.is-inline .voice-panel-actions{grid-column:2;grid-row:1/4;gap:12px}
.voice-panel.is-inline .voice-panel-actions button{min-height:36px}
@media(max-width:480px){.voice-panel.is-inline{column-gap:8px}.voice-panel.is-inline .voice-panel-actions{flex-direction:column;gap:4px}}

.voice-panel.is-inline[data-state="loading"] .dictation-wave,.voice-panel.is-inline[data-state="permission"] .dictation-wave{opacity:.35}
