:root{--ink:#080808;--paper:#e8e2d8;--rust:#9b4c2e;--blue:#b7d4e4;--line:rgba(255,255,255,.18)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#080808;color:#f2eee7;font-family:Arial,Helvetica,sans-serif}button,input,textarea{font:inherit}button,a{cursor:pointer}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.topbar{height:76px;position:sticky;top:0;z-index:80;display:flex;align-items:center;padding:0 4.5vw;border-bottom:1px solid rgba(255,255,255,.14);background:#080808}.brand{display:flex;align-items:center;gap:11px}.brand-words{display:flex;flex-direction:column}.gr-mark{display:grid;place-items:center;width:48px;height:48px;border:2px solid #fff;font-family:Impact,'Arial Narrow',sans-serif;font-size:27px;line-height:1;letter-spacing:-.09em;transform:skew(-5deg);background:rgba(0,0,0,.22)}.brand-main{font-weight:900;letter-spacing:.07em;font-size:19px}.brand-sub{font-size:8px;letter-spacing:.35em;color:var(--blue);margin-top:3px}.nav{margin-left:auto;display:flex;gap:27px}.nav a{font-size:9px;letter-spacing:.18em;font-weight:800;opacity:.72}.nav a:hover{opacity:1;color:var(--blue)}.menu-btn{display:none;margin-left:auto;background:none;border:1px solid #fff;color:#fff;padding:8px 10px;font-size:10px;letter-spacing:.15em}
.hero{height:calc(100vh - 76px);min-height:720px;position:relative;overflow:hidden;background:radial-gradient(circle at 72% 28%,#27455c 0,#142a3c 31%,#0a1017 63%,#060606 100%)}.hero:before{content:"";position:absolute;inset:0;background:url('assets/images/boot-smoke-blue.jpg') center/cover no-repeat;opacity:.19;filter:contrast(1.1) grayscale(.15)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.6) 38%,rgba(0,0,0,.14) 67%,rgba(0,0,0,.5) 100%)}.hero-noise{position:absolute;z-index:2;inset:0;opacity:.12;background-image:radial-gradient(rgba(255,255,255,.8) .7px,transparent .7px);background-size:7px 7px;mix-blend-mode:overlay}.hero-copy{position:absolute;z-index:5;left:6.5vw;top:50%;transform:translateY(-50%);max-width:740px}.eyebrow,.section-kicker{font-size:11px;letter-spacing:.27em;font-weight:800;color:var(--rust)}.hero-mark{font-family:Impact,'Arial Narrow',sans-serif;font-size:44px;letter-spacing:-.08em;border-left:5px solid var(--rust);padding-left:10px;margin-top:22px;color:#fff}.hero-copy h1{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(76px,10.8vw,174px);line-height:.77;margin:12px 0 18px;letter-spacing:-.015em;text-transform:uppercase;text-shadow:0 6px 30px rgba(0,0,0,.6)}.hero-genre{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(30px,3.2vw,52px);letter-spacing:.11em;color:var(--blue);margin-bottom:16px}.hero-copy p{font-family:Georgia,serif;font-style:italic;font-size:clamp(18px,1.6vw,25px);max-width:530px;color:#ded8cd}.hero-actions{display:flex;gap:12px;margin-top:30px}.primary-play,.ghost-btn,.download-btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid #fff;background:#fff;color:#090909;padding:15px 18px;font-size:11px;letter-spacing:.15em;font-weight:800}.ghost-btn{background:transparent;color:#fff}.ghost-btn:hover{background:#fff;color:#090909}.primary-play:hover{background:var(--blue);border-color:var(--blue)}.hero-art{position:absolute;z-index:4;right:1.5vw;bottom:0;height:100%;width:53%;display:flex;align-items:flex-end;justify-content:center}.hero-art img{max-height:100%;width:auto;filter:drop-shadow(-22px 22px 28px rgba(0,0,0,.6)) saturate(.78) contrast(1.08)}.hero-halo{position:absolute;width:68%;height:58%;border-radius:50%;background:radial-gradient(circle,rgba(168,208,230,.23),transparent 66%);top:12%;right:10%}.hero-sideword{position:absolute;z-index:3;right:-25px;top:50%;transform:rotate(90deg) translateY(-50%);font:700 9px/1 Arial;letter-spacing:.65em;color:rgba(255,255,255,.34)}
.statement{background:var(--paper);color:var(--ink);padding:66px 6.5vw 72px;border-top:8px solid var(--rust)}.statement-line{font-size:12px;letter-spacing:.3em;font-weight:800;margin-bottom:12px}.statement-big{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(48px,7.2vw,118px);line-height:.9}.music{background:#0b0b0b;padding:100px 6.5vw}.radio-head{display:grid;grid-template-columns:1.15fr .85fr;gap:6vw;align-items:end;margin-top:18px;margin-bottom:52px}.radio-head h2,.dirt h2,.gravel h2,.share h2{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(64px,8vw,132px);line-height:.82;margin:14px 0}.radio-head p{font-family:Georgia,serif;font-size:20px;line-height:1.55;color:#b9b3a9;max-width:560px}.radio-layout{display:grid;grid-template-columns:minmax(300px,38%) 1fr;gap:5vw;align-items:start}.featured-art{position:sticky;top:26px}.track-art{position:relative}.track-art:after{content:"";position:absolute;inset:-16px 20px 20px -16px;border:1px solid rgba(190,215,228,.34);z-index:0}.track-art img{position:relative;z-index:1;aspect-ratio:1;object-fit:cover;filter:saturate(.75) contrast(1.06)}.featured-copy{padding-top:27px}.featured-copy>span{font-size:9px;letter-spacing:.22em;color:var(--rust);font-weight:900}.featured-copy>strong{display:block;font-family:Impact,'Arial Narrow',sans-serif;font-size:56px;margin:7px 0 10px}.featured-copy p{font-family:Georgia,serif;color:#aaa49b;line-height:1.55}.track-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.inverse{background:var(--blue);border-color:var(--blue)}.download-btn{background:transparent;color:#fff}.playlist{border-top:1px solid var(--line)}.song-row{min-height:69px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:48px 1fr auto auto auto;gap:12px;align-items:center;padding:7px 0}.song-row.playing{background:linear-gradient(90deg,rgba(183,212,228,.12),transparent)}.song-num{font-size:10px;color:var(--rust);letter-spacing:.18em}.song-title,.song-play,.song-share{border:0;background:none;color:#fff;text-align:left}.song-title{font-family:Impact,'Arial Narrow',sans-serif;font-size:28px;letter-spacing:.025em}.song-row em{font-style:normal;font-size:8px;color:var(--blue);letter-spacing:.18em}.song-play,.song-share{font-size:9px;letter-spacing:.15em;font-weight:900}.song-share{color:var(--blue)}
.play-songs{position:relative;min-height:980px;background:#0a0a0a;overflow:hidden}.play-bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.97) 0,rgba(0,0,0,.87) 45%,rgba(0,0,0,.42) 100%),url('assets/images/boots-road-bw.jpg') center/cover no-repeat;filter:contrast(1.08)}.play-inner{position:relative;z-index:2;padding:115px 6.5vw}.section-kicker.light{color:var(--blue)}.play-inner>h2{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(88px,13vw,215px);line-height:.74;letter-spacing:-.02em;margin:24px 0 22px}.lead{font-family:Georgia,serif;font-size:clamp(22px,2vw,32px);font-style:italic;color:#ddd6cb}.play-columns{display:grid;grid-template-columns:1fr 1fr;gap:25px;max-width:1220px;margin-top:56px}.play-columns.three{grid-template-columns:repeat(3,1fr)}.play-columns article{border-top:1px solid var(--line);padding-top:20px;padding-right:25px}.column-num{display:block;font-size:10px;color:var(--rust);letter-spacing:.2em}.play-columns h3{font-family:Impact,'Arial Narrow',sans-serif;font-size:36px;letter-spacing:.03em;margin:12px 0}.play-columns p{color:#b8b2aa;line-height:1.6;font-size:16px}.text-play,.small-link{display:block;border:0;background:none;color:#fff;padding:0;margin-top:12px;font-weight:800;font-size:11px;letter-spacing:.16em;text-align:left}.small-link{color:var(--blue);margin-top:16px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:72px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.steps div{padding:22px 18px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:8px}.steps div:last-child{border-right:0}.steps b{color:var(--rust);font-size:11px}.steps span{font-weight:800;font-size:12px;letter-spacing:.14em}.no-contest{margin-top:24px;font-size:10px;letter-spacing:.18em;color:#8c8781}
.dirt{background:var(--paper);color:var(--ink);padding:110px 6.5vw}.dirt-head{display:flex;justify-content:space-between;gap:40px;align-items:flex-end}.dirt-head p{max-width:470px;font-family:Georgia,serif;font-size:18px;line-height:1.55;color:#4a4742}.dirt h2{margin-bottom:0}.dirt-grid-wrap{max-width:1080px;margin:55px auto 35px}.dirt-grid-wrap img{width:100%;box-shadow:0 24px 70px rgba(0,0,0,.19)}.dirt-strip{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:18px}.dirt-strip img{width:100%;height:360px;object-fit:cover;filter:contrast(1.05)}.gravel{display:grid;grid-template-columns:1fr 1fr;min-height:860px;background:#0d0d0d}.gravel-photo{min-height:860px;background:#111;overflow:hidden}.gravel-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;filter:contrast(1.12)}.gravel-copy{padding:100px 7vw;align-self:center}.gravel-copy p{max-width:590px;color:#b8b2a8;font-family:Georgia,serif;font-size:19px;line-height:1.65}.share{padding:110px 6.5vw;background:linear-gradient(145deg,#cadde7,#9bb8c8);color:#0a0a0a}.share-card{max-width:1050px;margin:0 auto}.share h2{font-size:clamp(72px,10vw,150px)}.share-card>p{font-family:Georgia,serif;font-size:20px;line-height:1.5;max-width:700px}.mock-form{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:40px}.mock-form input,.mock-form textarea{background:rgba(255,255,255,.52);border:1px solid rgba(0,0,0,.35);padding:15px 14px;color:#0a0a0a;font-size:12px;letter-spacing:.08em}.mock-form textarea{grid-column:1/-1;min-height:130px;resize:vertical}.mock-form button{grid-column:1/-1;background:#0a0a0a;color:#fff;border:0;padding:17px;font-size:11px;letter-spacing:.2em;font-weight:900}.footer{background:#080808;padding:36px 6.5vw 118px;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.12em;color:#8f8a82}.footer-center{text-align:center}
.player{position:fixed;z-index:60;left:18px;right:18px;bottom:16px;min-height:70px;background:rgba(7,7,7,.95);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(12px);display:grid;grid-template-columns:auto minmax(220px,360px) 1fr auto;align-items:center;gap:16px;padding:8px 13px;box-shadow:0 12px 40px rgba(0,0,0,.45)}.player-controls{display:flex;align-items:center;gap:5px}.player-play,.player-skip{height:42px;width:42px;border-radius:50%;border:1px solid var(--blue);color:#fff;background:transparent}.player-skip{width:30px;height:30px;border-color:#444;font-size:20px}.player-info{display:flex;flex-direction:column;gap:4px;font-size:11px;letter-spacing:.05em;min-width:0}.player-info strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-label{font-size:8px;color:var(--blue);letter-spacing:.22em}.progress-wrap{height:5px;background:#2a2a2a;cursor:pointer;position:relative}.progress{height:100%;width:0;background:var(--blue)}.player-right{display:flex;align-items:center;gap:10px}.time{font-size:9px;color:#96918a;min-width:84px;text-align:right}.player-share{background:none;border:1px solid #444;color:#fff;padding:8px 10px;font-size:8px;letter-spacing:.15em;font-weight:900}.share-toast{position:fixed;z-index:90;left:50%;bottom:102px;transform:translateX(-50%) translateY(10px);background:#e8e2d8;color:#080808;padding:10px 14px;font-size:9px;letter-spacing:.17em;font-weight:900;opacity:0;pointer-events:none;transition:.2s}.share-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media (max-width:1000px){.play-columns.three{grid-template-columns:1fr 1fr}.play-columns.three article:last-child{grid-column:1/-1}}
@media (max-width:900px){.topbar{padding:13px 16px}.nav{display:none;position:absolute;top:76px;left:12px;right:12px;background:#090909;border:1px solid #292929;flex-direction:column;padding:20px;margin:0}.nav.open{display:flex}.menu-btn{display:block}.brand-main{font-size:17px}.gr-mark{width:42px;height:42px;font-size:24px}.hero{min-height:780px}.hero-copy{left:22px;right:22px;top:41%;transform:translateY(-50%);max-width:none}.hero-copy h1{font-size:clamp(64px,19vw,105px)}.hero-art{width:78%;height:70%;right:-18%;opacity:.63}.hero-sideword{display:none}.hero-actions{flex-wrap:wrap}.music{padding:80px 22px}.radio-head,.radio-layout{grid-template-columns:1fr}.featured-art{position:static}.radio-head{gap:10px}.song-row{grid-template-columns:38px 1fr auto auto}.song-row em{display:none}.play-inner{padding:90px 22px}.play-columns,.play-columns.three{grid-template-columns:1fr}.play-columns.three article:last-child{grid-column:auto}.steps{grid-template-columns:1fr 1fr}.steps div:nth-child(2){border-right:0}.steps div:nth-child(-n+2){border-bottom:1px solid var(--line)}.dirt{padding:90px 22px}.dirt-head{display:block}.dirt-head p{margin-top:25px}.dirt-strip{grid-template-columns:1fr}.dirt-strip img{height:300px}.gravel{grid-template-columns:1fr}.gravel-photo{min-height:600px}.gravel-copy{padding:70px 22px 100px}.share{padding:90px 22px}.mock-form{grid-template-columns:1fr}.mock-form input,.mock-form textarea,.mock-form button{grid-column:1}.footer{padding-left:22px;padding-right:22px;flex-direction:column}.footer-center{text-align:left}.player{left:8px;right:8px;bottom:8px;grid-template-columns:auto 1fr auto;gap:8px}.progress-wrap{grid-column:1/-1;grid-row:2}.player-right .time{display:none}.player-info{min-width:0}.player-share{padding:7px 8px}.share-toast{bottom:100px}}
@media (max-width:560px){.hero-mark{font-size:32px}.song-title{font-size:22px}.song-row{grid-template-columns:30px 1fr auto}.song-share{grid-column:2/4;justify-self:start;padding-bottom:7px}.player-skip{display:none}.player{grid-template-columns:44px 1fr auto}.player-controls{display:block}}

/* v0.4.0 DIRT RADIO song pages / play counts / hover cards */
.song-row{position:relative;grid-template-columns:48px minmax(0,1fr) auto auto auto auto}.song-title-wrap{position:relative;min-width:0}.song-title{display:inline-block}.song-count{font-family:Impact,'Arial Narrow',sans-serif;font-size:16px;letter-spacing:.04em;color:#8f8a82;min-width:42px;text-align:right}.featured-stat{display:flex;align-items:baseline;gap:7px;margin:10px 0 0}.featured-stat b{font:28px/1 Impact,'Arial Narrow',sans-serif}.featured-stat span{font-size:8px;letter-spacing:.18em;color:#8f8a82;font-weight:900}.song-popover{position:absolute;z-index:35;left:0;top:calc(100% + 10px);width:min(420px,70vw);display:grid;grid-template-columns:100px 1fr;gap:13px;background:#e8e2d8;color:#080808;border:1px solid #8f8a82;padding:10px;box-shadow:0 20px 45px rgba(0,0,0,.55);opacity:0;visibility:hidden;transform:translateY(-4px);transition:.16s ease;pointer-events:none}.song-title-wrap:hover .song-popover,.song-title-wrap:focus-within .song-popover{opacity:1;visibility:visible;transform:translateY(0)}.song-popover img{width:100px;height:100px;object-fit:cover}.song-popover b{font-family:Impact,'Arial Narrow',sans-serif;font-size:22px}.song-popover p{font:13px/1.4 Georgia,serif;margin:7px 0;color:#47433d}.song-popover small{font-size:8px;letter-spacing:.12em;font-weight:900;color:#9b4c2e}.song-title:hover{color:var(--blue)}
@media(max-width:900px){.song-row{grid-template-columns:38px minmax(0,1fr) auto auto auto}.song-row em{display:none}.song-popover{display:none}}
@media(max-width:560px){.song-row{grid-template-columns:30px minmax(0,1fr) auto}.song-count{grid-column:3;grid-row:1}.song-play{grid-column:2}.song-share{grid-column:3;justify-self:end;padding-bottom:7px}.song-popover{display:none}}

/* v0.5.0 live layout + DIRT RADIO waveform / runtime / shuffle / repeat */
.song-duration{min-width:50px;text-align:right;font:10px/1 Arial,sans-serif;letter-spacing:.14em;color:var(--blue)}
.player{grid-template-columns:auto minmax(180px,330px) minmax(220px,1fr) auto}
.player-controls{gap:6px}.player-mode{position:relative;width:31px;height:31px;border:1px solid #444;border-radius:50%;background:transparent;color:#777;display:grid;place-items:center;padding:7px}.player-mode svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.player-mode.active{color:var(--blue);border-color:var(--blue);background:rgba(183,212,228,.08)}.repeat-one{display:none;position:absolute;right:-2px;bottom:-3px;width:13px;height:13px;border-radius:50%;background:var(--blue);color:#080808;font:bold 8px/13px Arial;text-align:center}.player-mode[data-repeat="one"] .repeat-one{display:block}
.waveform-wrap{height:42px;position:relative;cursor:pointer;overflow:hidden;border-left:1px solid rgba(255,255,255,.08);border-right:1px solid rgba(255,255,255,.08);padding:0 5px}.waveform-wrap canvas{display:block;width:100%;height:100%}
[data-layout-key]{position:relative;will-change:translate}
@media(max-width:900px){.song-row{grid-template-columns:38px minmax(0,1fr) auto auto auto auto}.player{grid-template-columns:auto 1fr auto}.waveform-wrap{grid-column:1/-1;grid-row:2;height:34px}}
@media(max-width:560px){.song-row{grid-template-columns:30px minmax(0,1fr) auto}.song-count{grid-column:3;grid-row:1}.song-duration{grid-column:3;grid-row:2}.song-play{grid-column:2;grid-row:2}.song-share{grid-column:2;grid-row:3;justify-self:start}.player-mode{width:29px;height:29px}.player-controls{display:flex}.player-controls .player-skip{display:none}}
.song-row{grid-template-columns:48px minmax(0,1fr) auto auto auto auto auto}

/* v0.5.1 DIRT RADIO dense seekable waveform */
.player{grid-template-columns:minmax(145px,280px) auto 42px minmax(260px,1fr) 42px auto;gap:10px;min-height:62px;padding:7px 10px;background:rgba(5,22,30,.97);border-color:rgba(94,153,174,.35)}
.player-info{padding-right:4px}.player-label{color:#38d2d6}.player-controls{white-space:nowrap}.player-play{border-radius:4px;background:#1d8b93;border-color:#38d2d6}.player-skip,.player-mode{border-radius:4px;background:rgba(255,255,255,.045)}
.player-time{font:700 9px/1 Arial,sans-serif;color:#d4e1e5;text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}.player-elapsed{text-align:right}.player-duration{text-align:left}
.waveform-wrap{height:46px;padding:0;border:0;background:transparent;overflow:visible}.waveform-wrap canvas{width:100%;height:100%;display:block}
.player-share{border-radius:3px;background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.15)}
@media(max-width:900px){.player{grid-template-columns:minmax(0,1fr) auto auto;grid-template-rows:auto 34px;gap:6px 8px}.player-info{grid-column:1}.player-controls{grid-column:2}.player-right{grid-column:3}.player-elapsed{grid-column:1;grid-row:2;display:none}.waveform-wrap{grid-column:1/4;grid-row:2;height:34px}.player-duration{display:none}}
@media(max-width:560px){.player{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto 34px}.player-controls{grid-column:2}.player-right{display:none}.waveform-wrap{grid-column:1/3;grid-row:2}.player-info strong{max-width:58vw}.player-mode{display:none}}

/* v0.5.4 fixed top navigation — stays visible for the entire page */
.topbar{position:fixed !important;top:0;left:0;right:0;width:100%;z-index:1000}
header.topbar + main{padding-top:76px}
section[id]{scroll-margin-top:76px}
@media(max-width:900px){header.topbar + main{padding-top:76px}.topbar .nav{z-index:1001}}


/* v0.5.4 DIRT RADIO palette — rust / charcoal / steel blue, no teal */
.player{
  background:rgba(21,21,20,.98);
  border-color:#3f3f3e;
  border-top:4px solid #874b30;
  box-shadow:0 12px 40px rgba(0,0,0,.52);
}
.player-label{color:#b7d4e4}
.player-play{
  background:transparent;
  border-color:#b7d4e4;
  color:#f4f1ea;
}
.player-play:hover{background:rgba(183,212,228,.09)}
.player-skip,.player-mode{
  background:#151514;
  border-color:#3f3f3e;
  color:#d3cec5;
}
.player-skip:hover,.player-mode:hover{border-color:#b7d4e4;color:#f4f1ea}
.player-mode.active{
  color:#b7d4e4;
  border-color:#b7d4e4;
  background:rgba(183,212,228,.08);
}
.repeat-one{background:#9b4c2e;color:#f4f1ea}
.player-time{color:#d3cec5}
.player-share{
  background:#151514;
  border-color:#3f3f3e;
  color:#f4f1ea;
}
.player-share:hover{border-color:#b7d4e4}
.waveform-wrap{background:transparent}

/* v0.5.5 hero position: restored Gravel higher in frame while fixed nav remains opaque */


/* v0.5.6 hero lock reset + DIRT RADIO hover volume control */
.hero-art{height:100%}
.player-right{position:relative;display:flex;align-items:center;gap:8px}
.player-volume{position:relative;display:flex;align-items:center}
.volume-toggle{
  height:31px;min-width:39px;padding:0 7px;border:1px solid #3f3f3e;
  background:#151514;color:#d3cec5;font:800 8px/1 Arial,sans-serif;
  letter-spacing:.11em
}
.volume-toggle:hover,.player-volume:hover .volume-toggle,.player-volume:focus-within .volume-toggle{
  border-color:#b7d4e4;color:#f4f1ea
}
.volume-toggle.muted{color:#9b4c2e;border-color:#9b4c2e}
.volume-popover{
  position:absolute;right:0;bottom:calc(100% + 9px);z-index:120;
  width:176px;padding:9px 10px;background:#151514;border:1px solid #484744;
  border-top:3px solid #874b30;box-shadow:0 12px 28px rgba(0,0,0,.5);
  display:grid;grid-template-columns:25px 1fr 25px;gap:7px;align-items:center;
  opacity:0;visibility:hidden;transform:translateY(5px);transition:.14s ease;
  pointer-events:none
}
.player-volume:hover .volume-popover,.player-volume:focus-within .volume-popover{
  opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto
}
.volume-popover input[type="range"]{
  width:100%;accent-color:#b7d4e4;cursor:pointer
}
.volume-step{
  width:25px;height:25px;border:1px solid #3f3f3e;background:#0d0d0d;
  color:#d3cec5;padding:0;font:700 10px/1 Arial,sans-serif
}
.volume-step:hover{border-color:#b7d4e4;color:#fff}
#volume-value{
  grid-column:1/-1;text-align:center;color:#aaa49b;
  font:700 8px/1 Arial,sans-serif;letter-spacing:.12em
}
@media(max-width:560px){
  .volume-popover{right:-44px;width:168px}
  .volume-toggle{min-width:36px}
}


/* v0.5.7 — inline volume slider + shorter waveform */
.player-main{
  display:grid;
  grid-template-columns:minmax(210px,1.05fr) auto minmax(260px,2.15fr) auto;
  align-items:center;
  gap:12px;
}
.player-wave{
  min-width:0;
  width:100%;
}
#waveform-wrap{
  width:100%;
  min-width:180px;
  max-width:760px;
}
.player-right{
  display:flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
}
.player-volume-inline{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:210px;
}
.volume-label{
  color:#d3cec5;
  font:800 8px/1 Arial,sans-serif;
  letter-spacing:.12em;
}
.player-volume-inline input[type="range"]{
  width:96px;
  accent-color:#b7d4e4;
  cursor:pointer;
}
.player-volume-inline #volume-value{
  min-width:34px;
  text-align:right;
  color:#aaa49b;
  font:700 8px/1 Arial,sans-serif;
  letter-spacing:.06em;
}
.inline-vol{
  width:23px;
  height:23px;
  flex:0 0 23px;
}
.volume-popover,.volume-toggle{display:none!important}

@media(max-width:980px){
  .player-main{
    grid-template-columns:minmax(170px,.9fr) auto minmax(180px,1.5fr) auto;
    gap:8px;
  }
  .player-volume-inline{min-width:178px;gap:5px}
  .player-volume-inline input[type="range"]{width:74px}
  #waveform-wrap{max-width:520px}
}
@media(max-width:760px){
  .player-main{
    grid-template-columns:1fr auto;
    grid-template-areas:
      "meta controls"
      "wave wave"
      "right right";
    row-gap:7px;
  }
  .player-meta{grid-area:meta}
  .player-controls{grid-area:controls}
  .player-wave{grid-area:wave}
  .player-right{grid-area:right;justify-content:flex-end}
  #waveform-wrap{max-width:none}
}

/* v0.5.9 — restore Gravel hero to intended default position.
   Old LIVE EDIT offsets are bypassed by the new hero layout key. */
.hero-art{
  right:1.5vw;
  bottom:0;
  height:100%;
  width:53%;
}
.hero-art img{
  max-height:100%;
  width:auto;
}

/* v0.6.3 — unobtrusive Admin link */
.footer-right-wrap{display:flex;align-items:center;justify-content:flex-end;gap:14px}
.footer-admin-link{color:#5f5d58;text-decoration:none;font-size:8px;font-weight:800;letter-spacing:.14em}
.footer-admin-link:hover{color:#b7d4e4}

/* v0.6.4 Safari/Chrome hero consistency */
.hero-art{
  top:0;
  bottom:0;
  height:auto;
  right:1.5vw;
  width:53%;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  transform:translate3d(0,0,0);
}
.hero-art img{
  height:100%;
  max-height:none;
  width:auto;
  object-fit:contain;
  object-position:bottom center;
}

/* v0.6.8 — persistent Gravel move + resize */
.hero-art{
  transform:translate3d(var(--hero-x,0px),var(--hero-y,0px),0)!important;
  transform-origin:50% 100%;
}
.hero-art img{
  transform:scale(var(--hero-scale,1));
  transform-origin:50% 100%;
}
.live-resize-handle{
  display:none;
  position:absolute;
  z-index:80;
  width:20px;
  height:20px;
  margin:-10px 0 0 -10px;
  background:#ffb000;
  border:2px solid #080808;
  box-shadow:0 0 0 2px rgba(255,176,0,.4);
  cursor:nwse-resize;
  border-radius:2px;
}
body.edit-move .live-resize-handle{display:block}

/* v0.6.9 — deterministic hero image box in Safari/Chrome */
.hero-art img{
  display:block;
  flex:0 0 auto;
  height:100%;
  max-height:none!important;
  max-width:none!important;
  width:auto!important;
}

/* v0.7.0 — four hidden corner resize handles on all draggable containers */
.live-resize-relative{position:relative!important}
.live-container-resize-handle{
  position:absolute;z-index:999;width:22px;height:22px;opacity:0;
  background:rgba(255,176,0,.18);border:1px solid rgba(255,176,0,.55);
  pointer-events:auto;touch-action:none
}
body.edit-move [data-move-key]:hover > .live-container-resize-handle,
body.edit-move .live-selected > .live-container-resize-handle{opacity:.32}
.live-container-resize-handle[data-corner="nw"]{left:0;top:0;cursor:nwse-resize}
.live-container-resize-handle[data-corner="ne"]{right:0;top:0;cursor:nesw-resize}
.live-container-resize-handle[data-corner="sw"]{left:0;bottom:0;cursor:nesw-resize}
.live-container-resize-handle[data-corner="se"]{right:0;bottom:0;cursor:nwse-resize}
body.edit-move .live-selected{outline:2px solid rgba(255,176,0,.65)!important;outline-offset:-2px}

/* v0.7.4 — mobile DIRT RADIO: no scrunched controls */
@media (max-width:820px){
  .player{
    left:8px;
    right:8px;
    bottom:max(8px,env(safe-area-inset-bottom));
    width:auto;
    min-height:0;
    padding:9px 10px 8px;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto 38px auto;
    grid-template-areas:
      "info controls"
      "wave wave"
      "right right";
    gap:7px 10px;
    align-items:center;
  }

  .player-info{
    grid-area:info;
    min-width:0;
    width:100%;
    padding:0;
  }
  .player-info strong{
    display:block;
    max-width:none!important;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:11px;
  }

  .player-controls{
    grid-area:controls;
    display:flex!important;
    align-items:center;
    justify-content:flex-end;
    gap:5px;
    min-width:0;
  }
  .player-play{
    width:38px;
    height:38px;
    flex:0 0 38px;
  }
  .player-skip{
    width:30px;
    height:30px;
    flex:0 0 30px;
  }
  .player-mode{
    width:30px;
    height:30px;
    flex:0 0 30px;
  }

  .player-elapsed,.player-duration{display:none!important}

  .waveform-wrap{
    grid-area:wave!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:38px!important;
    overflow:hidden!important;
  }

  .player-right{
    grid-area:right!important;
    display:flex!important;
    width:100%;
    min-width:0;
    align-items:center;
    justify-content:space-between!important;
    gap:8px;
  }

  .player-volume-inline{
    display:flex;
    flex:1 1 auto;
    min-width:0!important;
    max-width:none;
    gap:5px!important;
  }
  .player-volume-inline input[type="range"]{
    flex:1 1 90px;
    width:auto!important;
    min-width:70px;
    max-width:none;
  }
  .player-volume-inline #volume-value{
    flex:0 0 34px;
    min-width:34px;
  }
  .inline-vol{
    width:30px;
    height:30px;
    flex:0 0 30px;
  }
  .player-share{
    flex:0 0 auto;
    min-height:30px;
    padding:7px 9px;
  }

  .share-toast{
    bottom:calc(162px + env(safe-area-inset-bottom));
  }
}

@media (max-width:560px){
  .player{
    grid-template-rows:auto 36px auto;
    gap:6px 8px;
    padding:8px;
  }
  .player-controls .player-skip,
  .player-controls .player-mode{
    display:none!important;
  }
  .player-play{
    width:40px;
    height:40px;
    flex-basis:40px;
  }
  .waveform-wrap{height:36px!important}
  .volume-label{display:none}
  .player-volume-inline{gap:4px!important}
  .player-volume-inline input[type="range"]{min-width:80px}
  .inline-vol{
    width:28px;
    height:28px;
    flex-basis:28px;
  }
  .player-share{
    min-height:28px;
    padding:6px 8px;
    font-size:7px;
  }
}

@media (max-width:390px){
  .player-volume-inline #volume-value{display:none}
  .player-volume-inline input[type="range"]{min-width:72px}
}

/* v0.8.5 — working footer PLAY THE SONGS link */
.footer-song-link{color:inherit;text-decoration:none;cursor:pointer;transition:color .18s ease,opacity .18s ease}
.footer-song-link:hover,.footer-song-link:focus-visible{color:#d7edf8;opacity:1;outline:none}


/* v0.8.5 — MOBILE DIRT RADIO PLAYBACK / DESKTOP HOVER VOLUME */
.inline-vol{display:none!important}
@media(max-width:820px){
  .player-volume-inline{display:none!important}
  .player-right{justify-content:flex-end!important}
  .player-share{min-width:72px}
}
@media(max-width:560px){
  .player{grid-template-columns:minmax(0,1fr) 46px;grid-template-rows:auto 36px auto;grid-template-areas:"info controls" "wave wave" "right right"}
  .player-controls{grid-area:controls}
  .player-right{grid-area:right!important;display:flex!important;justify-content:flex-end!important}
  .player-share{display:block!important}
}