/* 设计令牌取自 UbuntuConsole (9002) — Fresh Cyberpunk */
:root{
  --bg-base:#050710; --bg-surface:#0b0e20; --bg-elev-1:#121630; --bg-elev-2:#191e42;
  --pink-main:#ff7eb6; --blue-main:#70d6ff;
  --accent:#ff7eb6; --accent-2:#70d6ff;
  --grad:linear-gradient(135deg,#ff7eb6 0%,#70d6ff 100%);
  --line:rgba(112,214,255,.10); --line-pink:rgba(255,126,182,.20); --line-strong:rgba(112,214,255,.22);
  --text-1:#fff; --text-2:#d4dbf5; --text-3:#8e97c6; --text-4:#575e8a;
  --r-md:10px; --r-lg:14px; --r-xl:20px;
  --ease-out:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:var(--bg-base);color:var(--text-1);
  font-family:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
body{min-height:100vh;padding-bottom:108px;
  background-image:radial-gradient(900px 500px at 15% -10%,rgba(255,126,182,.10),transparent 60%),
                   radial-gradient(800px 500px at 85% 0%,rgba(112,214,255,.09),transparent 60%);
  background-attachment:fixed}
header{padding:22px 18px 10px;max-width:860px;margin:0 auto}
.brand{display:flex;align-items:center;gap:10px}
.dot{width:10px;height:10px;border-radius:50%;background:var(--grad);box-shadow:0 0 14px rgba(255,126,182,.7)}
h1{font-size:20px;margin:0;letter-spacing:.4px;font-weight:700}
.sub{color:var(--text-3);font-size:12.5px;margin-top:6px;line-height:1.5}
.searchwrap{max-width:860px;margin:14px auto 0;padding:0 18px}
input[type=search]{width:100%;padding:13px 15px;border-radius:var(--r-lg);
  background:var(--bg-surface);border:1px solid var(--line);color:var(--text-1);font-size:15px;
  outline:none;font-family:inherit}
input[type=search]:focus{border-color:var(--line-pink);box-shadow:0 0 0 3px rgba(255,126,182,.10)}
.chips{display:flex;gap:8px;overflow-x:auto;padding:14px 18px 4px;max-width:860px;margin:0 auto;
  scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;padding:8px 14px;border-radius:999px;background:var(--bg-surface);
  border:1px solid var(--line);color:var(--text-3);font-size:12.5px;cursor:pointer;white-space:nowrap;
  transition:.18s var(--ease-out)}
.chip.on{color:#0a0c18;background:var(--grad);border-color:transparent;font-weight:700}
main{max-width:860px;margin:0 auto;padding:8px 18px 0}
.card{display:flex;gap:12px;align-items:center;padding:14px;margin-bottom:10px;
  background:linear-gradient(180deg,var(--bg-surface),var(--bg-elev-1));
  border:1px solid var(--line);border-radius:var(--r-lg);cursor:pointer;
  transition:.18s var(--ease-out)}
.card:active{transform:scale(.995)}
.card.playing{border-color:var(--line-pink);box-shadow:0 0 0 1px rgba(255,126,182,.18),0 8px 30px rgba(255,126,182,.10)}
.play{flex:0 0 42px;height:42px;border-radius:50%;background:var(--grad);display:grid;place-items:center;
  border:none;cursor:pointer;color:#0a0c18;font-size:15px;font-weight:700}
.play.ghost{background:var(--bg-elev-2);color:var(--blue-main);border:1px solid var(--line-strong)}
.meta{min-width:0;flex:1}
.t{font-size:14.5px;line-height:1.42;color:var(--text-1);display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
.m{font-size:11.5px;color:var(--text-4);margin-top:6px;display:flex;gap:10px;flex-wrap:wrap}
.m b{color:var(--blue-main);font-weight:600}
#bar{position:fixed;left:0;right:0;bottom:0;background:rgba(5,7,16,.92);backdrop-filter:blur(18px);
  border-top:1px solid var(--line);padding:10px 16px 14px;transform:translateY(120%);
  transition:transform .32s var(--ease-out);z-index:50}
#bar.up{transform:translateY(0)}
#bar .row{display:flex;align-items:center;gap:12px;max-width:860px;margin:0 auto}
#nowtitle{font-size:12.5px;color:var(--text-2);flex:1;min-width:0;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
audio{width:100%;max-width:860px;display:block;margin:8px auto 0;height:34px}
.modal{position:fixed;inset:0;background:rgba(3,5,12,.86);backdrop-filter:blur(8px);z-index:80;
  display:none;padding:16px}
.modal.up{display:block}
.sheet{max-width:860px;margin:0 auto;background:var(--bg-base);border:1px solid var(--line);
  border-radius:var(--r-xl);max-height:92vh;overflow:auto;padding:20px}
.sheet h2{font-size:16px;line-height:1.45;margin:0 0 12px;color:var(--text-1)}
.sheet pre{white-space:pre-wrap;word-break:break-word;font-family:inherit;font-size:14.5px;
  line-height:1.75;color:var(--text-2)}
.x{float:right;background:var(--bg-elev-2);border:1px solid var(--line);color:var(--text-3);
  border-radius:50%;width:32px;height:32px;cursor:pointer;font-size:15px}
.empty{color:var(--text-4);text-align:center;padding:40px 0;font-size:13px}
