/* g1 — owner panel (G1–G6) shared styles. Tokens only. */
@import url("../components.css");

/* chat */
.chat { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 12px; overflow: hidden; }
.chat .stamp { align-self: center; font: 400 13px/18px var(--font-ui); color: var(--ink-subtle); }
.bubble { max-width: 290px; padding: 12px 16px; border-radius: 20px; font: 400 15px/21px var(--font-ui); }
.bubble.me { align-self: flex-end; background: var(--ink); color: var(--on-ink); border-bottom-right-radius: 6px; }
.bubble.ai { background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); border-bottom-left-radius: 6px; }
.attach { align-self: flex-end; display: flex; align-items: center; gap: 10px; padding: 6px 14px 6px 6px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); border-radius: var(--r-md); }
.attach .ph { width: 44px; height: 44px; border-radius: 8px; background: linear-gradient(135deg, var(--photo-a), var(--photo-b)); }
.msg-ai { display: flex; align-items: flex-start; gap: 8px; }
.msg-ai > .col { gap: 8px; min-width: 0; align-items: flex-start; }
.draft-card { width: 100%; padding: 12px; display: flex; flex-direction: column; gap: 12px; }
.draft-card .thumb { width: 56px; height: 56px; border-radius: 10px; background: var(--site-bg); display: grid; place-items: center; flex: none; }
.draft-card .thumb::after { content: ""; width: 30px; height: 30px; border-radius: 6px; background: linear-gradient(135deg, var(--photo-a), var(--photo-b)); }
.composer { flex: none; background: var(--surface); border-top: 1px solid var(--line); padding: 12px 16px; display: flex; align-items: center; gap: 8px; }
.composer .field-search { background: var(--paper); box-shadow: none; }

/* draft preview */
.screen > .content > * { flex-shrink: 0; }
.changed { padding: 0 8px; outline: 2px dashed var(--live); outline-offset: 4px; border-radius: var(--r-sm); }
.site-page { flex: none; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.site-page .bar { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 8px; background: var(--paper); font: 400 13px/18px var(--font-ui); color: var(--ink-muted); }
.site-page .bar .i { --i: 12px; }
.site-page .hours { padding: 24px 20px 16px; display: flex; flex-direction: column; gap: 10px; }
.site-page .hours .r { display: flex; justify-content: space-between; font: 400 15px/21px var(--font-ui); }
.site-page .hours .r b { font-weight: 600; }

/* version timeline */
.tl-item .text.v { flex-direction: row; align-items: flex-start; justify-content: space-between; gap: 12px; padding-bottom: 20px; min-height: 60px; }
.tl-item .text.v > .col { gap: 2px; min-width: 0; }
.tl-item.draft .rail .dot { background: var(--amber); }
.tl-item.current .rail .dot { box-shadow: 0 0 0 4px var(--live-soft); }