/* 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:900px){
 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:900px){
 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:901px) 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:901px){
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:52dvh!important;bottom:auto!important;transform:translateY(-50%)!important;max-height:min(68dvh,calc(100dvh - 240px))!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;}

/* Shared reading composition; the page keeps its existing text sizes. */
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#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-note-paper{padding-inline:32px!important;scrollbar-gutter:stable!important;overscroll-behavior:contain;}
@media(min-width:901px),(max-height:500px){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#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-controls{left:50vw!important;right:auto!important;transform:translateX(-50%)!important;}}
@media(max-width:900px) and (min-height:501px){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#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-note .favorite-note-paper{left:20px!important;right:20px!important;width:auto!important;max-width:none!important;top:43dvh!important;bottom:calc(82px + env(safe-area-inset-bottom,0px))!important;height:auto!important;max-height:none!important;transform:none!important;padding:22px!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#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-controls{top:25dvh!important;bottom:auto!important;}}

@media(max-width:900px) and (max-height:500px){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#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-note .favorite-note-paper{left:52vw!important;right:20px!important;width:auto!important;max-width:none!important;top:52dvh!important;bottom:auto!important;max-height:calc(100dvh - 170px)!important;transform:translateY(-50%)!important;padding:18px!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#detail#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-controls{top:auto!important;bottom:64px!important;}}

@media(max-width:900px) and (min-height:501px){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#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-controls{left:20px!important;right:20px!important;width:auto!important;transform:none!important;display:flex!important;justify-content:space-between!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#detail#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-controls>span{display:none!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#detail#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-controls button{position:static!important;min-width:44px!important;min-height:44px!important;}}

@media(max-width:900px) and (max-height:500px){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#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-controls{display:flex!important;visibility:visible!important;opacity:1!important;width:176px!important;height:32px!important;left:50vw!important;right:auto!important;top:auto!important;bottom:44px!important;transform:translateX(-50%)!important;align-items:center!important;justify-content:space-between!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#detail#detail#detail#detail#detail#detail#detail#detail#detail[data-panel^="inspiration-"] .favorite-controls button{display:inline-flex!important;position:static!important;visibility:visible!important;opacity:1!important;width:36px!important;height:32px!important;}}