:root{
  --bg1:#0d6efd;
  --bg2:#7ecbff;
  --ink:#0b1633;
  --white:#fff;
  --btn:#2f5fe6;
  --btn2:#4b7bff;
}

*{box-sizing:border-box}
html,body{
  margin:0; padding:0;
  /* Вариант 1: красивый CSS-градиент (лёгкий, без файлов) */
  background:
    radial-gradient(900px 700px at 15% 5%, rgba(255,255,255,.25) 0%, transparent 60%),
    radial-gradient(700px 500px at 85% 10%, rgba(255,255,255,.20) 0%, transparent 60%),
    linear-gradient(160deg,var(--bg1),var(--bg2));
  color:var(--white);
  font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;
}

/* Вариант 2: твой фон-картинка, двигается со скроллом (раскомментируй ниже) */
/*
body{
  background: url('./assets/bg.jpg') no-repeat center top;
  background-size: cover;
  background-attachment: scroll;  /* фон двигается вместе с контентом */
}
*/

header{padding:16px 12px;text-align:center}
header .logo{
  position: fixed; /* фикс. логотип всегда сверху */
  top: 16px; left: 50%; transform: translateX(-50%);
  z-index: 1000; width: 180px;
  border-radius: 12px; box-shadow:0 8px 24px rgba(0,0,0,.25);
}

.currency-strip{
  margin: 96px auto 0;
  display: inline-flex; gap:12px; align-items:center;
  background: rgba(255,255,255,.9); color:#111;
  padding:6px 12px; border-radius:999px; font-weight:800
}
.currency-strip img{height:18px; vertical-align:middle}

main{max-width:640px;margin:0 auto;padding:16px; padding-top:20px}
h2{margin:18px 0 12px}
label{display:block;margin:10px 0 6px;font-weight:700}

select,input,textarea{
  width:100%; padding:12px 14px; border:0; border-radius:12px;
  background:rgba(255,255,255,.92); color:#111
}

button{
  width:100%; padding:12px 16px; border:0; border-radius:12px;
  background: linear-gradient(145deg,var(--btn),var(--btn2));
  color:#fff; font-weight:800; margin-top:12px; cursor:pointer
}
.btn-ghost{
  background:rgba(255,255,255,.15);
  border:2px solid rgba(255,255,255,.6);
  color:#fff
}
#rubcnyModeBox{display:none; gap:10px}

.result{
  margin-top:12px; background:rgba(255,255,255,.88);
  color:#111; border-radius:12px; padding:12px; font-weight:700
}

footer{padding:16px;text-align:center}
footer a{color:#fff;margin:0 10px;text-decoration:none;font-weight:700}

.table{width:100%;border-collapse:separate;border-spacing:0 10px}
.table th{color:#eef;text-align:left}
.table td{background:rgba(255,255,255,.92);color:#111;padding:10px;border-radius:10px}