/* anc0 Music Player Distribution Edition — scoped three-theme, compact SVG UI */
.anc0-mp-container,.anc0-mp-container *{box-sizing:border-box}
.anc0-mp-container{--mp-text:#f6f7fd;--mp-subtext:#c0cada;--mp-tagline:#bfc9dd;--mp-icon:#e1e8f2;--mp-bg-a:#141624;--mp-bg-b:#151d2c;--mp-bg-c:#0c1c2d;--mp-border:#64728e88;--mp-accent:#ff7bdc;--mp-track:#303849;--mp-detail-a:#1b263c;--mp-detail-b:#0d1a2d;--mp-detail-text:#e7edff;--mp-detail-heading:#ffbce6;--mp-detail-muted:#a8b8d6;--mp-spectrum-a:#f174ce;--mp-spectrum-b:#af67e9;--mp-spectrum-c:#39b8ee;--mp-glow:#ff65ce;--mp-sharp:#ffc3f6;--mp-inner:#ffadf0;--mp-disc1:#493447;--mp-disc2:#25182f;--mp-disc3:#121426;--mp-disc4:#080f1e;container:anc0-mp / inline-size;max-width:672px;width:100%;margin:1.25rem auto;position:relative;color:var(--mp-text);font-family:system-ui,'Hiragino Maru Gothic ProN','Yu Gothic',sans-serif;isolation:isolate}
.anc0-mp-player{--sc:.7;display:grid;grid-template-columns:calc(112px * var(--sc)) calc(260px * var(--sc)) minmax(0,1fr) calc(140px * var(--sc));gap:calc(17px * var(--sc));align-items:center;position:relative;width:100%;min-height:calc(130px * var(--sc));padding:calc(9px * var(--sc)) calc(14px * var(--sc));border:1px solid var(--mp-border);border-radius:calc(18px * var(--sc));background:radial-gradient(ellipse at 15% -42%,#e88ad41c,transparent 42%),radial-gradient(ellipse at 85% 135%,#409ce51c,transparent 40%),linear-gradient(105deg,var(--mp-bg-a),var(--mp-bg-b) 53%,var(--mp-bg-c));box-shadow:0 14px 30px #0008,inset 0 1px #fff1;isolation:isolate;overflow:visible}
.anc0-mp-cover{width:calc(112px * var(--sc));height:calc(112px * var(--sc));display:block;object-fit:cover;border-radius:calc(10px * var(--sc));box-shadow:0 5px 19px #0008}
.anc0-mp-cover--empty{display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#f38de799,transparent 45%),radial-gradient(circle at 80% 70%,#59c8f999,transparent 43%),#182340;font-size:15px;font-weight:800;color:white}
.anc0-mp-meta{min-width:0;width:100%;max-width:100%}
.anc0-mp-title{width:100%;max-width:100%;min-width:0;font-size:calc(22px * var(--sc));font-weight:700;letter-spacing:.006em;line-height:1.25;white-space:nowrap;overflow:hidden;height:calc(29px * var(--sc));color:var(--mp-text)}
.anc0-mp-title span{display:inline-block;width:max-content;white-space:nowrap;transform:translate3d(0,0,0);will-change:transform}
.anc0-mp-artist{font-size:calc(14px * var(--sc));color:var(--mp-subtext);margin:calc(2px * var(--sc)) 0 calc(11px * var(--sc));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.anc0-mp-controls{display:flex;align-items:center;gap:calc(14px * var(--sc));min-width:0}
.anc0-mp-player button{font-family:inherit}
.anc0-mp-button{appearance:none;flex:none;width:calc(54px * var(--sc));height:calc(54px * var(--sc));display:grid;place-items:center;padding:0;border:0;border-radius:50%;cursor:pointer;color:white;transition:transform .18s ease}
.anc0-mp-button:hover{transform:scale(1.04)}
.anc0-mp-play{position:relative;display:flex;align-items:center;justify-content:center;background:transparent;overflow:visible;isolation:isolate}
.anc0-mp-play .anc0-mp-art{position:absolute;left:50%;top:50%;width:calc(70px * var(--sc));height:calc(70px * var(--sc));max-width:none;overflow:visible;transform:translate(-50%,-50%);transform-origin:center;pointer-events:none;filter:drop-shadow(0 0 9px #f79bf24a)}
.anc0-mp-stop{width:calc(48px * var(--sc));height:calc(48px * var(--sc));border:1px solid #cad4ef48;background:radial-gradient(circle at 30% 22%,#64769799,#25324e 65%,#151c2d);box-shadow:inset 0 1px #ffffff26,0 6px 13px #0005}
.anc0-mp-stop svg{width:calc(23px * var(--sc));height:calc(23px * var(--sc));fill:white}
.anc0-mp-volume{display:flex;align-items:center;gap:calc(8px * var(--sc));margin-left:calc(4px * var(--sc));min-width:0}
.anc0-mp-mute{width:calc(21px * var(--sc));height:calc(28px * var(--sc));padding:0;appearance:none;border:0;background:transparent;cursor:pointer;display:grid;place-items:center}
.anc0-mp-mute svg{width:100%;height:100%;fill:#fff}
.anc0-mp-container input[type=range]{appearance:none;-webkit-appearance:none;background:linear-gradient(to right,var(--mp-accent) 0 var(--val,55%),var(--mp-track) var(--val,55%) 100%);height:calc(5px * var(--sc));border:0;border-radius:100px;cursor:pointer;padding:0;margin:0;outline:none;box-shadow:none}
.anc0-mp-container input[type=range]::-webkit-slider-thumb{appearance:none;width:calc(15px * var(--sc));height:calc(15px * var(--sc));border-radius:50%;background:#fff;border:0;box-shadow:0 0 9px #ffffff7c}
.anc0-mp-container input[type=range]::-moz-range-thumb{width:calc(15px * var(--sc));height:calc(15px * var(--sc));border-radius:50%;background:#fff;border:0;box-shadow:0 0 9px #ffffff7c}
.anc0-mp-vol{width:calc(76px * var(--sc));min-width:0}
.anc0-mp-visual{min-width:0;display:grid;grid-template-columns:calc(44px * var(--sc)) minmax(0,1fr) calc(44px * var(--sc));grid-template-rows:calc(54px * var(--sc)) calc(26px * var(--sc));column-gap:calc(7px * var(--sc));align-items:center}
.anc0-mp-spectrum{grid-column:1/-1;display:block;width:100%;height:calc(54px * var(--sc));filter:drop-shadow(0 0 5px #c27fff44)}
.anc0-mp-time{font-size:calc(12px * var(--sc));font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap;color:var(--mp-text)}
.anc0-mp-end{text-align:right}.anc0-mp-seek{width:100%;min-width:0}
.anc0-mp-aside{align-self:stretch;border-left:1px solid #8a9fbe36;display:flex;align-items:center;justify-content:space-between;gap:calc(6px * var(--sc));padding-left:calc(11px * var(--sc));min-width:0}
.anc0-mp-tagline{font-size:calc(9px * var(--sc));letter-spacing:.21em;color:var(--mp-tagline);line-height:1.52;font-weight:700;overflow-wrap:normal}
.anc0-mp-dots{appearance:none;border:0;background:transparent;color:var(--mp-icon);cursor:pointer;padding:0;border-radius:6px;line-height:0;height:calc(36px * var(--sc));width:calc(25px * var(--sc));flex:none;display:grid;place-items:center}
.anc0-mp-dots svg{width:calc(24px * var(--sc));height:calc(24px * var(--sc));fill:var(--mp-icon)}
.anc0-mp-details{position:absolute;z-index:40;right:6px;top:calc(100% - 6px);width:min(280px,calc(100vw - 54px));padding:15px 17px;border-radius:13px;border:1px solid #7288ab78;background:linear-gradient(130deg,var(--mp-detail-a),var(--mp-detail-b) 88%);box-shadow:0 17px 42px #000a,0 0 19px #ff76d91c;color:var(--mp-detail-text);font-size:12px;text-align:left;line-height:1.5}
.anc0-mp-details[hidden]{display:none!important}
.anc0-mp-details-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid #b9c9e72b;color:var(--mp-detail-heading);font-size:10px;font-weight:800;letter-spacing:.17em}
.anc0-mp-details-close{appearance:none;border:0;background:transparent;color:#e1e7f4;font-size:21px;line-height:1;cursor:pointer;padding:0 5px}
.anc0-mp-details-label{font-size:9px;letter-spacing:.14em;color:var(--mp-detail-muted);margin-top:8px;font-weight:800}
.anc0-mp-details-value{font-size:12px;color:var(--mp-detail-text);overflow-wrap:anywhere;font-weight:600}
.anc0-mp-mobile-details{display:none;appearance:none;border:1px solid #987db78e;border-radius:100px;background:#1b2941;color:var(--mp-detail-heading);padding:5px 8px;font:700 10px 'Nunito',sans-serif;cursor:pointer}
.anc0-mp-status{margin:6px 2px 0;font-size:10px;line-height:1.4;color:#aabbd0;min-height:0}
.anc0-mp-error{color:#b13a5b}
/* Width is the player slot, not the browser. This also handles desktop sidebars. */
@container anc0-mp (max-width:650px){
  .anc0-mp-player{grid-template-columns:calc(112px * var(--sc)) minmax(0,1fr);grid-template-rows:auto auto;column-gap:calc(16px * var(--sc));row-gap:calc(8px * var(--sc));padding:calc(10px * var(--sc)) calc(13px * var(--sc))}
  .anc0-mp-cover{grid-column:1;grid-row:1}
  .anc0-mp-meta{grid-column:2;grid-row:1;padding-right:calc(56px * var(--sc))}
  .anc0-mp-visual{grid-column:1/-1;grid-row:2;grid-template-rows:calc(45px * var(--sc)) calc(26px * var(--sc))}
  .anc0-mp-spectrum{height:calc(45px * var(--sc))}
  .anc0-mp-aside{display:none}
  .anc0-mp-mobile-details{display:block;position:absolute;right:calc(11px * var(--sc));top:calc(10px * var(--sc));z-index:3}
}
@container anc0-mp (max-width:410px){
  .anc0-mp-player{grid-template-columns:calc(80px * var(--sc)) minmax(0,1fr);column-gap:calc(13px * var(--sc));padding:calc(12px * var(--sc))}
  .anc0-mp-cover{width:calc(80px * var(--sc));height:calc(80px * var(--sc))}
  .anc0-mp-meta{padding-right:calc(42px * var(--sc))}
  .anc0-mp-controls{gap:calc(8px * var(--sc))}
  .anc0-mp-volume{margin-left:0;gap:2px}
  .anc0-mp-vol{width:min(calc(76px * var(--sc)), 100%)}
  .anc0-mp-mobile-details{right:5px;top:5px}
}
/* Desktop fallback for browsers without container query support. */
@supports not (container-type:inline-size){
  @media(max-width:760px){
    .anc0-mp-player{grid-template-columns:calc(112px * var(--sc)) minmax(0,1fr);grid-template-rows:auto auto}
    .anc0-mp-cover{grid-column:1;grid-row:1}
    .anc0-mp-meta{grid-column:2;grid-row:1;padding-right:40px}
    .anc0-mp-visual{grid-column:1/-1;grid-row:2}
    .anc0-mp-aside{display:none}
    .anc0-mp-mobile-details{display:block;position:absolute;right:8px;top:8px}
  }
}
@media(prefers-reduced-motion:reduce){.anc0-mp-button{transition:none}}

/* SVG gradient stops inherit the instance palette; IDs remain unique for each player. */
.anc0-mp-disc-1{stop-color:var(--mp-disc1)}.anc0-mp-disc-2{stop-color:var(--mp-disc2)}.anc0-mp-disc-3{stop-color:var(--mp-disc3)}.anc0-mp-disc-4{stop-color:var(--mp-disc4)}
.anc0-mp-glow-circle{stroke:var(--mp-glow)}.anc0-mp-sharp-circle{stroke:var(--mp-sharp)}.anc0-mp-inner-ring{stroke:var(--mp-inner)}
.anc0-mp-player button:focus-visible,.anc0-mp-player input:focus-visible{outline:2px solid var(--mp-accent)!important;outline-offset:3px}
.anc0-mp-play .anc0-mp-art{filter:drop-shadow(0 0 9px color-mix(in srgb,var(--mp-glow),transparent 68%))}
.anc0-mp-cover--empty{background:radial-gradient(circle at 30% 20%,#f38de799,transparent 45%),radial-gradient(circle at 80% 70%,#59c8f999,transparent 43%),#182340}
/* Soft porcelain / sakura variant from the original concept art. */
.anc0-mp-theme-light{--mp-text:#243148;--mp-subtext:#536079;--mp-tagline:#576681;--mp-icon:#46546c;--mp-bg-a:#fff;--mp-bg-b:#f8faff;--mp-bg-c:#eaf5ff;--mp-border:#cad5e8;--mp-accent:#f771c8;--mp-track:#c9d3e2;--mp-detail-a:#fff;--mp-detail-b:#edf4ff;--mp-detail-text:#273750;--mp-detail-heading:#b33690;--mp-detail-muted:#66748b;--mp-spectrum-a:#fa70c4;--mp-spectrum-b:#b87df2;--mp-spectrum-c:#4aabed;--mp-glow:#ec56c4;--mp-sharp:#ffb5ed;--mp-inner:#f7abeb;--mp-disc1:#ffcbf1;--mp-disc2:#f5a3de;--mp-disc3:#d078c7;--mp-disc4:#9958ad}
.anc0-mp-theme-light .anc0-mp-player{background:radial-gradient(ellipse at 15% -42%,#fff2f9,transparent 42%),radial-gradient(ellipse at 85% 135%,#d4f0ff,transparent 40%),linear-gradient(105deg,var(--mp-bg-a),var(--mp-bg-b) 53%,var(--mp-bg-c));box-shadow:0 10px 28px #7a94ad34,inset 0 1px #fff}
.anc0-mp-theme-light .anc0-mp-stop{background:radial-gradient(circle at 30% 22%,#fff,#d9e4f2 70%,#d3dbea);border-color:#cad4e5;box-shadow:0 3px 7px #677e9a30}
.anc0-mp-theme-light .anc0-mp-stop svg,.anc0-mp-theme-light .anc0-mp-mute svg{fill:#43536e}
.anc0-mp-theme-light .anc0-mp-aside{border-color:#aab9d066}.anc0-mp-theme-light .anc0-mp-details{border-color:#c5d5e8;box-shadow:0 13px 38px #506a8735}
.anc0-mp-theme-light .anc0-mp-details-heading{border-color:#aebdd143}.anc0-mp-theme-light .anc0-mp-details-close{color:#37465f}
.anc0-mp-theme-light .anc0-mp-mobile-details{background:#fff2fb;color:#90367b;border-color:#e9b6da}
/* Cyber variant — structural cut-corner chassis, NOT a dark theme recolor.
   The original concept uses stepped/slanted top rails and a cyan→violet→pink perimeter.
   Two clipped layers make a continuous polygonal gradient stroke at every responsive width. */
.anc0-mp-theme-cyber{--mp-text:#f5faff;--mp-subtext:#c9e3ed;--mp-tagline:#cae6ff;--mp-icon:#e5f9ff;--mp-bg-a:#0a1426;--mp-bg-b:#111a2c;--mp-bg-c:#06182d;--mp-border:#39e1f5a8;--mp-accent:#41edf5;--mp-track:#304058;--mp-detail-a:#13253e;--mp-detail-b:#071627;--mp-detail-text:#ecfaff;--mp-detail-heading:#78f2ff;--mp-detail-muted:#aacbe2;--mp-spectrum-a:#40ecfb;--mp-spectrum-b:#8474f1;--mp-spectrum-c:#ef66d4;--mp-glow:#36dcff;--mp-sharp:#adfaff;--mp-inner:#77f5ff;--mp-disc1:#1b6072;--mp-disc2:#174658;--mp-disc3:#13283e;--mp-disc4:#061521}
.anc0-mp-theme-cyber .anc0-mp-player{
  border:0;border-radius:0;background:transparent;box-shadow:none;
  /* Inner body is drawn by ::after and the neon chassis is drawn by ::before. */
}
.anc0-mp-theme-cyber .anc0-mp-player::before,
.anc0-mp-theme-cyber .anc0-mp-player::after{
  content:'';pointer-events:none;position:absolute;display:block;
  clip-path:polygon(0 12px,12px 0,31.5% 0,33.2% 6px,68.5% 6px,70.3% 0,96.5% 0,98% 6px,calc(100% - 8px) 6px,100% 14px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px));
}
.anc0-mp-theme-cyber .anc0-mp-player::before{
  inset:0;z-index:-2;
  background:linear-gradient(115deg,#45f6ff 0%,#18baff 24%,#9477ff 48%,#a45eff 70%,#42d5ff 84%,#f15dff 100%);
  filter:drop-shadow(0 0 5px #36efffa8) drop-shadow(0 0 9px #8b65ffc0);
}
.anc0-mp-theme-cyber .anc0-mp-player::after{
  inset:2px;z-index:-1;
  background:radial-gradient(ellipse at 14% -60%,#17e9ff1f,transparent 52%),
    radial-gradient(ellipse at 88% 140%,#c24bfc23,transparent 48%),
    linear-gradient(105deg,#0c192c,#161a2d 50%,#071628);
}
.anc0-mp-cyber-trim{display:none}
.anc0-mp-theme-cyber .anc0-mp-cyber-trim{display:block;position:absolute;inset:0;pointer-events:none;z-index:2}
.anc0-mp-theme-cyber .anc0-mp-cyber-trim::before,
.anc0-mp-theme-cyber .anc0-mp-cyber-trim::after{content:'';position:absolute;top:1px;height:2px;filter:drop-shadow(0 0 3px currentColor)}
.anc0-mp-theme-cyber .anc0-mp-cyber-trim::before{left:10%;width:24%;background:linear-gradient(90deg,transparent,#42f2ff 25%,#42f2ff 75%,transparent);color:#42f2ff}
.anc0-mp-theme-cyber .anc0-mp-cyber-trim::after{right:7%;width:21%;background:linear-gradient(90deg,transparent,#9b79ff 35%,#60caff 88%,transparent);color:#9b79ff}
.anc0-mp-theme-cyber .anc0-mp-stop{background:radial-gradient(circle at 30% 22%,#51658066,#141d31 75%);border-color:#8aadd45e}
.anc0-mp-theme-cyber .anc0-mp-cover{box-shadow:0 0 12px #46dfee35}
.anc0-mp-theme-cyber .anc0-mp-details{border:1px solid #43e6fb99;box-shadow:0 12px 30px #000a,0 0 15px #47dfff38}
@container anc0-mp (max-width:410px){
  .anc0-mp-theme-cyber .anc0-mp-player::before,
  .anc0-mp-theme-cyber .anc0-mp-player::after{clip-path:polygon(0 9px,9px 0,31.5% 0,33.2% 4px,68.5% 4px,70.3% 0,96% 0,100% 9px,100% calc(100% - 9px),calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px))}
}
/* Prevent the global WordPress theme from styling inner HTML controls unpredictably. */
.anc0-mp-container .anc0-mp-player{font-size:initial}.anc0-mp-container .anc0-mp-player button{min-width:0;line-height:normal;text-transform:none;letter-spacing:normal}.anc0-mp-container .anc0-mp-player svg{vertical-align:middle}
