@import"https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=MedievalSharp&display=swap";:root{--bg-dark: #1a1208;--bg-medium: #2a1f0e;--bg-card: #32260f;--bg-card-hover: #3d2e14;--gold: #c9a84c;--gold-bright: #e8c84a;--gold-dim: #8a7230;--text-primary: #e8dcc8;--text-secondary: #a89878;--border-color: #5a4a2a;--active-glow: rgba(201, 168, 76, .6);--danger: #8b2020;--danger-hover: #a82828}*{margin:0;padding:0;box-sizing:border-box}body{font-family:MedievalSharp,cursive;background:var(--bg-dark);color:var(--text-primary);min-height:100vh}.app{min-height:100vh;background:radial-gradient(ellipse at 20% 50%,rgba(42,31,14,.8) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(50,38,15,.6) 0%,transparent 40%),radial-gradient(ellipse at 50% 80%,rgba(30,22,8,.9) 0%,transparent 60%),repeating-conic-gradient(#1a120826 0% 25%,#2a1f0e1a 0% 50%),linear-gradient(180deg,#1a1208,#0f0a04);padding:0 1rem 2rem}.header{text-align:center;padding:2rem 1rem 1rem;border-bottom:2px solid var(--border-color);margin-bottom:1.5rem;position:relative}.header:after{content:"";display:block;width:60%;max-width:400px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-dim),transparent);margin:.5rem auto 0}.header-ornament{color:var(--gold-dim);font-size:.8rem;letter-spacing:1em}.title{font-family:Cinzel,serif;font-weight:700;font-size:clamp(1.8rem,5vw,3rem);color:var(--gold);text-shadow:0 0 20px rgba(201,168,76,.3),0 2px 4px rgba(0,0,0,.8);margin:.3rem 0;letter-spacing:.05em}.subtitle{font-family:MedievalSharp,cursive;color:var(--text-secondary);font-size:1rem;font-weight:400}.controls-bar{display:flex;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap;padding:1rem;margin:0 auto 1.5rem;max-width:800px;background:linear-gradient(135deg,#32260f99,#1a1208cc);border:1px solid var(--border-color);border-radius:8px}.master-volume{display:flex;align-items:center;gap:.75rem}.master-volume label{font-family:Cinzel,serif;font-size:.85rem;color:var(--gold);white-space:nowrap}.master-slider{width:150px;accent-color:var(--gold);cursor:pointer}.vol-value{color:var(--text-secondary);font-size:.85rem;min-width:36px}.stop-all-btn{font-family:Cinzel,serif;font-weight:600;font-size:.9rem;padding:.5rem 1.25rem;background:var(--danger);color:var(--text-primary);border:1px solid #6b1818;border-radius:6px;cursor:pointer;transition:all .2s}.stop-all-btn:hover{background:var(--danger-hover)}.stop-all-btn.has-active{animation:pulse-danger 2s infinite}@keyframes pulse-danger{0%,to{box-shadow:0 0 5px #8b202080}50%{box-shadow:0 0 15px #a82828cc}}.categories{max-width:1000px;margin:0 auto}.category{margin-bottom:2rem}.category-title{font-family:Cinzel,serif;font-weight:600;font-size:1.3rem;color:var(--gold);margin-bottom:.75rem;padding-bottom:.4rem;border-bottom:1px solid var(--border-color);display:flex;align-items:center;gap:.5rem}.category-icon{font-size:1.4rem}.sounds-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.sound-button{background:linear-gradient(145deg,var(--bg-card),var(--bg-medium));border:1px solid var(--border-color);border-radius:8px;overflow:hidden;transition:all .3s ease;position:relative}.sound-button:before{content:"";position:absolute;inset:0;border-radius:8px;opacity:0;transition:opacity .3s;pointer-events:none;box-shadow:inset 0 0 20px #c9a84c26}.sound-button:hover{border-color:var(--gold-dim);background:linear-gradient(145deg,var(--bg-card-hover),var(--bg-card));transform:translateY(-1px)}.sound-button:hover:before{opacity:1}.sound-button.active{border-color:var(--gold);box-shadow:0 0 15px var(--active-glow),0 0 30px #c9a84c33,inset 0 0 15px #c9a84c1a;animation:glow-pulse 3s ease-in-out infinite}@keyframes glow-pulse{0%,to{box-shadow:0 0 15px var(--active-glow),0 0 30px #c9a84c33}50%{box-shadow:0 0 25px var(--active-glow),0 0 50px #c9a84c4d}}.sound-trigger{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;padding:1.25rem 1rem;background:none;border:none;cursor:pointer;color:inherit;text-align:center}.sound-name{font-family:Cinzel,serif;font-weight:600;font-size:1.05rem;color:var(--text-primary);margin-bottom:.3rem}.sound-desc{font-family:MedievalSharp,cursive;font-size:.8rem;color:var(--text-secondary)}.sound-button.active .sound-name{color:var(--gold-bright)}.volume-control{padding:.5rem 1rem .75rem;background:#0000004d;border-top:1px solid rgba(90,74,42,.3)}.volume-slider{width:100%;accent-color:var(--gold);cursor:pointer}.footer{text-align:center;padding:2rem 1rem 1rem;margin-top:1rem;border-top:1px solid var(--border-color);color:var(--text-secondary);font-size:.85rem}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--gold-dim)}@media(max-width:600px){.sounds-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.controls-bar{flex-direction:column;gap:1rem}}