/* The persistent player belongs to the live header, outside the turning pages. */
.music-player{position:relative;z-index:2;grid-column:3;grid-row:1;justify-self:center;width:330px;max-width:100%;min-width:0;border:1px solid #bdc8ba;border-radius:7px;background:var(--paper);color:var(--ink);box-shadow:0 2px 9px #183a2e0d;overflow:visible;font-family:var(--sans)}
.music-header{display:grid;grid-template-columns:minmax(0,1fr) 28px 34px 28px 30px 26px;align-items:center;gap:2px;padding:8px}
.music-caption{min-width:0;line-height:1.3}
.music-caption strong{display:block;font-size:13px;font-weight:700;letter-spacing:.01em}
.music-caption small{display:block;font-size:12px;margin-top:3px;white-space:normal;overflow-wrap:normal;color:var(--muted)}
.music-player button{display:flex;align-items:center;justify-content:center;min-width:0;width:100%;height:36px;border:0;border-radius:4px;background:transparent;color:var(--ink);padding:5px;cursor:pointer}
.music-player button:hover{background:#e5ebdf}
.music-player [data-music-play]{background:#183a2e;color:#f1dfb0;height:38px}
.music-player [data-music-play]:hover{background:#2a4b38}
.music-player [data-music-expand] svg{transition:transform .2s;transform:rotate(180deg)}
.music-player [data-music-expand][aria-expanded="true"] svg{transform:rotate(0deg)}
.music-details{position:absolute;top:calc(100% + 24px);right:0;z-index:70;width:320px;max-width:calc(100vw - 48px);border:1px solid #bdc8ba;border-radius:7px;padding:14px;background:var(--paper);box-shadow:0 8px 26px #183a2e20}
.music-select-label{display:block;font-size:12px;margin-bottom:5px;color:var(--body)}
.music-player select{font:13px/1.5 var(--sans);color:var(--ink);background:#fff;border:1px solid #c4cbbb;border-radius:3px;width:100%;max-width:100%;padding:9px 6px}
.music-volume-row{display:flex;align-items:center;gap:9px;margin-top:12px;font-size:12px}
.music-volume-row input{min-width:0;flex:1;width:100%;accent-color:#2c5039;height:24px;margin:0}
.music-volume-row output{min-width:35px;text-align:right;font-size:12px}
.music-player .music-status{font-size:12px;line-height:1.5;color:var(--muted);margin:8px 0 0;min-height:18px}
.music-audio{display:none}
@media(max-width:600px){.music-player{width:100%;max-width:350px}.music-header{grid-template-columns:minmax(0,1fr) 26px 34px 26px 28px 24px;gap:2px;padding:8px}.music-caption strong{font-size:12px}.music-caption small{font-size:12px}.music-player button{height:34px;min-width:0}.music-player [data-music-play]{height:34px}.music-player button svg{width:20px;height:20px}.music-details{padding:10px}.music-volume-row{flex-wrap:wrap;gap:5px 8px}.music-volume-row label{width:100%}.music-player select{font-size:12px}.music-player .music-status{font-size:12px}}
@media screen{
 .site-header{grid-template-columns:auto auto minmax(210px,1fr) auto;gap:18px}
 .site-header .brand{grid-column:1;grid-row:1}
 .site-header .header-order{grid-column:2;grid-row:1;transform:none}
 .site-header .menu-toggle,.site-header .main-navigation{grid-column:4;grid-row:1}
}
@media screen and (max-width:1280px){
 .site-header .menu-toggle{display:flex;gap:14px;align-items:center;font-size:14px;border:1px solid var(--line);padding:9px 12px;background:none}
 .site-header .menu-icon{width:17px;height:10px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
 .site-header .main-navigation{grid-column:auto;grid-row:auto;display:none;position:absolute;top:100%;left:0;right:0;padding:22px var(--margin);background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 14px 22px #273b2714;flex-wrap:wrap;gap:15px 24px}
 .site-header .main-navigation.is-open{display:flex}
}
@media screen and (max-width:960px){
 .site-header{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;row-gap:8px}
 .site-header .menu-toggle{grid-column:3;grid-row:1}
 .site-header .music-player{grid-column:1/-1;grid-row:2;width:350px;max-width:100%}
 .music-details{top:calc(100% + 12px)}
}
@media screen and (max-width:600px){.site-header .music-player{width:100%;max-width:350px}}
@media screen and (max-width:360px){.site-header .menu-toggle>span:first-child{display:none}.site-header .menu-toggle{min-height:40px}}
@media print{.music-player,.site-header{display:none!important}}

/* Reserve the ordering button's rightward offset in the desktop grid. */
@media screen and (min-width:1024px){
 .site-header .header-order{margin-left:1cm}
}
