:root{
  --bg:#070A12;
  --panel:rgba(255,255,255,.06);
  --panel2:rgba(255,255,255,.08);
  --stroke:rgba(255,255,255,.12);
  --text:#eaf0ff;
  --muted:rgba(234,240,255,.72);
  --muted2:rgba(234,240,255,.55);
  --shadow: 0 18px 60px rgba(0,0,0,.40);
  --r:18px;
  --r2:24px;
  --grad: linear-gradient(135deg, #7c3aed 0%, #3b82f6 55%, #22c55e 120%);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial;
  background:
    radial-gradient(1000px 600px at 20% -10%, rgba(124,58,237,.35), transparent 60%),
    radial-gradient(900px 550px at 90% 10%, rgba(59,130,246,.30), transparent 60%),
    radial-gradient(900px 600px at 50% 110%, rgba(34,197,94,.18), transparent 55%),
    var(--bg);
  color: var(--text);
}

a{color:inherit;text-decoration:none}
.container{max-width:1140px;margin:0 auto;padding:0 18px}

.topbar{position:sticky;top:0;z-index:40;backdrop-filter: blur(14px);background:rgba(7,10,18,.65);border-bottom:1px solid rgba(255,255,255,.10)}
.topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:14px;height:68px}
.brand{display:flex;align-items:center;gap:10px}
.brand__logo{width:36px;height:36px;border-radius:14px;display:grid;place-items:center;background:var(--grad);box-shadow:0 12px 28px rgba(124,58,237,.25)}
.brand__name{font-weight:800;letter-spacing:.2px}

.iconbtn{display:none;flex-direction:column;gap:5px;background:transparent;border:1px solid rgba(255,255,255,.14);padding:10px;border-radius:14px;color:var(--text)}
.iconbtn__bar{display:block;width:18px;height:2px;background:rgba(234,240,255,.8);border-radius:10px}

.nav{display:flex;align-items:center;gap:14px}
.nav__link{opacity:.82;padding:10px 10px;border-radius:14px;border:1px solid transparent}
.nav__link:hover{opacity:1;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.10)}
.nav__link.is-active{opacity:1;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14)}

.lang{position:relative}
.lang__btn{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:var(--text);padding:10px 12px;border-radius:14px;cursor:pointer}
.lang__menu{position:absolute;inset-inline-end:0;top:48px;min-width:180px;background:rgba(15,20,40,.92);border:1px solid rgba(255,255,255,.12);border-radius:16px;box-shadow:var(--shadow);padding:8px;display:none}
.lang__menu.is-open{display:block}
.lang__item{display:block;padding:10px 10px;border-radius:12px;opacity:.9}
.lang__item:hover{background:rgba(255,255,255,.08);opacity:1}

.hero{display:grid;grid-template-columns: 1.1fr .9fr;gap:18px;padding:26px 18px 10px}
.hero__left{padding-top:10px}

.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:var(--muted);font-weight:650}

.h1{font-size:clamp(28px, 3.2vw, 44px);line-height:1.05;margin:14px 0 10px}
.h2{font-size:18px;margin:0}
.lead{color:var(--muted);font-size:16px;line-height:1.6;margin:0 0 14px}

.ctaRow{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 18px}
.btn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:var(--text);padding:11px 14px;border-radius:14px;cursor:pointer}
.btn:hover{filter:brightness(1.07)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn--primary{background:var(--grad);border-color:transparent}
.btn--small{padding:9px 12px;border-radius:12px}

.card{border-radius:var(--r2);border:1px solid rgba(255,255,255,.12);box-shadow: var(--shadow)}
.card--glass{background:rgba(255,255,255,.06);backdrop-filter: blur(12px)}
.card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 14px 0}
.card__body{padding:12px 14px 14px}

.address{font-size:18px;font-weight:800;margin-top:6px;word-break:break-all}
.pill{padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:var(--muted);font-weight:650;white-space:nowrap}
.hint{color:var(--muted2);font-size:13px;line-height:1.55}

.miniGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
.mini{padding:12px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10)}
.mini__k{font-size:12px;color:var(--muted2)}
.mini__t{margin-top:6px;font-weight:750}

.panel{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r2);box-shadow: var(--shadow);overflow:hidden}
.panel__head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px;border-bottom:1px solid rgba(255,255,255,.10)}
.panel__muted{color:var(--muted2);font-size:13px}

.list{padding:12px;display:flex;flex-direction:column;gap:10px;min-height:140px}
.empty{color:var(--muted2);padding:12px;border-radius:16px;border:1px dashed rgba(255,255,255,.16)}

.msg{padding:12px;border-radius:18px;background:rgba(10,14,28,.55);border:1px solid rgba(255,255,255,.10)}
.msg__top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.msg__subj{font-weight:800}
.msg__time{color:var(--muted2);font-size:12px;white-space:nowrap}
.msg__meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;color:var(--muted);font-size:13px}
.msg__meta b{color:var(--text)}
.msg__actions{margin-top:10px}

.viewer{padding:12px}
.viewer__meta{display:grid;gap:6px;color:var(--muted)}
.viewer__meta b{color:var(--text)}
.viewer__body{margin-top:12px;padding:12px;border-radius:18px;background:rgba(10,14,28,.55);border:1px solid rgba(255,255,255,.10);overflow:auto;max-height:520px}
.viewer pre{margin:0;white-space:pre-wrap;word-break:break-word}
.mailHtml img{max-width:100%;height:auto}

.page{padding:24px 18px}
.page__head{padding:12px 0 18px}
.content{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10);border-radius:var(--r2);padding:16px}
.content__block{padding:10px 4px 12px}
.content__block + .content__block{border-top:1px solid rgba(255,255,255,.10)}
.content p{color:var(--muted);line-height:1.75}
.content ul{color:var(--muted);line-height:1.8}

.footer{margin-top:24px;border-top:1px solid rgba(255,255,255,.10);background:rgba(7,10,18,.55);backdrop-filter: blur(12px)}
.footer__grid{display:grid;grid-template-columns: 1.1fr .7fr 1.2fr;gap:18px;padding:22px 0}
.footer__brand{display:flex;align-items:center;gap:12px}
.footer__title{font-weight:850}
.footer__muted{color:var(--muted2);font-size:13px;line-height:1.6}
.footer__links{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.footer__links a{color:var(--muted)}
.footer__links a:hover{color:var(--text)}
.footer__bottom{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:14px 0 20px;border-top:1px solid rgba(255,255,255,.08)}

.seoCards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.seoCards--page{grid-template-columns:repeat(3,1fr)}
.seoCard{display:block;padding:12px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10)}
.seoCard:hover{background:rgba(255,255,255,.07)}
.seoCard__k{color:var(--muted2);font-size:12px}
.seoCard__t{font-weight:850;margin-top:6px}
.seoCard__m{color:var(--muted);font-size:13px;line-height:1.6;margin-top:6px}

.toast{position:fixed;inset-inline:18px;bottom:18px;max-width:380px;margin-inline:auto;padding:12px 14px;border-radius:16px;background:rgba(15,20,40,.92);border:1px solid rgba(255,255,255,.12);box-shadow:var(--shadow);opacity:0;transform:translateY(10px);transition:.25s}
.toast--in{opacity:1;transform:translateY(0)}

@media (max-width: 980px){
  .hero{grid-template-columns:1fr;}
  .miniGrid{grid-template-columns:1fr}
  .seoCards{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
}

@media (max-width: 720px){
  .iconbtn{display:flex}
  .nav{position:absolute;top:68px;inset-inline:0;background:rgba(7,10,18,.92);backdrop-filter: blur(14px);
    border-bottom:1px solid rgba(255,255,255,.10);padding:12px 18px;display:none;flex-direction:column;align-items:stretch}
  .nav.is-open{display:flex}
  .nav__link{padding:12px 12px}
  .lang__menu{position:static;display:none;margin-top:8px}
  .lang__menu.is-open{display:block}
  .lang__btn{width:100%;justify-content:space-between}
}