/* Real native controls aligned to the approved 1536×1024 receiver, without cropping. */
.mess-radio-banner.mess-mini-radio[data-radio-integrated],
.home-page .home-activity-grid .mess-mini-radio[data-radio-integrated]{width:min(100%,650px);max-width:650px;padding:0;overflow:visible}
.mess-radio-banner-placement:has(>[data-radio-integrated]){min-width:0}
.radio-illustration-row{gap:6%;margin-bottom:22px}
.mess-mini-radio[data-radio-integrated] .radio-illustration-row>.mini-radio-artwork,
.radio-retro-receiver .radio-illustration-row>.radio-approved-artwork{flex-basis:64%;width:64%;margin:0;min-width:0}
.radio-illustration-row>.radio-ashtray{flex-basis:30%;width:30%;margin-left:0}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork{position:relative;container-type:inline-size;pointer-events:auto}
.mess-mini-radio[data-radio-integrated] .mini-radio-art-image{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;transform:none}
.mess-mini-radio[data-radio-integrated] .radio-embedded-display [data-mini-title]{font-size:clamp(8.5px,3.6cqw,16px)}

/* The controls layer has no surface; only its actual hit areas receive input. */
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork>.mini-radio-controls{position:absolute;inset:0;z-index:6;display:block;min-width:0;margin:0;padding:0;border:0;background:none;pointer-events:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork>.mini-radio-controls[hidden]{display:none!important}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport{position:absolute;inset:0;display:block;margin:0;padding:0;pointer-events:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button{position:absolute;top:69.7%;left:52.5%;display:block;width:clamp(24px,8.4cqw,44px);min-width:0;height:44px;min-height:44px;max-height:44px;margin:0;padding:0;border:0;border-radius:45%;background:transparent;box-shadow:none;color:transparent;font-size:0;line-height:0;transform:translate(-50%,-50%);filter:none;pointer-events:auto;touch-action:manipulation;cursor:pointer;-webkit-tap-highlight-color:transparent}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button[data-mini-toggle]{left:61.6%;width:clamp(24px,8.4cqw,44px);min-width:0;height:44px;border:0;background:transparent;box-shadow:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button[data-mini-next]{left:70.7%;background:transparent;box-shadow:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button svg{display:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button:hover{background:transparent;box-shadow:none;filter:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button:active{transform:translate(-50%,-50%);background:transparent;box-shadow:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button:focus-visible{outline:2px solid #c4f3ff;outline-offset:2px;box-shadow:0 0 9px #a6eeff4d}
.mess-mini-radio[data-radio-integrated][data-mini-playing="true"] .mini-radio-artwork .mini-radio-transport button[data-mini-toggle]{background:transparent;box-shadow:none}

/* The original metal rims and engraved symbols, with one coherent chrome finish.
   These crops retain the exact receiver geometry; native hit areas remain 44px tall. */
.radio-hardware-finish{position:absolute;inset:0;z-index:4;pointer-events:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button::before,
.radio-approved-artwork .radio-hardware-finish>i{content:"";position:absolute;left:50%;top:50%;width:7.4cqw;height:8.4cqw;border:0;border-radius:50%;background-image:url('assets/radio-mess-receiver-v3.webp');background-size:1351.351351% auto;background-position:52.699784% 72.540046%;background-repeat:no-repeat;filter:grayscale(1) contrast(1.04);transform:translate(-50%,-50%);pointer-events:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button[data-mini-toggle]::before,
.radio-approved-artwork .radio-hardware-finish>i:nth-child(2){background-position:62.526998% 72.540046%}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button[data-mini-next]::before,
.radio-approved-artwork .radio-hardware-finish>i:nth-child(3){background-position:72.354212% 72.540046%}
.radio-approved-artwork .radio-hardware-finish>i{top:69.7%;left:52.5%}
.radio-approved-artwork .radio-hardware-finish>i:nth-child(2){left:61.6%}
.radio-approved-artwork .radio-hardware-finish>i:nth-child(3){left:70.7%}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button:hover::before{filter:grayscale(1) contrast(1.04) brightness(1.12)}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button:active::before{transform:translate(-50%,-50%) scale(.96)}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button[data-mini-toggle]::after{content:"";position:absolute;z-index:1;left:calc(50% + 1.4cqw);top:calc(50% - 2.2cqw);width:clamp(2px,.9cqw,4px);height:clamp(2px,.9cqw,4px);border-radius:50%;background:#3b3b43;box-shadow:0 0 0 1px #c7c3cb66;pointer-events:none}
.mess-mini-radio[data-radio-integrated][data-mini-playing="true"] .mini-radio-artwork .mini-radio-transport button[data-mini-toggle]::after{background:#b9f9e2;box-shadow:0 0 4px #b9f9e299}

/* The range is still native, focusable and keyboard-operable, directly over the knob. */
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-row{position:absolute;left:88%;top:63.5%;z-index:8;display:block;width:20%;height:30%;min-width:44px;min-height:44px;margin:0;padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;transform:translate(-50%,-50%);pointer-events:auto;touch-action:none;cursor:ns-resize;isolation:isolate}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-row::before{content:"";position:absolute;inset:7%;z-index:0;border-radius:50%;pointer-events:none;background-color:#b9aebd;background-image:url('assets/radio-mess-receiver-v3.webp');background-size:581.395349% auto;background-position:95.89372% 68.19407%;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px #f9edf044,inset 0 0 4px #7c657926;opacity:1;transform:rotate(var(--mini-knob-angle,-40.5deg));transform-origin:center}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-row::after{content:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-row:hover,
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-row.is-dragging{box-shadow:0 0 11px #b5eaff35}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-row:focus-within{outline:2px solid #c4f3ff;outline-offset:2px;box-shadow:0 0 9px #a6eeff4d}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume{position:absolute;inset:0;z-index:2;display:block;width:100%;min-width:0;height:100%;min-height:44px;max-height:none;margin:0;padding:0;border:0;border-radius:50%;opacity:0;background:transparent;box-shadow:none;outline:none;pointer-events:auto;cursor:ns-resize;touch-action:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-label,
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-value{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}

/* The neon itself opens the complete radio; no extra labelled button below it. */
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork>.mini-radio-open{position:absolute;left:49%;top:37%;z-index:5;display:block;width:29%;height:24%;max-height:calc(32.7% - 22px);min-height:0;max-width:none;margin:0;padding:0;border:0;border-radius:42%;background:transparent;box-shadow:none;pointer-events:auto}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork>.mini-radio-open>span{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork>.mini-radio-open:hover{background:#ff8dda08;box-shadow:0 0 12px #f195d61a}
.mess-mini-radio[data-radio-integrated] .mini-radio-artwork>.mini-radio-open:focus-visible{outline:2px solid #c4f3ff;outline-offset:2px}
.mess-mini-radio[data-radio-integrated] .mini-radio-console,
.home-page .home-activity-grid .mess-mini-radio[data-radio-integrated] .mini-radio-console{display:block;max-width:620px;margin:7px auto 0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-console>.mini-radio-display{display:block;min-width:0;padding:0;border:0;background:none;box-shadow:none}
.mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-status-row{margin-top:2px}
.mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-progress{margin-top:5px}
.mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-artist{color:#352141}
.mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-status-row{color:#4c345c}
.mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-time{color:#352141}
.mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-progress::-webkit-progress-value{background:#65517b}
.mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-progress::-moz-progress-bar{background:#65517b}
.home-page .mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-artist{color:#e1d0ec}
.home-page .mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-status-row{color:#bfacce}
.home-page .mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-time{color:#e1d0ec}
.home-page .mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-progress::-webkit-progress-value{background:#c2abde}
.home-page .mess-mini-radio[data-radio-integrated] .mini-radio-console .mini-radio-progress::-moz-progress-bar{background:#c2abde}

/* Give both homepage objects equal space, with a larger receiver on interior pages. */
.radio-page-stage>.radio-retro-receiver.space-radio{width:min(100%,780px)}
@media(min-width:1000px){.home-page .home-activity-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-page .home-activity-grid>.mess-radio-banner-placement{padding:22px;align-self:stretch;align-items:center}.home-page .home-activity-grid .mess-mini-radio[data-radio-integrated]{width:min(100%,650px)}}
@media(min-width:1000px) and (max-width:1099px){.home-page .home-activity-grid{grid-template-columns:minmax(0,1fr)}}
@media(min-width:701px) and (max-width:999px){.home-page .home-activity-grid .mess-mini-radio[data-radio-integrated]{width:min(100%,650px)}}

/* Small screens put the ashtray in the foreground, clear of the real volume dial. */
@media(max-width:700px){
 .section-page .mess-radio-banner-placement:has(>[data-radio-integrated]){padding-inline:0}
 .mess-mini-radio[data-radio-integrated] .radio-illustration-row{container-type:inline-size;display:block;gap:0;margin-bottom:calc(6.5% + 10px);padding-top:12px;padding-bottom:20%;align-items:end}
 .mess-mini-radio[data-radio-integrated] .radio-illustration-row>.mini-radio-artwork{width:100%;max-width:none;flex-basis:auto}
 .mess-mini-radio[data-radio-integrated] .radio-illustration-row>.radio-ashtray{position:absolute;right:0;top:calc(12px + 56cqw);width:42%;max-width:none;flex-basis:auto;margin:0}
 /* Frame the original transparent plate around the two physical contact points. */
 .mess-mini-radio[data-radio-integrated] .radio-illustration-row::before{left:-2%;right:-2%;top:calc(12px + 14.3cqw);bottom:auto;height:108cqw;aspect-ratio:auto;background-size:100% 100%;background-position:center}
 .mess-radio-banner.mess-mini-radio[data-radio-integrated],.home-page .home-activity-grid .mess-mini-radio[data-radio-integrated]{width:100%;max-width:650px}
 .mess-mini-radio[data-radio-integrated] .mini-radio-console{margin-top:5px}
}
@media(max-width:340px){.home-page .home-activity-grid>.mess-radio-banner-placement{padding-inline:4px}.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-transport button{width:24px}}
@media(prefers-reduced-motion:reduce){.mess-mini-radio[data-radio-integrated] .mini-radio-artwork .mini-radio-volume-row::after{transition:none}}