/* ===== base.css — переменные, reset, оболочка .device ===== */

:root {
    --bg: #05060F;
    --accent-1: #7C5CFC;
    --accent-2: #2E6BFF;
    --accent-cyan: #22D3EE;
    --accent-neon: #00FFA3;
    --text-primary: #EAF3FF;
    --text-muted: #7C8AA8;
    --surface: rgba(255,255,255,0.06);
    --surface-border: rgba(255,255,255,0.12);
  }

* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color: transparent; }

html,body { height:100%; }

body {
    background: var(--bg);
    color: var(--text-primary);
    font-family:'Chakra Petch', sans-serif;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }

.device {
    width:100%;
    height:100dvh;
    height:var(--app-height, 100dvh);
    max-width:480px;
    margin:0 auto;
    position:relative;
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }

.device::before {
    content:"";
    position:absolute; inset:0;
    background:
      radial-gradient(ellipse 420px 320px at 50% -6%, rgba(124,92,252,0.35), transparent 60%),
      radial-gradient(ellipse 360px 300px at 100% 30%, rgba(46,107,255,0.16), transparent 55%),
      radial-gradient(ellipse 420px 340px at 0% 85%, rgba(0,255,163,0.08), transparent 55%);
    pointer-events:none;
    z-index:0;
  }