/* Desktop specials share a compact object / note composition. */
@media(min-width:1000px){
html body.studio-ui #detail#detail#detail#detail#detail#detail:is([data-panel="edison"],[data-panel="youtube"],[data-panel="akira"],[data-panel="astro"],[data-panel="isle_of_dogs"]) .favorite-note .favorite-note-paper{
left:42vw!important;right:auto!important;top:50dvh!important;bottom:auto!important;transform:translateY(-50%)!important;width:min(38vw,520px)!important;max-width:38vw!important;max-height:calc(100dvh - 220px)!important;
}}

@media(min-width:1000px){
html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail[data-mode="shelf"] .favorite-note .favorite-note-paper{
left:42vw!important;right:auto!important;width:min(40vw,560px)!important;max-width:40vw!important;padding:24px 32px!important;box-sizing:border-box!important;
}
}

/* One inset scrollbar treatment for every personal note, including mobile. */
html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail .favorite-note .favorite-note-paper{
 box-sizing:border-box!important;border:12px solid transparent!important;
 scrollbar-gutter:stable;scrollbar-width:thin;scroll-padding-block:24px;
 transition:background-color .3s,color .3s!important;
}
@media(max-width:700px){
 html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail .favorite-note .favorite-note-paper{
  border-width:8px!important;padding:18px!important;
  bottom:calc(78px + env(safe-area-inset-bottom,0px))!important;
 }
}
/* Date/category metadata uses the same quiet mono hierarchy as the studio. */
html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail:is([data-panel="notes"],[data-panel^="note-"]) :is(.blog-entry-heading,.surface)>.eyebrow{
 font:400 12px/18px 'Studio Mono',monospace!important;
 letter-spacing:0!important;margin:0 0 12px!important;
}
/* Keep long questions browsable; their complete text remains in the button. */
@media(max-width:700px){
 html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail .blog-directory button span{
  display:-webkit-box!important;-webkit-box-orient:vertical;
  -webkit-line-clamp:3;overflow:hidden;min-width:0;
  font:400 14px/20px 'Studio Sans',Arial,sans-serif!important;
 }
}

/* Tablet: spend the spare outer margin on the reading column. */
@media(min-width:701px) and (max-width:999px){
html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail[data-mode="shelf"] .favorite-note .favorite-note-paper{left:54vw!important;right:32px!important;width:auto!important;max-width:none!important;padding:24px 20px!important;}
html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail[data-mode="shelf"] .favorite-note-paper h2{font-size:22px!important;line-height:1.2!important;}
}

/* Keep the note hidden until its incoming object has settled. */
html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-note-paper{visibility:hidden!important;}
html body.studio-ui[data-favorite-ready^="inspiration-"] #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-note-paper{visibility:visible!important;}
@media(min-width:701px){
html body.studio-ui #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-note-paper{left:var(--favorite-note-left,52vw)!important;right:auto!important;width:min(40vw,560px)!important;max-width:40vw!important;top:50dvh!important;bottom:auto!important;transform:translateY(-50%)!important;max-height:calc(100dvh - 280px)!important;}
}

/* Reveal only after the shared object/note composition has arrived. */
@keyframes favorite-note-ready-hotfix18{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:no-preference){
html body.studio-ui[data-favorite-ready^="inspiration-"] #detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-note[open] .favorite-note-paper{animation:favorite-note-ready-hotfix18 300ms ease-out!important;}
}

/* Index owns the surface; underlying project chrome must not reappear when
   stage chrome restores its footer or the music button changes its host. */
html body.studio-ui:has(#detail[open][data-mode="film"]):is([data-audit-index],:has(#studio-index-popup[open]))>footer,
html body.studio-ui:has(#detail[open][data-mode="film"]):is([data-audit-index],:has(#studio-index-popup[open])) :is(#project-music#project-music#project-music,#context-action#context-action#context-action),
html body.studio-ui:has(#detail[open][data-mode="film"]):is([data-audit-index],:has(#studio-index-popup[open]))>.music-dock-glyph{display:none!important;}

html body.studio-ui:has(#detail[open][data-mode="film"]):is([data-audit-index],:has(#studio-index-popup[open])):has(#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail#detail)>footer{display:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;}