/* MusicPortal - Kaffeebraun/Orange */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Segoe UI',Arial,sans-serif;background:linear-gradient(135deg,#6F4E37 0%,#A0522D 50%,#FF8C00 100%);color:#333;min-height:100vh}
.container{max-width:1200px;margin:20px auto;background:#FFF8DC;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.3);border:3px solid #8B4513}
header{background:linear-gradient(135deg,#8B4513 0%,#FF8C00 100%);color:#fff;padding:30px;border-radius:9px 9px 0 0;text-align:center;box-shadow:0 4px 10px rgba(0,0,0,.2)}
header h1{font-size:2.5em;text-shadow:2px 2px 4px rgba(0,0,0,.3);margin-bottom:10px}
header p{font-size:1.1em;color:#F5DEB3}
header a{color:#F5DEB3;text-decoration:none;margin:0 10px}
header a:hover{color:#fff}
nav{background:#D2B48C;padding:15px;display:flex;justify-content:center;gap:20px;border-bottom:3px solid #8B4513}
nav a{color:#6F4E37;text-decoration:none;padding:10px 20px;border-radius:8px;font-weight:600;transition:all .3s}
nav a:hover{background:#FF8C00;color:#fff}
.filters{padding:20px;background:#F5DEB3;border-bottom:2px solid #D2B48C}
.filters input,.filters select,.filters button{padding:10px;border:2px solid #D2B48C;border-radius:8px;background:#fff}
.filters button{background:linear-gradient(135deg,#8B4513,#FF8C00);color:#fff;font-weight:600;cursor:pointer;border:none}
.tracks{padding:20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.track{background:#fff;border:2px solid #D2B48C;border-radius:12px;padding:20px;transition:all .2s}
.track:hover{transform:translateY(-5px);box-shadow:0 8px 20px rgba(139,69,19,.2);border-color:#FF8C00}
.track-cover{width:100%;height:200px;background:#F5DEB3;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:4em;margin-bottom:15px;overflow:hidden}
.track-cover img{width:100%;height:100%;object-fit:cover}
.track-info h3{color:#6F4E37;margin-bottom:5px;font-size:1.3em}
.artist{color:#D2691E;font-size:1.1em;margin-bottom:5px}
.genre{display:inline-block;background:#FFE4B5;color:#8B4513;padding:4px 12px;border-radius:12px;font-size:.85em;font-weight:600;margin:10px 0}
.rating{margin:10px 0}
.star{cursor:pointer;font-size:1.5em;color:#D2B48C;transition:color .2s}
.star.active,.star:hover{color:#FF8C00}
.stats{color:#999;font-size:.9em;margin:10px 0}
.track-actions{display:flex;gap:10px;margin-top:15px}
.play-btn,.buy-btn{flex:1;padding:12px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s}
.play-btn{background:#F5DEB3;color:#6F4E37}
.play-btn:hover{background:#D2B48C}
.buy-btn{background:linear-gradient(135deg,#8B4513,#FF8C00);color:#fff}
.buy-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(139,69,19,.3)}
.box{background:#fff;border:2px solid #D2B48C;border-radius:8px;padding:30px;margin:20px}
.box h2{color:#6F4E37;margin-bottom:20px;border-bottom:2px solid #FF8C00;padding-bottom:10px}
.form-group{margin-bottom:20px}
.form-group label{display:block;color:#6F4E37;margin-bottom:8px;font-weight:600}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px;border:2px solid #D2B48C;border-radius:8px;background:#fff}
.form-group input:focus{outline:none;border-color:#FF8C00;box-shadow:0 0 0 3px rgba(255,140,0,.1)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
button,.btn{background:linear-gradient(135deg,#8B4513,#FF8C00);color:#fff;padding:12px 30px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;text-decoration:none;display:inline-block}
button:hover,.btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(139,69,19,.3)}
.btn-del{background:#c00;padding:8px 15px;font-size:14px}
table{width:100%;border-collapse:collapse;margin:20px 0}
th{background:#8B4513;color:#fff;padding:12px;text-align:left}
td{padding:10px;border-bottom:1px solid #D2B48C}
tr:hover{background:#FFF8DC}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:20px}
.stat{background:#fff;border:2px solid #D2B48C;border-radius:8px;padding:20px;text-align:center}
.stat strong{display:block;font-size:2em;color:#FF8C00;margin-bottom:5px}
.error{background:#ffe4e4;color:#c00;padding:12px;border-radius:8px;margin:15px 0;border-left:4px solid #c00}
footer{background:#8B4513;color:#fff;text-align:center;padding:20px;border-radius:0 0 9px 9px;margin-top:20px}
@media (max-width:768px){.container{margin:10px;border-radius:8px}.tracks{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.stats{grid-template-columns:1fr}}