/* Shared controls: warm paper, fine edges, and restrained feedback. */
:root{--ui-surface:#f8f7f2ed;--ui-edge:#383c3021;--ui-shadow:0 3px 14px #22291d09;--ui-soft:#eae9e1;--ui-press:#dedfd5}
:where(.icon-button,.music-button,.room-back){background:var(--ui-surface);border-color:var(--ui-edge);box-shadow:var(--ui-shadow)}
:where(.icon-button,.music-button,.room-back,.life-action,.back-button,.text-button){transition:transform 160ms ease-out,background-color 160ms ease-out,color 160ms ease-out}
:where(.icon-button,.music-button,.room-back,.life-action,.back-button,.text-button):active:not(:disabled){transform:scale(.97)}
:where(button,a,input,summary):focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(hover:hover){:where(.icon-button,.music-button,.room-back,.life-action):hover:not(:disabled){transform:translateY(-1px);background:var(--paper)}}
.music-button{gap:11px;padding:9px 14px 9px 9px}.music-copy>span{font-size:13px;line-height:1.5}.music-copy small{font-size:12px;line-height:1.5}
.room-back{min-height:44px;padding:6px 15px 6px 7px;gap:9px;border-radius:16px;border-color:#6e69552b;background:#f7f5eeed;box-shadow:0 3px 14px #302d2110,inset 0 1px 0 #fff9;font-size:13px;font-weight:500;line-height:1.4}
.room-back-icon{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:10px;background:#e8e5db;color:#646455}
.room-back-icon svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.room-back:not([hidden]){animation:ui-appear 180ms ease-out}
.view-tools{gap:8px}.view-tools .icon-button{width:44px;height:44px}
.object-tooltip{border-radius:12px;background:#f8f7f2c9;border-color:#ffffff80;box-shadow:var(--ui-shadow);padding:8px 12px}
#hover-action{color:#62685e;font-size:12px}
.details-panel,.life-panel:not(.is-inspect),#vinyl-studio{box-shadow:-10px 0 36px #22291d08;animation:ui-panel-enter 200ms ease-out}
.detail-copy p,.life-scroll p{font-size:15px;line-height:1.9;text-wrap:pretty}.detail-copy h2,.life-top h2{text-wrap:balance}
.help-panel:not([hidden]),.light-menu:not([hidden]){animation:ui-appear 180ms ease-out}
.help-panel,.light-menu{border-radius:18px;box-shadow:0 8px 30px #22291d12}
@keyframes ui-appear{from{transform:translateY(5px);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes ui-panel-enter{from{transform:translateX(16px);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes ui-sheet-enter{from{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}
@media(max-width:760px){
  .room-back{left:max(20px,env(safe-area-inset-left))}.view-tools{right:max(18px,env(safe-area-inset-right))}
  .details-panel,.life-panel:not(.is-inspect),#vinyl-studio{animation-name:ui-sheet-enter}
  .detail-copy p,.life-scroll p{font-size:15px;line-height:1.85}
}
@media(max-width:640px){.music-button{padding:8px;gap:0;min-width:48px;min-height:48px;justify-content:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}