@font-face{font-family:'AbarLow-Regular';src:url('/assets/fonts/AbarLow-Regular.woff') format('woff2'),url('/assets/fonts/AbarLow-Regular.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
:root{--bg:#1f1f1f;--bg-elevated:#252525;--bg-glass:rgba(255,255,255,.02);--border-subtle:rgba(255,255,255,.06);--accent:#4f8cff;--accent-soft:rgba(79,140,255,.12);--accent-strong:#6296ff;--text-main:#f5f5f5;--text-soft:#b0b0b0;--text-mute:#808080;--shadow-soft:0 18px 45px rgba(0,0,0,.55);--radius-lg:18px;--radius-md:12px;--transition-fast:.18s cubic-bezier(.4,0,.2,1);--blur-glass:22px}
*,:before,:after{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;background:#000}
body{min-height:100vh;direction:rtl;background:radial-gradient(circle at top,#272727 0,#121212 42%,#050505 85%);color:var(--text-main);font-family:'AbarLow-Regular',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;display:flex;align-items:center;justify-content:center;padding:16px}
body::before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 0 0,rgba(79,140,255,.12) 0,transparent 55%),radial-gradient(circle at 100% 0,rgba(0,255,200,.08) 0,transparent 55%),radial-gradient(circle at 50% 100%,rgba(255,255,255,.04) 0,transparent 60%);opacity:.9;z-index:-2}
body::after{content:"";position:fixed;inset:0;background-image:linear-gradient(120deg,rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(210deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:120px 120px,160px 160px;mix-blend-mode:soft-light;opacity:.18;z-index:-1;pointer-events:none}
.container{width:100%;max-width:980px;display:flex;flex-direction:column;gap:24px;position:relative;z-index:1;padding:20px 22px 24px;border-radius:24px;background:radial-gradient(circle at top left,rgba(255,255,255,.04) 0,transparent 55%),radial-gradient(circle at 80% 0,rgba(79,140,255,.08) 0,transparent 60%),var(--bg-glass);border:1px solid rgba(255,255,255,.09);box-shadow:var(--shadow-soft);backdrop-filter:blur(var(--blur-glass))}
.notices{display:flex;flex-direction:column;gap:10px;border-radius:18px;padding:16px 18px;background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 30px rgba(0,0,0,.7);position:relative;overflow:hidden}
.notices::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(79,140,255,.16),transparent 40%,transparent 60%,rgba(0,255,200,.16));opacity:.22;mix-blend-mode:screen;pointer-events:none}
.notice-title{font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute);display:flex;align-items:center;gap:8px}
.notice-title::before{content:"";width:7px;height:7px;border-radius:999px;background:radial-gradient(circle at 30% 30%,#fff,rgba(255,255,255,.2));box-shadow:0 0 16px rgba(79,140,255,.9)}
.notice-slider{margin-top:4px;display:flex;align-items:center;gap:10px;color:var(--text-soft);font-size:13px;min-height:18px;position:relative;overflow:hidden}
.notice-item{position:absolute;inset-inline-start:0;white-space:nowrap;animation:slide-notice 16s linear infinite}
.notice-item:nth-child(2){animation-delay:8s}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:4px}
.card{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:14px 14px 14px 14px;border-radius:var(--radius-lg);background:radial-gradient(circle at top,rgba(255,255,255,.06),rgba(255,255,255,.01));border:1px solid var(--border-subtle);box-shadow:0 10px 26px rgba(0,0,0,.8);color:var(--text-main);text-decoration:none;cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast),background var(--transition-fast);overflow:hidden}
.card::before{content:"";position:absolute;inset:-40%;background:radial-gradient(circle at 0 0,rgba(255,255,255,.16) 0,transparent 50%);opacity:0;transition:opacity .25s ease-out,transform .25s ease-out;transform:translate3d(-30px,-30px,0);pointer-events:none}
.card-header{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.card .icon{width:18px;height:18px;flex-shrink:0;filter:drop-shadow(0 0 6px rgba(0,0,0,.8))}
.card-header span{font-size:13px;font-weight:500;color:var(--text-main);letter-spacing:.03em}
.card p{font-size:12px;line-height:1.7;color:var(--text-soft);margin:0}
.card:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 18px 40px rgba(0,0,0,.95);border-color:var(--accent-soft);background:radial-gradient(circle at top,#262a33,#1b1b1f)}
.card:hover::before{opacity:1;transform:translate3d(0,0,0)}
.card:active{transform:translateY(-1px) scale(1.005);box-shadow:0 10px 26px rgba(0,0,0,.9)}
@keyframes slide-notice{0%{transform:translateX(100%);opacity:0}5%{opacity:1}50%{transform:translateX(0);opacity:1}95%{opacity:1}100%{transform:translateX(-100%);opacity:0}}
.loader{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at top,#202020,#050505 70%);z-index:999;pointer-events:none;opacity:0;transition:opacity .25s ease-out}
.loader::before,.loader::after{content:"";position:absolute;border-radius:999px}
.loader::before{width:86px;height:86px;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 32px rgba(0,0,0,.9) inset}
.loader::after{width:44px;height:44px;border:3px solid transparent;border-top-color:var(--accent);border-right-color:var(--accent-strong);animation:spin 1s linear infinite;box-shadow:0 0 18px rgba(79,140,255,.8)}
.loader.active{pointer-events:auto;opacity:1}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:900px){.container{max-width:640px;padding:18px 16px 20px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.card{padding:12px 12px 12px 12px;border-radius:16px}.card-header{margin-bottom:8px}.card-header span{font-size:12px}}
@media (max-width:600px){body{padding:10px}.container{padding:14px 12px 16px;border-radius:20px}.notices{padding:12px 13px;border-radius:14px}.notice-title{font-size:12px}.notice-slider{font-size:11px}.grid{grid-template-columns:1fr;gap:10px}.card{padding:11px 11px 12px;border-radius:14px}.card .icon{width:17px;height:17px}.card-header span{font-size:12px}.card p{font-size:11px}}