:root{
  --bg:#0a0f1a;
  --card:#161b22;
  --muted:#8b949e;
  --text:#f0f6fc;
  --gold:#d4af37;
  --gold-light:#f4d03f;
  --green:#2ea043;
  --green-dark:#1a7f37;
  --line:rgba(255,255,255,.08);
  --shadow: 0 8px 32px rgba(0,0,0,.4);
  --radius:16px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial; background: radial-gradient(1200px 800px at 20% 0%, rgba(212,175,55,.12), transparent 60%),
radial-gradient(900px 700px at 80% 10%, rgba(46,160,67,.10), transparent 55%), var(--bg); color:var(--text);}
a{color:inherit;text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:22px}
.nav{position:sticky;top:0;backdrop-filter: blur(10px); background: rgba(10,15,26,.9); border-bottom:1px solid var(--line); z-index:10}
.nav .inner{display:flex;align-items:center;justify-content:space-between;gap:14px; padding:14px 22px; max-width:1100px;margin:0 auto;}
.brand{display:flex;gap:10px;align-items:center}
.brand img{width:36px;height:36px;border-radius:10px}
.brand .title{font-weight:800;letter-spacing:.2px;background:linear-gradient(135deg,var(--gold),var(--gold-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.nav .links{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:12px;border:1px solid var(--line); background: rgba(255,255,255,.05); color:var(--text); transition:all .2s;}
.btn:hover{background: rgba(255,255,255,.1);border-color:var(--gold);}
.btn-primary{border-color: var(--gold); background: linear-gradient(135deg, var(--gold), var(--gold-light)); color:#000; font-weight:600;}
.btn-primary:hover{background: linear-gradient(135deg, var(--gold-light), var(--gold));}
.btn-success{border-color: var(--green); background: linear-gradient(135deg, var(--green), var(--green-dark)); color:#fff;}
.btn-ghost{background:transparent}
.grid{display:grid;grid-template-columns: repeat(12,1fr); gap:16px}
.card{grid-column: span 12; background: var(--card); border:1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding:18px}
.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.h1{margin:0;font-size:20px}
.muted{color:var(--muted);font-size:13px}
.footer{opacity:.9;border-top:1px solid var(--line); margin-top:26px; padding:20px 0;text-align:center}
.input{width:100%; padding:12px 14px; border-radius:12px; border:1px solid var(--line); background: rgba(255,255,255,.03); color:var(--text); font-size:14px; transition:border-color .2s;}
.input:focus{outline:none;border-color:var(--gold);}
.input::placeholder{color:var(--muted);}
.form-group{margin-bottom:16px;}
.form-label{display:block;color:var(--muted);font-size:12px;margin-bottom:6px;font-weight:600;}
.row{display:grid;grid-template-columns: 1fr 1fr; gap:12px}
@media(max-width:760px){.row{grid-template-columns:1fr}}
.alert{padding:14px;border:1px solid rgba(212,175,55,.3); border-radius:12px; background: rgba(212,175,55,.1);color:var(--gold);}
.alert-success{background: rgba(46,160,67,.2);border-color:rgba(46,160,67,.4);color:var(--green);}
.alert-error{background: rgba(248,81,73,.15);border-color:rgba(248,81,73,.4);color:#f85149;}
.player-wrap{aspect-ratio:16/9;border-radius:16px;overflow:hidden;border:1px solid var(--line); background:#000}
.progress-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
.progress{flex:1;height:10px;border-radius:999px;border:1px solid var(--line); background: rgba(255,255,255,.05); overflow:hidden}
.bar{height:100%; background: linear-gradient(90deg, var(--gold), var(--green)); width:0%}
.badge{display:inline-block; padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600; border:1px solid rgba(212,175,55,.3); background: rgba(212,175,55,.15);color:var(--gold);}
.badge-success{background: rgba(46,160,67,.2);color:var(--green);border-color:rgba(46,160,67,.4);}
.hidden{display:none}
.table{width:100%; border-collapse: collapse; overflow:hidden; border-radius:14px; border:1px solid var(--line)}
.table th,.table td{padding:14px;border-bottom:1px solid var(--line); text-align:left}
.table th{color:var(--muted); font-size:12px; font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.lock{opacity:.55}