:root { --blue: #075ee8; --navy: #071a3b; --cyan: #08c7e8; --lime: #8df522; }
.brand-logo { display: block; width: 190px; height: 58px; object-fit: contain; object-position: left center; }
.admin-side .brand-logo { width: 208px; height: 66px; }
.sidebar .brand-logo { width: 190px; height: 62px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.auth-page { position: relative; overflow-x: hidden; overflow-y:auto; padding-block:110px 40px; background: radial-gradient(circle at 15% 15%, rgba(8,199,232,.14), transparent 34%), radial-gradient(circle at 88% 82%, rgba(7,94,232,.14), transparent 38%), #f4f8ff; }
.auth-page::before, .auth-page::after { content: ""; position: fixed; width: 360px; height: 360px; border-radius: 46% 54% 67% 33%; filter: blur(2px); opacity: .38; pointer-events: none; animation: authFloat 12s ease-in-out infinite alternate; }
.auth-page::before { left: -130px; top: 18%; background: linear-gradient(135deg,var(--cyan),var(--blue)); }
.auth-page::after { right: -150px; bottom: -120px; background: linear-gradient(135deg,var(--lime),var(--cyan)); animation-delay: -5s; }
@keyframes authFloat { to { transform: translate3d(40px,-35px,0) rotate(18deg) scale(1.08); } }
.auth-brand { position: relative; z-index: 1; margin-bottom: 16px; }
.auth-brand .brand-logo { width: 250px; height: 78px; object-position: center; }
.auth-card { position: relative; z-index: 1; width: min(470px,calc(100vw - 28px)); border: 1px solid rgba(7,94,232,.13); border-radius: 24px; padding: 28px; box-shadow: 0 28px 80px rgba(7,26,59,.14); backdrop-filter: blur(18px); background: rgba(255,255,255,.9); }
.auth-tabs { padding: 6px; border-radius: 14px; background: #eaf1fb; }
.auth-tabs button { border-radius: 10px; }
.remember-login { display: flex !important; grid-template-columns: auto 1fr !important; align-items: center; gap: 9px; font-weight: 650 !important; }
.remember-login input { width: 18px; min-height: 18px; }
.otp-row { display: grid; grid-template-columns: 1fr 145px; align-items: end; gap: 10px; }
.otp-row .btn { min-height: 48px; }

.admin-page { position: relative; background: radial-gradient(circle at 85% 8%,rgba(8,199,232,.12),transparent 28%),radial-gradient(circle at 40% 95%,rgba(141,245,34,.08),transparent 30%),#f1f6fc; }
.admin-main::before, .admin-main::after { content:""; position: fixed; border-radius: 999px; pointer-events:none; z-index:-1; filter: blur(4px); animation: adminDrift 14s ease-in-out infinite alternate; }
.admin-main::before { width: 310px; height: 310px; right: 5%; top: 13%; background: linear-gradient(135deg,rgba(8,199,232,.18),rgba(7,94,232,.08)); }
.admin-main::after { width: 240px; height: 240px; left: 30%; bottom: 3%; background: linear-gradient(135deg,rgba(141,245,34,.12),rgba(8,199,232,.08)); animation-delay:-6s; }
@keyframes adminDrift { to { transform: translate3d(-55px,45px,0) rotate(24deg) scale(1.12); } }
.admin-side { background: linear-gradient(180deg,#061630,#0a2850); }
.admin-side nav button:hover, .admin-side nav button.active { background: linear-gradient(105deg,#075ee8,#08a9df); box-shadow: 0 8px 24px rgba(7,94,232,.28); }
.admin-card, .admin-stats article { border-color: rgba(7,94,232,.1); box-shadow: 0 14px 35px rgba(7,26,59,.07); }

.source-service { display: grid; grid-template-columns: 78px minmax(300px,1fr) 190px 105px 145px; align-items: center; gap: 12px; padding: 15px 16px; border-top: 1px solid #e8eef6; background:#fff; }
.source-service.selected { background: linear-gradient(90deg,rgba(7,94,232,.055),rgba(8,199,232,.025)); }
.source-id { color:#075ee8; font-weight:850; }
.source-service .service-name { display:grid; gap:4px; }
.source-service small { color:#6b7890; }
.source-price { display:grid; gap:3px; }
.service-pick { border:1px solid #075ee8; color:#075ee8; background:#fff; border-radius:9px; min-height:38px; padding:8px 10px; font-weight:800; cursor:pointer; }
.service-pick.remove { color:#087e69; border-color:#13b798; background:#ecfff9; }

.catalog-shell { max-width: 1280px; }
.catalog-toolbar { display:flex; justify-content:space-between; gap:12px; margin-bottom:18px; }
.catalog-toolbar input { max-width:480px; }
.catalog-grid { display:grid; gap:18px; }
.catalog-card { border:1px solid #dce6f3; border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 10px 28px rgba(7,26,59,.06); }
.catalog-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:18px; background:linear-gradient(115deg,#f4f8ff,#f3fffd); }
.catalog-card-head h2 { margin:6px 0 3px; font-size:1.02rem; }
.catalog-card-head small { color:#718099; }
.catalog-id { display:inline-flex; padding:5px 8px; border-radius:7px; background:#075ee8; color:#fff; font-size:.72rem; font-weight:850; }
.catalog-switch { display:flex!important; grid-template-columns:auto 1fr!important; align-items:center; gap:7px; white-space:nowrap; }
.catalog-switch input { width:18px; min-height:18px; }
.catalog-fields { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; padding:18px; }
.catalog-fields .wide { grid-column:span 2; }
.catalog-fields textarea { resize:vertical; min-height:98px; }
.catalog-price { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px 18px; border-top:1px solid #e8eef6; background:#081d3c; color:#dcecff; }
.catalog-price strong { color:#8df522; font-size:1rem; }
.catalog-empty { padding:42px; text-align:center; color:#6b7890; border:1px dashed #bfd0e6; border-radius:14px; }

.landing .brand-logo { width:190px; height:58px; }
.landing .brand { padding:0; }
.landing .brand-light { color:#fff; }

.landing { position:relative; overflow-x:hidden; background-color:#030712; background-image:linear-gradient(rgba(57,120,183,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(57,120,183,.09) 1px,transparent 1px),radial-gradient(circle at 18% 38%,rgba(0,120,255,.25),transparent 34%),radial-gradient(circle at 88% 54%,rgba(0,221,255,.18),transparent 38%); }
.landing::before { content:""; position:fixed; inset:-40%; pointer-events:none; background:conic-gradient(from 120deg,transparent,rgba(30,151,255,.055),transparent 26%,rgba(139,244,36,.035),transparent 52%); animation:skySpin 24s linear infinite; }
.topbar { height:92px; }
.landing .brand-logo { width:220px; height:64px; filter:drop-shadow(0 0 16px rgba(0,157,255,.22)); }
.growth-visual { height:560px; position:relative; display:grid; place-items:center; isolation:isolate; perspective:1000px; }
.growth-visual::before { content:""; position:absolute; inset:9% 4%; border:1px solid rgba(68,205,255,.2); border-radius:44px; background:linear-gradient(145deg,rgba(13,42,76,.52),rgba(4,10,24,.18)); box-shadow:inset 0 0 80px rgba(0,185,255,.08),0 45px 100px rgba(0,0,0,.48); backdrop-filter:blur(10px); transform:rotate(-2deg); }
.growth-visual img { position:relative; z-index:3; width:112%; max-width:none; object-fit:contain; filter:drop-shadow(0 34px 42px rgba(0,0,0,.55)) drop-shadow(0 0 24px rgba(0,198,255,.24)); animation:engineFloat 5.2s ease-in-out infinite; }
.visual-aura { position:absolute; z-index:1; width:64%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(0,205,255,.24),rgba(23,100,255,.08) 42%,transparent 68%); filter:blur(14px); animation:auraBeat 2.8s ease-in-out infinite; }
.visual-orbit { position:absolute; z-index:2; width:72%; aspect-ratio:1; border-radius:50%; border:1px dashed rgba(55,218,255,.36); animation:orbitSpin 13s linear infinite; }
.visual-orbit::after { content:""; position:absolute; left:9%; top:12%; width:11px; height:11px; border-radius:50%; background:#66eaff; box-shadow:0 0 22px #09d8ff; }
.visual-orbit.orbit-b { width:48%; border-style:solid; border-color:rgba(154,245,43,.3); animation-direction:reverse; animation-duration:9s; }
.visual-orbit.orbit-b::after { left:auto; right:3%; top:54%; background:#a0f52b; box-shadow:0 0 24px #8df522; }
.live-chip,.speed-chip { position:absolute; z-index:5; display:grid; gap:3px; padding:13px 16px; border:1px solid rgba(113,214,255,.25); border-radius:14px; background:rgba(5,19,39,.72); box-shadow:0 15px 35px rgba(0,0,0,.3); backdrop-filter:blur(14px); }
.live-chip { left:1%; top:15%; padding-left:34px; }.live-chip span{position:absolute;left:15px;top:19px;width:9px;height:9px;border-radius:50%;background:#59efa9;box-shadow:0 0 14px #59efa9;animation:auraBeat 1.5s infinite}.speed-chip{right:-2%;bottom:16%;text-align:right}.live-chip small,.speed-chip small{color:#8fa6c3;font-size:.72rem}.speed-chip b{font-size:1.35rem;color:#a4f638}
@keyframes engineFloat { 0%,100%{transform:translate3d(0,-5px,0) rotateY(-2deg)} 50%{transform:translate3d(0,15px,0) rotateY(3deg) scale(1.02)} }
@keyframes orbitSpin { to{transform:rotate(360deg)} } @keyframes auraBeat { 50%{transform:scale(1.13);opacity:.68} } @keyframes skySpin { to{transform:rotate(360deg)} }
.admin-side nav a { border:0;background:transparent;color:#b9c7df;text-align:left;padding:12px 13px;border-radius:9px;font-weight:700;font-size:.83rem; }
.admin-side nav a:hover { background:rgba(8,169,223,.17);color:#fff; }
.side-nav a { display:block;color:#354568;border-radius:9px;padding:13px 14px;font-weight:650; }.side-nav a span{display:inline-block;width:29px;font-size:1.1rem}.side-nav a:hover{background:#edf5ff;color:var(--blue)}

@media (max-width: 900px) {
  .growth-visual { height:500px; }
  .source-service { min-width:900px; }
  .catalog-fields { grid-template-columns:1fr 1fr; }
  .catalog-fields .wide { grid-column:span 2; }
}
@media (max-width: 600px) {
  .auth-page { padding-top:100px; }
  .auth-card { padding:20px; border-radius:18px; }
  .otp-row { grid-template-columns:1fr; }
  .catalog-toolbar,.catalog-card-head,.catalog-price { align-items:stretch; flex-direction:column; }
  .catalog-fields { grid-template-columns:1fr; }
  .catalog-fields .wide { grid-column:auto; }
  .brand-logo { width:165px; }
  .growth-visual { height:390px; }.growth-visual img{width:118%}.live-chip{left:0;top:8%}.speed-chip{right:0;bottom:10%}
}
@media (prefers-reduced-motion: reduce) { .auth-page::before,.auth-page::after,.admin-main::before,.admin-main::after,.landing::before,.growth-visual img,.visual-orbit,.visual-aura,.live-chip span { animation:none; } }
