:root{
  --bg:#f4fffe;
  --term:#daeceb;
  --card: rgba(186,230,243,.88);
  --cardBorder: rgba(255,255,255,.7);
  --shadow: 0 30px 80px rgba(0,0,0,.25);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg)}
a{color:#064b52;text-decoration:none}
a:hover{text-decoration:underline}

/* ===== Dense animated legal terms background ===== */
.bg-terms{position:fixed;inset:0;overflow:hidden;background:var(--bg);z-index:0}
.row{position:absolute;white-space:nowrap;display:flex;gap:56px;color:var(--term);font-weight:900;letter-spacing:.6px;opacity:.95;mix-blend-mode:normal}
.row .track{display:inline-block;padding-right:56px;animation:slideRight 38s linear infinite}
.row.slow  .track{animation-duration:48s}
.row.slower .track{animation-duration:62s}
.row.fast  .track{animation-duration:28s}
.row.vfast .track{animation-duration:22s}
.row.xslow .track{animation-duration:76s}

.row.tiny  span{font-size:22px}
.row.small span{font-size:28px}
.row.base  span{font-size:36px}
.row.large span{font-size:46px}

@keyframes slideRight{0%{transform:translateX(-60%)}100%{transform:translateX(0%)}}

/* staggered vertical positions (non-equidistant) */
.row.r1{top:7%} .row.r2{top:18%} .row.r3{top:26%} .row.r4{top:38%}
.row.r5{top:47%} .row.r6{top:57%} .row.r7{top:68%} .row.r8{top:78%}

/* ===== Card unchanged ===== */
.page{position:relative;min-height:100%;display:grid;place-items:center}
.card{position:relative;z-index:1;width:min(680px,92vw);border-radius:26px;background:linear-gradient(180deg, var(--card), rgba(186,230,243,.78));backdrop-filter: blur(7px);padding:38px 44px;border:4px solid var(--cardBorder);box-shadow:var(--shadow)}
.logo-wrap{display:grid;place-items:center;margin-top:-12px;margin-bottom:6px}
.logo{width:84px;height:84px;border-radius:22px;background:url('assets/logo_glow.png') center/cover no-repeat, radial-gradient(circle at 50% 50%, #fff, #e9f7fb);border:5px solid rgba(255,255,255,.85);box-shadow:0 12px 30px rgba(0,0,0,.22), 0 0 0 10px rgba(255,255,255,.12) inset}
.h1{text-align:center;color:#063b41;font-weight:900;font-size:40px;margin:10px 0 24px}
.label{color:#05383e;font-weight:700;margin:10px 0 6px;display:block}
.input{width:100%;padding:14px 16px;border:none;border-radius:14px;background:#fff;box-shadow:inset 0 2px 8px rgba(0,0,0,.08);font-size:16px}
.rowc{margin:8px 0 14px}
.actions{display:flex;justify-content:space-between;align-items:center;margin-top:10px}
.btn{appearance:none;border:none;cursor:pointer;padding:14px 18px;border-radius:14px;background:#7bd0dc;color:#05313a;font-weight:900;letter-spacing:.3px;box-shadow:0 16px 40px rgba(0,0,0,.18)}
.btn:hover{transform:translateY(-1px)}
.small{color:#0a5560;font-size:13px}