/* IU One overview and its persistent application entry. */
#iuone-sidebar > .iuone-app-center-nav {
  flex: none;
  margin-bottom: 7px;
  min-height: 54px;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--card);
  color: var(--ink);
  text-align: start;
  text-decoration: none;
}
.iuone-app-center-nav .app-center-glyph {
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  padding: 6px;
  border-radius: 9px;
  background: color-mix(in srgb, var(--accent) 12%, var(--card));
  color: var(--accent);
  opacity: 1;
}
.iuone-app-center-nav b, .iuone-app-center-nav small { display: block; }
.iuone-app-center-nav b { font-size: 14px; }
.iuone-app-center-nav small { margin-top: 2px; font-size: 11px; color: var(--muted); }
#iuone-sidebar > .iuone-app-center-nav:hover { border-color: var(--accent); }

#iuone-landing > .hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-template-columns: minmax(0, 3fr) minmax(175px, 2fr);
  min-height: 0;
  margin: 20px 0 16px;
  padding: 18px clamp(18px, 2.4vw, 40px);
  gap: 12px;
  border: 1px solid color-mix(in srgb, var(--accent) 16%, var(--line));
  border-radius: 18px;
  background: radial-gradient(ellipse at 83% 70%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 56%), var(--card);
}
#iuone-landing > .hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 0 42%;
  background: radial-gradient(circle, var(--accent) .8px, transparent 1px) 0 0 / 16px 16px;
  mask-image: linear-gradient(95deg, transparent, black);
  opacity: .19;
}
#iuone-landing .hero h1 {
  margin: 0;
  font-size: clamp(27px, 2.45vw, 42px);
  line-height: 1.26;
  letter-spacing: -.035em;
}
#iuone-landing .hero-copy > p { margin: 10px 0 14px; font-size: 13px; line-height: 1.65; }
#iuone-landing .hero-art { height: 198px; --avatar-visible-height: 154px; --avatar-baseline: 28px; }
.hero-companions, .iuone-manage-actions, .iuone-current-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.hero-companions .pet-toggle {
  min-height: 32px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--ink);
}
.hero-companions .pet-toggle:hover,
.hero-companions .pet-toggle[aria-pressed="true"] { border-color: var(--accent); }

#iuone-home-agent-panel, #iuone-landing .iuone-groups-panel {
  box-sizing: border-box;
  padding: clamp(16px, 1.6vw, 26px);
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
}
#iuone-home-agent-panel .iuone-home-agent-head, #iuone-landing .iuone-groups-head {
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
#iuone-home-agent-panel h3, #iuone-landing .iuone-groups-head h3 { margin: 0 0 4px; font-size: 20px; }
#iuone-home-agent-panel .iuone-home-agent-head p, #iuone-landing .iuone-groups-head p {
  display: block;
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--muted);
}
.iuone-manage-actions .soft-button, .iuone-current-actions .soft-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; text-decoration: none; }
#iuone-home-agent-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 154px), 1fr));
  gap: 8px;
  margin-top: 16px;
  padding: 3px;
}
#iuone-home-agent-list .iuone-agent-chip {
  position: relative;
  min-width: 0;
  width: 100%;
  max-width: none;
  padding: 9px 26px 9px 12px;
  border-radius: 10px;
  font-size: 13px;
  color: var(--ink);
}
#iuone-home-agent-list .iuone-agent-chip small { font-size: 12px; }
html[data-theme="dark"] #iuone-home-agent-list .iuone-butler-chip small { color: #d9c697; }
#iuone-home-agent-list .iuone-agent-chip.active { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, var(--card)); }
#iuone-home-agent-list .iuone-agent-chip.active::after {
  content: "";
  position: absolute;
  inset-inline-end: 12px;
  top: 50%;
  width: 8px;
  height: 4px;
  border: solid var(--accent);
  border-width: 0 0 2px 2px;
  transform: translateY(-65%) rotate(-45deg);
}
#iuone-current-agent:not([hidden]) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
#iuone-identity-summary {
  display: block;
  flex: 1 1 220px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  overflow-wrap: anywhere;
}
#iuone-identity-summary p { margin: 4px 0 0; max-width: none; text-align: start; color: var(--muted); opacity: 1; }
#iuone-open-agent-workbench { background: var(--accent); color: var(--bg); border-color: transparent; font-weight: 700; }
#iuone-open-agent-workbench svg { width: 15px; height: 15px; }
#iuone-landing :is(button,a):focus-visible, .iuone-app-center-nav:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#iuone-landing .iuone-groups-list { gap: 12px; }
@media (max-width: 700px) {
  #iuone-landing > .hero { grid-template-columns: minmax(0,1fr) 72px; gap: 4px; margin: 12px 0; padding: 16px 12px; }
  #iuone-landing .hero h1 { font-size: clamp(22px, 5vw, 28px); }
  #iuone-landing .hero-art { height: 110px; --avatar-visible-height: 78px; --avatar-baseline: 10px; }
  #iuone-landing .hero-art .iuone-hero-role-anim { display: block; }
  #iuone-landing .hero-ant { width: 66px; height: 66px; }
  #iuone-landing .hero-copy > p { font-size: 12px; }
  #iuone-home-agent-panel, #iuone-landing .iuone-groups-panel { margin-inline: 0; padding: 14px; }
  #iuone-home-agent-list { grid-template-columns: none; grid-template-rows: auto auto; grid-auto-flow: column; grid-auto-columns: minmax(124px, 44%); overflow-x: auto; scrollbar-width: thin; }
  #iuone-home-agent-list .iuone-agent-chip { min-height: 48px; }
  .iuone-current-actions, .iuone-manage-actions { gap: 6px; }
  .iuone-manage-actions .soft-button, .iuone-current-actions .soft-button { min-height: 44px; }
  #iuone-current-agent .iuone-current-actions { width: 100%; }
  #iuone-current-agent #iuone-open-agent-workbench { flex: 1; }
  #iuone-landing .iuone-groups-list { grid-template-columns: 1fr; }
}