diff --git a/frontend/packages/agent/src/agent.css b/frontend/packages/agent/src/agent.css
index 4328ac1..cd91696 100644
--- a/frontend/packages/agent/src/agent.css
+++ b/frontend/packages/agent/src/agent.css
@@ -140,15 +140,16 @@ h2, h3 {
text-shadow: 0 0 8px rgba(203, 166, 247, 0.4);
}
.agent-icon {
- /* Full-height square identity anchor (#394 — mara's spec). The
- `align-items: stretch` on .agent-header stretches the icon's
- `
` box; `aspect-ratio: 1` keeps it square; `height: 100%`
- makes it follow the header's actual height through resizes /
- wrap. width:auto + aspect-ratio derives the width from height. */
- height: 100%;
- width: auto;
- aspect-ratio: 1;
+ /* Square identity anchor (#394 — mara's spec). Explicit em sizing
+ so the
's intrinsic (large) dimensions don't push the
+ parent flex container open via `align-items: stretch`-driven
+ height feedback. Width = header content area (header min-h 6em
+ - 2 × 0.5em padding ≈ 5em). Sticks to the top so a state-row
+ wrap doesn't drag the icon down with it. (#411) */
+ width: 5em;
+ height: 5em;
flex-shrink: 0;
+ align-self: flex-start;
border-radius: 8px;
box-shadow: 0 0 18px -2px rgba(203, 166, 247, 0.4);
object-fit: cover;
@@ -201,7 +202,16 @@ h2, h3 {
/* Overflow popover — rebuild + new-session (and the dashboard
back-link, prepended in app.js setHeader). Positioned in JS so
- the menu's top-right corner anchors under the trigger button. */
+ the menu's top-right corner anchors under the trigger button.
+ `:not([hidden])` scoping (#411): the `[hidden]` HTML attribute
+ sets `display: none` via the UA stylesheet, but author CSS's
+ `display: flex` would override that. Scope display rules so
+ they apply only when the menu is unhidden. */
+.overflow-menu:not([hidden]) {
+ display: flex;
+ flex-direction: column;
+ gap: 0.15em;
+}
.overflow-menu {
position: fixed;
background: var(--agent-frost-bg);
@@ -210,9 +220,6 @@ h2, h3 {
border: 1px solid var(--purple-dim);
border-radius: 6px;
padding: 0.35em;
- display: flex;
- flex-direction: column;
- gap: 0.15em;
z-index: 40;
box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45);
min-width: 14em;