*{box-sizing:border-box}
:root{--bg:#020816;--panel:#071b31;--panel2:#0a2946;--cyan:#10e8ff;--cyan2:#00bde9;--green:#16e4b0;--text:#e9fbff;--muted:#8ca9ba;--yellow:#ffe500}
html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Arial,sans-serif;background:#020610;color:var(--text)}
body{background:
radial-gradient(circle at 50% 12%,rgba(0,180,255,.13),transparent 27rem),
radial-gradient(circle at 50% 55%,rgba(0,255,207,.07),transparent 30rem),
linear-gradient(180deg,#020814,#01040b 75%,#00030a)}
button,input,select{font:inherit}
.hidden{display:none!important}
.app{width:min(100%,760px);margin:0 auto;padding-bottom:22px}
.topbar{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid rgba(0,216,255,.13);background:rgba(2,10,23,.72);backdrop-filter:blur(12px);position:sticky;top:0;z-index:10}
.brand{font-weight:800;letter-spacing:.5px;font-size:18px;display:flex;align-items:center;gap:9px}
.brand-mark{width:29px;height:29px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(145deg,#22ffd0,#0084ff);box-shadow:0 0 18px rgba(0,238,255,.45)}
.language{display:flex;align-items:center;gap:4px;padding:7px 9px;border:1px solid rgba(0,222,255,.22);border-radius:18px;background:rgba(4,31,53,.75);font-size:13px}
.language select{border:0;background:transparent;color:#dffaff;outline:0;cursor:pointer}
.language option{background:#071625;color:#fff}

.hero{text-align:center;position:relative;overflow:hidden;padding:22px 18px 12px;min-height:300px}
.hero:before{content:"";position:absolute;inset:0;background:
linear-gradient(125deg,transparent 20%,rgba(0,210,255,.08) 21%,transparent 22%),
radial-gradient(ellipse at 75% 45%,rgba(0,221,255,.18),transparent 18rem);pointer-events:none}
.online{position:relative;display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(0,235,178,.55);color:#36f3c1;border-radius:18px;padding:5px 12px;font-size:12px;background:rgba(0,84,75,.2)}
.online i{width:7px;height:7px;border-radius:50%;background:#00e5aa;box-shadow:0 0 10px #00e5aa}
.hero h1{position:relative;font-size:clamp(32px,7vw,52px);line-height:1.17;margin:18px 0 10px;font-weight:900;text-shadow:0 0 18px rgba(66,239,255,.32)}
.hero p{position:relative;margin:0;color:#9ab5c5;font-size:14px}
.orb{height:135px;width:250px;margin:-2px auto 0;position:relative;transform:scale(.9)}
.orb-core{position:absolute;z-index:3;left:83px;top:28px;width:84px;height:84px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:19px;color:#a7ffff;background:radial-gradient(circle at 38% 32%,#53faff,#00567c 45%,#021522 75%);box-shadow:0 0 20px #00ddff,0 0 55px rgba(0,201,255,.5);border:2px solid #57edff}
.orb-ring{position:absolute;border:1px solid rgba(0,236,255,.7);border-radius:50%;transform:rotate(-12deg)}
.ring-a{width:235px;height:72px;left:8px;top:45px;box-shadow:0 0 14px rgba(0,226,255,.35)}
.ring-b{width:168px;height:48px;left:42px;top:62px;transform:rotate(22deg)}
.orb-base{position:absolute;bottom:0;left:47px;width:156px;height:24px;border-radius:50%;background:radial-gradient(ellipse,#0feaff,#06334d 48%,transparent 70%);box-shadow:0 12px 24px rgba(0,217,255,.35)}

.demo-notice{margin:0 14px 12px;padding:9px 12px;border:1px solid rgba(255,220,0,.35);border-radius:10px;background:rgba(86,72,0,.15);color:#ffe95a;text-align:center;font-size:12px}

.card{margin:14px 14px 0;padding:19px 16px;border:1px solid rgba(0,221,255,.55);border-radius:18px;background:linear-gradient(145deg,rgba(8,40,67,.92),rgba(3,18,35,.96));box-shadow:0 0 26px rgba(0,203,255,.08),inset 0 0 24px rgba(0,174,255,.035)}
.card-title{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;margin-bottom:14px}
.gift,.send{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:rgba(0,218,255,.12);font-size:20px}
.field-label{display:block;color:#a3bbc9;font-size:12px;margin-bottom:8px}
.input-wrap{height:48px;display:flex;align-items:center;gap:9px;border:1px solid rgba(0,227,255,.8);border-radius:11px;padding:0 12px;background:rgba(1,14,28,.72)}
.input-wrap span{color:#7593a5}
.input-wrap input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:#eaffff}
.input-wrap input::placeholder{color:#637c8b}
.primary{width:100%;height:48px;border:0;border-radius:11px;margin-top:14px;color:#012a2a;font-weight:900;cursor:pointer;background:linear-gradient(100deg,#18eec7,#12d9ad);box-shadow:0 0 18px rgba(0,236,186,.24);transition:.2s transform,.2s filter}
.primary:hover{filter:brightness(1.07);transform:translateY(-1px)}
.primary:disabled{opacity:.72;cursor:wait;transform:none}
.primary b{margin-left:6px}
.limit{text-align:center;color:#8aa8b5;font-size:11px;margin-top:12px}
.progress-panel{margin-top:15px;padding:12px;border-radius:12px;background:rgba(0,0,0,.18)}
.progress-head{display:flex;justify-content:center;gap:7px;font-size:14px;color:#dffaff}
.progress-track{height:6px;background:#1b3449;border-radius:9px;overflow:hidden;margin:10px 0 5px}
.progress-track span{display:block;width:0;height:100%;background:linear-gradient(90deg,#00e3ff,#19e8b1);border-radius:9px;box-shadow:0 0 12px rgba(0,229,255,.6)}
.progress-pct{text-align:center;color:#9fb5c0;font-size:12px}
.transfer-card{border-color:rgba(0,179,255,.48)}
.transfer-card .muted{color:#91aaba;font-size:12px;margin:-5px 0 10px}
.copy-row{display:flex;gap:7px;border:1px solid rgba(0,219,255,.68);border-radius:10px;padding:5px;background:rgba(0,10,22,.45)}
.copy-row input{min-width:0;flex:1;border:0;background:transparent;color:#56dfff;font-size:12px;padding:7px;outline:0}
.copy-row button{border:1px solid rgba(0,219,255,.35);background:#07526b;color:#d8fbff;border-radius:8px;padding:0 13px;cursor:pointer}
.auto-note{text-align:center;margin-top:10px;color:#8ba8b5;font-size:11px}
.auto-note:first-letter{color:#00edb4}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px}
.info-grid div{padding:15px 10px;text-align:center;border:1px solid rgba(0,201,255,.15);border-radius:13px;background:rgba(4,26,43,.5)}
.info-grid strong{display:block;font-size:22px;color:#41eaff}
.info-grid span{display:block;margin-top:3px;color:#829eae;font-size:11px}
footer{text-align:center;color:#66849a;font-size:12px;padding:8px 15px 0}
.footer-demo{display:inline-block;margin-left:7px;color:#ffe44d}

.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,15px);opacity:0;pointer-events:none;z-index:30;background:#102b3b;color:#eaffff;border:1px solid rgba(0,224,255,.35);padding:10px 15px;border-radius:10px;font-size:12px;transition:.25s}
.toast.show{opacity:1;transform:translate(-50%,0)}
.boot-screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:
radial-gradient(circle at 50% 45%,rgba(0,217,255,.11),transparent 20rem),#01040a;z-index:100}
.boot-logo{font-size:46px;filter:drop-shadow(0 0 18px rgba(0,226,255,.6));margin-bottom:14px}
.boot-title{font-weight:900;font-size:20px;letter-spacing:2px}
.boot-progress{width:min(260px,65vw);height:5px;background:#16222b;border-radius:10px;margin:24px 0 9px;overflow:hidden}
.boot-progress span{display:block;width:1%;height:100%;background:linear-gradient(90deg,#00e7ff,#1ce8b5);box-shadow:0 0 12px #00e7ff}
#bootPct{color:#91a7b5;font-size:12px}

@media(min-width:800px){
  body{padding:18px 0}
  .app{border:1px solid rgba(0,210,255,.15);border-radius:24px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.55)}
  .topbar{position:relative}
  .hero{padding-top:30px}
  .card{margin-left:22px;margin-right:22px}
  .demo-notice{margin-left:22px;margin-right:22px}
  .info-grid{margin-left:22px;margin-right:22px}
}
@media(max-width:420px){
  .topbar{padding:0 13px}
  .brand{font-size:16px}
  .language{font-size:11px}
  .hero{min-height:270px}
  .hero h1{font-size:31px}
  .card-title{font-size:18px}
}

.share-card{border-color:rgba(0,220,255,.48)}
.share-card .muted{color:#91aaba;font-size:12px;margin:-5px 0 10px}

.address-status{min-height:15px;margin:5px 3px 0;text-align:right;font-size:12px;color:#91aaba}
.address-status.valid{color:#18e8b3}
.address-status.invalid{color:#ff6677}
.address-status.checking{color:#91aaba}
.primary:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.6)}