/* Owned page styles; no global theme, root-font, shell or World mutations. */
.ui-preferences { min-inline-size:0; padding-block-end:var(--ui-space-6); }
.ui-preferences .ui-button { min-block-size:max(44px,var(--ui-action-min)); }
.ui-preferences p { overflow-wrap:anywhere; }
.ui-preferences__list { display:grid; gap:var(--ui-space-2); container:preferences-list / inline-size; }
.ui-preferences__row.ui-button { inline-size:100%; min-block-size:3.25rem; display:flex; justify-content:flex-start; gap:var(--ui-space-3); text-align:start; padding:var(--ui-space-4); border:1px solid var(--ui-border); background:var(--ui-raised); border-radius:var(--ui-radius-card); }
.ui-preferences__row-copy { display:grid; flex:1; min-inline-size:0; gap:.25rem; }
.ui-preferences__row-summary { font-size:var(--ui-secondary-size); font-weight:400; color:var(--ui-secondary); line-height:var(--ui-secondary-line); text-wrap:balance; }
.ui-preferences__glyph { display:inline-block; inline-size:1.5rem; block-size:1.5rem; flex-shrink:0; background:currentColor; }
.ui-preferences__font-glyph { inline-size:1.5rem; flex-shrink:0; font-size:1rem; }
/* Text keeps the saved user scale. Decorative allocation yields when the
 * component has fewer than 20 text ems, without changing the wide layout. */
@container preferences-list (max-width:20em) {
  .ui-preferences__row.ui-button { gap:8px; padding:12px; }
  .ui-preferences__row > .ui-preferences__glyph { inline-size:24px; block-size:24px; }
  .ui-preferences__row > .ui-preferences__glyph:last-child { inline-size:16px; block-size:16px; }
  .ui-preferences__row > .ui-preferences__font-glyph { inline-size:24px; font-size:min(1rem,18px); line-height:1; white-space:nowrap; align-self:center; }
}
.ui-preferences__actions { display:flex; flex-wrap:wrap; gap:var(--ui-space-3); }
.ui-preferences__actions .ui-button { min-inline-size:0; flex:0 1 auto; max-inline-size:100%; }
.ui-preferences__actions .ui-button__label { text-wrap:balance; overflow-wrap:anywhere; }
.ui-preferences__form { min-inline-size:0; }
.ui-preferences__choices { border:1px solid var(--ui-border); border-radius:var(--ui-radius-card); margin:0; min-inline-size:0; padding:var(--ui-space-3); display:grid; gap:var(--ui-space-2); background:var(--ui-raised); }
.ui-preferences__legend { padding-inline:var(--ui-space-2); font-weight:600; }
.ui-preferences__choice { display:flex; align-items:center; min-block-size:max(44px,2.75rem); gap:var(--ui-space-3); padding:.25rem; overflow-wrap:anywhere; }
.ui-preferences__choice input { inline-size:1.25rem; block-size:1.25rem; accent-color:var(--ui-primary); flex-shrink:0; }
.ui-preferences__choice span { min-inline-size:0; }
.ui-preferences__type-preview { padding:var(--ui-space-4); border:1px solid var(--ui-border); border-radius:var(--ui-radius-card); background:var(--ui-raised); line-height:1.5; text-wrap:balance; }
.ui-preferences__help { padding:var(--ui-space-4); border:1px solid var(--ui-border); border-radius:var(--ui-radius-card); background:var(--ui-raised); }
/* Missing-host Help keeps the chosen text scale; its card inset yields when
 * the reading column is narrow, just like the Settings overview rows. */
.ui-preferences:has(> .ui-preferences__help) { container:preferences-help / inline-size; }
@container preferences-help (max-width:20em) {
  .ui-preferences__help { padding:12px; }
  .ui-preferences__help > .ui-section-title { text-wrap:balance; }
}
/* FINAL Settings is one scrolling paper page. Only its overview rows use this
 * treatment; native detail forms keep their existing presentation and motion. */
.ui-root .ui-preferences.ui-preferences--settings { --ui-settings-edge:max(12px,env(safe-area-inset-left)); position:relative; overflow:clip; display:block; inline-size:calc(100% + 2 * var(--ui-settings-edge)); max-inline-size:none; margin-inline:calc(-1 * var(--ui-settings-edge)); padding:.75rem var(--ui-settings-edge) 0; }
.ui-preferences--settings .ui-preferences__content { display:grid; gap:0; transform-origin:center bottom; }
/* Search shares the page's continuous paper field. Only the input and native
 * actions have surfaces; results keep the existing row component and scale. */
.ui-settings-search { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 12px; margin-block:0 1rem; min-inline-size:0; }
.ui-settings-search .ui-field { min-inline-size:0; }
.ui-settings-search .ui-field__label { color:var(--ui-text); font-weight:600; }
.ui-settings-search .ui-field__control { inline-size:100%; min-inline-size:0; min-block-size:48px; border-radius:1rem; color:var(--ui-text); background:var(--ui-raised); }
.ui-settings-search .ui-field__hint { color:var(--ui-secondary); line-height:1.45; }
.ui-settings-search__actions { display:flex; flex-wrap:wrap; align-content:center; gap:8px; }
.ui-settings-search__actions .ui-button { min-inline-size:44px; min-block-size:44px; }
.ui-settings-search > .ui-status { grid-column:1 / -1; margin:0; color:var(--ui-secondary); }
.ui-settings-search .ui-field__control:focus-visible { outline:2px solid var(--ui-primary); outline-offset:2px; }
.ui-root [data-setting-search-target]:focus { outline:2px solid var(--ui-primary); outline-offset:3px; }
@media (max-width:440px) {
  .ui-settings-search { grid-template-columns:minmax(0,1fr); }
  .ui-settings-search__actions { justify-content:flex-end; }
}
@media (forced-colors:active) {
  .ui-settings-search .ui-field__control { color:CanvasText; background:Canvas; border-color:ButtonText; }
  .ui-settings-search .ui-field__label,.ui-settings-search .ui-field__hint,.ui-settings-search > .ui-status { color:CanvasText; }
  .ui-root [data-setting-search-target]:focus { outline-color:Highlight; }
}
.ui-preferences__accessible-heading { position:absolute; inline-size:1px; block-size:1px; margin:-1px; padding:0; border:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.ui-preferences--settings .ui-preferences__list { gap:.625rem; }
.ui-preferences--settings .ui-preferences__row.ui-button { min-block-size:6rem; gap:1.125rem; padding:1rem 1.125rem; border-color:#ebe5d7; border-radius:1rem; color:#19493f; background-color:#fffefa; box-shadow:0 2px 7px rgb(105 90 54 / .045),inset 0 0 0 1px rgb(255 255 255 / .7); }
.ui-preferences--settings .ui-preferences__row-copy { gap:.375rem; }
.ui-preferences--settings .ui-preferences__row .ui-button__label { font-family:'Times New Roman','Noto Serif CJK SC','Songti SC',SimSun,serif; font-size:1.375rem; font-weight:700; line-height:1.2; text-wrap:pretty; }
.ui-preferences--settings .ui-preferences__row-summary { font-family:'Times New Roman','Noto Serif CJK SC','Songti SC',SimSun,serif; font-size:1rem; color:#365b52; line-height:1.35; text-wrap:pretty; }
.ui-preferences--settings .ui-preferences__row > .ui-preferences__glyph { inline-size:2.25rem; block-size:2.25rem; }
.ui-preferences--settings .ui-preferences__row > .ui-preferences__glyph:last-child { inline-size:1.125rem; block-size:1.5rem; color:#52716a; }
.ui-preferences--settings .ui-preferences__font-glyph { inline-size:2.25rem; font-size:2rem; font-family:Georgia,serif; font-weight:400; line-height:1; white-space:nowrap; }
.ui-preferences--settings .ui-preferences__actions:not(:has(> :not([hidden]))) { display:none; }
.ui-preferences__closing { position:relative; isolation:isolate; overflow:clip; display:grid; justify-items:center; padding:0 12px; text-align:center; }
/* Only the closing art reaches the paper edge. Equal page padding preserves
 * every native search/row width, and the original vertical page clip remains. */
.ui-preferences--settings .ui-preferences__closing { inline-size:calc(100% + 2 * var(--ui-settings-edge)); margin-inline:calc(-1 * var(--ui-settings-edge)); }
/* The foliage owns a separate scrolling band. Its image frames cannot overlap
 * the native statement, including when saved text makes the statement taller. */
.ui-preferences__closing-art { position:relative; overflow:clip; inline-size:calc(100% + 24px); block-size:192px; }
.ui-preferences__motto { position:relative; margin:0; display:grid; gap:.25rem; min-inline-size:0; max-inline-size:100%; font-family:ui-serif,Georgia,'Noto Serif CJK SC','KaiTi',STKaiti,serif; font-size:1.5rem; line-height:1.55; color:#245648; text-wrap:balance; }
.ui-preferences__closing-note { position:relative; margin:0; max-inline-size:100%; font-family:ui-serif,Georgia,'Noto Serif CJK SC','Songti SC',SimSun,serif; font-size:.875rem; line-height:1.6; color:#648174; text-wrap:balance; }
.ui-preferences--settings .ui-preferences__reveal { position:absolute; box-sizing:border-box; inset-inline:0; inset-block-end:0; display:grid; align-content:start; gap:.75rem; padding:16px calc(12px + var(--ui-settings-edge)); overflow:auto; overscroll-behavior:contain; background:var(--ui-page); text-align:center; transform:translateY(100%); opacity:0; }
.ui-preferences--settings .ui-preferences__reveal[aria-hidden="true"] { pointer-events:none; }
.ui-preferences--settings[data-overscroll="settling"] .ui-preferences__content,
.ui-preferences--settings[data-overscroll="settling"] .ui-preferences__reveal { transition:transform 220ms ease-out,opacity 160ms ease-out; }
.ui-preferences--settings .ui-preferences__reveal-trigger { position:absolute; inset-block-end:8px; inset-inline-start:50%; transform:translateX(-50%); inline-size:1px; block-size:1px; padding:0; border:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.ui-preferences--settings .ui-preferences__reveal-trigger:focus { inline-size:max-content; max-inline-size:calc(100% - 24px - 2 * var(--ui-settings-edge)); block-size:auto; min-block-size:44px; padding:8px 12px; clip-path:none; white-space:normal; overflow:visible; border:1px solid var(--ui-primary); border-radius:var(--ui-radius-card); background:var(--ui-page); color:var(--ui-text); font:inherit; }
.ui-preferences--settings .ui-preferences__reveal:focus-visible,
.ui-preferences--settings .ui-preferences__reveal-trigger:focus-visible { outline:2px solid var(--ui-primary); outline-offset:-3px; }
@media (prefers-reduced-motion:reduce) {
  .ui-preferences--settings[data-overscroll="settling"] .ui-preferences__content,
  .ui-preferences--settings[data-overscroll="settling"] .ui-preferences__reveal { transition:none; }
}
.ui-root .ui-preferences__sprig { --ui-settings-sprig-size:min(176px,calc(50% - 12px)); position:absolute; inset-block-start:8px; inline-size:var(--ui-settings-sprig-size); aspect-ratio:1; pointer-events:none; user-select:none; }
.ui-root .ui-preferences__sprig > .ui-block-art__content { display:none; }
.ui-root .ui-preferences__sprig > .ui-block-art__visual { position:absolute; inset:0; inline-size:100%; block-size:100%; }
/* Compensate each intact master's visible alpha margin in its own square:
 * 194/1254 on the left, (1254-1008)/1254 on the right, plus 2px page bleed. */
.ui-root .ui-preferences__sprig--left { inset-inline-start:calc(-.154705 * var(--ui-settings-sprig-size) - 2px); }
.ui-root .ui-preferences__sprig--right { inset-inline-end:calc(-.196172 * var(--ui-settings-sprig-size) - 2px); }
/* The keyboard label can occupy the full width at enlarged text. Retire only
 * paint while it is focused; preserve the 192px gesture endpoint and focus. */
.ui-preferences__closing:has(.ui-preferences__reveal-trigger:focus) .ui-preferences__closing-art { visibility:hidden; }
/* Let decoration yield to saved text size, retaining full words and targets. */
@container preferences-list (max-width:18em) {
  .ui-preferences--settings .ui-preferences__row.ui-button { gap:8px; padding:12px; }
  .ui-preferences--settings .ui-preferences__row > .ui-preferences__glyph { inline-size:24px; block-size:24px; }
  .ui-preferences--settings .ui-preferences__row > .ui-preferences__glyph:last-child { inline-size:16px; block-size:20px; }
  .ui-preferences--settings .ui-preferences__font-glyph { inline-size:24px; font-size:24px; }
}
@container preferences-list (max-width:12em) {
  .ui-preferences--settings .ui-preferences__row.ui-button { display:grid; grid-template-columns:1fr auto; align-content:center; }
  .ui-preferences--settings .ui-preferences__row-copy { grid-column:1 / -1; grid-row:2; }
  .ui-preferences--settings .ui-preferences__row > .ui-preferences__glyph:last-child { grid-column:2; grid-row:1; }
}
.ui-shop { padding-block:12px 0; container:shop / inline-size; }
.ui-shop .ui-shop__intro { margin:0 0 8px; text-align:center; font-size:1rem; font-weight:400; line-height:1.5; color:var(--ui-text); text-wrap:balance; }
.ui-shop > .ui-preferences__actions:not(:has(> :not([hidden]))) { display:none; }
.ui-shop__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,9.25rem),1fr)); gap:10px 8px; }
.ui-shop .ui-shop__card.ui-button[data-variant="quiet"] { display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; min-inline-size:0; inline-size:100%; padding:7px 7px 12px; gap:0; border:1px solid #e8e4db; border-radius:13px; background:linear-gradient(145deg,rgb(255 255 255 / .95),rgb(255 254 250 / .92)); background-color:#fffefa; box-shadow:0 2px 8px rgb(65 58 39 / .035); color:#173f42; text-align:start; white-space:normal; }
.ui-shop .ui-shop__card.ui-button[data-variant="quiet"]:hover { border-color:#c7cebc; background-color:#fffefa; }
.ui-shop .ui-shop__card.ui-button[data-variant="quiet"]:active { background-color:#f4f6ed; }
.ui-shop .ui-shop__card.ui-button[data-variant="quiet"][data-active="true"] { border-color:#b7c6ac; box-shadow:inset 0 0 0 1px rgb(151 171 133 / .22),0 2px 8px rgb(65 58 39 / .035); }
.ui-root .ui-shop__card-art { inline-size:100%; gap:0; }
.ui-shop__copy { display:flex; flex-direction:column; }
.ui-shop__name { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:4px; margin:9px 2px 6px; }
.ui-shop__card .ui-button__label { color:#123f42; font-family:Georgia,"Songti SC","STSong","SimSun",serif; font-size:1.125rem; font-weight:700; line-height:1.4; text-align:start; text-wrap:pretty; overflow-wrap:anywhere; }
.ui-shop__chevron { display:block; inline-size:16px; block-size:24px; margin-block-start:.0625rem; background:#173b50; }
.ui-shop__description { margin-inline:2px; color:var(--ui-text); font-size:1rem; font-weight:400; line-height:1.5; overflow-wrap:anywhere; }
.ui-shop__picture { display:block; aspect-ratio:var(--ui-shop-image-ratio,2/3); overflow:hidden; border-radius:8px; background:#f1f3e8; }
.ui-shop__art { display:block; inline-size:100%; block-size:100%; object-fit:cover; object-position:center; transform:scale(var(--ui-shop-art-scale,1)); }
.ui-shop__badge { color:#536b5b; font-size:var(--ui-secondary-size); font-weight:400; line-height:var(--ui-secondary-line); overflow-wrap:anywhere; }
.ui-shop__card .ui-shop__badge { margin:8px 2px 0; padding-block-start:4px; }
.ui-shop__footer { --ui-shop-edge:max(12px,env(safe-area-inset-left)); position:relative; display:grid; place-items:center; min-block-size:104px; padding:24px 92px 24px 84px; isolation:isolate; overflow:visible; }
.ui-shop__footer-copy { position:relative; margin:0; min-inline-size:0; max-inline-size:100%; color:var(--ui-secondary); font-size:.875rem; line-height:1.5; text-align:center; text-wrap:balance; }
/* The existing 12px stack gap plus this 24px rise joins the final card's
 * empty lower border. The complete groups stay outside all native card copy. */
.ui-root .ui-shop__footer-art { position:absolute; inset-block-start:-24px; inline-size:min(var(--ui-shop-fringe-size),calc(50% - 8px)); aspect-ratio:1; pointer-events:none; user-select:none; }
.ui-root .ui-shop__footer-art > .ui-block-art__content { display:none; }
.ui-root .ui-shop__footer-art > .ui-block-art__visual { position:absolute; inset:0; inline-size:100%; block-size:100%; }
.ui-root .ui-shop__footer-art--left { --ui-shop-fringe-size:88px; inset-inline-start:calc(-1 * var(--ui-shop-edge)); }
.ui-root .ui-shop__footer-art--right { --ui-shop-fringe-size:104px; inset-inline-end:calc(-1 * var(--ui-shop-edge)); }
/* When text ems leave too little center space, the complete groups move below
 * full-width text. No font reduction or painted-over words makes them fit. */
@container shop (max-width:20rem) {
  .ui-shop__footer { min-block-size:140px; padding:24px 12px 144px; overflow:clip; }
  .ui-root .ui-shop__footer-art { inset-block-start:auto; inset-block-end:0; }
  .ui-root .ui-shop__footer-art--left { inset-inline-start:0; }
  .ui-root .ui-shop__footer-art--right { inset-inline-end:0; }
}
@media (forced-colors:active) {
  .ui-shop .ui-shop__card.ui-button[data-variant="quiet"] { border-color:ButtonText; background:Canvas; }
  .ui-shop__card .ui-button__label,.ui-shop__description,.ui-shop__badge,.ui-shop .ui-shop__intro,.ui-shop__footer-copy { color:CanvasText; }
  .ui-shop__chevron { background:ButtonText; }
  /* Keep the endpoint band for enlarged keyboard access; do not paint raster
     foliage in forced colors or collapse the band beneath a focused label. */
  .ui-preferences--settings .ui-preferences__closing-art { visibility:hidden; }
  .ui-preferences--settings .ui-preferences__reveal,
  .ui-preferences--settings .ui-preferences__reveal-trigger:focus { color:CanvasText; background:Canvas; }
}
.ui-shop-detail__article { display:grid; gap:24px; min-inline-size:0; }
.ui-shop-detail__figure { display:grid; gap:8px; margin:0; inline-size:min(100%,20rem); }
.ui-shop-detail__image, .ui-shop-detail__image > .ui-shop__picture { inline-size:100%; min-inline-size:0; }
.ui-shop-detail__caption { color:var(--ui-secondary); font-size:var(--ui-secondary-size); }
.ui-shop-detail__section { display:grid; gap:12px; min-inline-size:0; padding-block-start:20px; border-block-start:1px solid var(--ui-border); }
.ui-shop-detail__section-title { margin:0; color:var(--ui-heading); font-family:var(--ui-display-font); font-size:var(--ui-section-size); line-height:var(--ui-section-line); font-weight:600; }
.ui-shop-detail__section p, .ui-shop-detail__image-status { margin:0; overflow-wrap:anywhere; }
.ui-shop-detail__features { margin:0; padding-inline-start:1.25em; display:grid; gap:10px; overflow-wrap:anywhere; }
.ui-shop-detail__actions { display:flex; flex-wrap:wrap; gap:12px; align-items:start; }
.ui-shop-detail__actions > .ui-status { flex-basis:100%; margin:0; }
.ui-shop-detail__actions > .ui-status:empty { display:none; }
.ui-shop-detail__save-feedback { flex-basis:100%; min-width:0; }
.ui-shop-detail__save-feedback > .ui-status { margin:0 0 12px; }

/* One transient image/surface layer, clipped to the existing content viewport.
   Header, navigation, native copy, hit targets and page geometry stay intact. */
.ui-root .ui-shop-morph { position:absolute; inset:0; z-index:2; overflow:hidden; pointer-events:none; user-select:none; }
.ui-root .ui-shop-morph__surface,.ui-root .ui-shop-morph__image { position:absolute; box-sizing:border-box; pointer-events:none; }
.ui-root .ui-shop-morph__image { display:block; object-fit:cover; }
.ui-preferences [hidden] { display:none !important; }
/* A single square material covers each owner uniformly. Overscan removes the
   sample's transparent margin; no tiles or stretched fibers meet behind text. */
.ui-preferences--settings .ui-preferences__row.ui-button,
.ui-preferences__row.ui-button,
.ui-preferences__choices,
.ui-preferences__type-preview,
.ui-preferences__help,
.ui-shop .ui-shop__card.ui-button[data-variant="quiet"] {
  background-image:linear-gradient(rgb(255 255 255 / .94),rgb(255 255 255 / .94)),url('../../assets/ui/v1/raster/material-paper-384.png');
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover,auto max(115%,115cqw);
}
/* Keep this after the material owners, with matching specificity: raster
   backgrounds must not repaint the system colors in forced-color mode. */
@media (forced-colors:active) {
  .ui-preferences--settings .ui-preferences__row.ui-button,
  .ui-preferences__row.ui-button,
  .ui-preferences__choices,
  .ui-preferences__type-preview,
  .ui-preferences__help,
  .ui-shop .ui-shop__card.ui-button[data-variant="quiet"] { background-image:none; }
}