/* v5.12.0 (Colin): on wide screens the logo is sized from the height (154% of it, shifted right by 2.2% of its width — Colin, 24 Oct)
   so it isn't enormous; upright phones keep the app's 1.64 × the width. */
/* ppsapps.com – PhraseAlert's glass look (v5.12.0 step 1, Colin): the app's ground colours, the
   big blurred PA logo behind everything (Theme.Glass: 1.64 × the width, blur 26, P and A centred,
   a little below centre; dark brightness 30% + green-black shade 20%; light 62%, no shade),
   and see-through cards (dark 45%, light 44%). */
:root { --ground:#ECF6EF; --card:rgba(255,255,255,.44); --text:#0B2416; --soft:#4A6656;
  --brand:#248A3D; --line:rgba(11,36,22,.10); --logo:.62; --shade:0; }
@media (prefers-color-scheme: dark) {
  :root { --ground:#03130A; --card:rgba(28,28,30,.45); --text:#F2F7F3; --soft:#9DB8A8;
    --brand:#30D158; --line:rgba(255,255,255,.10); --logo:.23; --shade:.2; }
}
/* v6.1.0 step 6 (Colin, 1 Nov): EventAlert-themed pages (html.ea): the app's blue #4E8DFF, blue-black /
   pale-blue grounds (#03081A / #ECF1F8), the calendar-E logo kept centred (no shift, no drop). */
html.ea { --ground:#ECF1F8; --card:rgba(255,255,255,.44); --text:#0B1626; --soft:#4A5B74;
  --brand:#2F74E0; --line:rgba(11,22,38,.10); --logo:.62; --shade:0; }
@media (prefers-color-scheme: dark) {
  html.ea { --ground:#03081A; --card:rgba(28,28,30,.45); --text:#F2F5FA; --soft:#9DAEC8;
    --brand:#4E8DFF; --line:rgba(255,255,255,.10); --logo:.23; --shade:.2; }
}
html.ea .glass-bg::after { background:rgb(0,6,20); }
html.ea .glass-bg img { transform:translate(-50%,-50%); }
/* The PPS Apps front page: two tiles, one per app (v6.1.0 step 6). */
html.pps { --ground:#F2F3F5; --text:#111; --soft:#5A6068; --brand:#333; --line:rgba(0,0,0,.08); --card:rgba(255,255,255,.7); }
@media (prefers-color-scheme: dark) { html.pps { --ground:#0C0D10; --text:#F2F2F5; --soft:#A0A6B0; --brand:#DDD; --line:rgba(255,255,255,.1); --card:rgba(28,28,30,.7); } }
.tiles { display:grid; gap:16px; grid-template-columns:1fr; } @media (min-width:600px) { .tiles { grid-template-columns:1fr 1fr; } }
.tile { display:block; text-decoration:none; color:inherit; text-align:center; padding:28px 20px; }
.tile img { width:min(180px,50vw); height:auto; } .tile h2 { margin:14px 0 4px; font-size:26px; } .tile .tag { font-weight:600; }
.tile.pa { --tileBrand:#248A3D; } .tile.ea { --tileBrand:#2F74E0; }
@media (prefers-color-scheme: dark) { .tile.pa { --tileBrand:#30D158; } .tile.ea { --tileBrand:#4E8DFF; } }
.tile .tag { color:var(--tileBrand); }
* { box-sizing:border-box; }
html { background:var(--ground); }
body { margin:0; font:17px/1.55 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--text); background:transparent; min-height:100vh; }
.glass-bg { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; background:var(--ground); }
.glass-bg img { position:absolute; width:min(164vw, 154vh); height:auto; left:50%; top:50%;
  transform:translate(calc(-50% + 0.022 * min(164vw, 154vh)), calc(-50% + 30px)); max-width:none; -webkit-filter:blur(26px);
  filter:blur(26px); opacity:var(--logo); }
.glass-bg::after { content:""; position:absolute; inset:0; background:rgb(0,20,8); opacity:var(--shade); }
main { max-width:720px; margin:0 auto; padding:28px 16px 24px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:24px; margin:16px 0;
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); }
h1 { font-size:34px; line-height:1.15; margin:0 0 8px; } h2 { font-size:21px; margin:24px 0 6px; }
.brand { color:var(--brand); } .soft { color:var(--soft); }
.logo { display:flex; align-items:center; gap:10px; font-weight:700; font-size:26px; letter-spacing:-.3px;
  text-decoration:none; color:var(--text); }
.logo img { width:56px; height:auto; }
.hero { text-align:center; margin:28px 0 8px; }
.hero img { width:min(220px,55vw); height:auto; }
.center { text-align:center; } .big { font-size:24px; font-weight:600; }
a { color:var(--brand); }
footer { max-width:720px; margin:0 auto; padding:8px 16px 40px; font-size:14px; color:var(--soft); }
footer .legal { font-size:12px; }   /* v5.16.0: company line (Colin, 28 Oct) */