:root{
    --bg:#000; --panel:#0E0F0D; --panel-2:#15160F;
    --accent:#F5E642; --accent-deep:#E4D11A;
    --line:rgba(255,255,255,.10); --line-2:rgba(255,255,255,.07);
    --txt:#fff; --muted:rgba(255,255,255,.58); --faint:rgba(255,255,255,.4);
    --sans:'Sora',system-ui,sans-serif; --mono:'JetBrains Mono',monospace;
    --ease:cubic-bezier(.22,.61,.36,1);
  }
  *{box-sizing:border-box;}
  body{ margin:0; min-height:100vh; background:
      radial-gradient(120% 80% at 50% 0%, rgba(245,230,66,.07) 0%, transparent 50%),
      var(--bg);
    color:var(--txt); font-family:var(--sans); -webkit-font-smoothing:antialiased;
    -webkit-text-size-adjust:100%; display:flex; flex-direction:column; align-items:center;
    justify-content:center; padding:48px 22px; }
  a{ text-decoration:none; color:inherit; }
  :focus-visible{ outline:3px solid #5b8cff; outline-offset:3px; border-radius:10px; }

  .stage{ width:100%; max-width:680px; display:flex; flex-direction:column; align-items:center; }

  .logo{ width:232px; max-width:64vw; height:auto; display:block; }
  .welcome{ color:var(--muted); font-size:.92rem; margin:18px 0 26px; text-align:center; }

  /* ===== LAUNCHER (primary login path — kept bright + unobstructed) ===== */
  .launcher{ width:100%; max-width:430px; background:var(--panel); border:1px solid var(--line);
    border-radius:22px; padding:16px; display:flex; flex-direction:column; gap:12px;
    box-shadow:0 30px 70px -30px rgba(0,0,0,.9); }
  .tool{ position:relative; display:flex; align-items:center; justify-content:center; gap:10px;
    background:#fff; color:#111; font-weight:700; font-size:1.04rem; padding:18px 22px; border-radius:999px;
    transition:transform .15s var(--ease), box-shadow .2s; }
  .tool:hover{ transform:translateY(-2px); box-shadow:0 14px 30px -12px rgba(255,255,255,.35); color: #111 !important; }
  .tool .ico{ width:19px; height:19px; color:#111; }

  /* ===== gentle product showcase ===== */
  .feat{ width:100%; margin-top:40px; }
  .feat-head{ display:flex; align-items:center; gap:14px; margin-bottom:18px; }
  .feat-head::before, .feat-head::after{ content:""; flex:1; height:1px; background:var(--line-2); }
  .feat-head span{ font-family:var(--mono); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--faint); white-space:nowrap; }

  .push-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  @media(max-width:600px){ .push-grid{ grid-template-columns:1fr; } }
  .push{ position:relative; background:linear-gradient(160deg, var(--panel-2), var(--panel));
    border:1px solid var(--line); border-radius:18px; padding:20px; overflow:hidden;
    transition:border-color .25s, transform .2s, box-shadow .25s; }
  .push::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
    background:linear-gradient(180deg, var(--accent), var(--accent-deep)); }
  .push:hover{ border-color:rgba(245,230,66,.45); transform:translateY(-3px);
    box-shadow:0 22px 46px -26px rgba(245,230,66,.4); color: inherit; }
  .push .tag{ font-family:var(--mono); font-size:.56rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
    color:var(--accent); margin-bottom:12px; display:inline-block; }
  .push .ic{ width:30px; height:30px; border-radius:9px; background:rgba(245,230,66,.13);
    display:grid; place-items:center; color:var(--accent); margin-bottom:12px; }
  .push .ic svg{ width:17px; height:17px; }
  .push h3{ font-size:1.06rem; font-weight:700; margin:0 0 6px; }
  .push p{ font-size:.85rem; color:var(--muted); line-height:1.5; margin:0 0 14px; }
  .push .go{ font-size:.82rem; font-weight:700; color:var(--accent); display:inline-flex; align-items:center; gap:6px; }
  .push .go svg{ width:14px; height:14px; transition:transform .2s; }
  .push:hover .go svg{ transform:translateX(3px); }

  .new-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
  @media(max-width:600px){ .new-grid{ grid-template-columns:1fr; } }
  .nw{ display:flex; gap:13px; align-items:flex-start; background:var(--panel); border:1px solid var(--line-2);
    border-radius:16px; padding:16px; transition:border-color .25s, transform .2s; }
  .nw:hover{ border-color:var(--line); transform:translateY(-2px); color: inherit; }
  .nw .ic{ width:34px; height:34px; border-radius:9px; background:rgba(255,255,255,.06); display:grid; place-items:center;
    color:var(--txt); flex-shrink:0; }
  .nw .ic svg{ width:18px; height:18px; }
  .nw .body{ min-width:0; }
  .nw .row{ display:flex; align-items:center; gap:8px; }
  .nw h4{ font-size:.95rem; font-weight:700; margin:0; }
  .nw .badge{ font-family:var(--mono); font-size:.52rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
    color:#111; background:var(--accent); padding:2px 6px; border-radius:5px; }
  .nw p{ font-size:.8rem; color:var(--muted); line-height:1.45; margin:5px 0 0; }

  .foot{ margin-top:30px; text-align:center; font-size:.8rem; color:var(--faint); }
  .foot a{ color:var(--muted); font-weight:600; border-bottom:1px solid var(--line); padding-bottom:1px; }
  .foot a:hover{ color:var(--txt); }

  @media(prefers-reduced-motion:reduce){ *{transition:none!important;} }