* { box-sizing: border-box; }
:root { color-scheme: dark; font-family: Arial, Helvetica, sans-serif; background: #1e2939; color: #e4e8ef; }
body { margin: 0; min-width: 320px; background: #1e2939; }
.page { min-height: 100vh; padding: 244px 20px 18px; text-align: center; position: relative; }
.language-control { position:absolute; top:16px; right:18px; z-index:2; }
.language-control select { max-width:min(210px, 48vw); height:38px; padding:0 34px 0 12px; border:1px solid #59677c; border-radius:8px; background:#26354a; color:#f4f6fa; font:600 14px Arial,Helvetica,sans-serif; cursor:pointer; box-shadow:0 4px 14px #0a122033; }
.language-control select:focus-visible { outline:3px solid #ffd331; outline-offset:2px; }
.brand { display:flex; justify-content:center; align-items:center; gap:14px; height:58px; margin-bottom:34px; }
.brand-name { color:#ffd331; font-weight:800; font-size:50px; line-height:1; text-decoration:underline; text-shadow:2px 2px 0 #080d15; }
.sun { color:#ffd51b; -webkit-text-stroke:2px #080d15; text-shadow:1px 2px #000; font-size:45px; line-height:1; }
.drops { width:44px; height:48px; position:relative; display:inline-block; }
.drops i { position:absolute; display:block; background:#00c7ef; border:3px solid #080d15; border-radius:70% 40% 70% 45%; transform:rotate(30deg); }
.drops i:nth-child(1){width:21px;height:25px;left:2px;top:0}.drops i:nth-child(2){width:31px;height:22px;right:0;top:14px}.drops i:nth-child(3){width:20px;height:17px;left:1px;bottom:0}
.drops.flip { transform:scaleX(-1); }
h1 { color:#8dbaf3; font-size:34px; line-height:1.2; margin:0 0 36px; font-weight:700; }
h2 { color:#f0525c; font-size:34px; line-height:1.2; margin:0 0 38px; font-weight:700; }
.faucet { margin:0 auto; max-width:535px; }
#wallet { width:100%; height:48px; border:0; border-radius:5px; background:#fff; color:#222; padding:0 13px; font-size:16px; box-shadow:0 1px 2px #1115; }
#wallet::placeholder { color:#9aa0a8; }
.request-row { display:flex; align-items:center; justify-content:center; gap:5px; margin-top:16px; color:#8dbaf3; font-size:22px; font-weight:700; }
#amount { width:64px; height:25px; border:0; border-radius:4px; background:white; color:#111; text-align:center; font-size:16px; font-weight:700; }
.network { height:44px; min-width:106px; border:0; border-radius:4px; color:white; font-size:14px; font-weight:bold; cursor:pointer; transition:filter .15s, transform .15s; }
.network:hover { filter:brightness(1.12); transform:translateY(-1px); }.network[aria-pressed="true"] { outline:2px solid #e5ebf6; outline-offset:2px; }
.testnet { background:#18a34a; }.devnet { background:#3979ed; }
.local-note { display:none; font-size:13px; color:#bac5d4; margin:10px 0 0; }.local-note.show { display:block; }
.about { margin:70px auto 0; max-width:1110px; font-weight:700; }
.about h3 { font-size:32px; margin:0 0 2px; line-height:1.2; }
.about p { font-size:24px; line-height:1.32; margin:0; }
a { color:#ffd331; text-decoration:underline; text-underline-offset:2px; }
footer { position:absolute; left:16px; bottom:18px; color:#aab5c5; font-size:16px; font-weight:bold; }
footer a { color:#8dbaf3; }.heart { color:#ef3340; }.sun-small { color:#ffd31a; }
.visually-hidden { position:absolute; width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
[hidden] { display:none !important; }
body.guide-active { overflow:hidden; }
.guide-backdrop { position:fixed; inset:0; z-index:10000; pointer-events:none; }
.guide-spotlight { position:fixed; box-sizing:border-box; border:2px solid #ffd331; border-radius:12px; box-shadow:0 0 0 100vmax rgb(5 10 20 / 82%), 0 0 28px rgb(255 211 49 / 58%); transition:top .25s ease,left .25s ease,width .25s ease,height .25s ease; }
.guide-panel { position:fixed; z-index:10001; right:clamp(16px,4vw,52px); bottom:30px; width:min(420px,calc(100vw - 32px)); padding:24px; border:1px solid #ffffff24; border-radius:18px; background:linear-gradient(145deg,#283951,#172334); color:#eef3fb; text-align:left; box-shadow:0 20px 70px #0009; }
.guide-panel .guide-kicker { margin:0 0 8px; color:#ffd331; font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.guide-panel h2 { margin:0 0 10px; color:#f5f7fb; font-size:25px; line-height:1.15; }
.guide-panel #guide-description { margin:0; color:#cfdae9; font-size:15px; line-height:1.55; }
.guide-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:20px; }
.guide-countdown { color:#b8c5d5; font-size:13px; }
.guide-next { min-width:112px; padding:11px 16px; border:0; border-radius:9px; background:#ffd331; color:#1d2734; font:700 14px Arial,Helvetica,sans-serif; cursor:pointer; transition:filter .15s,transform .15s,opacity .15s; }
.guide-next:hover:not(:disabled) { filter:brightness(1.06); transform:translateY(-1px); }
.guide-next:disabled { opacity:.48; cursor:not-allowed; }
.guide-next:focus-visible { outline:3px solid #fff; outline-offset:3px; }
html[dir="rtl"] .language-control { right:auto; left:18px; }
html[dir="rtl"] .guide-panel { right:auto; left:clamp(16px,4vw,52px); text-align:right; }
html[dir="rtl"] footer { left:auto; right:16px; }
@media (max-width:700px) {
  .page { padding:78px 18px 90px; }
  .brand { gap:7px; height:44px; margin-bottom:30px; }.brand-name { font-size:36px; }.sun { font-size:31px; }.drops { transform:scale(.72); width:32px; margin:0 -4px; }.drops.flip { transform:scale(-.72,.72); }
  h1 { font-size:25px; margin-bottom:24px; } h2 { font-size:24px; margin-bottom:30px; }
  .faucet { max-width:460px; } .request-row { flex-wrap:wrap; gap:7px 5px; font-size:19px; }.network { min-width:94px; height:42px; }
  .about { margin-top:54px; }.about h3 { font-size:23px; margin-bottom:8px; }.about p { font-size:18px; line-height:1.42; }
  footer { left:18px; right:18px; bottom:20px; text-align:left; font-size:14px; }
  html[dir="rtl"] footer { left:18px; right:18px; text-align:right; }
  html[dir="rtl"] .language-control { left:12px; right:auto; }
  .guide-panel { padding:20px; border-radius:15px; }
  .guide-panel h2 { font-size:22px; }
  .guide-panel #guide-description { font-size:14px; }
  .guide-footer { margin-top:16px; }
  .guide-countdown { font-size:12px; }
}
@media (max-width:370px) { .brand-name{font-size:31px}.sun{font-size:28px}h1{font-size:23px}h2{font-size:21px}.network{min-width:87px} }