.mars-player {
  position: fixed;
  right: max(25px, env(safe-area-inset-right));
  bottom: max(24px, env(safe-area-inset-bottom));
  z-index: 50;
  width: 344px;
  padding: 14px 17px 13px;
  border: 1px solid #b8c4d32e;
  border-radius: 16px;
  background: var(--radio-bg);
  box-shadow: 0 14px 65px #0006;
  color: var(--radio-text);
  font: 12px/1.5 var(--sans);
  max-height: calc(100dvh - 24px - env(safe-area-inset-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
}
@supports (backdrop-filter: blur(15px)) {
  .mars-player { background: var(--radio-bg); backdrop-filter: blur(15px); }
}
.radio-symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
.radio-heading { display: flex; justify-content: space-between; align-items: center; }
.radio-heading > span { font-size: 8px; letter-spacing: .23em; color: var(--radio-accent); }
.radio-light { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #8391a5; margin-right: 9px; }
[data-state="playing"] .radio-light { background: #d6bd8a; box-shadow: 0 0 10px #dfbe8377; }
.radio-now { display: flex; gap: 14px; align-items: center; margin: 7px 0 10px; }
.radio-track-copy { flex: 1; min-width: 0; }
#mars-title { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#mars-artist { color: var(--radio-muted); font-size: 10px; margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.radio-orbit { font-size: 31px; font-weight: 200; color: var(--radio-muted); margin-right: 4px; }
.radio-controls { display: flex; gap: 5px; align-items: center; }
.radio-icon { flex: 0 0 32px; width: 32px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: var(--radio-text); padding: 0; cursor: pointer; touch-action: manipulation; }
.radio-icon svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.radio-icon:hover { background: #ffffff0c; }
.radio-icon:focus-visible, #mars-volume:focus-visible { outline: 2px solid var(--radio-accent); outline-offset: 3px; }
.radio-play { flex-basis: 38px; width: 38px; height: 38px; border: 1px solid #ccb78f99; border-radius: 50%; color: var(--radio-accent); }
.radio-fold { height: 26px; }
.radio-fold[aria-expanded="true"] svg { transform: rotate(180deg); }
#mars-status { flex: 1; min-width: 0; padding: 0 5px; color: var(--radio-muted); font-size: 9px; line-height: 1.7; }
.radio-details { border-top: 1px solid #b4c3d322; padding-top: 15px; margin-top: 13px; }
#mars-track-count { font-size: 7px; letter-spacing: .08em; color: var(--radio-muted); }
.radio-volume { display: flex; align-items: center; gap: 12px; margin-top: 14px; font-size: 10px; color: var(--radio-muted); }
.radio-volume > label { flex-shrink: 0; white-space: nowrap; }
#mars-volume { flex: 1; width: auto; min-width: 0; height: 32px; margin: 0; accent-color: var(--radio-accent); cursor: pointer; }
#mars-volume-value { min-width: 32px; text-align: right; font-variant-numeric: tabular-nums; }
.radio-hint { color: var(--radio-muted); font-size: 9px; margin-top: 9px; }
.radio-noscript { padding: 20px 8%; font-size: 12px; color: var(--quiet); }
@media (max-width: 700px) {
  .about-page .about-hero { padding-top: 60px; }
  .about-page .about-hero > p:not(.eyebrow) { font-size: 13px; }
  .about-page .chapter-body .lead { font-size: 20px; }
  .about-page .chapter-body > p:not(.lead) { font-size: 14px; }
  .interest-line strong { font-size: 23px; }
  .mars-player { width: min(344px, calc(100% - 24px)); right: max(12px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); padding: 12px 14px; }
  .radio-icon { min-width: 34px; height: 40px; }
  .radio-play { height: 40px; }
  #mars-status { font-size: 9px; padding: 0 2px; }
  #mars-title { font-size: 14px; }
}

/* Self-contained colors avoid page-local variables changing player legibility. */
.mars-player { --radio-bg:#101b2cf5; --radio-text:#e8edf5; --radio-muted:#b4c1d3; --radio-accent:#e1c89c; --radio-field:#101827; --sans:"Segoe UI","Microsoft YaHei",sans-serif; box-sizing:border-box; transition:background-color .4s,color .4s,border-color .4s; }
.mars-player[data-theme="love"] { --radio-bg:#fff9f1f5; --radio-text:#543c3f; --radio-muted:#785b60; --radio-accent:#92505c; --radio-field:#fffaf5; border-color:#bd8f8c66; box-shadow:0 14px 60px #76514926; }
.mars-player p { margin:0; }
.mars-player button { font-family:var(--sans); letter-spacing:normal; }
.mars-player [hidden] { display:none!important; }
.mars-player input { accent-color:var(--radio-accent); }
.mars-player :focus-visible { outline:2px solid var(--radio-accent); outline-offset:3px; }
.radio-play { border-color:var(--radio-accent); }
.radio-details { border-color:color-mix(in srgb,var(--radio-muted) 25%,transparent); }
.radio-progress { display:flex; align-items:center; gap:8px; margin-top:12px; font-size:10px; color:var(--radio-muted); }
#mars-progress { flex:1; width:0; height:30px; }
.radio-repeat { padding:6px 10px; margin-top:8px; color:var(--radio-accent); background:transparent; border:1px solid currentColor; border-radius:6px; cursor:pointer; }
.memory-feature .memory-date { font-family:Georgia,serif; font-size:clamp(32px,6vw,60px); line-height:1.2; color:#975564; letter-spacing:-.04em; margin-bottom:22px; }
.memory-feature > p:not(.memory-date) { white-space:pre-wrap; line-height:2.15; max-width:66ch; }
.memory-entry .story-photo { display:block; width:min(100%,520px); max-height:none; height:auto; object-fit:contain; border-radius:5px; margin:30px 0 0; box-shadow:0 15px 45px #69432f1c; }
#timeline-description:empty { display:none; }
@media(max-width:700px) { .mars-player { width:min(344px,calc(100% - 24px)); } .radio-icon { min-width:40px; height:44px; } }
@media(prefers-reduced-motion:reduce) { .mars-player, .mars-player * { transition:none!important; animation:none!important; } }

.memory-entry.memory-feature { width:100%; margin-left:0; padding:clamp(23px,4vw,44px); }
.memory-entry.memory-feature:before { display:none; }
.memory-entry.memory-feature > p:not(.memory-date) { font-size:15px; }
@media(max-width:700px) { .memory-entry.memory-feature { margin-left:27px; width:calc(100% - 27px); } .memory-feature:before { left:-32px; } .memory-entry.memory-feature > p:not(.memory-date) { font-size:14px; } }
/* All sizes belong to the fixed layer; no body or page-content layout reservation. */
.radio-heading-actions { display:flex; align-items:center; gap:7px; }
.radio-hide { border:0; padding:5px 7px; background:transparent; color:var(--radio-muted); font-size:10px; cursor:pointer; }
.radio-hide:hover { color:var(--radio-accent); }
.radio-mini { display:flex; align-items:center; gap:8px; }
.radio-mini-copy { flex:1; min-width:0; }
#mars-mini-title { font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#mars-mini-status { font-size:10px; color:var(--radio-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:3px; }
.mars-player[data-concealed="true"] { width:min(292px,calc(100% - 24px)); padding:10px 12px; }
.radio-mini .radio-icon { flex-shrink:0; width:44px; height:44px; flex-basis:44px; }
.mars-player :is(button,input,p) { transition:color .4s,background-color .4s,border-color .4s; }
.mars-player .radio-light { transition:background-color .4s; }
.mars-player[data-theme="love"] [data-state="playing"] .radio-light,
.mars-player[data-theme="love"][data-state="playing"] .radio-light { background:var(--radio-accent); box-shadow:0 0 10px #92505c33; }
.radio-details { max-height:max(72px,min(360px,calc(100dvh - 220px - env(safe-area-inset-top) - env(safe-area-inset-bottom)))); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--radio-accent) transparent; }
.radio-list-heading { display:flex; justify-content:space-between; align-items:center; color:var(--radio-muted); margin-bottom:8px; }
.radio-playlist { list-style:none; margin:0; padding:0; max-height:180px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--radio-accent) transparent; }
.radio-track { display:flex; align-items:center; gap:10px; width:100%; min-height:48px; text-align:left; border:1px solid transparent; border-radius:7px; color:var(--radio-text); background:transparent; cursor:pointer; padding:7px 8px; }
.radio-track-number { color:var(--radio-muted); font-size:9px; font-variant-numeric:tabular-nums; flex:0 0 17px; }
.radio-track-text { min-width:0; flex:1; }
.radio-track-name,.radio-track-artist { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.radio-track-name { font-size:11px; }
.radio-track-artist { font-size:10px; color:var(--radio-muted); margin-top:2px; }
.radio-track:hover { background:var(--radio-field); }
.radio-track[aria-current="true"] { color:var(--radio-accent); border-color:var(--radio-accent); background:var(--radio-field); }
.radio-track[aria-current="true"] .radio-track-number { color:var(--radio-accent); }
.mars-player[data-state="playing"] .radio-light { animation:radio-breathe 2.8s ease-in-out infinite; }
@keyframes radio-breathe { 50% { opacity:.55; } }
@media(max-width:700px) { .radio-hide { min-width:44px; min-height:44px; } }
@media(prefers-reduced-motion:reduce) { .mars-player :is(button,input,p) { transition:none; } }
