*{box-sizing:border-box} :root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#fff}
body{margin:0;min-height:100vh;background:#21133d;overflow-x:hidden}.bg{position:fixed;inset:0;background:url("assets/bts-background.jpg") center/cover no-repeat;z-index:-3}.veil{position:fixed;inset:0;background:linear-gradient(180deg,rgba(69,43,116,.45),rgba(77,44,125,.68) 50%,rgba(29,17,55,.84));z-index:-2}.particles{position:fixed;inset:0;z-index:-1;opacity:.65;background-image:radial-gradient(circle,rgba(255,255,255,.75) 0 1px,transparent 1.5px);background-size:73px 81px;animation:float 18s linear infinite;pointer-events:none}
@keyframes float{to{background-position:70px 90px}} .hidden{display:none!important}.screen{min-height:100vh;display:grid;place-items:center;padding:20px}.glass{background:rgba(36,20,67,.48);border:1px solid rgba(255,255,255,.19);box-shadow:0 18px 60px rgba(12,4,28,.3);backdrop-filter:blur(13px)}
.login-card{width:min(440px,100%);padding:32px 22px;border-radius:30px;text-align:center}.brand{letter-spacing:.1em;font-weight:800;font-size:13px}.login-card h1{font-size:45px;margin:14px 0 7px}.login-card p{color:#eee5ff;margin:0 0 24px}.login-card input,.code-box input{width:100%;padding:14px 16px;margin:6px 0;border:1px solid rgba(255,255,255,.18);border-radius:15px;background:rgba(255,255,255,.09);color:#fff;outline:none}.login-card input::placeholder,.code-box input::placeholder{color:#d0c5e3}.btn{width:100%;border:0;border-radius:999px;padding:14px 20px;margin-top:10px;background:linear-gradient(100deg,#fff,#e9dcff);color:#55358d;font-weight:900;cursor:pointer}.login-card small{display:block;color:#c9bddc;margin-top:15px}
#app{min-height:100vh;padding-bottom:85px}.topbar{position:sticky;top:10px;z-index:10;margin:10px 12px 0;padding:12px 15px;border-radius:18px;display:flex;justify-content:space-between;align-items:center}.topbar strong{font-size:14px}.topbar span{display:block;color:#cfc0e9;font-size:11px}.icon-btn{border:0;background:rgba(255,255,255,.1);border-radius:12px;padding:9px;color:#fff}
main{width:min(980px,100%);margin:auto;padding:15px}.page{display:none}.page.active{display:block}.hero{border-radius:30px;padding:30px 20px;text-align:center;margin:8px 0 20px}.pill{display:inline-block;border:1px solid rgba(255,255,255,.25);padding:7px 12px;border-radius:999px;font-size:11px}.hero h1{font-size:clamp(38px,11vw,68px);margin:15px 0 8px;line-height:.95}.hero p{color:#e5dcf5;margin:0 auto 22px;max-width:560px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.stats div{padding:12px 4px;border-radius:15px;background:rgba(255,255,255,.08)}.stats b{display:block;font-size:20px}.stats small{font-size:9px;color:#cfc3e1}
.section-title,.section-head{display:flex;align-items:center;justify-content:space-between;margin:20px 2px 13px}.section-title h2,.section-head h2{margin:0}.section-title span,.section-head small{color:#cfc1e7;font-size:12px}.section-head{justify-content:flex-start;gap:12px}.section-head button{border:0;background:rgba(255,255,255,.1);color:#fff;border-radius:12px;padding:9px 12px}
.categories{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.cat{min-height:125px;border:1px solid rgba(255,255,255,.15);border-radius:22px;color:#fff;background:rgba(255,255,255,.08);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer}.cat span{font-size:29px}.cat b{font-size:15px;margin-top:6px}.cat small{color:#cfc3e3;margin-top:4px}.cat.special{background:linear-gradient(140deg,rgba(205,160,255,.23),rgba(255,255,255,.07))}
.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:15px}.feature{border:1px solid rgba(255,255,255,.13);border-radius:20px;padding:17px;background:rgba(255,255,255,.08);color:#fff;text-align:left;cursor:pointer}.feature:first-letter{font-size:20px}.feature b,.feature small{display:block}.feature b{margin-top:7px}.feature small{color:#cfc2e2;margin-top:4px}
.bottom-nav{position:fixed;bottom:10px;left:10px;right:10px;z-index:20;border-radius:22px;padding:7px;display:grid;grid-template-columns:repeat(4,1fr)}.bottom-nav button{border:0;background:transparent;color:#fff;padding:7px 2px;font-size:18px}.bottom-nav span{display:block;font-size:9px;color:#d2c7e6;margin-top:2px}
.tabs{display:flex;gap:7px;overflow:auto;padding-bottom:10px}.tabs button{white-space:nowrap;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.08);color:#fff;padding:9px 12px;border-radius:999px}.tabs .selected{background:#fff;color:#57368d}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.card{border-radius:19px;overflow:hidden;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.13)}.card-art{height:150px;background:linear-gradient(145deg,rgba(183,139,242,.65),rgba(57,34,90,.7));display:grid;place-items:center;font-size:50px}.card-body{padding:11px}.card-body b{font-size:13px}.card-body small{display:block;color:#cfc3e2;margin-top:3px}.tag{display:inline-block;margin-top:7px;padding:4px 7px;border-radius:999px;background:rgba(255,255,255,.11);font-size:9px}
.envelope-info{padding:16px;border-radius:20px;display:flex;justify-content:space-between;gap:10px;margin-bottom:20px}.big-envelope{width:210px;height:270px;margin:30px auto 20px;border-radius:22px;display:grid;place-items:center;text-align:center;font-size:65px;background:linear-gradient(150deg,#b89aff,#7048a8);box-shadow:0 25px 80px rgba(95,46,160,.45);cursor:pointer;animation:breathe 2.2s ease-in-out infinite}.big-envelope span{font-size:18px;font-weight:900;letter-spacing:.12em;text-shadow:0 3px 10px #4d2d79}.hint{text-align:center;color:#d5c9e8;font-size:12px}
@keyframes breathe{50%{transform:translateY(-5px) rotate(1deg);box-shadow:0 30px 90px rgba(148,99,220,.6)}}.exchange-box,.code-box{padding:17px;border-radius:20px;margin:12px 0}.mini-card,.request{padding:13px;border-radius:13px;background:rgba(255,255,255,.08);margin-top:8px;display:flex;justify-content:space-between;gap:8px}.request button{border:0;border-radius:999px;padding:8px 11px;background:#fff;color:#56368c;font-weight:800}
.admin-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.admin-card{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;border-radius:20px;padding:20px;text-align:left}.admin-card b,.admin-card small{display:block}.admin-card b{margin-top:7px}.admin-card small{color:#cfc2e2;margin-top:4px}
.modal{position:fixed;inset:0;z-index:50;background:rgba(10,5,20,.65);display:grid;place-items:center;padding:20px}.modal-box{width:min(430px,100%);padding:25px;border-radius:25px;position:relative;text-align:center}.close{position:absolute;right:12px;top:10px;border:0;background:rgba(255,255,255,.1);color:#fff;border-radius:50%;width:32px;height:32px;font-size:20px}.reveal{font-size:55px}.reveal h2{margin:10px 0}.reveal p{color:#d8cceb}
@media(min-width:700px){main{padding-top:25px}.categories{grid-template-columns:repeat(4,1fr)}.quick-grid{grid-template-columns:repeat(4,1fr)}.cards{grid-template-columns:repeat(4,1fr)}.admin-grid{grid-template-columns:repeat(4,1fr)}.card-art{height:180px}}
