.neap-toolbar{margin:14px 0;width:100%}

.neap-player{flex:1;display:flex;align-items:center;gap:10px;background:#f5f5f5;border:1px solid #d9d9d9;border-radius:14px;padding:8px 12px;box-shadow:0 1px 4px rgba(0,0,0,.04);min-width:0}
.neap-main-button-wrap{flex:0 0 auto}
.neap-big-play{width:44px;height:44px;padding:0;border-radius:50%;border:none;background:#000;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.neap-big-play:hover{transform:scale(1.04)}
.neap-icon-play{display:block;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:13px solid #fff;margin-left:4px}
.neap-big-play.is-playing .neap-icon-play{width:12px;height:14px;border:none;background:linear-gradient(90deg,#fff 0 35%,transparent 35% 65%,#fff 65% 100%);margin-left:0}

/* Title, timeline and transport share one row; status and sliders wrap beneath. */
.neap-player-body{min-width:0;flex:1;display:flex;align-items:center;flex-wrap:wrap;gap:5px 12px}
.neap-player-head{order:1;flex:0 0 auto;display:flex;align-items:center;gap:5px;margin:0;font-size:12px;line-height:1.2;color:#777}
.neap-player-head strong{color:#111;font-weight:700}
.neap-timeline-row{order:2;flex:1 1 200px;display:flex;align-items:center;gap:8px;min-width:0}
.neap-current-time,.neap-total-time{font-size:12px;font-weight:600;color:#111;min-width:36px;font-variant-numeric:tabular-nums}
.neap-total-time{text-align:right}
.neap-progress{position:relative;flex:1;height:5px;min-width:50px;background:#ddd;border-radius:999px;overflow:hidden}
.neap-progress-fill{display:block;height:100%;width:0;background:var(--neap-accent,#111);border-radius:999px}
.neap-subcontrols{order:3;flex:0 0 auto;display:flex;align-items:center;gap:4px;margin:0}
.neap-volume-toggle,.neap-seek-back,.neap-seek-forward,.neap-speed-toggle{border:none;background:transparent;border-radius:6px;cursor:pointer;color:#111;font-size:12px;line-height:1;padding:5px 6px}
.neap-volume-toggle:hover,.neap-seek-back:hover,.neap-seek-forward:hover,.neap-speed-toggle:hover{background:rgba(0,0,0,.06)}
.neap-speed-toggle{font-weight:700}
.neap-status{order:4;flex:1 1 100%;margin:0;text-align:left;color:#777;font-size:11px;line-height:1.35}
.neap-fine-controls{order:5;flex:1 1 100%;display:flex;gap:12px;flex-wrap:wrap;margin:0}
.neap-fine-controls.is-hidden{display:none}
.neap-fine-controls label{font-size:11px;color:#555;display:flex;gap:6px;align-items:center}
.neap-fine-controls input[type=range]{width:88px;height:14px}

@media(max-width:900px){
  .neap-player{padding:8px 10px;gap:8px}
  .neap-big-play{width:40px;height:40px}
  .neap-timeline-row{flex:1 1 140px}
}
/* Drop the decorative subtitle before the controls are forced onto a second row. */
@media(max-width:600px){.neap-player-head span{display:none}}