/* Light papers stay quiet; the selected palette lives in the photographs. */
:root{--photo-filter:sepia(.12) saturate(1.13);--album-colour:#99381f}
:root[data-theme=merlot]{--paper:#f2e4e5;--ink:#321b23;--muted:#795b63;--accent:#6b233a;--soft:#e8d4d8;--line:rgba(73,17,17,.19);--cover:#eddbdf;--photo-filter:sepia(.42) saturate(1.45) hue-rotate(315deg) brightness(.87);--album-colour:#641c35;color-scheme:light}
:root[data-theme=cocoa]{--paper:#eee4d9;--ink:#35251c;--muted:#7a6454;--accent:#70472f;--soft:#e1d0bf;--line:rgba(69,38,24,.2);--cover:#e6d6c6;--photo-filter:sepia(.65) saturate(.66) brightness(.85);--album-colour:#60412b;color-scheme:light}
.pantry-image,.statement-art>img,.room-picture>img,.detail-scene>img,.find-image>img,.dialog-image{filter:var(--photo-filter)}
.colour-label{position:relative;z-index:2}
.tiny-photos{z-index:1;width:36px;height:40px;left:calc(50% - 18px);bottom:44px;pointer-events:none}
.tiny-photos img{width:35px;height:41px;top:0;left:0;transform:rotate(-5deg);border-width:3px;transition:transform .4s var(--ease),opacity .25s}
.tiny-photos img:nth-child(2){opacity:0;visibility:hidden;transform:rotate(5deg);left:17px;top:7px}
.palette-button.active .tiny-photos{width:60px;height:60px;left:calc(50% - 35px)}
.palette-button.active .tiny-photos img{width:47px;height:58px}
.palette-button.active .tiny-photos img:first-child{transform:rotate(-12deg)}
.palette-button.active .tiny-photos img:nth-child(2){visibility:visible;opacity:1;left:23px;top:6px;transform:rotate(13deg)}
.palette-button.active .colour-label{font-weight:600}
.merlot-photos img{filter:sepia(.4) saturate(1.5) hue-rotate(315deg) brightness(.87)}
.cocoa-photos img{filter:sepia(.65) saturate(.66) brightness(.85)}
.pantry{aspect-ratio:3/4}
.pantry-top{z-index:3;font-size:6px;top:12px;pointer-events:none;text-shadow:0 1px 5px #0009}
.wardrobe-link{position:absolute;width:29.5%;height:29%;z-index:2;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;border-radius:6px;transition:background .2s}
.wardrobe-link>span{font-size:7px;line-height:1.5;padding:4px 7px;border-radius:20px;color:#3f271d;background:#fff3e6e8;box-shadow:0 1px 5px #0002;white-space:nowrap;transition:transform .2s,background .2s}
.wardrobe-link:active{background:#fff2}.wardrobe-link:active>span{transform:scale(.95)}
.wardrobe-link:hover>span{background:#fff9ee}
.shelf-left{left:5%}.shelf-middle{left:35%}.shelf-right{left:65%}
.shelf-one{top:5.5%}.shelf-two{top:37%;height:28%}.shelf-three{top:68%;height:28%}
.bottom-dock{position:fixed;z-index:15;bottom:0;left:50%;transform:translate(-50%,110%);width:min(100%,460px);background:var(--paper);border-top:1px solid var(--line);box-shadow:0 -5px 24px #30211712;padding:7px 17px max(10px,env(safe-area-inset-bottom));opacity:0;transition:transform .4s var(--ease),opacity .3s,background .4s;isolation:isolate}
.bottom-dock.visible{transform:translate(-50%,0);opacity:1}
.mini-player{display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:3}
.bottom-dock .record-control{position:static;inset:auto;transform:none;opacity:1;border:0;box-shadow:none;padding:0;background:none;gap:10px;border-radius:4px}
.bottom-dock .record{width:38px;height:38px;flex:none;background:repeating-radial-gradient(circle,#211a17 0px,#211a17 1px,#3b322b 1.7px,#211a17 2.4px)}
.bottom-dock.visible .record{animation-play-state:running}
.bottom-dock .record-label{background:var(--album-colour);width:17px;height:17px}
.bottom-dock .record-caption{display:flex;gap:4px}
.record-caption b{font-size:12px}.record-caption>span{font-size:6px;letter-spacing:1.1px}
.sound-toggle{display:flex;align-items:center;gap:8px;padding:0 4px;background:none;min-height:44px;font-size:9px;color:var(--muted);white-space:nowrap}
.sound-indicator{position:relative;display:flex;align-items:center;gap:2px;height:16px}
.sound-indicator i{display:block;width:2px;height:4px;background:currentColor;border-radius:4px}
.sound-indicator i:nth-child(2){height:10px}.sound-indicator i:nth-child(3){height:7px}
.sound-indicator:after{content:'';position:absolute;width:18px;height:1px;background:var(--muted);transform:rotate(-45deg);left:-4px}
.audio-on .sound-indicator:after{display:none}
.audio-on .sound-indicator i{animation:sound-drift 1.4s ease-in-out infinite alternate}
.audio-on .sound-indicator i:nth-child(2){animation-delay:-.4s}.audio-on .sound-indicator i:nth-child(3){animation-delay:-.8s}
.bottom-palette{display:none;gap:12px;padding-top:42px;position:relative;z-index:1}
.bottom-dock.tabs-visible .bottom-palette{display:grid}
.bottom-palette .palette-button{padding-bottom:0}
.bottom-palette .colour-label{height:34px;font-size:12px}
.bottom-palette .tiny-photos{bottom:25px;height:33px}
.bottom-palette .tiny-photos img{width:30px;height:35px}
.bottom-palette .palette-button.active .tiny-photos{height:47px;width:52px;left:calc(50% - 29px)}
.bottom-palette .palette-button.active .tiny-photos img{width:38px;height:46px}
.bottom-palette .palette-button.active .tiny-photos img:nth-child(2){left:18px;top:4px}
.bottom-palette .selected-line{height:3px;margin-top:5px}
.closing{padding-bottom:180px}
.toast{bottom:160px}
.album-dialog{border:1px solid var(--line);border-radius:24px;padding:29px 22px 18px;width:calc(100% - 42px);max-width:365px;max-height:90dvh;overflow:auto;background:var(--paper);color:var(--ink);text-align:center;box-shadow:0 18px 90px #0003}
.album-dialog::backdrop{background:#21130a80;backdrop-filter:blur(5px)}
.album-dialog[open]{animation:dialog-in .35s var(--ease)}
.album-close{position:absolute;right:12px;top:10px;width:34px;height:34px;font-size:25px;background:none;color:var(--muted)}
.album-dialog>.eyebrow{font-size:7px;letter-spacing:1.8px}
.album-invitation{font-family:Georgia,serif;font-size:20px;letter-spacing:-.4px;margin:13px 0 24px}
.album-discs{display:grid;grid-template-columns:1fr 1.4fr 1fr;align-items:center;gap:9px;padding-top:7px;min-height:133px}
.album-side{background:none;padding:0;display:flex;align-items:center;flex-direction:column;gap:12px;opacity:.67;transition:transform .3s,opacity .3s}
.album-side:hover{opacity:1;transform:translateY(-4px)}
.disc-surface{display:grid;place-items:center;aspect-ratio:1;width:100%;border-radius:50%;background:repeating-radial-gradient(circle,#1f1917 0px,#1f1917 1px,#39312b 1.6px,#1f1917 2.3px);box-shadow:1px 5px 14px #2b17172e}
.disc-centre{width:41%;aspect-ratio:1;display:grid;place-items:center;background:var(--disc-color,#99381f);border-radius:50%;box-shadow:inset 0 0 0 1px #fff2}
.disc-centre i{width:5px;height:5px;border-radius:50%;background:#edddc6}
.disc-name{font-size:9px}
.album-current{display:flex;align-items:center;flex-direction:column;gap:13px}
.album-current>.disc-surface{animation:record-spin 12s linear infinite}
.now-previewing{font-size:5px;letter-spacing:1.35px;color:var(--muted);white-space:nowrap}
.album-description{min-height:142px;padding-top:15px}
.album-description h2{font-size:34px;line-height:1.1;font-weight:700;letter-spacing:-1.5px}
#album-track{display:block;font-size:8px;letter-spacing:.7px;margin:8px 0 11px;color:var(--muted)}
.album-description p{font-size:10px;line-height:1.8;color:var(--muted);max-width:265px;margin:auto}
.album-paging{display:flex;align-items:center;justify-content:center;gap:26px;padding:9px 0 13px}
.album-paging button{background:none;border:1px solid var(--line);border-radius:50%;width:35px;height:35px;font-size:17px}
.album-paging>span{font-size:8px;letter-spacing:1.4px;color:var(--muted)}
.album-apply{display:flex;align-items:center;justify-content:space-between;width:100%;border-radius:10px;background:#41251d;color:#fff3e0;padding:15px 17px;font-size:12px}
.album-apply span{font-size:18px}.album-apply:active{transform:scale(.98)}
.album-sound{background:none;color:var(--muted);min-height:40px;font-size:8px;margin-top:3px;padding:10px}
@keyframes sound-drift{to{transform:scaleY(.45)}}
@media(prefers-reduced-motion:reduce){.album-current>.disc-surface,.audio-on .sound-indicator i{animation:none}}

/* A self-contained floating music pill; the bottom navigation has no panel. */
:root{--record-art:url('assets/57668.png')}
:root[data-theme=merlot]{--record-art:url('assets/38dfb.png')}
:root[data-theme=cocoa]{--record-art:url('assets/d05ce.png')}
.bottom-dock{background:transparent;border:0;box-shadow:none;pointer-events:none;padding:10px 17px max(13px,env(safe-area-inset-bottom))}
.mini-player{width:210px;max-width:100%;gap:14px;padding:5px 10px 5px 5px;border:1px solid var(--line);border-radius:40px;background:var(--paper);box-shadow:0 3px 15px #30211714;pointer-events:auto}
.bottom-dock .record-control{gap:10px;flex:1;min-width:0}
.bottom-dock .record{width:46px;height:46px;animation-duration:24s}
.bottom-dock .record-label{position:relative;width:35px;height:35px;overflow:hidden;background-image:var(--record-art);background-size:cover;background-position:center;border:1px solid #fff4;filter:var(--photo-filter)}
.bottom-dock .record-label i{position:absolute;left:calc(50% - 2px);top:calc(50% - 2px);width:4px;height:4px;background:#ead7bd;box-shadow:0 0 0 1px #251a1466}
.bottom-dock .record-caption b{font-size:13px;font-weight:600}
.mini-player .sound-toggle{width:36px;min-width:36px;min-height:36px;height:36px;padding:8px;justify-content:center;border:1px solid var(--line);border-radius:50%;color:var(--ink);background:none}
.speaker-playing{display:none}.audio-on .speaker-playing{display:block}.audio-on .speaker-muted{display:none}
.bottom-palette{pointer-events:auto;background:transparent}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.disc-centre{position:relative;overflow:hidden;width:62%;background-image:var(--disc-art);background-size:cover;background-position:center}
.disc-centre i{position:absolute;left:calc(50% - 2.5px);top:calc(50% - 2.5px);box-shadow:0 0 0 1px #261a1480}
.album-current>.disc-surface{animation-duration:24s}
