*{box-sizing:border-box}body{margin:0;background:#06111f;color:#eaf4ff;font:16px system-ui,-apple-system,Segoe UI,sans-serif}a{color:#65b8ff;text-decoration:none}header{background:#030b16;border-bottom:1px solid #164b77;display:flex;gap:20px;align-items:center;flex-wrap:wrap;padding:16px 4%}nav{margin-left:auto;display:flex;gap:14px;align-items:center;flex-wrap:wrap}nav a{color:#cde8ff}.logo{font-size:28px;font-weight:900;color:white}.logo span{color:#1687ff}.home,.btn,button{background:#086be7;color:white;border:0;border-radius:9px;padding:10px 15px;font-weight:700;cursor:pointer;display:inline-block}.home{background:#102d55;border:1px solid #178eff}main{max-width:1150px;margin:auto;padding:22px 18px 120px}.hero{padding:35px 25px;text-align:center;border-radius:18px;background:radial-gradient(circle at 80% 10%,#1646a3,transparent 45%),linear-gradient(120deg,#0a203e,#060d1b);border:1px solid #144c85;margin-bottom:20px}.hero h1{font-size:clamp(34px,6vw,58px);margin:0}.hero h1 span{color:#1687ff}.hero p{letter-spacing:3px}.card{max-width:460px;margin:35px auto;background:#0d2037;padding:24px;border:1px solid #1a568b;border-radius:15px}input,select{background:#112b49;color:white;border:1px solid #37618b;border-radius:8px;padding:12px;width:100%;font:inherit}label{display:block;margin:15px 0 5px}button:hover,.btn:hover{filter:brightness(1.15)}.danger{background:#a8314b}.green{background:#079654}.muted{color:#a5bbd1}.notice{padding:12px;background:#153657;border-radius:9px;margin:12px 0}.error{background:#62243c}.song{display:flex;align-items:center;gap:14px;border-bottom:1px solid #213a55;padding:14px 5px;flex-wrap:wrap}.song .details{flex:1;min-width:170px}.song .details strong{display:block;font-size:18px}.song .actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.song button,.song .btn{font-size:14px}.filters{display:flex;gap:12px;flex-wrap:wrap;margin:15px 0}.filters input{flex:2;min-width:200px}.filters select{flex:1;min-width:130px}.player{position:fixed;bottom:0;left:0;right:0;background:#091e37;border-top:2px solid #178eff;padding:12px 4%;display:flex;align-items:center;gap:12px;z-index:3}.player audio{flex:1;min-width:100px}.player #playing{max-width:240px;font-weight:700}table{width:100%;border-collapse:collapse}td,th{padding:12px;border-bottom:1px solid #274059;text-align:left}form.inline{display:inline}form.inline button{padding:7px 10px}footer{text-align:center;color:#8ea6c1;padding:25px}@media(max-width:600px){header{gap:10px}nav{width:100%;margin:0;justify-content:center;gap:10px}.logo{font-size:23px}.song .actions{width:100%;justify-content:flex-start}.player{flex-direction:column;align-items:stretch}.player #playing{max-width:none}main{padding-bottom:155px}.hero{padding:26px 10px}}
/* ReyMusic visual upgrade — append-only rules, preserving original selectors */
:root{color-scheme:dark;--rm-blue:#087cff;--rm-cyan:#39caff;--rm-border:#21486e;--rm-surface:#0c2036}
body{background:radial-gradient(ellipse 65% 45% at 95% 0%,rgba(7,91,201,.13),transparent 70%),#050f1d;color:#f1f7ff}
a{transition:color .2s ease}a:hover{color:#a7e7ff}
header{background:rgba(3,11,22,.97);border-bottom:1px solid #1b4268;box-shadow:0 8px 32px rgba(0,0,0,.18);padding:15px 3.5%;gap:18px}
.logo{font-size:clamp(25px,3vw,35px);letter-spacing:-1px;text-shadow:0 0 24px rgba(17,121,255,.12)}
.logo span{color:#188bff}
nav{gap:18px}nav a{font-weight:550;transition:color .2s ease}nav a:hover{color:#58c8ff}
.home{background:linear-gradient(135deg,#163c71,#0a2342);border:1px solid #2889ef;box-shadow:0 0 16px rgba(0,125,255,.12)}
.home:hover{box-shadow:0 0 20px rgba(0,125,255,.28)}
main{max-width:1350px;padding:26px 20px 155px}
.hero{position:relative;overflow:hidden;isolation:isolate;min-height:215px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:35px 25px;border:1px solid #20548b;border-radius:20px;background:radial-gradient(ellipse at 78% 30%,rgba(17,104,231,.55),transparent 47%),radial-gradient(ellipse at 12% 95%,rgba(10,68,137,.65),transparent 52%),linear-gradient(125deg,#07192f,#071121 55%,#102b58);box-shadow:0 18px 45px rgba(0,0,0,.15)}
.hero:before{content:'♫  ♪  ♫';position:absolute;left:5%;top:22%;font-size:clamp(32px,5vw,75px);letter-spacing:13px;color:rgba(64,161,255,.15);transform:rotate(-9deg);z-index:-1;pointer-events:none}
.hero:after{content:'♫  ♪';position:absolute;right:5%;bottom:13%;font-size:clamp(35px,5vw,75px);letter-spacing:12px;color:rgba(96,206,255,.15);transform:rotate(11deg);z-index:-1;pointer-events:none}
.hero h1{font-weight:900;letter-spacing:-2px;text-shadow:0 6px 30px rgba(0,0,0,.25)}
.hero h1 span{background:linear-gradient(115deg,#3ac6ff,#087cff 75%);background-clip:text;-webkit-background-clip:text;color:transparent}
.hero p{font-weight:650;letter-spacing:3.5px;font-size:clamp(11px,1.4vw,16px);color:#e5f0ff}
h1,h2,h3{letter-spacing:-.5px}h2{font-size:clamp(24px,3vw,31px)}
.card{background:linear-gradient(150deg,#102946,#091a2d);border:1px solid #245b91;box-shadow:0 18px 48px rgba(0,0,0,.22)}
input,select{background:#132b49;border:1px solid #35638c;transition:border-color .2s ease,box-shadow .2s ease}
input:focus,select:focus{outline:none;border-color:#35aaff;box-shadow:0 0 0 3px rgba(13,125,255,.16)}
button,.btn{background:linear-gradient(180deg,#158cff,#0567df);box-shadow:0 3px 10px rgba(0,79,185,.12);transition:filter .2s ease,transform .2s ease,box-shadow .2s ease}
button:hover,.btn:hover{filter:brightness(1.12);transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,104,240,.2)}
.green{background:linear-gradient(180deg,#12b96b,#078f50)}.danger{background:linear-gradient(180deg,#c64560,#9d2741)}
.notice{border:1px solid rgba(93,165,236,.13)}
.filters{gap:12px;margin:20px 0 13px}.filters input{flex:2.2}.filters select{flex:1}
.song{background:linear-gradient(90deg,rgba(19,45,75,.26),transparent 85%);border:1px solid transparent;border-bottom-color:#203c5b;padding:15px 12px;gap:15px;transition:background .2s ease,border-color .2s ease}
.song:hover{background:#102740;border-color:#1c446a;border-radius:11px}
.song .details strong{font-size:18px;line-height:1.4;color:#f8fbff}
.song .actions{gap:9px}
.song .actions .btn,.song .actions button{border-radius:9px}
.player{background:linear-gradient(100deg,#061426,#0c2440);border-top:2px solid #138aff;box-shadow:0 -10px 40px rgba(0,0,0,.42);padding:12px 3.5%;gap:16px;backdrop-filter:blur(12px)}
.player #playing{font-size:15px;line-height:1.45}
.player audio{height:44px;accent-color:#0a84ff}
footer{color:#8ba9c9}
@media(max-width:760px){header{padding:12px 4%;gap:11px}nav{gap:12px;justify-content:flex-start}main{padding:17px 12px 175px}.hero{min-height:160px;padding:25px 14px}.hero h1{letter-spacing:-1px}.hero p{letter-spacing:2px}.song{padding:13px 8px}.song .details strong{font-size:18px}.song .actions{width:100%;justify-content:flex-start}.song .actions .btn,.song .actions button{min-height:41px}.filters{gap:9px}.filters input,.filters select{flex:1 1 100%;min-width:0}.player{flex-direction:column;align-items:stretch;gap:8px;padding:10px 4%}.player #playing{max-width:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player audio{width:100%;min-width:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* ReyMusic sticky top player - music library page only */
.rm-player{position:sticky;top:0;z-index:50;width:100%;max-width:760px;margin:0 auto 20px;padding:12px;background:linear-gradient(150deg,#e9f1f8,#b7c8d8);border:2px solid #86a6bd;border-radius:14px;box-shadow:0 10px 35px rgba(0,0,0,.45);color:#071d30}
.rm-screen{background:linear-gradient(145deg,#056b9f,#18a9d4 55%,#075585);border:5px solid #102d3e;box-shadow:inset 0 0 16px #003e70;border-radius:4px;padding:9px 12px 5px;color:#fff;min-height:120px}
.rm-screen-top{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px}.rm-screen-top #playing{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90%;font-weight:650}.rm-bars{opacity:.8}
.rm-time{text-align:center;font-size:clamp(36px,9vw,65px);font-weight:650;line-height:1.12;font-variant-numeric:tabular-nums;text-shadow:0 0 12px #bceeff}
.rm-progress input{width:100%;height:12px;margin:4px 0;accent-color:#e6faff;cursor:pointer;padding:0;box-shadow:none}
.rm-time-row{display:flex;justify-content:space-between;font-size:11px;opacity:.85}
.rm-controls{display:flex;justify-content:center;align-items:center;gap:clamp(5px,2vw,16px);padding:9px 2px 0}
.rm-controls button{border:0;border-radius:9px;padding:8px 11px;background:#172b3b;color:#f4fbff;box-shadow:none;font-size:18px;min-width:40px;min-height:40px;touch-action:manipulation}
.rm-controls button.rm-toggle{border-radius:50%;width:58px;height:58px;font-size:26px;background:linear-gradient(#29b6f7,#0868d0);border:3px solid #173d5d;box-shadow:0 0 0 2px #819ba8}
.rm-controls button.active{background:#087bc6;color:white}
.rm-player audio{display:none}
@media(max-width:600px){main{padding-bottom:35px}.rm-player{border-radius:9px;padding:8px;margin-bottom:14px}.rm-screen{min-height:110px;padding:6px 8px 3px}.rm-controls{gap:5px}.rm-controls button{padding:7px;min-width:36px;min-height:36px}.rm-controls button.rm-toggle{width:53px;height:53px}}
