/* One persistent shell for the library and the photo house. */
#spaceMain{overflow-anchor:none}
html:has(body.workspace-ready){scrollbar-gutter:auto;scrollbar-width:none}
html:has(body.workspace-ready)::-webkit-scrollbar{width:0;height:0}
html:has(body.workspace-ready.viewing-memories){height:100%;overflow:hidden;scrollbar-gutter:auto}
body.video-entry-page.workspace-ready.viewing-memories{height:100dvh;min-height:0;overflow:hidden}
:root{--space-panel:rgba(255,252,247,.88)}
html[data-space-theme=dark]{--space-panel:rgba(26,43,35,.91)}
body.video-entry-page .space-shell,
body.video-entry-page.viewing-memories .space-shell {
  display:grid;grid-template-columns:196px minmax(0,1fr)!important;
  grid-template-rows:72px minmax(0,1fr);min-height:100dvh;
  width:100%;max-width:none;margin:0;padding:0;color:var(--space-ink);
}
body.video-entry-page.viewing-memories .space-shell{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:72px minmax(0,1fr);height:100dvh;min-height:0}
.workspace-header{grid-column:1/-1;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:28px;padding:0 clamp(22px,3vw,44px);height:72px;position:sticky;top:0;z-index:15;border-bottom:1px solid var(--space-line);background:var(--space-panel);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.workspace-brand{justify-self:start;color:var(--space-ink);text-decoration:none;font:500 27px/1.4 'Noto Serif SC',serif;letter-spacing:.13em}
body.video-entry-page .workspace-header .workspace-tabs{display:flex;justify-self:end;justify-content:flex-end;width:fit-content;margin:0;gap:26px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
body.video-entry-page .workspace-header .workspace-tabs a{display:inline-flex;align-items:center;min-height:44px;color:var(--space-muted);padding:0;font-size:12px;line-height:1.4;border:0;border-radius:0;background:transparent;box-shadow:none;white-space:nowrap;text-decoration:none;transition:color .18s ease}
body.video-entry-page .workspace-header .workspace-tabs a:hover,body.video-entry-page .workspace-header .workspace-tabs a[aria-current=page]{background:transparent;color:var(--space-accent);box-shadow:none}
body.video-entry-page .workspace-header .workspace-tabs a[aria-current=page]{font-weight:500;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:7px}
body.video-entry-page .workspace-header .workspace-tabs a:focus-visible{outline:2px solid var(--space-accent);outline-offset:4px}
body.video-entry-page .workspace-header .space-account{display:flex;align-items:center;justify-self:end;gap:9px;padding:0;margin:0;border:0;min-width:0}
body.video-entry-page .workspace-header .space-account>div{min-width:0;max-width:130px}
body.video-entry-page .workspace-header .space-account strong{font-size:11px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.video-entry-page .workspace-header .space-account small{font-size:8px;margin-top:2px;line-height:1.5;white-space:nowrap}
body.video-entry-page .workspace-header .space-avatar{width:30px;height:30px;font-size:11px;flex:none}
body.video-entry-page .workspace-header .space-icon-button{width:36px;height:40px;flex:none;padding:9px}
body.video-entry-page .space-sidebar,body.video-entry-page.viewing-memories .space-sidebar{display:flex;flex-direction:column;position:sticky;top:72px;align-self:start;height:calc(100dvh - 72px);width:auto;padding:32px 16px 24px;border-right:1px solid var(--space-line);background:var(--space-panel);gap:0}
body.video-entry-page.viewing-memories .space-sidebar{display:none}
body .space-sidebar .space-nav{display:grid;gap:8px;width:100%}
body .space-sidebar .space-nav-item{min-height:46px;padding:12px;gap:10px;font-size:12px;border-radius:12px;min-width:0}
body .space-sidebar .space-nav-item svg{width:17px;height:17px;flex:none}
body .space-sidebar .space-nav-item.active{background:rgba(227,184,197,.25);border-color:transparent}
body .space-sidebar .space-sidebar-bottom{display:block;margin-top:auto;padding:30px 8px 0;max-width:none}
body .space-sidebar .space-storage{padding:0}
body .space-sidebar .space-storage>span{display:flex;flex-direction:column;align-items:start;gap:7px;font-size:9px;line-height:1.7}
body .space-sidebar .space-storage progress{display:block;margin-top:12px;height:3px}
body.video-entry-page .space-main,body.video-entry-page.viewing-memories .space-main{display:flex;flex-direction:column;align-self:start;width:100%;max-width:1320px;min-width:0;min-height:calc(100dvh - 72px);margin:0 auto!important;padding:36px clamp(24px,3vw,44px) 0}
body.video-entry-page.viewing-memories .space-main{grid-column:1;grid-row:2;align-self:stretch;height:100%;min-height:0;padding-top:12px}
body .space-main>#spacePage,body .space-main>#memoryPage{min-width:0;flex:1;transition:opacity .18s ease,transform .18s ease}
/* A transformed page becomes the containing block of its fixed dock. Both the
   legacy entrance keyframes and route slide used to move it until they ended.
   Fade this panel without ever transforming the dock's ancestor. */
body .space-main>#memoryPage{animation:none;transform:none;transition:opacity .18s ease}
body.video-entry-page.viewing-memories .space-main>#memoryPage{display:flex;flex-direction:column;min-height:0;z-index:1}
body .space-main>.is-changing{opacity:0;transform:translateY(6px);pointer-events:none}
body .space-main .space-footer{display:flex;height:auto;margin:28px 0 0;padding:20px 0 max(22px,env(safe-area-inset-bottom));gap:14px;font-size:8px}
body #spacePage .space-heading{margin:0 0 28px;gap:24px;align-items:center}
body #spacePage .space-heading h1{font-size:clamp(32px,3vw,42px)}
body #spacePage .space-tools{margin-bottom:24px}
body #spacePage .category-gallery{grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:30px 24px}
body #spacePage .collection-info{padding-top:15px}
body #spacePage .collection-image{aspect-ratio:3/2}
body #spacePage .collection-meta{display:flex;flex-wrap:wrap;gap:5px 14px}

/* The same content frame stays in place. The clock, photographs, controls and
   player have their own grid rows, so narrow screens never stack them on top. */
body.viewing-memories .house-stage{display:grid;grid-template-rows:auto 98px minmax(300px,1fr) auto auto;gap:14px;width:100%;max-width:none;min-height:760px;height:max(760px,calc(100dvh - 160px));padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;color:var(--space-ink)}
body .house-stage .house-header{position:relative;inset:auto;grid-row:1;gap:12px;min-height:60px}
body .house-stage .house-brand{padding:0;border:0;background:none;box-shadow:none;gap:9px}
body .house-stage .house-brand h1{font:400 clamp(32px,3vw,42px)/1.35 'Noto Serif SC',serif;letter-spacing:.08em}
#memoryTitle:focus{outline:none}
body .house-stage .house-brand small{font-size:7px}
body .house-stage .house-header-actions button{min-height:44px;padding:10px 16px;border-radius:10px}
body .house-stage .house-anniversary{position:relative;inset:auto;transform:none;grid-row:2;align-self:center;justify-self:center;width:fit-content;max-width:100%;padding:12px 26px;border-radius:28px}
body .house-stage .house-anniversary>div{gap:20px}
body .house-stage .house-anniversary h2{font-size:15px}
body .house-stage .house-clock{gap:11px}
body .house-stage .house-clock b{font-size:24px}
body .house-stage .house-photos{position:relative;inset:auto;grid-row:3;min-width:0;min-height:300px;width:100%;height:100%;perspective:1250px;touch-action:none;outline-offset:-3px;border-radius:14px}
body .house-stage .house-photo{transition:none} /* transforms are interpolated once per frame in photo-scene.js */
body .house-stage .house-photo-tools{position:relative;inset:auto;grid-row:4;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:flex-start}
body .house-stage .house-modes{display:flex;width:fit-content;max-width:100%;padding:3px;border-radius:22px}
body .house-stage .house-modes button{min-height:34px;padding:7px 10px;font-size:10px;white-space:nowrap;touch-action:manipulation}
body .house-stage .house-paging{margin-left:auto;align-items:center}
body .house-stage .house-music{position:relative;inset:auto;transform:none;grid-row:5;width:min(590px,100%);justify-self:center;padding-top:3px;color:var(--space-ink)}
body .house-stage .house-empty{top:42%;left:20px;right:20px;transform:none;width:auto}
body .house-stage .house-message{inset:150px 15px auto;font-size:10px}
body .house-stage .house-stage-status{top:40%;left:0}
/* Preserve the original glass refraction on the clock, mode controls and player. */
body .house-stage .music-lyrics{height:73px}
body .house-stage .music-wave{height:20px;margin-bottom:8px}
body .house-stage .music-song-button strong{font-size:11px}
body .house-stage .music-song-button small{font-size:8px}
body .house-stage .music-transport button{min-height:34px;min-width:30px}
body .house-stage .music-extras button{min-height:34px;min-width:24px}
@media(max-width:1050px) and (min-width:761px){
  body.video-entry-page:not(.viewing-memories) .space-shell{grid-template-columns:168px minmax(0,1fr)!important}
  .workspace-header{padding-inline:24px;gap:12px}
  body.video-entry-page .workspace-header .space-avatar{display:none}
  body.video-entry-page .workspace-header .workspace-tabs{gap:20px}
  body .house-stage .house-anniversary>div{gap:12px}
}
@media(max-width:760px){
  body.video-entry-page .space-shell,body.video-entry-page.viewing-memories .space-shell{display:grid;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto minmax(0,1fr)}
  .workspace-header{height:auto;min-height:115px;grid-template-columns:1fr auto;grid-template-rows:48px 48px;gap:3px 12px;padding:max(8px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) 8px max(18px,env(safe-area-inset-left));align-items:center}
  .workspace-brand{font-size:25px;grid-row:1}
  body.video-entry-page .workspace-header .space-account{grid-row:1;gap:5px}
  body.video-entry-page .workspace-header .space-account>div{max-width:108px}
  body.video-entry-page .workspace-header .space-account strong{font-size:10px}
  body.video-entry-page .workspace-header .space-account small{display:none}
  body.video-entry-page .workspace-header .space-avatar{display:none}
  body.video-entry-page .workspace-header .space-icon-button{width:36px;height:42px}
  body.video-entry-page .workspace-header .workspace-tabs{grid-column:1/-1;grid-row:2;display:flex;justify-self:end;gap:24px;padding:0}
  body.video-entry-page .workspace-header .workspace-tabs a{text-align:right;font-size:12px;padding:0}
  body.video-entry-page .space-sidebar,body.video-entry-page.viewing-memories .space-sidebar{position:relative;top:auto;grid-column:1;grid-row:2;width:100%;height:auto;padding:10px max(18px,env(safe-area-inset-right)) 10px max(18px,env(safe-area-inset-left));border-right:0;border-bottom:1px solid var(--space-line)}
  body .space-sidebar .space-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  body .space-sidebar .space-nav-item{justify-content:center;gap:7px;min-width:0;min-height:42px;padding:9px 5px;font-size:11px}
  body .space-sidebar .space-nav-item svg{width:15px;height:15px}
  body .space-sidebar .space-nav-item small{margin:0;font-size:9px}
  body .space-sidebar .space-sidebar-bottom{display:block;margin:6px 0 0;padding:0}
  body .space-sidebar .space-storage>span{flex-direction:row;justify-content:flex-end;gap:8px;font-size:8px;line-height:1.5}
  body .space-sidebar .space-storage progress{display:none}
  body.video-entry-page .space-main,body.video-entry-page.viewing-memories .space-main{grid-column:1;grid-row:3;min-height:calc(100dvh - 196px);padding:26px max(20px,env(safe-area-inset-right)) 0 max(20px,env(safe-area-inset-left))}
  body.video-entry-page.viewing-memories .space-shell{grid-template-rows:auto minmax(0,1fr)}
  body.video-entry-page.viewing-memories .space-main{grid-row:2;min-height:calc(100dvh - 116px)}
  body #spacePage .space-heading{gap:20px;margin-bottom:25px}
  body #spacePage .space-heading h1{font-size:33px}
  body #spacePage .space-heading-actions .space-button{min-height:46px}
  body #spacePage .space-tools{gap:8px;margin-bottom:23px}
  body #spacePage .space-search input{font-size:12px}
  body #spacePage .category-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
  body .space-main .space-footer{margin-top:25px;padding-bottom:max(28px,calc(env(safe-area-inset-bottom) + 20px));flex-wrap:wrap}
  body.viewing-memories .house-stage{grid-template-rows:auto 116px minmax(270px,1fr) auto auto;gap:12px;padding:0;min-height:835px;height:max(835px,calc(100dvh - 260px));border-radius:0}
  body .house-stage .house-brand h1{font-size:33px}
  body .house-stage .house-header{gap:6px;padding:0;min-height:46px}
  body .house-stage .house-brand small{display:none}
  body .house-stage .house-header-actions{gap:5px}
  body .house-stage .house-header-actions button{font-size:10px;padding-inline:10px;min-height:42px}
  body .house-stage .house-anniversary{padding:13px 12px;max-width:100%;width:100%;border-radius:22px}
  body .house-stage .house-anniversary>div{flex-direction:column;gap:8px}
  body .house-stage .house-anniversary h2{font-size:14px}
  body .house-stage .house-clock{gap:12px}
  body .house-stage .house-clock b{font-size:24px}
  body .house-stage .house-photos{min-height:270px;perspective:850px}
  body .house-stage .house-modes{display:flex;width:fit-content;max-width:100%;border-radius:22px}
  body .house-stage .house-modes button{min-height:40px;padding:8px;font-size:10px}
  body .house-stage .house-music{width:100%}
  body .house-stage .music-player-row{padding:9px 10px;gap:7px}
  body .house-stage .music-song-button{gap:7px}
  body .house-stage .music-song-button strong,body .house-stage .music-song-button small{max-width:86px}
  body .house-stage .music-transport{gap:0}
  body .house-stage .music-extras{gap:4px}
  body .house-stage .music-lyrics{height:76px}
  body .house-stage .music-lyric-line.is-current{font-size:15px}
  body .house-stage .house-message{top:175px}
}
@media(max-width:480px){body #spacePage .category-gallery{grid-template-columns:minmax(0,1fr)}body #spacePage .collection-info strong{font-size:20px}body #spacePage .collection-meta{font-size:11px}}
@media(prefers-reduced-motion:reduce){body .space-main>#spacePage,body .space-main>#memoryPage{transition:none}}

/* Keep perspective cards and their shadows inside a generous scene viewport. */
body .house-stage .house-photos{min-height:0;touch-action:pan-y;border-radius:0;overflow:visible}
body .house-stage .house-photos[data-photo-mode=corridor]{cursor:default}
body.viewing-memories .house-stage{flex:1;grid-template-rows:44px 98px minmax(0,1fr);gap:12px;min-height:0;height:100%;overflow:visible}
body.viewing-memories .house-stage .house-header{min-height:0}
body.viewing-memories .house-stage .house-photos{height:100%}
body .house-stage .house-music{width:min(760px,100%);padding-top:22px;padding-bottom:12px}
body .house-stage .music-player-row{display:grid;grid-template-columns:minmax(150px,1fr) auto;gap:18px 26px;padding:18px 22px;border-radius:24px}
body .house-stage .music-song-button strong{font-size:14px;max-width:100%}
body .house-stage .music-song-button small{font-size:11px;max-width:100%;line-height:1.7}
body .house-stage .music-transport{gap:14px}
body .house-stage .music-transport .music-play{width:42px;height:42px}
body .house-stage .music-extras{grid-column:1/-1;justify-content:flex-end;gap:22px;padding-top:10px;border-top:1px solid var(--space-line)}
body .house-stage .music-volume input{width:90px}
body .house-stage .music-progress{padding:16px 10px 0;font-size:10px;gap:14px}
body .house-stage .music-lyrics{height:80px}
@media(max-width:760px){
 body.viewing-memories .house-stage{grid-template-rows:42px auto minmax(0,1fr);gap:10px;min-height:0}
 body .house-stage .house-photos{min-height:0}
 body .house-stage .music-player-row{grid-template-columns:minmax(0,1fr) auto;padding:15px;gap:14px 10px}
 body .house-stage .music-song-button strong,body .house-stage .music-song-button small{max-width:150px}
 body .house-stage .music-transport{gap:5px}
 body .house-stage .music-extras{justify-content:space-between}
}


/* Give each control a distinct hit area and keep the timeline off the buttons. */
body .house-stage .music-song-button{min-height:48px;gap:12px}
body .house-stage .music-art{width:42px;height:42px;font-size:21px}
body .house-stage .music-extras button{min-width:42px;min-height:40px;font-size:15px;cursor:pointer}
body .house-stage .music-extras button small{font-size:9px;margin-top:4px}
body .house-stage .music-volume{display:flex;align-items:center;gap:10px;font-size:10px;color:var(--space-muted)}
body .house-stage .music-progress{min-height:46px;padding:16px 6px 6px;gap:14px}
body .house-stage .music-progress input{height:20px;cursor:pointer}
body .house-stage .music-transport button{width:36px;height:42px;cursor:pointer}
body .house-stage .music-transport .music-play{width:46px;height:46px}
body .house-stage .music-status{font-size:12px;margin-top:12px}
@media(max-width:760px){
 body .house-stage .music-player-row{grid-template-columns:minmax(0,1fr);gap:16px;padding:18px}
 body .house-stage .music-song-button strong,body .house-stage .music-song-button small{max-width:100%}
 body .house-stage .music-transport{justify-content:center;gap:30px}
 body .house-stage .music-extras{gap:14px;justify-content:space-between}
 body .house-stage .music-volume{gap:6px}
 body .house-stage .music-volume input{width:80px}
 .music-library footer small{flex-basis:100%;font-size:11px;line-height:1.7}
}

/* Keep mode switching above a long matrix and give small collections a real
   portrait composition rather than a large, almost empty 3D stage. */
body .house-stage .house-photo-tools{grid-row:3;margin:4px 0 8px}
body .house-stage .house-photos{grid-row:4}
body .house-stage .house-photos[data-photo-mode=corridor],
body .house-stage .house-photos[data-photo-density=single],
body .house-stage .house-photos[data-photo-density=small]{min-height:0}
body .house-stage .house-photos[data-photo-mode=corridor] .house-photo-front,
body .house-stage .house-photos[data-photo-mode=corridor] .house-photo-back{box-shadow:0 5px 13px rgba(35,58,53,.15)}
body .house-stage .house-photos[data-photo-mode=corridor] .house-photo-front strong{font-size:8px;left:6px;right:6px;bottom:7px}
body .house-stage .house-photos[data-photo-mode=corridor] .house-photo-tag{font-size:6px}
body .house-stage .house-photos[data-photo-density=single] .house-photo-front{box-shadow:0 12px 25px rgba(35,58,53,.17)}

body .house-stage .house-paging{width:max-content;gap:12px;color:var(--space-muted);font-size:11px;white-space:nowrap}
body .house-stage .house-paging button{display:grid;place-items:center;width:34px;min-height:34px;padding:0;border:1px solid var(--space-line);border-radius:50%;background:var(--space-panel);color:var(--space-ink)}
body .house-stage .house-paging button:disabled{opacity:.35}
@media(max-width:600px){body .house-stage .house-paging{margin-left:0}}

/* Library reference composition: full-height sidebar and a quiet content nav.
   Shared live controls are reparented, never cloned, when changing spaces. */
.library-brand-slot,.library-topline{display:none}
body.video-entry-page:not(.viewing-memories) .space-shell{grid-template-columns:224px minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)}
body.video-entry-page:not(.viewing-memories) .workspace-header{display:none}
body.video-entry-page:not(.viewing-memories) .space-sidebar{grid-column:1;grid-row:1;position:sticky;top:0;height:100dvh;padding:43px 21px 24px}
body.video-entry-page:not(.viewing-memories) .library-brand-slot{display:block;padding:0 13px;margin-bottom:39px}
body.video-entry-page:not(.viewing-memories) .library-brand-slot .workspace-brand{display:inline-block;font-size:27px;line-height:1.5;letter-spacing:.12em}
body.video-entry-page:not(.viewing-memories) .space-sidebar-caption{margin:10px 0 0;font-size:10px;line-height:1.8;letter-spacing:.055em}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-nav{gap:7px}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-nav-item{min-height:47px;padding:12px 13px;gap:12px;border-radius:12px;font-size:13px}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-sidebar-bottom{padding:32px 0 0}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-storage{padding:0 12px 23px}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-storage>span{flex-direction:row;justify-content:space-between;gap:8px;font-size:10px;line-height:1.7}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-storage progress{margin-top:9px}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-account{display:flex;gap:8px;margin:0;padding:17px 2px 0;border-top:1px solid var(--space-line)}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-account>div{flex:1;min-width:0}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-account strong{font-size:12px;line-height:1.6;white-space:nowrap}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-account small{font-size:8px;line-height:1.5;white-space:nowrap}
body.video-entry-page:not(.viewing-memories) .space-sidebar .space-icon-button{width:28px;height:32px;flex:none;padding:6px}
body.video-entry-page:not(.viewing-memories) .space-main{grid-column:2;grid-row:1;min-height:100dvh;max-width:1264px;padding:30px clamp(28px,3.6vw,52px) 0}
body.video-entry-page:not(.viewing-memories) .library-topline{display:flex;justify-content:flex-end;flex:none;min-height:38px;margin:0 0 32px}
body.video-entry-page:not(.viewing-memories) .library-topline .workspace-tabs{display:flex;justify-content:flex-end;gap:4px;margin:0;width:auto;padding:0;border:0;background:none;border-radius:0;box-shadow:none}
body.video-entry-page:not(.viewing-memories) .library-topline .workspace-tabs a{display:inline-flex;align-items:center;min-height:38px;padding:10px 15px;font-size:12px;letter-spacing:0;color:var(--space-muted);text-decoration:none;border:0;border-radius:24px;background:none;transition:background .2s,color .2s}
body.video-entry-page:not(.viewing-memories) .library-topline .workspace-tabs a[aria-current=page]{background:rgba(235,205,214,.4);color:var(--space-ink);font-weight:500}
body.video-entry-page:not(.viewing-memories) .library-topline .workspace-tabs a:hover{background:rgba(235,205,214,.25);color:var(--space-ink)}
body.video-entry-page:not(.viewing-memories) .library-topline [data-space-link=memories]:after{content:' ↗';margin-left:5px}
body.video-entry-page:not(.viewing-memories) #spacePage .space-heading{margin-bottom:30px}
body.video-entry-page:not(.viewing-memories) #spacePage .category-gallery{grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:34px 30px}
@media(max-width:1050px) and (min-width:761px){
 body.video-entry-page:not(.viewing-memories) .space-shell{grid-template-columns:204px minmax(0,1fr)!important}
 body.video-entry-page:not(.viewing-memories) .space-sidebar{padding-inline:16px}
 body.video-entry-page:not(.viewing-memories) .space-main{padding-inline:28px}
}
@media(max-width:760px){
 body.video-entry-page:not(.viewing-memories) .space-shell{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr)}
 body.video-entry-page:not(.viewing-memories) .space-sidebar{display:grid;position:relative;top:auto;grid-column:1;grid-row:1;grid-template-columns:minmax(0,1fr) auto;gap:13px 12px;height:auto;padding:max(16px,env(safe-area-inset-top)) 18px 12px;border-right:0}
 body.video-entry-page:not(.viewing-memories) .library-brand-slot{grid-column:1;grid-row:1;padding:0;margin:0}
 body.video-entry-page:not(.viewing-memories) .library-brand-slot .workspace-brand{font-size:25px}
 body.video-entry-page:not(.viewing-memories) .space-sidebar-caption{display:none}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-nav{grid-column:1/-1;grid-row:2;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-nav-item{justify-content:center;min-height:42px;padding:9px 5px;gap:7px;font-size:11px}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-sidebar-bottom{grid-column:2;grid-row:1;display:grid;gap:1px;max-width:205px;padding:0;margin:0}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-account{grid-row:1;gap:5px;border:0;padding:0}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-account>div{max-width:100px}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-account strong{font-size:10px}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-avatar{display:none}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-storage{grid-row:2;padding:0 2px}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-storage>span{justify-content:flex-end;gap:7px;font-size:8px}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-storage progress{display:none}
 body.video-entry-page:not(.viewing-memories) .space-main{grid-column:1;grid-row:2;min-height:calc(100dvh - 116px);padding:19px 20px 0}
 body.video-entry-page:not(.viewing-memories) .library-topline{min-height:34px;margin-bottom:25px}
 body.video-entry-page:not(.viewing-memories) .library-topline .workspace-tabs a{font-size:11px;padding:9px 12px}
}

/* One persistent space switcher: same anchor, dimensions and selection style.
   It stays outside the page panels and is never moved during route changes. */
body.video-entry-page{--switcher-width:192px;--switcher-edge:max(clamp(28px,calc(var(--workspace-viewport-width,100vw) * .036),52px),calc((var(--workspace-viewport-width,100vw) - 1488px)/2 + 52px))}
body.video-entry-page .workspace-switcher{position:fixed;z-index:30;top:30px;left:calc(var(--workspace-viewport-width,100vw) - var(--switcher-edge) - var(--switcher-width));right:auto;display:flex;align-items:center;justify-content:flex-end;gap:4px;width:var(--switcher-width);height:44px;max-width:calc(100% - 40px);margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;letter-spacing:0}
body.video-entry-page .workspace-switcher a{display:inline-flex;align-items:center;justify-content:center;flex:1;min-width:0;height:44px;min-height:44px;padding:10px 14px;border:0;border-radius:24px;background:transparent;box-shadow:none;color:var(--space-muted);font:500 12px/1.4 'DM Sans','Noto Sans SC',sans-serif;letter-spacing:0;white-space:nowrap;text-decoration:none;transition:background .18s ease,color .18s ease}
body.video-entry-page .workspace-switcher a[aria-current=page]{background:rgba(235,205,214,.4);color:var(--space-ink);text-decoration:none}
body.video-entry-page .workspace-switcher a:hover{background:rgba(235,205,214,.25);color:var(--space-ink)}
body.video-entry-page .workspace-switcher a:after{content:none}
body.video-entry-page .workspace-switcher a:focus-visible{outline:2px solid var(--space-accent);outline-offset:3px}
body.video-entry-page.viewing-memories .workspace-header{grid-template-columns:auto minmax(0,1fr);gap:20px;position:relative;border-bottom:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;padding-right:calc(252px + clamp(28px,3.6vw,52px))}
body.video-entry-page.viewing-memories .workspace-header .space-account{justify-self:start}
@media(max-width:760px){
 body.video-entry-page{--switcher-width:184px;--switcher-edge:max(20px,env(safe-area-inset-right))}
 body.video-entry-page .workspace-switcher{top:max(64px,calc(env(safe-area-inset-top) + 56px));height:40px}
 body.video-entry-page .workspace-switcher a{height:40px;min-height:40px;font-size:11px;padding:9px 12px}
 body.video-entry-page:not(.viewing-memories) .space-sidebar{grid-template-rows:48px 44px auto;gap:8px 12px;padding-top:max(8px,env(safe-area-inset-top))}
 body.video-entry-page:not(.viewing-memories) .space-sidebar .space-nav{grid-row:3}
 body.video-entry-page:not(.viewing-memories) .library-topline{display:none}
 body.video-entry-page.viewing-memories .workspace-header{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:48px 48px;gap:3px 12px;padding:max(8px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) 8px max(18px,env(safe-area-inset-left))}
 body.video-entry-page.viewing-memories .workspace-header .space-account{justify-self:end}
}

/* The house title takes the former brand/account position, without a duplicate
   title in the photo section. Library identity/account controls stay in its sidebar. */
body.video-entry-page.viewing-memories .workspace-header{grid-template-columns:minmax(0,1fr)}
.memory-page-heading{margin:0;color:var(--space-ink);font:400 28px/1.4 'Noto Serif SC',serif;letter-spacing:.1em;justify-self:start}
.memory-page-heading:focus{outline:none}
body.viewing-memories .house-stage .house-header{justify-content:flex-end}
@media(max-width:760px){
 .memory-page-heading{grid-column:1;grid-row:1;font-size:25px;letter-spacing:.08em}
 body.video-entry-page.viewing-memories .workspace-header{grid-template-columns:minmax(0,1fr);grid-template-rows:48px 48px}
}

/* Photographs remain clean; titles and dates are available in the viewer. */
body .house-stage .house-photo-front:after{content:none}
body .house-stage .house-photos[data-photo-mode=heart] .house-photo-front{border-color:rgba(255,255,255,.65);box-shadow:0 4px 11px rgba(35,58,53,.2)}
body .house-stage .house-photo-back{padding:0;background:linear-gradient(140deg,var(--space-panel),var(--space-soft))}
body .house-stage .house-photos[data-photo-mode=cloud] .house-photo-front{border-color:rgba(255,255,255,.35);box-shadow:0 8px 19px rgba(25,41,34,.2)}

/* Put the lower-left mode dock above the footer signature. Keep their total
   reserved height unchanged so the photo scene does not shrink or move. */
body.viewing-memories .house-stage .house-photo-tools{position:fixed;left:max(20px,env(safe-area-inset-left));bottom:max(56px,calc(env(safe-area-inset-bottom) + 44px));right:auto;top:auto;z-index:20;display:flex;align-items:flex-start;flex-wrap:nowrap;gap:0;width:max-content;max-width:calc(100vw - 40px);margin:0;grid-row:auto}
body.viewing-memories .house-stage .house-photos{grid-row:3}
body.viewing-memories .house-stage .house-photo-tools .house-paging{position:absolute;left:calc(100% + 12px);bottom:4px;margin:0}
/* Keep the footer's transparent reserved area below the interactive gallery.
   Its positioned box otherwise intercepted pointer clicks on the fixed dock. */
body.video-entry-page.viewing-memories .space-main .space-footer{position:relative;z-index:0;flex:none;margin-top:12px;padding:76px 0 max(10px,env(safe-area-inset-bottom));border-top-color:transparent}
body.video-entry-page.viewing-memories .space-main .space-footer:before{content:'';position:absolute;left:0;right:0;bottom:calc(max(10px,env(safe-area-inset-bottom)) + 24px);height:1px;background:var(--space-line);pointer-events:none}
body .house-stage .house-photos[data-photo-mode=cloud] .house-photo-front{border-color:rgba(255,255,255,.4);box-shadow:0 8px 22px rgba(15,28,25,.24)}
@media(max-width:760px){
 body.viewing-memories .house-stage .house-photo-tools{left:max(16px,env(safe-area-inset-left));bottom:max(44px,calc(env(safe-area-inset-bottom) + 36px));max-width:calc(100vw - 32px)}
 body.viewing-memories .house-stage .house-photo-tools .house-paging{left:calc(100% + 8px);bottom:6px}
}
@media(max-width:359px){body.viewing-memories .house-stage .house-photo-tools .house-paging{left:0;bottom:calc(100% + 10px)}}

/* The house is a viewport-sized gallery. The grid budgets room for the clock,
   footer and fixed dock; the photo engine fits/paginates the remaining cell. */
@media(max-width:760px){
 body.video-entry-page.viewing-memories .space-shell{grid-template-rows:auto minmax(0,1fr)}
 body.video-entry-page.viewing-memories .workspace-header{height:auto;min-height:112px;grid-template-rows:48px 44px;row-gap:4px}
 body.video-entry-page.viewing-memories .space-main{height:100%;min-height:0;padding-top:8px}
 body.viewing-memories .house-stage .house-anniversary{padding:10px 12px}
 body.video-entry-page.viewing-memories .space-main .space-footer{margin-top:8px;padding-top:72px;padding-bottom:max(8px,env(safe-area-inset-bottom))}
 body.video-entry-page.viewing-memories .space-main .space-footer:before{bottom:calc(max(8px,env(safe-area-inset-bottom)) + 24px)}
}
@media(max-height:620px){
 body.video-entry-page.viewing-memories .space-main{padding-top:8px}
 body.viewing-memories .house-stage{grid-template-rows:36px auto minmax(0,1fr);gap:8px}
 body.viewing-memories .house-stage .house-header-actions button{min-height:36px;padding-block:6px}
 body.viewing-memories .house-stage .house-anniversary{padding:7px 16px}
 body.viewing-memories .house-stage .house-anniversary h2{font-size:13px}
 body.viewing-memories .house-stage .house-clock b{font-size:21px}
 body.video-entry-page.viewing-memories .space-main .space-footer{margin-top:6px;padding-bottom:max(6px,env(safe-area-inset-bottom))}
}
@media(max-width:359px){body.video-entry-page.viewing-memories:has(#memoryPaging:not(.hidden)) .space-main .space-footer{padding-top:112px}}

/* Align only the right edge; each action retains its natural button width. */
body.viewing-memories .house-stage .house-header-actions{position:fixed;z-index:16;top:84px;left:auto;right:var(--switcher-edge);display:flex;gap:8px;width:max-content;margin:0}
body.viewing-memories .house-stage .house-header-actions button{width:auto;min-width:0;padding-inline:16px;font-size:11px}
@media(max-width:760px){
 body.viewing-memories .house-stage .house-header-actions{top:max(120px,calc(env(safe-area-inset-top) + 112px))}
 body.viewing-memories .house-stage .house-header-actions button{padding-inline:10px;font-size:10px}
}
@media(min-width:761px) and (max-height:620px){body.viewing-memories .house-stage .house-header-actions{top:80px}}

/* A themed, keyboard-accessible sort list replaces the operating-system popup. */
body .space-sort{position:relative}
body #sortSelect[hidden]{display:none}
.space-sort-trigger{display:flex;align-items:center;gap:9px;min-height:40px;padding:7px 0 7px 10px;border:0;border-radius:10px;background:transparent;color:var(--space-muted);font:inherit;font-size:12px;white-space:nowrap}
.space-sort-trigger svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;transition:transform .18s ease}
.space-sort-trigger[aria-expanded=true] svg{transform:rotate(180deg)}
.space-sort-trigger:hover{color:var(--space-ink)}
.space-sort-trigger:disabled{cursor:default;opacity:.6}
.space-sort-trigger:focus-visible{outline:2px solid var(--space-accent);outline-offset:4px}
.space-sort-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:40;display:grid;gap:3px;width:168px;max-width:calc(100vw - 40px);padding:6px;overflow-y:auto;scrollbar-width:thin;border:1px solid var(--space-line);border-radius:15px;background:rgba(255,252,248,.97);box-shadow:0 12px 34px rgba(42,65,56,.13);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.space-sort-menu[hidden]{display:none}
.space-sort-menu.opens-up{top:auto;bottom:calc(100% + 8px)}
.space-sort-menu button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:36px;padding:8px 12px;border:0;border-radius:9px;background:transparent;color:var(--space-muted);font:inherit;font-size:12px;text-align:left;white-space:nowrap}
.space-sort-menu button:hover,.space-sort-menu button:focus-visible{background:rgba(227,184,197,.16);color:var(--space-ink);outline:none}
.space-sort-menu button[aria-selected=true]{background:rgba(227,184,197,.25);color:var(--space-ink)}
.space-sort-menu button[aria-selected=true]:after{content:'✓';color:var(--space-accent)}
html[data-space-theme=dark] .space-sort-menu{background:rgba(32,50,41,.97)}
@media(max-width:760px){.space-sort-trigger{font-size:11px}}

/* Compact category deletion: reveal only the fields required by the choice. */
#deleteCategoryDialog{width:min(400px,calc(100% - 28px));padding:24px;border-radius:20px}
#deleteCategoryDialog form{gap:12px}
#deleteCategoryDialog h2{font-size:22px}
#deleteCategoryDialog .delete-options{gap:7px}
#deleteCategoryDialog .delete-options legend{margin-bottom:9px;font-size:11px;color:var(--space-muted)}
#deleteCategoryDialog .delete-choice{align-items:center;min-height:39px;padding:8px 11px;border:1px solid var(--space-line);border-radius:11px;font-size:12px;cursor:pointer}
#deleteCategoryDialog .delete-choice:has(input:checked){background:rgba(227,184,197,.14);border-color:rgba(190,126,148,.45)}
#deleteCategoryDialog .delete-choice input{margin:0;flex:none}
#deleteCategoryDialog #deleteMoveLabel{display:grid;gap:5px;margin:0 0 3px 25px;font-size:10px}
#deleteCategoryDialog .delete-mode-hint{margin:0;color:var(--space-muted);font-size:11px;line-height:1.7}
#deleteCategoryDialog #deleteConfirmLabel{gap:8px;align-items:center;font-size:11px}
#deleteCategoryDialog #deleteConfirmLabel.hidden{display:none!important}
#deleteCategoryDialog #deleteConfirmLabel input{margin:0;flex:none}
#deleteCategoryDialog footer{margin-top:2px;padding-top:14px}
#deleteCategoryDialog footer .space-button{min-height:40px;padding:9px 14px;font-size:11px}
@media(max-width:760px){#deleteCategoryDialog{padding:22px}}

/* Personal settings use the same quiet surfaces as the library. */
body.video-entry-page .space-account #userAvatar{display:inline-flex!important;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border:0;padding:0;border-radius:50%;overflow:hidden;cursor:pointer;background:#f2dce3;color:#a96c81}
#userAvatar img,#profileAvatarPreview img{width:100%;height:100%;object-fit:cover;display:block}
#userAvatar:focus-visible{outline:2px solid #b87990;outline-offset:3px}
#profileDialog{max-width:440px;padding:28px;border-radius:22px}
#profileDialog form{display:grid;gap:16px}
#profileDialog h2{font-size:26px}
#profileDialog label small,#profileDialog .profile-avatar-row small{display:block;font-size:11px;color:var(--space-muted,#81908a);margin-top:5px}
.profile-avatar-row{display:flex;align-items:center;gap:18px}
#profileAvatarPreview{display:flex;align-items:center;justify-content:center;width:72px;height:72px;flex:none;border:0;border-radius:50%;padding:0;overflow:hidden;background:#f2dce3;color:#a96c81;font-size:26px;cursor:pointer}
#profileDialog #chooseAvatar{padding:8px 14px;min-height:36px;font-size:12px}
.profile-remove{border:0;background:none;color:#b87990;padding:8px 10px;cursor:pointer;font:inherit;font-size:12px}
#profileDialog input[hidden]{display:none!important}
@media(max-width:600px){#profileDialog{padding:24px 20px;max-height:calc(100dvh - 32px)}}

/* Authenticated navigation paints immediately after server verification. */
body.video-entry-page.workspace-ready .space-shell{opacity:1;transition:none}

/* Login errors float above the card and never move the form. */
#authModal #authMessage{display:none!important}
.auth-notice{position:fixed;z-index:10000;top:max(24px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;box-sizing:border-box;width:max-content;max-width:calc(100vw - 32px);padding:13px 15px;border:1px solid rgba(183,120,143,.24);border-radius:14px;background:rgba(255,249,251,.97);color:#865367;box-shadow:0 8px 32px rgba(64,38,49,.13);font:500 14px/1.6 'DM Sans','Noto Sans SC',sans-serif;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.auth-notice[hidden]{display:none!important}
.auth-notice-icon{display:grid;place-items:center;width:21px;height:21px;flex:none;border-radius:50%;background:#f1dce4;color:#a2667d;font-size:13px;font-weight:700}
#authNoticeText{overflow-wrap:anywhere;min-width:0}

/* A light tactile press, with a quick release and no hover lift. */
body.video-entry-page #authForm #authSubmit{transform:none!important;opacity:1;cursor:pointer;touch-action:manipulation;background:#ba7e93;border:1px solid rgba(255,255,255,.32);box-shadow:0 2px 7px rgba(138,84,103,.11);transition:transform 90ms cubic-bezier(.2,.7,.3,1),background-color 90ms ease,box-shadow 90ms ease,border-color 90ms ease!important;will-change:auto}
body.video-entry-page #authForm #authSubmit:hover{transform:none!important;background:#b5768c;box-shadow:0 2px 7px rgba(138,84,103,.11)}
body.video-entry-page #authForm #authSubmit:active{transform:translateY(1px) scale(.985)!important;background:#aa6d83;border-color:rgba(255,255,255,.22);box-shadow:inset 0 1px 2px rgba(89,41,59,.12),0 0 0 3px rgba(186,126,147,.10)}
body.video-entry-page #authForm #authSubmit[aria-busy=true]{opacity:1;cursor:pointer}

@media(prefers-reduced-motion:reduce){body.video-entry-page #authForm #authSubmit{transition:none!important}body.video-entry-page #authForm #authSubmit:active{transform:none!important}}

/* Decode thumbnails before revealing them; a pending request is never a black card. */
body .house-stage .house-photo-front{background:var(--space-panel,#f5efef)}
body .house-stage .house-photo-front img{opacity:0;transition:opacity 140ms ease}
body .house-stage .house-photo[data-image-state=ready] .house-photo-front img{opacity:1}
body .house-stage .house-photo:not([data-image-state=ready]) .house-photo-front,
body .house-stage .house-photo:not([data-image-state=ready]) .house-photo-back{box-shadow:0 3px 12px rgba(55,55,55,.08);background:var(--space-panel,#f5efef);border-color:var(--space-line,#e4dddd)}
body .house-stage .house-photo:not([data-image-state=ready]) .house-photo-front:before{content:'';position:absolute;inset:calc(50% - 3px);border-radius:50%;background:var(--space-accent,#ba7e93);opacity:.35}
body .house-stage .house-photo[data-image-state=error] .house-photo-front:before{content:'↻';inset:0;display:grid;place-items:center;background:none;color:var(--space-muted);font-size:22px;opacity:.8}
body .house-stage .house-stage-status{color:var(--space-muted,#80908a)}
@media(prefers-reduced-motion:reduce){body .house-stage .house-photo-front img{transition:none}}

body .house-stage .house-modes button{transition:background-color 120ms ease-out,color 120ms ease-out}
@media(prefers-reduced-motion:reduce){body .house-stage .house-modes button{transition:none}}