/* Kasbokar.com Universe Pro Max v28 — visual refinement and 2.5D city */
:root{
  --k28-bg:#040817;--k28-panel:rgba(8,14,35,.78);--k28-line:rgba(170,203,255,.16);
  --k28-blue:#5e7cff;--k28-cyan:#45e7ff;--k28-violet:#9a6cff;--k28-mint:#56f2c5;--k28-gold:#ffd477;
}
.kasb28{background:radial-gradient(circle at 12% 5%,rgba(76,107,255,.11),transparent 30%),radial-gradient(circle at 88% 25%,rgba(69,231,255,.07),transparent 28%),var(--k28-bg)}
.kasb28 .roya-nav{border-color:rgba(164,199,255,.17);background:linear-gradient(125deg,rgba(5,9,24,.91),rgba(12,17,43,.78));box-shadow:0 22px 75px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.04)}
.kasb28 .roya-brand img{filter:drop-shadow(0 0 18px rgba(69,231,255,.26))}
.kasb28 .roya-nav>nav a:after{background:linear-gradient(90deg,var(--k28-blue),var(--k28-cyan))}
.roya-auth-btn{height:42px;min-width:58px;padding:0 13px;border:1px solid var(--k28-line);border-radius:13px;background:rgba(255,255,255,.035);color:#eaf2ff;font:900 9px/1 inherit;cursor:pointer;transition:.25s ease}
.roya-auth-btn:hover{transform:translateY(-2px);border-color:rgba(69,231,255,.42);background:rgba(69,231,255,.08)}
.roya-auth-btn.register{border-color:rgba(147,108,255,.3);background:linear-gradient(135deg,rgba(94,124,255,.14),rgba(154,108,255,.14));color:#fff}
.kasb28 .roya-cta{background:linear-gradient(135deg,#5978ff,#936aff 58%,#45dff2);box-shadow:0 15px 36px rgba(84,116,255,.25)}
.kasb28 .kasb-hero{background:radial-gradient(circle at 80% 30%,rgba(82,116,255,.14),transparent 33%),radial-gradient(circle at 20% 72%,rgba(69,231,255,.08),transparent 28%),#050918}
.kasb28 .kasb-visual-frame{border-color:rgba(160,199,255,.25);box-shadow:inset 0 0 0 1px rgba(255,255,255,.035),0 42px 110px rgba(0,0,0,.47),0 0 90px rgba(84,117,255,.09)}
.kasb28 .kasb-primary{background:linear-gradient(135deg,#5375ff,#9368ff 62%,#49dcf1);box-shadow:0 20px 48px rgba(80,111,255,.28)}
.kasb28 .kasb-section-head em,.kasb28 .kasb-hero h1 em{background:linear-gradient(90deg,#c9d7ff,#55e6ff 52%,#b99aff);-webkit-background-clip:text;background-clip:text;color:transparent}

/* City — stronger depth, clearer HUD and premium frame */
.kasb28 .city-stage{isolation:isolate;min-height:720px;background:#030714;box-shadow:inset 0 1px rgba(255,255,255,.05),inset 0 -1px rgba(255,255,255,.04)}
.kasb28 .city-stage:before{content:"";position:absolute;z-index:4;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(3,7,20,.15),transparent 20%,transparent 73%,rgba(2,5,15,.32)),radial-gradient(circle at 50% 43%,transparent 42%,rgba(0,0,0,.31) 100%)}
.kasb28 .city-canvas{image-rendering:auto;filter:saturate(1.08) contrast(1.035);transform:translateZ(0);will-change:transform}
.kasb28 .city-atmosphere{z-index:3;opacity:.34;background:radial-gradient(circle at 50% 45%,transparent 34%,rgba(1,5,17,.42) 100%),linear-gradient(115deg,rgba(69,231,255,.035),transparent 35%,rgba(146,98,255,.035))}
.kasb28 .city-hud{z-index:15;grid-template-columns:auto minmax(190px,340px) 105px 1fr;border:1px solid rgba(151,190,255,.17);background:linear-gradient(110deg,rgba(4,8,24,.9),rgba(11,17,44,.76));box-shadow:0 22px 65px rgba(0,0,0,.32);backdrop-filter:blur(20px) saturate(135%)}
.kasb28 .city-hud-brand small,.kasb28 .city-location small,.kasb28 .city-speed small{color:#a9b9dc}
.kasb28 .city-location strong,.kasb28 .city-hud-brand b{color:#fff;text-shadow:0 2px 16px rgba(115,169,255,.16)}
.kasb28 .city-location span{color:#75eaff}.kasb28 .city-speed strong{color:#f5fbff}.kasb28 .city-speed span{color:#8ea1c7}
.kasb28 .city-tools button{border-color:rgba(155,190,255,.16);background:rgba(11,17,43,.75);color:#e9f1ff}.kasb28 .city-tools button:hover{border-color:rgba(69,231,255,.42);background:rgba(69,231,255,.08)}
.kasb28 .city-minimap,.kasb28 .city-gps{border-color:rgba(157,194,255,.19);background:linear-gradient(150deg,rgba(6,10,27,.92),rgba(12,20,49,.82));box-shadow:0 22px 65px rgba(0,0,0,.34)}
.kasb28 .city-prompt{border-color:rgba(69,231,255,.35);background:rgba(5,11,30,.91);box-shadow:0 16px 45px rgba(0,0,0,.35),0 0 35px rgba(69,231,255,.09)}
.kasb28 .city-bottom-status{z-index:15;border-color:rgba(158,193,255,.13);background:rgba(4,8,23,.91);color:#c8d4ed;backdrop-filter:blur(17px)}
.kasb28 .city-bottom-status kbd{color:#7deeff;border-color:rgba(69,231,255,.22);background:rgba(69,231,255,.07)}
.kasb28 .city-gate{background:radial-gradient(circle at 72% 35%,rgba(85,118,255,.17),transparent 28%),radial-gradient(circle at 18% 76%,rgba(69,231,255,.09),transparent 31%),linear-gradient(145deg,#050919,#07112b)}
.kasb28 .city-gate-actions button{background:linear-gradient(135deg,#5878ff,#956bff 58%,#49def2);box-shadow:0 22px 60px rgba(83,113,255,.31)}
.kasb28 .city-live i{background:var(--k28-mint);box-shadow:0 0 16px var(--k28-mint)}
.kasb28 .city-dialog article,.kasb28 .city-map-panel>article,.kasb28 .city-help article{border-color:rgba(155,194,255,.2);background:linear-gradient(145deg,rgba(10,16,40,.98),rgba(4,8,23,.98));box-shadow:0 35px 100px rgba(0,0,0,.55)}
.kasb28 .city-mobile-controls{z-index:18}.kasb28 .city-joystick,.kasb28 .city-mobile-controls button{border-color:rgba(165,202,255,.22);background:rgba(7,13,34,.82);box-shadow:0 18px 50px rgba(0,0,0,.32)}

/* Network cards and auth dialog */
.kasb28 .kasb-site-card{border-color:rgba(159,192,255,.14);background:linear-gradient(150deg,rgba(12,18,43,.82),rgba(5,9,25,.9));box-shadow:0 22px 64px rgba(0,0,0,.15)}
.kasb28 .kasb-site-card:hover{transform:translateY(-8px);border-color:color-mix(in srgb,var(--site-tone) 42%,transparent);box-shadow:0 32px 85px rgba(0,0,0,.32),0 0 40px color-mix(in srgb,var(--site-tone) 10%,transparent)}
.universe-auth .auth-dialog{border-color:rgba(151,193,255,.21);background:linear-gradient(145deg,#0a102a,#050919);box-shadow:0 40px 120px rgba(0,0,0,.62)}
.universe-auth .auth-visual{background:radial-gradient(circle at 30% 25%,rgba(69,231,255,.13),transparent 34%),radial-gradient(circle at 75% 75%,rgba(151,105,255,.16),transparent 38%),#081027}

@media(max-width:980px){
  .kasb28 .city-hud{grid-template-columns:auto minmax(150px,1fr) auto}.kasb28 .city-speed{display:none}.kasb28 .city-tools{justify-self:end}
  .roya-auth-btn{min-width:46px;padding:0 9px;font-size:8px}.roya-auth-btn.login{display:none}
}
@media(max-width:600px){
  .kasb28 .roya-nav-actions{gap:5px}.kasb28 .roya-auth-btn.register{display:flex;height:38px;align-items:center}.kasb28 .roya-cta{height:38px;padding-inline:9px}.kasb28 .roya-cta i{display:none}
  .kasb28 .city-stage{height:87svh;min-height:600px;max-height:820px}.kasb28 .city-canvas{filter:saturate(1.12) contrast(1.06) brightness(1.04)}
  .kasb28 .city-hud{top:70px;right:8px;left:8px;grid-template-columns:minmax(0,1fr) auto;height:auto;min-height:58px;padding:7px 8px;border-radius:16px}.kasb28 .city-hud-brand{display:none}.kasb28 .city-location{min-width:0;max-width:none}.kasb28 .city-location strong{font-size:11px}.kasb28 .city-location span{font-size:8px}.kasb28 .city-tools{gap:4px}.kasb28 .city-tools button{width:36px;height:38px;border-radius:10px}.kasb28 .city-tools button small{display:none}.kasb28 .city-tools button:nth-child(3),.kasb28 .city-tools button:nth-child(4){display:none}
  .kasb28 .city-minimap{width:122px;bottom:154px;left:8px}.kasb28 .city-gps{right:8px;bottom:154px;width:134px}.kasb28 .city-bottom-status{height:42px;padding-inline:9px}.kasb28 .city-bottom-status span:nth-child(2),.kasb28 .city-bottom-status span:nth-child(3){display:none}.kasb28 .city-bottom-status a{font-size:7px}.kasb28 .city-bottom-status b{font-size:7px}
  .kasb28 .city-mobile-controls{bottom:50px}.kasb28 .city-prompt{bottom:146px}.kasb28 .city-gate h2{font-size:43px}.kasb28 .city-gate-metrics span:nth-child(2) b{font-size:11px}
}
@media(max-width:390px){
  .kasb28 .roya-auth-btn.register{display:none}.kasb28 .city-stage{height:84svh;min-height:570px}.kasb28 .city-gps{display:none}.kasb28 .city-minimap{bottom:145px}.kasb28 .city-prompt{bottom:137px}.kasb28 .city-gate h2{font-size:38px}
}
@media(prefers-reduced-motion:reduce){.kasb28 .kasb-site-card:hover,.roya-auth-btn:hover{transform:none}}

/* Configurable project popup */
.project-promo-popup{position:fixed;z-index:220;inset:0;display:grid;place-items:center;padding:18px;opacity:0;visibility:hidden;transition:.3s ease}.project-promo-popup.is-open{opacity:1;visibility:visible}.project-promo-backdrop{position:absolute;inset:0;background:rgba(1,4,14,.72);backdrop-filter:blur(13px)}
.project-promo-popup>article{position:relative;z-index:1;width:min(760px,100%);display:grid;grid-template-columns:.8fr 1.2fr;gap:25px;align-items:center;padding:26px;border:1px solid rgba(154,194,255,.22);border-radius:28px;background:radial-gradient(circle at 15% 15%,rgba(69,231,255,.12),transparent 30%),linear-gradient(145deg,#101837,#060a1d);box-shadow:0 45px 130px rgba(0,0,0,.65);transform:translateY(22px) scale(.97);transition:.35s ease}.project-promo-popup.is-open>article{transform:none}.project-promo-popup>article>button{position:absolute;top:12px;left:12px;width:38px;height:38px;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:rgba(255,255,255,.04);color:#fff;font-size:22px;cursor:pointer}.project-promo-media{min-height:260px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.08);border-radius:22px;background:radial-gradient(circle,rgba(145,105,255,.14),transparent 62%)}.project-promo-media img{width:100%;height:260px;object-fit:contain;filter:drop-shadow(0 28px 35px rgba(0,0,0,.42))}.project-promo-popup h2{margin:8px 0 12px;color:#fff;font-size:34px}.project-promo-popup p{color:#aab7d2;line-height:2}.project-promo-popup .btn{display:inline-flex;margin-top:15px}.project-promo-popup.position-bottom-right,.project-promo-popup.position-bottom-left{align-items:end}.project-promo-popup.position-bottom-right{justify-items:end}.project-promo-popup.position-bottom-left{justify-items:start}.project-promo-popup.position-bottom-right>article,.project-promo-popup.position-bottom-left>article{width:min(580px,100%)}
@media(max-width:600px){.project-promo-popup>article{grid-template-columns:1fr;padding:18px}.project-promo-media{min-height:160px}.project-promo-media img{height:160px}.project-promo-popup h2{font-size:25px}.project-promo-popup p{font-size:11px}.project-promo-popup .btn{width:100%;justify-content:center}}