/* Presentational components only. No page routing, art, sensors or World media. */
.ui-root, .ui-root * { box-sizing: border-box; }
.ui-root [hidden] { display: none !important; }
.ui-root :where(button, input, textarea) { font: inherit; }
.ui-root :where(button, input, textarea, [tabindex]):focus-visible {
  outline: .125rem solid var(--ui-focus);
  outline-offset: .125rem;
}
.ui-root :where(h1, h2, h3, h4, h5, h6, p) { margin: 0; }
.ui-root .ui-title { color: var(--ui-heading); font-family: var(--ui-display-font); font-size: var(--ui-title-size); line-height: var(--ui-title-line); font-weight: 700; overflow-wrap: anywhere; }
.ui-root .ui-section-title { color: var(--ui-heading); font-family: var(--ui-display-font); font-size: var(--ui-section-size); line-height: var(--ui-section-line); font-weight: 700; overflow-wrap: anywhere; }
.ui-root.ui-stack, .ui-root .ui-stack { display: flex; flex-direction: column; gap: var(--ui-space-3); min-width: 0; }
.ui-root.ui-actions, .ui-root .ui-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-space-2); min-width: 0; }
.ui-root .ui-button {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--ui-space-2);
  min-width: var(--ui-target-min); min-height: var(--ui-action-min); max-width: 100%;
  padding: var(--ui-space-3) var(--ui-space-4); border: 1px solid transparent;
  border-radius: var(--ui-radius-pill-action); background: var(--ui-primary); color: var(--ui-on-primary);
  line-height: var(--ui-body-line); font-weight: 600; text-align: center; white-space: normal;
  overflow-wrap: anywhere; cursor: pointer; touch-action: manipulation;
}
.ui-root .ui-button__label { min-width: 0; }
.ui-root .ui-button:hover { background: var(--ui-primary-hover); }
.ui-root .ui-button:active { background: var(--ui-primary-pressed); }
.ui-root .ui-button[data-variant="primary"] { border: 2px solid #d1d7aa; background: linear-gradient(180deg, #91aa73 0%, #6f935b 10%, #4b7545 24%, #2d674b 100%); box-shadow: inset 0 1px 2px rgb(255 255 244 / .7), inset 0 0 0 1px rgb(246 238 183 / .35), 0 2px 4px rgb(67 79 44 / .12); }
.ui-root .ui-button[data-variant="primary"]:where(:not(:disabled, [aria-disabled="true"])):hover { background: linear-gradient(rgb(255 255 255 / .08), transparent 45%, rgb(0 0 0 / .08)), var(--ui-primary-hover); }
.ui-root .ui-button[data-variant="primary"]:where(:not(:disabled, [aria-disabled="true"])):active { background: var(--ui-primary-pressed); box-shadow: inset 0 1px 3px rgb(20 40 25 / .22); }
.ui-root .ui-button[data-variant="secondary"] { background: linear-gradient(#fffefa, #fbfcf5); color: var(--ui-text); border-color: #dbe1ce; box-shadow: 0 1px 3px rgb(77 92 56 / .06); }
.ui-root .ui-button:where([data-variant="quiet"]) { background: transparent; color: var(--ui-text); }
.ui-root .ui-button:is([data-variant="secondary"], [data-variant="quiet"]):hover { background: var(--ui-selection); }
.ui-root .ui-button:disabled, .ui-root .ui-button[aria-disabled="true"] { background: var(--ui-disabled-fill); color: var(--ui-disabled-text); border-color: var(--ui-border); box-shadow: none; cursor: default; }
.ui-root .ui-button[aria-busy="true"] { cursor: progress; }
.ui-root .ui-button__busy { width: .75rem; height: .75rem; flex: 0 0 auto; border: .125rem solid currentColor; border-radius: 50%; border-inline-end-color: transparent; }
/* Only unadorned native text pills participate. Prepended glyphs and nested
 * card labels have their own geometry; quiet controls keep their current role.
 * The small indicator fits existing >=12px inline padding: 8px ring, 2px edge,
 * >=2px text clearance. Recovery-dialog text pills reserve that space in both
 * states. Other compact Chat controls keep their existing 8px padding/flow. */
@media (height > 640px) {
  .ui-root .ui-button:where([data-variant="primary"], [data-variant="secondary"]):where(:has(> .ui-button__label:first-child + .ui-button__busy:last-child)) { position: relative; }
  .ui-root .ui-button:where([data-variant="primary"], [data-variant="secondary"]):where(:has(> .ui-button__label:first-child + .ui-button__busy:last-child)) > .ui-button__busy {
    position: absolute; inset-inline-end: 2px; top: 50%; transform: translateY(-50%);
    width: var(--ui-pill-indicator-size); height: var(--ui-pill-indicator-size); border-width: 1px;
  }
}
@media (height <= 640px) {
  .ui-root .ui-button:where([data-variant="primary"], [data-variant="secondary"]):where(:has(> .ui-button__label:first-child + .ui-button__busy:last-child)):where(:not(.ui-chat .ui-button), .ui-chat .ui-chat__recovery .ui-dialog__actions > .ui-button) { position: relative; }
  .ui-root .ui-button:where([data-variant="primary"], [data-variant="secondary"]):where(:has(> .ui-button__label:first-child + .ui-button__busy:last-child)):where(:not(.ui-chat .ui-button), .ui-chat .ui-chat__recovery .ui-dialog__actions > .ui-button) > .ui-button__busy {
    position: absolute; inset-inline-end: 2px; top: 50%; transform: translateY(-50%);
    width: var(--ui-pill-indicator-size); height: var(--ui-pill-indicator-size); border-width: 1px;
  }
}
.ui-root .ui-card { min-width: 0; padding: var(--ui-space-4); border: 1px solid var(--ui-border); border-radius: var(--ui-radius-outer-card); background: var(--ui-raised); box-shadow: var(--ui-shadow); }
.ui-root .ui-card__body, .ui-root .ui-card__footer { min-width: 0; overflow-wrap: anywhere; }
.ui-root .ui-card[data-tone="error"] { border-color: var(--ui-danger); }
.ui-root .ui-card[data-tone="selected"] { border-color: var(--ui-control-border); background: var(--ui-selection); }
.ui-root .ui-field { display: flex; flex-direction: column; gap: var(--ui-space-2); min-width: 0; }
.ui-root .ui-field__label { color: var(--ui-heading); font-weight: 600; overflow-wrap: anywhere; }
.ui-root .ui-field__control { display: block; width: 100%; min-width: 0; min-height: var(--ui-action-min); padding: var(--ui-space-3); border: 1px solid var(--ui-control-border); border-radius: var(--ui-radius-field); background: var(--ui-raised); color: var(--ui-text); }
.ui-root textarea.ui-field__control { resize: vertical; }
.ui-root .ui-field__control::placeholder { color: var(--ui-secondary); opacity: 1; }
.ui-root .ui-field__control:disabled { color: var(--ui-disabled-text); background: var(--ui-disabled-fill); }
.ui-root .ui-field__control[aria-invalid="true"] { border-color: var(--ui-danger); }
.ui-root .ui-field__hint, .ui-root .ui-field__error { font-size: var(--ui-secondary-size); line-height: var(--ui-secondary-line); overflow-wrap: anywhere; }
.ui-root .ui-field__hint { color: var(--ui-secondary); }
.ui-root .ui-field__error { color: var(--ui-danger); }
.ui-root .ui-status { overflow-wrap: anywhere; color: var(--ui-secondary); }
.ui-root .ui-status[data-tone="error"] { color: var(--ui-danger); }
.ui-root .ui-status[data-tone="success"] { color: var(--ui-success); }
.ui-root .ui-feedback { min-width: 0; padding: var(--ui-space-4); border-radius: var(--ui-radius-card); border: 1px solid var(--ui-border); background: var(--ui-surface); overflow-wrap: anywhere; }
.ui-root .ui-feedback[data-kind="error"] { background: var(--ui-danger-fill); border-color: var(--ui-danger); }
.ui-root .ui-dialog {
  width: min(35rem, calc(100% - 1.5rem)); max-width: none;
  max-height: calc(100vh - 1.5rem); max-height: calc(100dvh - 1.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  /* 手机全屏时避开刘海/状态栏和底部横条：在安全区里居中（网页版安全区为 0，不受影响） */
  inset-block: env(safe-area-inset-top, 0px) env(safe-area-inset-bottom, 0px);
  margin: auto; padding: 0; border: 1px solid var(--ui-control-border); border-radius: var(--ui-radius-card);
  background: var(--ui-raised); color: var(--ui-text); overflow: auto; overscroll-behavior: contain;
  max-inline-size: calc(var(--ui-frame-max) - 24px);
}
.ui-root .ui-dialog::backdrop { background: rgb(24 42 28 / .42); }
.ui-root .ui-dialog[data-dialog-motion="enter"]::backdrop { animation: ui-dialog-shade-in 280ms cubic-bezier(.2, 0, 0, 1) both; }
.ui-root .ui-dialog[data-dialog-motion="automatic-enter"]::backdrop { animation: ui-dialog-shade-in 160ms cubic-bezier(.2, 0, 0, 1) both; }
@keyframes ui-dialog-shade-in { from { background: transparent; } to { background: rgb(24 42 28 / .42); } }
.ui-root .ui-dialog-retirement {
  position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none;
  margin: 0; padding: 0; border: 0; overflow: hidden; pointer-events: none;
}
.ui-root .ui-dialog-retirement::backdrop { background: transparent; pointer-events: none; }
.ui-root .ui-dialog-retirement, .ui-root .ui-dialog-retirement * { pointer-events: none !important; }
.ui-root .ui-dialog__form { display: flex; flex-direction: column; min-height: 0; }
.ui-root .ui-dialog__header { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--ui-space-2); padding: var(--ui-space-4); flex-shrink: 0; }
.ui-root .ui-dialog__title { flex: 1 1 10rem; align-self: center; }
.ui-root .ui-dialog__body { min-height: 0; padding: .125rem var(--ui-space-4) var(--ui-space-4); }
.ui-root .ui-dialog__actions { padding: var(--ui-space-4); flex-shrink: 0; border-top: 1px solid var(--ui-border); }
.ui-root .ui-dialog__actions > .ui-status { flex-basis: 100%; }
@media (max-width: 359px) {
  .ui-root .ui-card { padding: var(--ui-space-3); }
  .ui-root .ui-actions > .ui-button { flex: 1 1 100%; }
}
/* One modal scrollport: fixed header/footer rows can consume the entire viewport
 * at enlarged text. Native focus scrolling keeps every action and field reachable. */
@media (forced-colors: active) {
  .ui-root .ui-button, .ui-root .ui-card, .ui-root .ui-feedback, .ui-root .ui-dialog, .ui-root .ui-field__control { border-color: CanvasText; }
  .ui-root .ui-button:focus-visible, .ui-root .ui-field__control:focus-visible { outline-color: Highlight; }
  .ui-root .ui-button:disabled, .ui-root .ui-button[aria-disabled="true"] { color: GrayText; border-color: GrayText; }
}
