@layer aster.elements {
  aster-conversation-reader{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%;font:inherit;color:var(--aster-text);background:var(--aster-surface)}
  .ac-reader{display:grid;grid-template-columns:minmax(0,1fr);flex:1;min-height:0;overflow:hidden}
  .ac-reader[data-context]{grid-template-columns:minmax(0,1fr) minmax(300px,37%)}
  aster-conversation-pane{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;background:var(--aster-surface)}
  .ac-context{display:flex;flex-direction:column;min-width:0;min-height:0;border-left:1px solid var(--aster-rule);background:var(--aster-sunk)}
  .ac-context aster-conversation-pane{flex:1;background:transparent}
  .ac-return{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--aster-rule)}
  .ac-return button{font-size:11px;color:var(--aster-accent);padding:5px 0}
  .ac-return button:last-child{font-size:24px;line-height:1;width:30px;height:30px;display:grid;place-items:center}
  .ac-pane-header{padding:20px 24px 14px;border-bottom:1px solid var(--aster-rule);display:flex;align-items:center;justify-content:space-between;gap:16px}
  .ac-focus-launch{color:var(--aster-accent);width:34px;height:34px;display:grid;place-items:center;font-size:20px;flex:none}
  .ac-pane-header h2{margin:0;font-size:18px;line-height:1.3;letter-spacing:-.4px;overflow-wrap:anywhere}
  .ac-kicker{margin:0 0 5px;color:var(--aster-accent);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.12em}
  .ac-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px 20px;color:var(--aster-text-2);font-size:10px;border-bottom:1px solid var(--aster-rule-2)}
  .ac-tools>div{display:flex;align-items:center;gap:8px}
  .ac-tools button{padding:5px;color:var(--aster-accent);min-width:26px;min-height:28px}
  .ac-scroll{flex:1;min-height:0;overflow:auto;overflow-anchor:none;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--aster-rule) transparent;padding:16px 24px 20px;scroll-behavior:auto}
  .ac-entries{list-style:none;margin:0;padding:0}
  .ac-entries>li{padding:0;margin:0 0 19px}
  .ac-entry{position:relative;padding:3px 0;scroll-margin:14px;overflow-wrap:anywhere}
  .ac-entry>header{min-height:32px;padding-inline-end:76px;display:flex;gap:9px;align-items:baseline;flex-wrap:wrap;margin-bottom:7px}
  .ac-entry strong{font-size:12px;font-weight:650}
  .ac-entry time{font-size:10px;color:var(--aster-text-2)}
  .ac-body{white-space:pre-wrap;max-width:76ch;font-size:12px;line-height:1.7}
  .ac-entry[data-kind=note]{border:1px solid var(--aster-rule);border-left:3px solid var(--aster-caution);background:color-mix(in oklch,var(--aster-caution) 6%,transparent);padding:12px;border-radius:6px}
  .ac-entry[data-kind=event]{font-size:11px;color:var(--aster-text-2);padding:8px 12px;border-left:2px solid var(--aster-rule)}
  .ac-entry[data-kind=event] .ac-body{font-size:11px}
  .ac-badge{font-size:9px;border:1px solid var(--aster-rule);padding:2px 6px;border-radius:4px;color:var(--aster-text-2)}
  .ac-entry-actions{display:flex;gap:8px 18px;flex-wrap:wrap;margin-top:6px}
  .ac-entry-actions button{padding:4px 0;color:var(--aster-accent);font-size:10px;min-height:28px}
  .ac-edge{text-align:center;padding:0 0 18px;color:var(--aster-text-2)}
  .ac-edge button{border:1px solid var(--aster-rule);border-radius:6px;padding:7px 12px;background:var(--aster-sunk);font-size:10px}
  .ac-edge button:disabled{border-color:transparent;background:transparent;cursor:default}
  .ac-composer{margin:0 16px 14px;border:1px solid var(--aster-rule);border-radius:8px;padding:11px 13px;flex:none;background:var(--aster-surface)}
  .ac-composer label{display:block;font-size:10px;font-weight:600;color:var(--aster-text-2)}
  .ac-composer textarea{display:block;width:100%;border:0;resize:vertical;min-height:52px;max-height:160px;background:transparent;padding:6px 0;margin:6px 0;font-size:12px;color:var(--aster-text);line-height:1.6;field-sizing:content}
  .ac-composer footer{display:flex;justify-content:space-between;align-items:center;gap:12px}
  .ac-composer footer>span{font-size:9px;color:var(--aster-text-2)}
  .ac-composer button[type=submit]{font-size:11px;white-space:nowrap;background:var(--aster-accent);color:var(--aster-on-accent);padding:7px 12px;border-radius:5px;min-height:32px}
  .ac-composer button:disabled{opacity:.5}
  .ac-feedback{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:3px 18px;min-height:44px;font-size:10px;color:var(--aster-text-2)}
  .ac-feedback button{color:var(--aster-accent);padding:4px 0}
  .ac-error{color:var(--aster-negative);font-size:11px;margin:9px 0 0}
  .ac-selection{display:flex;align-items:center;gap:10px;padding:0;margin-left:auto;font-size:10px;flex-wrap:wrap}
  .ac-selection span{color:var(--aster-text-2)}
  .ac-selection button{color:var(--aster-accent);padding:5px 0}
  .ac-selection button:last-child{margin-left:auto;min-width:24px}
  .ac-reader-feedback{font-size:11px;color:var(--aster-negative);padding-inline:16px}
  .ac-empty{font-size:12px;color:var(--aster-text-2);padding:20px}
  .ac-sr{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
  .ac-email{border:1px solid var(--aster-rule);border-radius:7px;padding:15px;max-width:78ch;background:var(--aster-surface);font-size:12px;line-height:1.75}
  .ac-email p{white-space:pre-wrap;margin:0}
  .ac-email details{border-top:1px solid var(--aster-rule);margin-top:12px;padding-top:9px;color:var(--aster-text-2);font-size:11px}
  .ac-focus-dialog{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:var(--aster-surface);color:var(--aster-text)}
  .ac-focus-dialog[open]{display:flex;flex-direction:column}
  .ac-focus-dialog::backdrop{background:var(--aster-scrim)}
  .ac-focus-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:20px;padding:18px 28px;border-bottom:1px solid var(--aster-rule);flex:none}
  .ac-focus-toolbar h2{font-size:20px;margin:0;overflow-wrap:anywhere}
  .ac-focus-toolbar>div:first-child{min-width:0}
  .ac-focus-actions{display:contents}
  .ac-focus-actions aster-command-bar{grid-column:2;grid-row:1;min-width:0}
  .ac-reader-close{grid-column:3;grid-row:1;width:38px;height:38px;display:grid;place-items:center;font-size:26px;color:var(--aster-text-2)}
  .ac-focus-body{flex:1;min-height:0;display:flex;flex-direction:column;max-width:100ch;width:100%;margin-inline:auto}
  .ac-reader-pane{flex:1}
  .ac-reader-pane>.ac-pane-header{display:none}
  .ac-reader-pane .ac-body{font-size:16px;line-height:1.8}
  .ac-reader-pane .ac-entry strong{font-size:13px}
  .ac-reader-pane .ac-entry time{font-size:11px}
  .ac-reader-pane .ac-email{font-size:16px}
  .ac-focus-footer{padding:10px 24px;border-top:1px solid var(--aster-rule);font-size:11px;color:var(--aster-text-2);flex:none;text-align:center}
  @media(max-width:760px){
    .ac-reader[data-context]{grid-template-columns:minmax(0,1fr)}
    .ac-reader[data-context]>.ac-main{display:none}
    .ac-context{border-left:0}
    .ac-scroll{padding-inline:16px}
    .ac-pane-header{padding:16px}
    .ac-focus-toolbar{padding:12px;gap:10px;grid-template-columns:minmax(0,1fr) auto}
    .ac-focus-toolbar h2{font-size:17px}
    .ac-focus-actions aster-command-bar{grid-column:1 / -1;grid-row:2}
    .ac-reader-close{grid-column:2}
    .ac-reader-close,.ac-focus-launch{width:44px;height:44px}
    .ac-composer{margin-inline:10px}
    .ac-composer textarea{font-size:16px;min-height:48px}
    .ac-composer footer>span{max-width:130px}
    .ac-tools button,.ac-entry-actions button,.ac-return button:first-child,.ac-edge button,.ac-feedback button,.ac-selection button{min-height:44px}
  }
  @media(prefers-reduced-motion:reduce){aster-conversation-reader *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
  @media(forced-colors:active){.ac-entry[data-kind=note],.ac-badge,.ac-composer,.ac-selection{border:1px solid CanvasText}.ac-composer button{border:1px solid ButtonText}}
}

@layer aster.elements {
  /* Match InfoModel's floating row controls without changing reading geometry on hover. */
  .ac-message-controls { position: absolute; inset-block-start: 0; inset-inline-end: 0; z-index: 1; display: flex; gap: 2px; padding: 2px; border-radius: var(--aster-r-ctl); background: var(--aster-surface); box-shadow: var(--aster-e2); }
  .ac-entry[data-kind=note]>.ac-message-controls { inset-block-start: 8px; inset-inline-end: 8px; }
  .ac-message-controls button { display: grid; place-items: center; width: var(--aster-ctl-tight); height: calc(var(--aster-ctl-tight) - 2px); padding: 0; border-radius: var(--aster-r-ctl); color: var(--aster-text-2); }
  .ac-message-controls button:hover { background: var(--aster-accent-soft); color: var(--aster-text); }
  .ac-message-controls button:active { background: oklch(from var(--aster-accent) l c h / .18); }
  .ac-message-controls button:focus-visible { outline: 2px solid var(--aster-focus); outline-offset: -2px; }
  .ac-message-controls svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
  @media (hover: hover) and (pointer: fine) {
    .ac-message-controls { opacity: 0; pointer-events: none; transition: opacity var(--aster-t-micro); }
    .ac-entry:is(:hover, :focus-within)>.ac-message-controls { opacity: 1; pointer-events: auto; }
  }
  @media (hover: none), (pointer: coarse) {
    .ac-entry>header { min-height: 48px; padding-inline-end: 100px; }
    .ac-message-controls button { width: 44px; height: 44px; }
  }
}
@media (prefers-reduced-motion: reduce) {
  .ac-message-controls { transition: none !important; }
}
@media (forced-colors: active) {
  .ac-message-controls { border: 1px solid ButtonText; }
}

@layer aster.preview {
  aster-contextual-hierarchy { display:block; min-width:0; min-height:0; }
  .aster-hierarchy { display:flex; flex-direction:column; min-height:0; height:100%; }
  .aster-hierarchy > nav { display:flex; flex-wrap:wrap; align-items:center; gap:var(--aster-gap); padding:8px var(--aster-pad); border-block-end:1px solid var(--aster-rule); }
  .aster-hierarchy > nav button { color:var(--aster-accent); min-height:var(--aster-ctl); }
  .aster-hierarchy > nav span { color:var(--aster-text-2); font-size:12px; overflow-wrap:anywhere; }
  .aster-hierarchy-level { min-height:0; overflow:auto; padding:var(--aster-pad); }
  .aster-hierarchy-level[hidden] { display:none; }
  .aster-hierarchy[data-motion=slide] { overflow:hidden; --hierarchy-entry:16px; }
  .aster-hierarchy[data-motion=slide][data-direction=back] { --hierarchy-entry:-16px; }
  .aster-hierarchy:dir(rtl) { --hierarchy-sign:-1; }
  .aster-hierarchy[data-motion=slide] > .aster-hierarchy-level:not([hidden]) { animation:aster-hierarchy-enter 180ms var(--aster-ease); }
  @keyframes aster-hierarchy-enter { from { opacity:.6; transform:translateX(calc(var(--hierarchy-entry) * var(--hierarchy-sign,1))); } to { opacity:1; transform:translateX(0); } }
  @media(prefers-reduced-motion:reduce) { .aster-hierarchy[data-motion=slide] > .aster-hierarchy-level:not([hidden]) { animation:none; } }
  .aster-hierarchy-level > header { display:flex; align-items:start; justify-content:space-between; gap:var(--aster-gap); margin-block-end:var(--aster-gap); }
  .aster-hierarchy-level h3 { margin:0; font-size:18px; }
  .aster-hierarchy-level header p { margin:6px 0 0; color:var(--aster-text-2); }
  @media(pointer:coarse) { .aster-hierarchy > nav button { min-height:44px; } }
}