/* ==========================================================
   RET Forms — Mobile-first responsive launcher (same style)
   ========================================================== */

:root{
  --bg:#0e1416;
  --panel:rgba(255,255,255,.06);
  --panel-2:rgba(255,255,255,.09);
  --text:#f5f7f8;
  --muted:rgba(245,247,248,.7);
  --accent:#F3AA15;
  --radius:18px;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --ring:0 0 0 4px rgba(243,170,21,.28);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--text);

  /* Same "nice" background */
  background:
    radial-gradient(1200px 700px at 20% 10%, rgba(243,170,21,.18), transparent 55%),
    radial-gradient(900px 600px at 80% 20%, rgba(56,73,88,.35), transparent 55%),
    radial-gradient(1000px 700px at 50% 85%, rgba(18,26,28,.75), transparent 60%),
    var(--bg);

  padding: env(safe-area-inset-top) env(safe-area-inset-right)
           env(safe-area-inset-bottom) env(safe-area-inset-left);
}

a{color:inherit;text-decoration:none}
a:focus-visible{
  outline:none;
  box-shadow:var(--ring);
  border-radius:calc(var(--radius) + 6px);
}

.shell{
  min-height:100%;
  display:grid;
  place-items:center;
  padding:clamp(18px,4vw,34px);
}

.header{
  width:min(760px,100%);
  margin-bottom:18px;
}

.title{
  margin:0;
  font-size:clamp(26px,4.2vw,40px);
  letter-spacing:-.02em;
  line-height:1.15;
}

/* Grid */
.grid{
  width:min(760px,100%);
  display:grid;
  gap:14px;
  grid-template-columns:1fr; /* mobile-first */
}

@media (min-width:560px){
  .grid{grid-template-columns:repeat(2,1fr);}
}
@media (min-width:920px){
  .grid{grid-template-columns:repeat(3,1fr); width:min(980px,100%);}
}

/* Tiles */
.tile{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:center;

  padding:16px;
  border-radius:var(--radius);
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
  box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.10);
  -webkit-tap-highlight-color:transparent;

  transition:transform .12s ease, background .12s ease;
}

.tile:hover{transform:translateY(-2px);}
.tile:active{transform:translateY(0px) scale(.99);}

.tile__icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:rgba(243,170,21,.18);
  border:1px solid rgba(243,170,21,.30);
  font-size:20px;
}

.tile__text{
  font-weight:700;
  font-size:16px;
  line-height:1.2;
}

/* Install tip button */
.install{
  margin-top:22px;
  background:none;
  border:none;
  color:var(--muted);
  font-size:13px;
  text-decoration:underline;
  cursor:pointer;
}

.install--ready{
  color:var(--accent);
  font-weight:600;
  text-decoration:none;
}

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