@charset "UTF-8";
/* The only product-page player. Settings expand inside the same bottom bar. */
.xb-listen-dock{position:fixed;left:var(--xb-listen-left,12px);bottom:calc(var(--xb-listen-nav,0px) + 12px + env(safe-area-inset-bottom,0px));width:var(--xb-listen-width,calc(100% - 24px));max-width:680px;z-index:70;box-sizing:border-box;border:1px solid #d5bfec40;border-radius:22px;background:linear-gradient(125deg,#292033f5,#1b1527f8);box-shadow:0 7px 28px #09071066;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);color:#f7eefb;font-family:var(--companion-interface,-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif);isolation:isolate;}
.xb-listen-dock[data-nav="true"]{bottom:calc(var(--xb-listen-nav,0px) + 10px);}
.xb-listen-dock[hidden],.xb-listen-dock [hidden]{display:none!important;}
.xb-listen-dock *{box-sizing:border-box;}
.xb-listen-row{display:flex;align-items:stretch;min-width:0;min-height:68px;}
.xb-listen-dock button,.xb-listen-dock select{font:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent;}
.xb-listen-primary{position:relative;display:flex;align-items:center;gap:12px;flex:1;min-width:0;min-height:68px;padding:12px 142px 12px 18px;border:0;border-radius:21px 0 0 21px;background:transparent;color:inherit;cursor:pointer;text-align:left;}
.xb-listen-symbol{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border:1px solid #d7b3f57a;border-radius:50%;color:#f1d1fb;background:linear-gradient(130deg,#805dbb5c,#d687b73b);}
.xb-listen-symbol svg{width:22px;height:22px;}
.xb-listen-pause{display:none;}
.xb-listen-dock[data-state="speaking"] .xb-listen-play{display:none;}
.xb-listen-dock[data-state="speaking"] .xb-listen-pause{display:block;}
.xb-listen-copy{display:flex;flex-direction:column;gap:2px;min-width:0;}
.xb-listen-title{font-size:15px;line-height:1.5;font-weight:600;white-space:nowrap;}
.xb-listen-summary{font-size:11px;line-height:1.5;color:#c9b7d9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.xb-listen-art{position:absolute;right:4px;top:-1px;bottom:auto;display:block;width:144px;height:auto;aspect-ratio:560 / 411;transform:translateY(-82%);object-fit:contain;object-position:center bottom;max-width:none;margin:0;border:0;border-radius:0;pointer-events:auto;user-select:none;-webkit-user-select:none;filter:drop-shadow(0 2px 4px #0003);}
.xb-listen-chevron{display:grid;place-items:center;flex:0 0 46px;min-width:44px;min-height:44px;margin:8px 8px 8px 0;padding:0;border:0;border-radius:14px;background:#bfa1df10;color:#dcc9ef;cursor:pointer;}
.xb-listen-chevron svg{width:22px;height:22px;}
.xb-listen-dock[data-expanded="true"] .xb-listen-chevron svg{transform:rotate(180deg);}
.xb-listen-primary:hover:not(:disabled),.xb-listen-chevron:hover{background:#c7a0eb0a;}
.xb-listen-dock button:focus-visible,.xb-listen-dock select:focus-visible{outline:2px solid #ebc6ff;outline-offset:3px;}
.xb-listen-dock button:disabled{cursor:default;}
.xb-listen-primary:disabled .xb-listen-symbol{opacity:.6;}
.xb-listen-settings{padding:0 18px 15px;border-top:1px solid #d5bfec1c;max-height:min(320px,45dvh);overflow:auto;overscroll-behavior:contain;}
.xb-listen-status{margin:12px 0 10px;font-size:13px;line-height:1.65;color:#e5d6ef;overflow-wrap:anywhere;}
.xb-listen-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding-top:10px;}
.xb-listen-status:not([hidden])+.xb-listen-controls{padding-top:0;}
.xb-listen-controls button{min-height:44px;padding:8px 12px;border:1px solid #bfa4d33d;border-radius:12px;background:#362841;color:#f0e2f8;font-size:13px;cursor:pointer;}
.xb-listen-controls button:disabled{color:#a799b2;border-color:#bfa4d320;}
.xb-listen-speed{display:flex;white-space:nowrap;flex-shrink:0;align-items:center;gap:8px;min-height:44px;color:#d9c4e7;font-size:13px;}
.xb-listen-speed select{min-width:84px;min-height:44px;padding:8px;border:1px solid #bfa4d33d;border-radius:12px;background:#362841;color:#f0e2f8;font-size:14px;color-scheme:dark;}
.xb-listen-caption{display:block;margin-top:10px;font-size:10px;line-height:1.5;color:#b5a2c4;}
body.xb-listen-dock-visible #content{padding-bottom:max(80px,var(--xb-listen-space,150px));}
html.xb-listen-dock-space{scroll-padding-bottom:var(--xb-listen-space,150px);}
@media(max-width:650px){.xb-listen-dock{border-radius:18px;}.xb-listen-row,.xb-listen-primary{min-height:62px;}.xb-listen-primary{padding:10px 112px 10px 12px;gap:9px;border-radius:17px 0 0 17px;}.xb-listen-symbol{flex-basis:30px;width:30px;height:30px;}.xb-listen-symbol svg{width:19px;height:19px;}.xb-listen-title{font-size:14px;}.xb-listen-summary{font-size:10px;}.xb-listen-art{width:124px;right:-4px;}.xb-listen-chevron{flex-basis:40px;margin:7px 5px 7px 0;}.xb-listen-settings{padding:0 12px 12px;}}
@media(max-width:350px){.xb-listen-primary{padding-right:88px;}.xb-listen-art{width:100px;}.xb-listen-title{font-size:13px;}.xb-listen-symbol{flex-basis:26px;width:26px;height:26px;}.xb-listen-primary{gap:6px;}}
@media(prefers-reduced-motion:reduce){.xb-listen-dock *{animation:none!important;transition:none!important;}}
@media print{.xb-listen-dock{display:none!important;}body.xb-listen-dock-visible #content{padding-bottom:0;}}

/* Small anchored listening cue: part of the existing tap target, no new control. */
.xb-listen-guide{position:absolute;right:152px;top:-33px;display:block;padding:4px 7px;border-radius:7px;background:#241a31ed;color:#eee0fa;font-size:11px;font-weight:400;line-height:18px;white-space:nowrap;pointer-events:none;box-shadow:0 1px 5px #10091820;}
.xb-listen-guide::after{content:"";position:absolute;left:100%;top:50%;width:22px;height:9px;border-top:1px solid #c9acdce0;border-right:1px solid #c9acdce0;transform:skewY(-18deg);transform-origin:left;}
@media(max-width:650px){.xb-listen-guide{right:124px;top:-31px;font-size:10px;padding:3px 6px;}.xb-listen-guide::after{width:17px;}}
@media(max-width:350px){.xb-listen-guide{right:100px;font-size:10px;}}
