:root{
  --bg:#050505;
  --panel:#101010;
  --panel-2:#151515;
  --line:rgba(255,255,255,.08);
  --text:#fff;
  --muted:#a8a8a8;
  --blue:#2f7cff;
  --blue-2:#5ca3ff;
  --green:#2fe870;
  --orange:#ffb25c;
  --red:#ff6666;
  --radius-xl:32px;
  --radius-lg:24px;
  --radius-md:18px;
  --shadow:0 20px 60px rgba(0,0,0,.35);
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  min-height:100vh;
  color:var(--text);
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(24,63,128,.22), transparent 45%),
    radial-gradient(1000px 480px at 100% 0%, rgba(20,54,112,.16), transparent 48%),
    linear-gradient(180deg,#050505 0%, #06090f 100%);
  font-family:Inter,system-ui,sans-serif;
  overflow-x:hidden;
}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
.hidden{display:none !important}

.euPage{width:100%}
.euWrap{padding:26px 34px 80px}

/* floating buttons */
.euMenuBtn,.euProfileBtn{
  position:fixed;
  top:14px;
  z-index:9998;
  height:48px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(20,20,20,.88);
  backdrop-filter:blur(12px);
  box-shadow:0 10px 25px rgba(0,0,0,.24);
}
.euMenuBtn{
  right:14px;
  width:48px;
  display:grid;
  place-items:center;
  color:#fff;
  cursor:pointer;
}
.euProfileBtn{
  right:72px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:0 16px;
}
.euProfileTxt{font-size:13px;font-weight:800}

/* menu */
.euMenuOverlay{
  position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(5px);z-index:9997;
}
.euMenu{
  position:fixed;
  top:14px;right:14px;
  width:min(360px, calc(100vw - 28px));
  max-height:calc(100vh - 28px);
  overflow:auto;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.10);
  background:#101010;
  box-shadow:0 24px 70px rgba(0,0,0,.45);
  z-index:9999;
}
.euMenuHead{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px;border-bottom:1px solid rgba(255,255,255,.08);
}
.euMenuBrand{display:flex;align-items:center;gap:10px}
.euMenuMark{
  width:38px;height:38px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--blue),var(--blue-2));font-weight:1000;
}
.euMenuTitle{font-size:15px;font-weight:900}
.euMenuClose{
  width:38px;height:38px;border-radius:14px;border:1px solid rgba(255,255,255,.10);
  background:#181818;color:#fff;cursor:pointer;
}
.euMenuNav{display:flex;flex-direction:column;gap:8px;padding:14px}
.euMenuLink{
  border:1px solid rgba(255,255,255,.08);
  background:#171717;
  min-height:46px;
  padding:0 14px;
  border-radius:14px;
  display:flex;
  align-items:center;
  font-weight:800;
}
html.euMenuOpen{overflow:hidden}

/* hero */
.euHero{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) 360px;
  gap:22px;
  margin-bottom:22px;
}
.euHeroContent,.euHeroSide .euInfoCard{
  border-radius:34px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(90deg, rgba(19,46,93,.30) 0%, rgba(8,8,8,0) 55%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  box-shadow:var(--shadow);
}
.euHeroContent{padding:34px}
.euEyebrow{
  color:#8ab8ff;font-size:12px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;
}
.euTitle{
  margin-top:10px;font-size:58px;line-height:.95;font-weight:1000;letter-spacing:-.05em;max-width:800px;
}
.euLead{
  margin-top:16px;max-width:760px;font-size:19px;line-height:1.6;color:var(--muted);
}
.euHeroBadges{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.euBadge{
  min-height:38px;padding:0 14px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);
  font-size:13px;font-weight:800;
}
.euHeroActions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.euBtn{
  min-height:50px;padding:0 18px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;border:1px solid rgba(255,255,255,.10);cursor:pointer;
}
.euBtnPrimary{
  background:linear-gradient(135deg,var(--blue),var(--blue-2));
  color:#fff;border:0;box-shadow:0 12px 28px rgba(47,124,255,.22);
}
.euBtnGhost{background:#121212;color:#fff}
.euInfoCard{padding:26px}
.euInfoTitle{font-size:24px;font-weight:1000;letter-spacing:-.03em}
.euInfoList{margin-top:16px;padding-left:18px;display:grid;gap:10px;color:#ddd;line-height:1.5}

/* layout */
.euMainGrid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:22px;
}
.euMainCol,.euSideCol{display:flex;flex-direction:column;gap:22px;min-width:0}
.euCard{
  border-radius:30px;
  border:1px solid rgba(255,255,255,.08);
  background:#0f0f0f;
  padding:24px;
  box-shadow:0 12px 28px rgba(0,0,0,.22);
}
.euCardHead{margin-bottom:18px}
.euCardTitle{font-size:28px;line-height:1;font-weight:1000;letter-spacing:-.04em}
.euCardSub{margin-top:8px;color:var(--muted);font-size:14px;line-height:1.5}

/* form */
.euGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.euField{display:flex;flex-direction:column;gap:6px}
.euLabel{font-size:12px;font-weight:800;color:var(--muted)}
.euInput{
  min-height:48px;padding:0 14px;border-radius:14px;border:1px solid rgba(255,255,255,.10);
  background:#151515;color:#fff;outline:none;
}
.euInput:focus{border-color:rgba(92,163,255,.55);box-shadow:0 0 0 3px rgba(92,163,255,.16)}
.euWarningBox{
  margin-top:16px;padding:16px;border-radius:18px;background:#141414;border:1px solid rgba(255,255,255,.08);
}
.euWarningTitle{font-size:14px;font-weight:900}
.euWarningText{margin-top:6px;color:var(--muted);font-size:14px;line-height:1.5}
.euFormActions{margin-top:18px;display:flex;justify-content:flex-start}

/* empty/auth */
.euAuthGate,.euRequestsList{min-width:0}
.euEmptyBox{
  min-height:180px;border-radius:22px;border:1px dashed rgba(255,255,255,.10);
  background:#141414;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:20px;
}
.euEmptyTitle{font-size:20px;font-weight:1000}
.euEmptyText{margin-top:8px;color:var(--muted);font-size:14px;line-height:1.5;max-width:420px}

/* requests */
.euRequestsList{display:flex;flex-direction:column;gap:14px}
.euRequestCard{
  border-radius:22px;border:1px solid rgba(255,255,255,.08);background:#141414;padding:18px;
}
.euRequestTop{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap}
.euRequestDate{font-size:18px;font-weight:900}
.euRequestStatus{
  min-height:34px;padding:0 12px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:900;border:1px solid rgba(255,255,255,.08);
}
.status-oczekuje{background:rgba(255,178,92,.12);color:#ffcb92}
.status-w-trakcie{background:rgba(47,124,255,.12);color:#9bc4ff}
.status-konto-polaczone-milej-pracy{background:rgba(47,232,112,.12);color:#8cf1b0}
.euRequestGrid{
  margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:12px;
}
.euRequestMeta{
  border-radius:16px;background:#101010;border:1px solid rgba(255,255,255,.06);padding:12px;
}
.euRequestMetaLabel{font-size:12px;color:var(--muted);font-weight:800}
.euRequestMetaValue{margin-top:6px;font-size:15px;font-weight:900;line-height:1.4}

/* side */
.euStatusLegend{display:grid;gap:14px}
.euLegendItem{
  display:flex;gap:12px;padding:14px;border-radius:18px;background:#141414;border:1px solid rgba(255,255,255,.08);
}
.euStatusDot{
  width:14px;height:14px;border-radius:999px;flex-shrink:0;margin-top:4px;
}
.euStatusDotPending{background:var(--orange)}
.euStatusDotProgress{background:var(--blue)}
.euStatusDotDone{background:var(--green)}
.euLegendTitle{font-size:15px;font-weight:900}
.euLegendText{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.5}

.euPromoCard{
  background:
    linear-gradient(180deg, rgba(47,124,255,.14), rgba(16,16,16,1) 40%),
    #101010;
}
.euPromoOverline{
  color:#8ab8ff;font-size:12px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;
}
.euPromoTitle{margin-top:10px;font-size:28px;line-height:1.05;font-weight:1000;letter-spacing:-.04em}
.euPromoLinks{display:grid;gap:10px;margin-top:18px}
.euPromoLink{
  min-height:52px;padding:0 16px;border-radius:18px;background:#141414;border:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;font-weight:900;
}

/* modal */
.euModal{
  position:fixed;inset:0;z-index:10050;display:flex;align-items:center;justify-content:center;padding:20px;
}
.euModalBackdrop{position:absolute;inset:0;background:rgba(0,0,0,.66);backdrop-filter:blur(6px)}
.euModalCard{
  position:relative;width:min(720px,100%);border-radius:28px;border:1px solid rgba(255,255,255,.10);
  background:#111111;padding:24px;box-shadow:0 24px 70px rgba(0,0,0,.45);
}
.euModalTitle{font-size:30px;line-height:1.05;font-weight:1000;letter-spacing:-.04em}
.euModalText{margin-top:12px;color:var(--muted);font-size:15px;line-height:1.6}
.euPreviewBox{
  margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px;
}
.euPreviewItem{
  border-radius:16px;background:#141414;border:1px solid rgba(255,255,255,.08);padding:14px;
}
.euPreviewLabel{font-size:12px;color:var(--muted);font-weight:800}
.euPreviewValue{margin-top:7px;font-size:15px;font-weight:900;line-height:1.4}
.euModalActions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end;margin-top:18px}

@media (max-width:1180px){
  .euHero,.euMainGrid{grid-template-columns:1fr}
}
@media (max-width:860px){
  .euWrap{padding:14px 14px 40px}
  .euTitle{font-size:38px}
  .euLead{font-size:15px}
  .euHeroContent,.euCard,.euInfoCard{padding:18px;border-radius:24px}
  .euGrid,.euRequestGrid,.euPreviewBox{grid-template-columns:1fr}
  .euProfileTxt{display:none}
  .euMenuBtn{right:12px}
  .euProfileBtn{right:66px;padding:0 14px}
}
*{-webkit-tap-highlight-color:transparent}