*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;color:#fff}
body{min-height:100vh;background:#120d09 url("background.png") center/cover fixed no-repeat;overflow-x:hidden}
.shade{position:fixed;inset:0;z-index:0;background:linear-gradient(180deg,rgba(0,0,0,.64),rgba(0,0,0,.43) 45%,rgba(0,0,0,.72))}
.topbar{position:relative;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:22px 38px}
.brand{display:flex;align-items:center;gap:10px;font-size:16px;white-space:nowrap}
.brand strong{font-weight:700}.collab{color:#e9c47e}.bw{font-size:25px;font-weight:950;letter-spacing:-3px;margin-right:5px}
.close-btn{border:1px solid rgba(255,255,255,.28);background:rgba(0,0,0,.16);backdrop-filter:blur(12px);color:#fff;border-radius:28px;padding:12px 20px;font-size:15px;cursor:pointer}
.close-btn:hover{background:rgba(255,255,255,.12)}
.landing-content,.home-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center}
.landing-content{min-height:calc(100vh - 105px);justify-content:center;padding-bottom:80px}
.tiny{font-size:12px;letter-spacing:5px;color:#edc57d;margin-bottom:15px}
.landing h1{font-size:clamp(76px,10vw,140px);line-height:.9;margin:0;font-weight:850}
.landing p{font-size:21px;margin:25px 0 34px;color:#eee}
.start-btn{width:310px;padding:18px 25px;border:1px solid #f1ce8d;border-radius:17px;background:linear-gradient(135deg,#f4d18e,#dba95f);color:#17110b;font-size:21px;font-weight:800;cursor:pointer;box-shadow:0 18px 45px rgba(0,0,0,.3)}
.start-btn span{float:right;font-size:27px;line-height:20px}
.home-content{padding:46px 22px 120px}
.home-content h1{font-size:64px;line-height:1;margin:0;font-weight:850}
.subtitle{font-size:22px;letter-spacing:7px;color:#eac17b;margin-top:8px}
.welcome{font-size:20px;margin:28px 0 30px}
.search-box{width:min(820px,94vw);height:78px;display:flex;align-items:center;border:1px solid rgba(255,255,255,.28);border-radius:42px;background:rgba(7,7,7,.72);backdrop-filter:blur(16px);box-shadow:0 18px 45px rgba(0,0,0,.25);padding:0 22px}
.search-icon{font-size:35px;color:#ddd;line-height:1}
.search-box input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:#fff;font-size:20px;padding:0 15px}
.search-box input::placeholder{color:#bdbdbd}
.search-box .divider{height:42px;width:1px;background:rgba(255,255,255,.35)}
.search-box button{border:0;background:transparent;color:#fff;font-size:34px;cursor:pointer;padding-left:20px}
.cards{display:grid;grid-template-columns:repeat(4,minmax(185px,260px));gap:24px;margin-top:38px}
.card{min-height:290px;border:1px solid rgba(229,190,119,.36);border-radius:20px;background:rgba(10,9,8,.70);backdrop-filter:blur(14px);color:#fff;padding:24px 20px;cursor:pointer;transition:.22s;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:0 15px 40px rgba(0,0,0,.2)}
.card:hover{transform:translateY(-7px);border-color:#e9c37b;background:rgba(20,16,12,.82)}
.card-icon{height:78px;font-size:60px;line-height:70px;color:#f0c77e;font-weight:700}
.card-icon.music{font-size:75px}.card-icon.cloud{font-size:66px}
.card h2{font-size:23px;margin:12px 0 12px}.card p{font-size:14px;line-height:1.55;color:#d7d7d7;margin:0;min-height:44px}
.action{margin-top:auto;background:rgba(196,147,75,.15);padding:12px 27px;border-radius:20px;color:#efc87f;font-size:14px;min-width:130px}.action b{font-size:18px;margin-left:16px}
footer{position:fixed;z-index:3;bottom:17px;left:0;right:0;text-align:center;font-size:12px;color:#ddd}
.bottom-nav{position:fixed;z-index:4;left:50%;bottom:12px;transform:translateX(-50%);display:flex;gap:2px;padding:5px 8px;border:1px solid rgba(255,255,255,.13);background:rgba(5,5,5,.74);backdrop-filter:blur(15px);border-radius:25px}
.bottom-nav button{width:48px;height:35px;border:0;border-radius:18px;background:transparent;color:#eee;font-size:20px;cursor:pointer}
.bottom-nav button.active{background:rgba(214,164,80,.24);color:#f0c77e}
#toast{position:fixed;z-index:20;left:50%;bottom:65px;transform:translate(-50%,12px);opacity:0;pointer-events:none;padding:13px 18px;border:1px solid #d9ad63;border-radius:12px;background:#111;color:#fff;transition:.25s}
#toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1050px){.cards{grid-template-columns:repeat(2,minmax(210px,280px))}}
@media(max-width:650px){.topbar{padding:17px 15px}.brand strong{font-size:14px}.collab{display:none}.close-btn{padding:10px 14px}.close-btn span{display:none}.home-content{padding-top:35px}.home-content h1{font-size:43px}.subtitle{font-size:14px;letter-spacing:4px}.search-box{height:65px}.search-box input{font-size:16px}.cards{grid-template-columns:1fr;width:min(330px,92vw)}footer{position:relative;margin-top:-65px;padding-bottom:75px}.bottom-nav{bottom:10px}}

#searchEngine{border:0;outline:0;background:transparent;color:#fff;font-size:14px;font-weight:700;cursor:pointer;padding:8px 9px}
#searchEngine option{background:#17120d;color:#fff}
.secret-site{position:fixed;z-index:10;left:12px;bottom:12px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:rgba(240,199,126,.35);text-decoration:none;font-size:12px;opacity:.45;transition:.2s}
.secret-site:hover{opacity:1;color:#f0c77e;transform:scale(1.25)}
.settings-content{position:relative;z-index:2;min-height:calc(100vh - 105px);display:flex;flex-direction:column;align-items:center;text-align:center;padding:55px 22px 120px}
.settings-content h1{font-size:64px;line-height:1;margin:0;font-weight:850}
.page-desc{font-size:18px;color:#ddd;margin:18px 0 30px}
.panel{width:min(760px,94vw);border:1px solid rgba(229,190,119,.3);border-radius:22px;background:rgba(10,9,8,.72);backdrop-filter:blur(15px);padding:24px;text-align:left;box-shadow:0 15px 40px rgba(0,0,0,.22)}
.history-item{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px 5px;border-bottom:1px solid rgba(255,255,255,.1)}
.history-item strong{display:block}.history-item small{display:block;color:#aaa;margin-top:5px}
.history-item a{color:#efc87f;text-decoration:none;white-space:nowrap}.empty-state{text-align:center;color:#aaa;padding:35px}
.danger-btn,.secondary-btn{margin-top:20px;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:12px 18px;background:rgba(255,255,255,.07);color:#fff;cursor:pointer}.danger-btn{border-color:rgba(255,100,100,.35);color:#ffb0b0}
.settings-panel{padding:8px 22px 22px}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.1)}.setting-row strong{display:block}.setting-row small{display:block;color:#aaa;margin-top:5px}
.setting-row input{width:20px;height:20px;accent-color:#e4b96f}
.no-background{background:#120d09!important}.no-background .shade{background:rgba(0,0,0,.82)}
.compact .cards{gap:12px;margin-top:24px}.compact .card{min-height:250px}.compact .home-content{padding-top:30px}
@media(max-width:650px){#searchEngine{font-size:11px;padding:5px}.settings-content h1{font-size:43px}.panel{padding:18px}.history-item{align-items:flex-start}}