/* Optional atmosphere dock; compact and collapsed by default. */
.atmo-dock { position: fixed; z-index: 100; right: 12px; bottom: 8px; width: min(420px, calc(100vw - 24px)); color: var(--aubergine); background: var(--page); border: 2px solid var(--aubergine); box-shadow: -3px 4px 0 var(--aubergine); font: 700 .82rem/1.25 var(--f-form); }
.atmo-dock summary { min-height: 44px; display: flex; align-items: center; padding: 8px 12px; cursor: pointer; list-style-position: inside; }
.atmo-dock summary:focus-visible, .atmo-button:focus-visible, .atmo-volume input:focus-visible { outline: 3px solid var(--pink); outline-offset: 2px; }
.atmo-panel { padding: 0 9px 7px; }
.atmo-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.atmo-button { min-height: 44px; padding: 8px 10px; color: var(--aubergine); background: var(--paper); border: 2px solid var(--aubergine); font: inherit; cursor: pointer; }
.atmo-button[aria-pressed="true"] { background: var(--lime); }
.atmo-volume { min-height: 44px; display: flex; gap: 7px; align-items: center; }
.atmo-volume input { width: 92px; min-height: 44px; accent-color: var(--aubergine); }
.atmo-status { margin: 5px 2px 0; font-size: .72rem; }
html.atmo-ready body { padding-bottom: 66px; }
.atmo-motion-live { animation: atmo-puppet 2.8s steps(6, end) infinite; }
@keyframes atmo-puppet { 0%, 100% { translate: 0 0; rotate: 0deg; } 30% { translate: 0 -2px; rotate: .18deg; } 65% { translate: 0 1px; rotate: -.18deg; } }
@media (max-width: 480px) { .atmo-dock { right: 8px; bottom: 8px; width: calc(100vw - 16px); } .atmo-panel { padding-inline: 7px; } .atmo-row { gap: 5px; } .atmo-button { flex: 1 1 auto; padding-inline: 8px; } .atmo-volume { flex: 1 1 100%; } .atmo-volume input { flex: 1; width: auto; } }
@media (prefers-reduced-motion: reduce) { .atmo-motion-live { animation: none !important; } }
html.motion-off .atmo-motion-live { animation: none !important; }
@media print { html.atmo-ready body { padding-bottom: 0; } .atmo-dock { display: none !important; } }

.atmo-dock:not([open]){width:max-content;max-width:calc(100vw - 24px)}
.atmo-dock summary::after{content:"+";margin-left:auto;padding-left:18px;font-size:1.1rem}
.atmo-dock[open] summary::after{content:"−"}