/* Canonical home-scene layout.
   All SD/LD geometry lives here; app.css and interface-system.css contain no
   competing LD size or pair-position rules. */

.native-app .native-character-stage.visual-mode-ld{
  --scene-pair-shift:23%;
  position:relative!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  scale:1!important;
  animation:none!important;
  transform:none!important;
  transform-origin:50% 100%!important;
  pointer-events:none!important;
}
.native-app .native-character-stage.visual-mode-ld>i{display:none!important}
.native-app .native-character-stage.visual-mode-ld>.scene-ld-art,
.native-app .native-character-stage.visual-mode-ld .native-scene-lineup-person.is-ld>.scene-ld-art{
  position:absolute!important;
  left:calc(50% + var(--character-art-x,0%))!important;
  top:var(--character-art-y,0%)!important;
  bottom:auto!important;
  display:block!important;
  width:auto!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  translate:-50% 0!important;
  scale:var(--character-render-scale,1)!important;
  rotate:var(--character-art-rotation,0deg)!important;
  transform:translate3d(0,0,0);
  transform-origin:50% 100%!important;
  animation:home-ld-idle 4.8s ease-in-out infinite!important;
  will-change:transform;
  filter:drop-shadow(0 18px 13px #0008)!important;
}
@keyframes home-ld-idle{
  0%,100%{transform:translate3d(0,0,0) rotate(0deg)}
  42%{transform:translate3d(0,-5px,0) rotate(-.12deg)}
  68%{transform:translate3d(0,-2px,0) rotate(.1deg)}
}
.native-app .native-character-stage.visual-mode-ld.has-two-scene-actors>.native-scene-lineup.is-pair{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  translate:0 0!important;
  transform:none!important;
}
.native-app .native-character-stage.visual-mode-ld.has-two-scene-actors .native-scene-lineup-person{
  position:absolute!important;
  top:0!important;
  bottom:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  translate:-50% 0!important;
  scale:1!important;
  transform:none!important;
  animation:none!important;
  filter:none!important;
  overflow:visible!important;
}
.native-app .native-character-stage.visual-mode-ld.has-two-scene-actors .pair-slot-left{
  left:calc(50% - var(--scene-pair-shift))!important;
  right:auto!important;
  z-index:2!important;
}
.native-app .native-character-stage.visual-mode-ld.has-two-scene-actors .pair-slot-right{
  left:calc(50% + var(--scene-pair-shift))!important;
  right:auto!important;
  z-index:2!important;
}
.native-app .native-character-stage.visual-mode-ld.has-two-scene-actors .native-scene-lineup-person.is-selected{z-index:4!important}
.native-app .native-character-stage.visual-mode-ld .native-scene-lineup-person>small{display:none!important}
.native-app .native-character-stage.visual-mode-ld.has-two-scene-actors .native-scene-lineup-person:not(.is-ld)>.native-scene-lineup-avatar{
  position:absolute!important;
  left:calc(50% + var(--character-art-x,0%))!important;
  top:calc(45% + var(--character-art-y,0%))!important;
  width:clamp(96px,24vw,138px)!important;
  height:clamp(96px,24vw,138px)!important;
  max-width:138px!important;
  max-height:138px!important;
  object-fit:contain!important;
  translate:-50% -50%!important;
  scale:var(--character-render-scale,1)!important;
  transform:none!important;
}
.native-app .native-character-stage.visual-mode-ld.has-two-scene-actors .native-scene-lineup-person:not(.is-ld)>img.profile-photo-fallback{
  border-radius:50%!important;
  object-fit:cover!important;
}

/* Per-character SD placement uses the same saved geometry without replacing
   the existing scene animation. */
.native-app .native-character-stage.visual-mode-sd>.native-main-character,
.native-app .native-character-stage.visual-mode-sd .native-scene-lineup-person>.native-scene-lineup-avatar{
  left:var(--character-art-x,0%)!important;
  top:var(--character-art-y,0%)!important;
  scale:var(--character-render-scale,1)!important;
  rotate:var(--character-art-rotation,0deg)!important;
}
.native-app .native-scene-action-prop{
  left:calc(55% + var(--character-action-x,0%))!important;
  top:calc(54% + var(--character-action-y,0%))!important;
}
.native-app .native-person-action-prop{
  left:calc(50% + var(--character-action-x,0%))!important;
  top:calc(48% + var(--character-action-y,0%))!important;
}
.native-app .native-character-stage.visual-mode-ld :is(.native-scene-action-prop,.native-person-action-prop){display:grid!important;z-index:12!important}

/* Mobile: the art owns one viewport-height frame behind the interface. A pair
   duplicates that exact frame and changes only the two X centers. */
@media(max-width:720px),(min-width:721px) and (orientation:portrait){
  html.native-app[data-active-tab="observe"] .native-observe-home{--scene-frame-top:8.62dvh}
  html.native-platform[data-active-tab="observe"] .game-observe-hud[data-native-hud-version="4"] .game-hud-stage.visual-mode-ld{
    --scene-frame-top:8.62dvh;
    position:absolute!important;
    z-index:7!important;
    left:0!important;
    right:0!important;
    top:var(--scene-frame-top)!important;
    bottom:0!important;
    display:block!important;
    width:100vw!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }
  html.native-platform[data-active-tab="observe"] .game-observe-hud[data-native-hud-version="4"] .game-hud-stage.visual-mode-ld>.native-character-stage.visual-mode-ld,
  html.native-app[data-active-tab="observe"] .native-character-stage.visual-mode-ld{
    --scene-pair-shift:clamp(72px,22vw,96px);
    position:absolute!important;
    inset:0!important;
    width:100vw!important;
    height:100%!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    translate:0 0!important;
    z-index:10!important;
  }
  /* HUD v3 keeps the character plane below every interface layer (the parent
     stage remains z-index 7). Only the LD art frame and pair composition are
     widened to the viewport: selected character in the left foreground,
     companion behind on the right. */
  html.native-platform[data-active-tab="observe"] .game-observe-hud[data-native-hud-version="3"] .game-hud-stage .native-character-stage.visual-mode-ld{
    left:50%!important;
    top:-13.1dvh!important;
    bottom:auto!important;
    width:100vw!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-width:none!important;
    max-height:none!important;
    translate:-50% 0!important;
    z-index:1!important;
  }
  html.native-platform[data-active-tab="observe"] .game-observe-hud[data-native-hud-version="3"] .game-hud-stage .native-character-stage.visual-mode-ld.has-two-scene-actors .native-scene-lineup-person{
    top:auto!important;
    right:auto!important;
    transform-origin:50% 100%!important;
  }
  html.native-platform[data-active-tab="observe"] .game-observe-hud[data-native-hud-version="3"] .game-hud-stage .native-character-stage.visual-mode-ld.has-two-scene-actors .native-scene-lineup-person.is-selected{
    left:27vw!important;
    bottom:-12dvh!important;
    width:100vw!important;
    height:112dvh!important;
    scale:1.12!important;
    z-index:4!important;
  }
  html.native-platform[data-active-tab="observe"] .game-observe-hud[data-native-hud-version="3"] .game-hud-stage .native-character-stage.visual-mode-ld.has-two-scene-actors .native-scene-lineup-person:not(.is-selected){
    left:70vw!important;
    bottom:-5dvh!important;
    width:100vw!important;
    height:88dvh!important;
    scale:.9!important;
    z-index:2!important;
  }
  html.native-app[data-active-tab="observe"] :is(.native-observe-top,.native-character-picker,.native-status-card,.native-log-card){z-index:60!important}
  html.native-app[data-active-tab="observe"] .native-observe-top{position:absolute!important}
  html.native-app[data-active-tab="observe"] .native-character-picker{pointer-events:auto!important}
  html.native-app[data-active-tab="observe"] .native-character-stage.visual-mode-ld + .native-character-picker{
    grid-row:1!important;
    align-self:end!important;
    position:relative!important;
    margin-top:0!important;
    margin-bottom:0!important;
  }
  html.native-app[data-active-tab="observe"] .native-game-menu{z-index:80!important;pointer-events:none!important}
  html.native-app[data-active-tab="observe"] .native-game-menu button{pointer-events:auto!important}
}

/* Desktop uses the same full-height art model. Both people receive the same
   frame height, so source pixel dimensions cannot make one character huge. */
.desktop-observe-scene .desktop-scene-canvas{grid-template-columns:minmax(360px,1fr) minmax(520px,48%)!important}
.desktop-observe-scene .desktop-scene-copy{z-index:60!important}
.desktop-observe-scene .native-character-stage.visual-mode-ld{
  --scene-pair-shift:clamp(105px,10vw,190px);
  justify-self:end!important;
  align-self:end!important;
  width:min(48vw,820px)!important;
  height:min(70dvh,680px)!important;
  min-height:430px!important;
  max-width:none!important;
  max-height:none!important;
  z-index:10!important;
}
.desktop-observe-scene .native-character-stage.visual-mode-ld.has-two-scene-actors{width:min(54vw,920px)!important}
@media(max-width:1100px){
  .desktop-observe-scene .desktop-scene-canvas{grid-template-columns:minmax(300px,1fr) minmax(420px,52%)!important}
  .desktop-observe-scene .native-character-stage.visual-mode-ld{height:min(62dvh,570px)!important;min-height:380px!important}
}

/* Character-specific direct-manipulation editor. */
.character-home-layout-editor{
  grid-column:1/-1!important;
  display:grid!important;
  gap:14px!important;
  width:100%!important;
  padding:18px!important;
  border:1px solid color-mix(in srgb,var(--p) 35%,var(--line))!important;
  border-radius:22px!important;
  background:color-mix(in srgb,var(--panel) 92%,var(--p) 8%)!important;
  box-sizing:border-box!important;
}
.character-home-layout-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.character-home-layout-heading h3,.character-home-layout-heading p{margin:0}.character-home-layout-heading p{margin-top:6px;max-width:680px;color:var(--muted);line-height:1.55}
.home-layout-mode-buttons{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}
.home-layout-mode-buttons button.on{border-color:var(--p)!important;background:var(--p)!important;color:var(--on-p)!important}
.character-home-layout-editor[data-mode="sd"] [data-home-layout-fill]{display:none!important}
.home-layout-preview{
  --ld-preview-top:8.62%;
  position:relative;
  isolation:isolate;
  width:min(100%,412px);
  aspect-ratio:412/917;
  margin:auto;
  overflow:hidden;
  border:1px solid #ffffff55;
  border-radius:22px;
  background:#111;
  color:#fff;
  box-shadow:0 18px 40px #0004;
  touch-action:none;
  user-select:none;
  cursor:grab;
}
.home-layout-preview.is-gesturing{cursor:grabbing}
.home-layout-preview-backdrop{
  position:absolute;z-index:0;inset:0;
  background:linear-gradient(#1017221c,#10172238),var(--layout-preview-bg) center/cover no-repeat;
}
.home-layout-ld-frame-guide{
  position:absolute;
  z-index:6;
  inset:var(--ld-preview-top) 0 0;
  display:none;
  overflow:hidden;
  border:2px dashed #fff;
  background:#7379804f;
  box-shadow:inset 0 0 0 999px #6c72781e;
  pointer-events:none;
}
.character-home-layout-editor[data-mode="ld"] .home-layout-ld-frame-guide{display:block}
.home-layout-ld-frame-guide small{position:absolute;left:8px;top:7px;padding:4px 7px;border-radius:8px;background:#20252bc4;color:#fff;font-size:10px;font-weight:800}
.home-layout-layer{position:absolute;z-index:10;inset:10% 0 5%;display:none;pointer-events:none}
.character-home-layout-editor[data-mode="sd"] [data-home-layout-layer="sd"],
.character-home-layout-editor[data-mode="ld"] [data-home-layout-layer="ld"]{display:block}
.home-layout-art{
  position:absolute;
  left:calc(50% + var(--character-art-x,0%));
  top:calc(8% + var(--character-art-y,0%));
  display:grid;
  place-items:end center;
  width:28%;
  height:28%;
  translate:-50% 0;
  scale:var(--character-render-scale,1);
  rotate:var(--character-art-rotation,0deg);
  transform-origin:50% 100%;
  cursor:grab;
  pointer-events:auto;
  touch-action:none;
  filter:drop-shadow(0 9px 8px #0008);
}
[data-home-layout-layer="sd"]{
  inset:auto!important;
  left:50%!important;
  top:18%!important;
  width:34%!important;
  height:24%!important;
  translate:-50% 0!important;
  overflow:visible!important;
}
[data-home-layout-layer="sd"] .home-layout-art{
  left:calc(50% + var(--character-art-x,0%));
  top:var(--character-art-y,0%);
  width:100%;
  height:100%;
}
[data-home-layout-layer="ld"]{inset:var(--ld-preview-top) 0 0!important;overflow:hidden!important}
[data-home-layout-layer="ld"] .home-layout-art{
  inset:0;
  display:block;
  width:100%;
  height:100%;
  translate:0 0;
  scale:1;
  rotate:0deg;
  filter:none;
  cursor:default;
  pointer-events:none;
}
.home-layout-art:active{cursor:grabbing}
.home-layout-art>:is(img,.home-layout-fallback){display:block;width:100%;height:100%;border:0;border-radius:0;background:transparent;object-fit:contain;object-position:center bottom}
[data-home-layout-layer="ld"] .home-layout-art>img.scene-ld-art{
  position:absolute!important;
  left:calc(50% + var(--character-art-x,0%))!important;
  top:var(--character-art-y,0%)!important;
  display:block!important;
  width:auto!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  translate:-50% 0!important;
  scale:var(--character-render-scale,1)!important;
  rotate:var(--character-art-rotation,0deg)!important;
  transform-origin:50% 100%!important;
  filter:drop-shadow(0 9px 8px #0008)!important;
  cursor:grab!important;
  pointer-events:auto!important;
  touch-action:none!important;
}
html.native-app[data-active-tab="character"] .mobile-character-full-settings>main [data-home-layout-layer="ld"] .home-layout-art>img.scene-ld-art{
  width:auto!important;
  max-width:none!important;
  box-sizing:content-box!important;
}
[data-home-layout-layer="ld"] .home-layout-art>.home-layout-fallback{position:absolute;left:calc(50% + var(--character-art-x,0%));top:var(--character-art-y,0%);width:min(70%,280px);height:100%;translate:-50% 0;scale:var(--character-render-scale,1);transform-origin:50% 100%;pointer-events:auto}
/* The photo fallback is circular even in a rectangular SD stage. SD and LD
   artwork keep their transparent silhouette and their saved transforms. */
.native-app .native-character-stage img.sprite.profile-photo-fallback,
html.native-app[data-active-tab="character"] .mobile-character-full-settings>main .home-layout-art>img.profile-photo-fallback,
.home-layout-art>img.profile-photo-fallback{border-radius:50%!important;object-fit:cover!important;object-position:center!important;clip-path:circle(closest-side at 50% 50%)!important}
.home-layout-fallback{display:grid!important;place-items:center!important;border-radius:50%!important;background:var(--p)!important;color:#fff!important;font-size:42px;font-weight:900}
.home-layout-fallback.is-ld{border-radius:18px!important;background:#101722c9!important;font-size:28px;text-align:center}.home-layout-fallback small{font-size:11px}
.home-layout-resize-handle{position:absolute!important;right:-12px!important;bottom:-12px!important;z-index:5!important;display:grid!important;place-items:center!important;width:34px!important;min-width:34px!important;height:34px!important;min-height:34px!important;padding:0!important;border:2px solid #fff!important;border-radius:50%!important;background:var(--p)!important;color:#fff!important;font-size:15px!important;line-height:1!important;box-shadow:0 4px 12px #0007!important;cursor:nwse-resize!important;touch-action:none!important}
.home-layout-action{position:absolute!important;z-index:12!important;left:calc(55% + var(--character-action-x,0%))!important;top:calc(54% + var(--character-action-y,0%))!important;display:grid!important;place-items:center!important;width:13.6%!important;min-width:0!important;height:auto!important;min-height:0!important;aspect-ratio:1!important;padding:0!important;border:0!important;border-radius:14px!important;background:transparent!important;font-size:31px!important;line-height:1!important;translate:0 0!important;box-shadow:none!important;cursor:grab!important;pointer-events:auto!important;touch-action:none!important}
.home-layout-action:hover,.home-layout-action:focus-visible{outline:2px dashed #fff!important;outline-offset:2px!important;background:#1017223d!important}
.home-layout-action>.native-scene-action-prop{position:static!important;left:auto!important;top:auto!important;display:grid!important;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;margin:0!important;place-items:center!important}
.home-layout-action:active{cursor:grabbing!important}
.home-layout-art,.home-layout-art *,.home-layout-action{-webkit-user-drag:none;-webkit-tap-highlight-color:transparent}
.home-layout-preview-ui{position:absolute;z-index:30;inset:0;overflow:hidden;pointer-events:none;font-family:var(--home-ui-font,"KCCHanbit",var(--ui-font))}
.home-layout-preview-wood::before,.home-layout-preview-wood::after{position:absolute;z-index:1;left:0;width:100%;content:"";background-position:center bottom;background-size:cover;background-repeat:no-repeat}
.home-layout-preview-wood::before{top:0;height:2.95%;background-image:var(--home-ui-wood-strip,url("./assets/home-ui/wood-strip.png"))}
.home-layout-preview-wood::after{top:1.45%;height:7.17%;background-image:var(--home-ui-wood-top,url("./assets/home-ui/wood-top.png"))}
.home-layout-preview-top{position:absolute;z-index:3;inset:0;width:100%;height:100%}
.home-layout-preview-top>span{position:absolute;left:1.7%;top:3.38%;display:grid;place-items:center;width:18.93%;height:8.51%;overflow:visible}
.home-layout-preview-top>span>:is(.avatar,.sprite){width:85.6%;height:85.6%;border:0;border-radius:50%;background:transparent;box-shadow:none;object-fit:cover}
.home-layout-preview-top>span>img:last-child{position:absolute;z-index:2;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:contain}
.home-layout-preview-top>b{position:absolute;left:22.57%;top:1.745%;max-width:52%;overflow:hidden;color:#fff;font-size:clamp(12px,4vw,21px);font-weight:400;line-height:1.1;text-overflow:ellipsis;white-space:nowrap;-webkit-text-stroke:1px #000;paint-order:stroke fill;text-shadow:0 2px 3px #0008}
.home-layout-preview-top>em{position:absolute;left:23.18%;top:5.945%;display:grid;place-items:center;max-width:46%;height:3.45%;padding:0 8px;overflow:hidden;border-radius:999px;background:var(--home-ui-pill-middle,#674a3b) center/100% 100% repeat-x;color:#FFF5DD;font-size:clamp(7px,2.35vw,12px);font-style:normal;text-overflow:ellipsis;white-space:nowrap}
.home-layout-preview-top>small,.home-layout-preview-top>time{position:absolute;right:3.155%;color:#fff;font-size:clamp(7px,2.3vw,12px);font-style:normal;font-weight:400;line-height:1;text-shadow:0 1px 2px #000}
.home-layout-preview-top>small{top:4.035%}.home-layout-preview-top>time{top:5.998%;font-size:clamp(9px,2.8vw,14px);-webkit-text-stroke:.7px #000;paint-order:stroke fill}
.home-layout-preview-side{position:absolute;z-index:4;display:grid;grid-template-rows:repeat(3,29.26%);align-content:start;width:16.75%;height:34.35%;overflow:visible}
.home-layout-preview-side.left{left:2.91%;top:12.87%}.home-layout-preview-side.right{right:2.18%;top:9.38%}
.home-layout-preview-side>span{position:relative;display:block;width:100%;height:100%;overflow:visible}
.home-layout-preview-side img{position:absolute;left:50%;top:0;display:block;width:91.3%;height:68.7%;max-width:none;object-fit:contain;translate:-50% 0;filter:drop-shadow(0 2px 2px #0008)}
.home-layout-preview-side.right img{width:78.3%;height:58.9%}
.home-layout-preview-side small,.home-layout-preview-dock small{position:absolute;z-index:2;left:50%;display:grid;place-items:center;height:3.71%;padding:0 6px;border-radius:999px;background:var(--home-ui-pill-middle,#674a3b) center/100% 100% repeat-x;color:#FFF5DD;font-size:clamp(6px,2.1vw,11px);line-height:1;white-space:nowrap;translate:-50% 0}
.home-layout-preview-side small{top:55.6%;width:122%;height:36.9%}.home-layout-preview-side.right small{top:50.2%}
.home-layout-preview-moment{position:absolute;z-index:5;left:7.04%;bottom:15.38%;display:grid;align-content:start;gap:.55%;box-sizing:border-box;width:85.19%;height:21.26%;padding:5.8% 7.28% 2.1%;overflow:visible;border:1px solid #000;border-radius:20px;background:#fff8efed;color:#292724;box-shadow:0 5px 18px #2b160d35}
.home-layout-preview-moment>strong{position:absolute;left:7.77%;top:-15%;color:#fff;font-size:clamp(11px,4.2vw,20px);font-weight:400;-webkit-text-stroke:1px #000;paint-order:stroke fill;text-shadow:0 2px 3px #000b}
.home-layout-preview-moment>b{overflow:hidden;font-size:clamp(10px,3.5vw,17px);font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.home-layout-preview-moment>p{display:-webkit-box;margin:0;overflow:hidden;color:#5a514c;font-size:clamp(7px,2.45vw,12px);line-height:1.55;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.home-layout-preview-moment>small{margin-top:auto;overflow:hidden;font-size:clamp(7px,2.35vw,11px);font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.home-layout-preview-dock{position:absolute;z-index:5;left:1.21%;top:86.69%;display:grid;grid-template-columns:repeat(5,1fr);gap:1.21%;width:97.57%;height:11.45%;overflow:visible}
.home-layout-preview-dock>span{position:relative;display:block;width:100%;height:100%}
.home-layout-preview-dock img{position:absolute;left:50%;top:0;display:block;width:94.5%;height:72.4%;max-width:none;object-fit:contain;translate:-50% 0;filter:drop-shadow(0 2px 2px #0008)}
.home-layout-preview-dock small{top:66.6%;width:93%;height:32.4%}
.home-layout-preview-caption{justify-self:center;color:var(--muted);text-align:center}
.home-layout-adjustments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.home-layout-adjustments>section{display:grid;gap:8px;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.home-layout-adjustments>section>b{text-align:center}
.home-layout-nudge-pad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.home-layout-nudge-pad button,.home-layout-scale-buttons button{min-width:0!important;min-height:46px!important;padding:8px!important;font-size:20px!important;touch-action:manipulation!important}
.home-layout-scale-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.home-layout-scale-buttons button{font-size:14px!important}
.home-layout-save-note{justify-self:center;color:var(--muted)}
.home-layout-save-bar{position:sticky;z-index:60;bottom:-12px;display:grid;width:100%;padding:10px 0 max(12px,env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,#f6efe4 24%)}
.home-layout-save-bar button{width:100%;min-height:48px;font-weight:800;touch-action:manipulation}
@media(max-width:720px),(min-width:721px) and (orientation:portrait){
  .character-home-layout-editor{padding:12px!important;border-radius:18px!important}
  .character-home-layout-heading{display:grid}.home-layout-mode-buttons{justify-content:stretch}.home-layout-mode-buttons button{flex:1 1 120px}
  .home-layout-preview{width:min(100%,360px);border-radius:22px}
  .home-layout-adjustments{grid-template-columns:minmax(0,1fr)}
}
html.native-app[data-animation-intensity="reduced"] body #app :is(.scene-ld-art,.native-main-character,.native-scene-lineup-person,.home-person-visual,.town-traveler-visual),
html.native-app[data-animation-intensity="off"] body #app :is(.scene-ld-art,.native-main-character,.native-scene-lineup-person,.home-person-visual,.town-traveler-visual,.native-scene-atmosphere,.native-scene-effects,.native-scene-effects *, .native-character-stage::before,.native-character-stage::after){animation:none!important;will-change:auto!important}
html.native-app[data-animation-intensity="reduced"] body #app .native-scene-atmosphere{animation:none!important;will-change:auto!important}
html.native-app[data-animation-intensity="off"] body #app :is(.native-scene-effects,.native-scene-atmosphere){display:none!important}
@media(prefers-reduced-motion:reduce){
  .native-app .native-character-stage.visual-mode-ld,
  .native-app .native-character-stage.visual-mode-ld .scene-ld-art,
  .native-app .native-character-stage.visual-mode-ld .native-scene-lineup-person{animation:none!important}
}