:root{--bg-0: #eef2f7;--bg-1: #f7fafc;--bg-2: rgba(255, 255, 255, .65);--surface: rgba(255, 255, 255, .55);--surface-strong: rgba(255, 255, 255, .8);--border: rgba(20, 45, 70, .1);--border-strong: rgba(20, 45, 70, .18);--text: #17222e;--text-dim: #55677c;--text-muted: #8b9aab;--accent: #2fc9a8;--accent-soft: #5ee2c4;--accent-2: #0b87c9;--accent-ink: #04231d;--danger: #cf3f54;--success: #0d9466;--radius-lg: 20px;--radius-md: 12px;--radius-sm: 8px;--shadow-card: 0 1px 0 rgba(255,255,255,.9) inset, 0 30px 70px -30px rgba(30, 60, 90, .35), 0 10px 30px -12px rgba(47, 201, 168, .25);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace}*,*:before,*:after{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{margin:0;font-family:var(--font-sans);color:var(--text);background:radial-gradient(1200px 700px at 15% -10%,rgba(94,226,196,.35),transparent 60%),radial-gradient(900px 600px at 110% 10%,rgba(77,196,255,.3),transparent 55%),radial-gradient(700px 500px at 50% 120%,rgba(150,120,255,.22),transparent 60%),linear-gradient(180deg,var(--bg-1),var(--bg-0) 60%,var(--bg-1));background-attachment:fixed;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-height:1.5}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:linear-gradient(rgba(20,45,70,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(20,45,70,.04) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse at 50% 30%,black 40%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 30%,black 40%,transparent 75%);z-index:0}main{position:relative;z-index:1;min-height:100dvh;display:grid;place-items:center;padding:32px 20px}.card{width:100%;max-width:440px;padding:28px;background:var(--surface);border:1px solid rgba(255,255,255,.7);border-radius:var(--radius-lg);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);box-shadow:var(--shadow-card);position:relative;overflow:hidden;animation:rise .5s cubic-bezier(.2,.7,.2,1) both}.card:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:inherit;padding:1px;background:linear-gradient(140deg,rgba(47,201,168,.6),rgba(11,135,201,.3) 40%,transparent 60%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.7}header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px;min-width:0}.card h1,.card .title{margin:0;font-size:20px;font-weight:700;letter-spacing:-.02em;display:flex;align-items:center;gap:10px;min-width:0}.card h1:before,.card .title:before{content:"";flex-shrink:0;width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px #2fc9a8cc}.badge{flex-shrink:0;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);background:#ffffff80;border:1px solid var(--border-strong);border-radius:999px;padding:4px 10px}button{font:inherit;cursor:pointer;border:0;color:inherit}#connect-btn,#unwrap-btn{display:block;width:100%;padding:14px 18px;border-radius:var(--radius-md);font-weight:650;font-size:15px;letter-spacing:-.01em;color:var(--accent-ink);background:linear-gradient(180deg,var(--accent-soft),var(--accent));box-shadow:0 1px #ffffff80 inset,0 -6px 20px #00000014 inset,0 10px 24px -8px #2fc9a88c;transition:transform .12s ease,box-shadow .2s ease,filter .2s ease}#connect-btn:hover:not(:disabled),#unwrap-btn:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.04);box-shadow:0 1px #fff9 inset,0 -6px 20px #00000014 inset,0 14px 30px -10px #2fc9a8a6}#connect-btn:active,#unwrap-btn:active{transform:translateY(0)}#connect-btn:disabled,#unwrap-btn:disabled{cursor:not-allowed;background:#fff6;color:var(--text-muted);box-shadow:none;border:1px solid var(--border)}#wallet-ui{display:flex;flex-direction:column;gap:16px}.account-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 12px;padding:10px 14px;background:#ffffff73;border:1px solid var(--border);border-radius:var(--radius-md);min-width:0}#account-id{color:var(--text-dim);font-size:13px;overflow-wrap:anywhere}.link{background:transparent;color:var(--accent-2);padding:4px 8px;border-radius:6px;font-size:13px;font-weight:600;transition:background .15s ease,color .15s ease}.link:hover{background:#0b87c91a;color:#0a6ea3}.input-row{position:relative;display:flex;align-items:center;padding:6px 6px 6px 18px;background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius-md);transition:border-color .15s ease,box-shadow .15s ease}.input-row:focus-within{border-color:#2fc9a899;box-shadow:0 0 0 4px #2fc9a826}#amount{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font-family:var(--font-mono);font-size:22px;font-weight:600;letter-spacing:-.02em;padding:12px 8px}#amount::placeholder{color:var(--text-muted)}#amount::-webkit-outer-spin-button,#amount::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}#amount[type=number]{-moz-appearance:textfield}.unit{flex-shrink:0;padding:8px 14px;border-radius:999px;background:#2fc9a824;color:#0b7d68;font-size:12px;font-weight:700;letter-spacing:.08em}.hint{margin:0;font-size:13px;color:var(--text-dim);text-align:center}.hint strong{color:var(--text);font-weight:600}.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.msg{margin:4px 0 0;min-height:1em;font-size:13px;color:var(--text-dim);text-align:center;overflow-wrap:anywhere}.msg.err{color:var(--danger)}.msg.ok{color:var(--success)}.msg.ok:before{content:"✓ "}#fatal:not(:empty):not([hidden]){margin-bottom:12px;padding:10px 12px;background:#cf3f5414;border:1px solid rgba(207,63,84,.3);border-radius:var(--radius-sm);text-align:left}:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px;border-radius:6px}@keyframes rise{0%{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}@media (max-width: 480px){main{padding:20px 14px}.card{padding:22px;border-radius:18px}#amount{font-size:20px}}@media (max-width: 360px){main{padding:16px 10px}.card{padding:18px 16px;border-radius:16px}.card h1,.card .title{font-size:17px;gap:8px;flex-wrap:wrap}#connect-btn,#unwrap-btn{padding:12px 14px;font-size:14px}.account-row{gap:4px 10px;padding:10px 12px}#account-id{font-size:12px}.link{font-size:12px;padding:2px 6px}.input-row{padding:4px 4px 4px 14px}#amount{font-size:18px;padding:10px 6px}.unit{padding:6px 10px;font-size:11px;letter-spacing:.06em}.hint,.msg{font-size:12px}}
