/* edgematic.com coming-soon page (app/templates/landing.html). Fonts: /static/css/fonts.css (self-hosted, OFL).
   Same tokens as the v6 app (theme.css): plane, glass window, neon-blue bias, cyan last-price line, green particle field. */
:root{
  --plane:#040810; --surface:rgba(13,12,30,0.44); --surface-2:rgba(20,16,44,0.52);
  --ink:#e6edf6; --ink-2:#9fb0c3; --muted:#6a7f94; --line:#1b2740;
  --bias:#00b3ff; --bias-glow:rgba(0,179,255,0.42); --bias-soft:rgba(0,179,255,0.09); --bias-line:rgba(0,179,255,0.22);
  --cyan:#25e2ff; --cyan-glow:rgba(37,226,255,0.5); --green:#00ff88; --red:#ff3355;
  --f-head:'Orbitron','Chakra Petch','Courier New',monospace;
  --f-ui:'Chakra Petch','Courier New',monospace;
  --f-num:'Rajdhani','Chakra Petch',monospace;
  --f-mono:'Courier New',Courier,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:radial-gradient(1200px 600px at 20% -10%,var(--bias-soft),transparent 60%),var(--plane);
  color:var(--ink);font-family:var(--f-ui);font-weight:600;font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased;overflow:hidden}
button,input{font:inherit;color:inherit}
#bg{position:fixed;inset:0;z-index:0;opacity:.45;pointer-events:none}

.page{position:relative;z-index:2;height:100%;display:grid;grid-template-columns:minmax(0,1fr);
  padding:max(28px,env(safe-area-inset-top)) 0 max(28px,env(safe-area-inset-bottom)) 0}
.left{display:flex;flex-direction:column;justify-content:center;padding:0 clamp(28px,7vw,120px);min-width:0}

.logo{font-family:var(--f-mono);font-weight:400;text-transform:uppercase;color:rgba(255,255,255,.22);white-space:nowrap;
  font-size:clamp(26px,4.4vw,54px);letter-spacing:.36em;margin-right:-.36em}
.logo span{color:var(--bias);text-shadow:0 0 18px var(--bias-glow)}
.soon{margin-top:22px;font-family:var(--f-head);font-weight:800;font-size:12px;letter-spacing:.42em;text-transform:uppercase;
  color:var(--bias);text-shadow:0 0 8px var(--bias-glow);display:flex;align-items:center;gap:12px}
.soon i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}

/* glass window = companion .card */
.win{margin-top:40px;width:min(460px,100%);background:var(--surface);border:1px solid var(--bias-line);border-radius:10px;padding:20px 22px 18px;
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  box-shadow:0 0 24px color-mix(in srgb,var(--bias) 5%,transparent) inset,0 8px 30px rgba(0,0,0,.3)}
.win h2{font-family:var(--f-head);font-size:11px;text-transform:uppercase;letter-spacing:.18em;color:var(--bias);font-weight:800;
  text-shadow:0 0 8px var(--bias-glow);margin-bottom:14px}
.row{display:flex;gap:10px}
.in{flex:1;min-width:0;height:44px;border-radius:7px;border:1px solid var(--line);background:rgba(4,8,16,.6);padding:0 14px;font-size:15px;
  outline:none;transition:border-color .15s,box-shadow .15s}
.in::placeholder{color:var(--muted);font-weight:400}
.in:focus{border-color:var(--bias);box-shadow:0 0 0 3px var(--bias-soft)}
.in.bad{border-color:var(--red);box-shadow:0 0 0 3px rgba(255,51,85,.12)}
/* glass button, no gradient: tinted fill + neon rim, like the app's primary action */
.btn{height:44px;padding:0 20px;border-radius:7px;border:1px solid color-mix(in srgb,var(--bias) 55%,transparent);
  background:color-mix(in srgb,var(--bias) 14%,transparent);color:#dff4ff;font-family:var(--f-head);font-size:11px;font-weight:800;
  letter-spacing:.18em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:background .15s,box-shadow .15s}
.btn:hover{background:color-mix(in srgb,var(--bias) 22%,transparent);box-shadow:0 0 18px var(--bias-glow)}
.btn:disabled{opacity:.55;cursor:default;box-shadow:none}
.msg{min-height:20px;margin-top:10px;font-size:12px;font-weight:400;color:var(--muted)}
.msg.err{color:var(--red)}
.done{display:none;align-items:center;gap:12px;height:44px;font-size:15px}
.done b{color:var(--green);text-shadow:0 0 10px rgba(0,255,136,.4)}
.win.ok .row{display:none}.win.ok .done{display:flex}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

.foot{position:fixed;z-index:2;left:clamp(28px,7vw,120px);bottom:max(22px,env(safe-area-inset-bottom));font-size:11px;font-weight:400;color:var(--muted);letter-spacing:.06em}
.foot a{color:var(--ink-2);text-decoration:none}.foot a:hover{color:var(--cyan)}


@media (max-width:760px){
  .left{padding:0 22px 0 24px}
  .logo{font-size:clamp(20px,7.4vw,34px);letter-spacing:.28em;margin-right:-.28em}
  .soon{font-size:10.5px;letter-spacing:.34em}
  .win{margin-top:30px;padding:18px 16px 14px}
  .row{flex-direction:column}
  .in{flex:none;height:46px;font-size:16px}   /* column flex: flex:1 would collapse the input; 16px stops iOS zoom-on-focus */
  .btn{height:46px}
  .btn{width:100%}
  .foot{left:24px}
}
@media (max-height:520px){.win{margin-top:22px}.soon{margin-top:14px}}
@media (prefers-reduced-motion:reduce){.soon i{animation:none}}