:root { --primary:#2563eb; --dark:#020617; --light:#f8fafc; --radius:18px; }
body { font-family:"Segoe UI",Arial,sans-serif; background:#f1f5f9; }
a { text-decoration:none; }
.navbar { box-shadow:0 4px 18px rgba(0,0,0,.12); }
.card { border-radius:var(--radius); }
.rounded-4 { border-radius:var(--radius)!important; }

/* Search page */
.search-wrapper { max-width:900px; margin:auto; }
.search-card { border:none; border-radius:22px; box-shadow:0 15px 35px rgba(0,0,0,.10); }
.search-box { height:60px; border-radius:16px; font-size:18px; }
.lyric-card { border:none; border-radius:18px; transition:.25s ease; cursor:pointer; }
.lyric-card:hover { transform:translateY(-5px); box-shadow:0 18px 35px rgba(0,0,0,.15); }
.song-title { font-size:22px; font-weight:700; }
.song-used { font-size:14px; color:#64748b; }
.empty-search { padding:50px; text-align:center; color:#64748b; }

/* Admin */
.admin-page { background:#f8fafc; }
.admin-card { border:none; box-shadow:0 10px 25px rgba(0,0,0,.08); }
.table th { font-size:14px; text-transform:uppercase; color:#64748b; }
.form-control,.form-select { border-radius:12px; padding:12px; }

/* Projection */
.projection-body { margin:0; min-height:100vh; color:#fff; overflow:hidden; background:#020617; }
.projection-screen {
    position:relative; z-index:2; min-height:100vh; display:flex;
    align-items:center; justify-content:center; padding:60px; text-align:center;
    touch-action:none;
}
.lyrics-title { position:fixed; top:25px; left:35px; z-index:5; font-size:22px; font-weight:600; opacity:.85; }
.lyrics-slide {
    max-width:1200px; white-space:pre-line; font-size:64px; line-height:1.25;
    font-weight:700; text-shadow:0 6px 25px rgba(0,0,0,.55); animation:fadeIn .45s ease;
}
.projection-controls {
    position:fixed; bottom:25px; left:50%; transform:translateX(-50%); z-index:10;
    display:flex; gap:10px; background:rgba(0,0,0,.45); padding:12px;
    border-radius:18px; backdrop-filter:blur(12px);
}
.projection-controls button { border-radius:12px; }

/* Large edge shortcuts appear only when touch is the primary pointer. */
.touch-nav {
    display:none; position:fixed; top:50%; z-index:9; width:64px; height:96px;
    transform:translateY(-50%); color:#fff; background:rgba(0,0,0,.38);
    border:1px solid rgba(255,255,255,.35); font-size:38px; line-height:1;
    backdrop-filter:blur(8px); touch-action:manipulation;
}
.touch-nav-prev { left:10px; border-radius:0 18px 18px 0; }
.touch-nav-next { right:10px; border-radius:18px 0 0 18px; }
.touch-nav:active { background:rgba(255,255,255,.35); }
@media (hover:none) and (pointer:coarse) { .touch-nav { display:block; } }

/* Themes and animated background */
.wave-blue { background:linear-gradient(135deg,#020617,#0f172a,#1d4ed8); }
.wave-purple { background:linear-gradient(135deg,#1e1b4b,#4c1d95,#7e22ce); }
.wave-gold { background:linear-gradient(135deg,#1c1917,#78350f,#f59e0b); }
.wave-dark { background:linear-gradient(135deg,#000,#111827,#020617); }
.wave-bg { position:fixed; inset:0; z-index:1; overflow:hidden; }
.wave-bg::before,.wave-bg::after {
    content:""; position:absolute; width:180%; height:180%; left:-40%; top:-40%;
    background:radial-gradient(circle,rgba(255,255,255,.18),transparent 30%),
               radial-gradient(circle at 70% 40%,rgba(255,255,255,.10),transparent 35%);
    animation:waveMove 14s linear infinite;
}
.wave-bg::after { animation-duration:22s; animation-direction:reverse; opacity:.6; }
@keyframes waveMove { from { transform:rotate(0deg) scale(1); } to { transform:rotate(360deg) scale(1.08); } }
@keyframes fadeIn { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }

@media (max-width:992px) { .lyrics-slide { font-size:48px; } }
@media (max-width:768px) {
    .lyrics-slide { font-size:36px; }
    .projection-screen { padding:35px 20px; }
    .projection-controls { width:95%; flex-wrap:wrap; justify-content:center; }
    .song-title { font-size:19px; }
}
@media (max-width:480px) {
    .lyrics-slide { font-size:30px; }
    .lyrics-title { font-size:16px; left:18px; top:18px; }
}