/* App navigation preserves the existing green / warm league-card palette. */
:root{--app-nav-space:calc(88px + env(safe-area-inset-bottom,0px));--app-nav-obstruction:0px;--app-shell-green:#126a43;--app-shell-line:#c8ded3}
body.webapp-shell{padding-top:env(safe-area-inset-top,0px)}
.home-preview a.match-card{text-decoration:none}
.home-preview a.match-card:focus-visible{outline:3px solid #126a43;outline-offset:-4px}
.app-nav{display:flex;align-items:center;gap:6px;max-width:960px;margin:0 auto 18px;padding:6px;border:1px solid var(--app-shell-line);background:#fff;border-radius:16px;box-shadow:0 4px 16px #173d390b}
.app-nav>a,.app-nav>button{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;flex:1;min-width:0;padding:9px 13px;border:0;border-radius:11px;background:transparent;color:#426b59;font:inherit;font-size:14px;font-weight:500;line-height:1.3;text-decoration:none;cursor:pointer;touch-action:manipulation;white-space:nowrap}
.app-nav svg{width:23px;height:23px;flex:none}
.app-nav>a:hover,.app-nav>button:hover{background:#edf5f0;color:#0d5938}
.app-nav .is-active{background:var(--app-shell-green);color:#fff;box-shadow:0 3px 8px #126a432b}
.app-nav .is-active:hover{background:#105d3b;color:#fff}
.app-nav .app-community{flex:1.55;border:1px solid #e5a94a;background:linear-gradient(135deg,#ffedb7,#ffc56d);color:#713b16;box-shadow:0 4px 13px #be782529;font-weight:500}
.app-nav .app-community:hover{background:linear-gradient(135deg,#ffe7a0,#ffba51);color:#622f0f}
.app-nav .app-community[hidden]{display:none}
.app-community-emoji{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:32px;font-family:system-ui,sans-serif;font-size:28px;line-height:1;transform-origin:50% 80%;animation:community-wiggle 5.5s ease-in-out infinite}
.app-community-emoji>span{position:absolute;right:-4px;bottom:-1px;font-size:19px;transform:rotate(9deg)}
.app-community-label{position:relative;white-space:nowrap}
@keyframes community-wiggle{0%,70%,100%{transform:translateY(0) rotate(0)}74%{transform:translateY(-3px) rotate(-9deg)}78%{transform:translateY(-2px) rotate(8deg)}82%{transform:translateY(-3px) rotate(-6deg)}86%{transform:translateY(0) rotate(4deg)}90%{transform:translateY(0) rotate(0)}}
.app-nav a:focus-visible,.app-nav button:focus-visible,.app-install-dialog button:focus-visible,.app-update-notice button:focus-visible,.app-network-notice button:focus-visible{outline:3px solid #4aa889;outline-offset:3px}
.app-live-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;margin-left:5px;padding:0 4px;border-radius:99px;background:#c82431;color:#fff;font-size:10px;font-variant-numeric:tabular-nums}
.app-live-count[hidden],.app-network-notice[hidden],.app-update-notice[hidden],.app-install-primary[hidden]{display:none}
.app-network-notice{display:flex;align-items:center;justify-content:space-between;gap:10px;max-width:960px;margin:0 auto 14px;padding:11px 14px;border:1px solid #dec18b;border-radius:12px;background:#fff7e4;color:#75531a;font-size:13px;line-height:1.6}
.app-network-notice button{flex:none;min-height:40px;border:1px solid #d7b777;border-radius:9px;padding:7px 10px;background:#fff;color:#76511a;font:inherit;cursor:pointer}
.app-update-notice{position:fixed;z-index:25;right:20px;bottom:20px;max-width:min(460px,calc(100% - 32px));display:flex;align-items:center;gap:12px;padding:12px 15px;border:1px solid #bdd7c9;border-radius:16px;background:#fff;color:#234d3c;box-shadow:0 8px 28px #173d3929;font-size:13px;line-height:1.5}
.app-update-notice button{min-height:44px;flex:none;padding:8px 15px;border:0;border-radius:10px;background:var(--app-shell-green);color:#fff;font:inherit;font-weight:500;cursor:pointer}
.app-update-notice button:disabled{opacity:.55;cursor:wait}
.app-overlay-open .app-nav,.app-overlay-open .app-update-notice{visibility:hidden;pointer-events:none}
.app-install-dialog{box-sizing:border-box;width:min(500px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:24px;border:1px solid #c4dacf;border-radius:25px;background:#fff;color:#173e32;overflow:auto;font:inherit;line-height:1.75;box-shadow:0 20px 70px #12382b35}
.app-install-dialog::backdrop{background:#102b2966;backdrop-filter:blur(5px)}
.app-install-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.app-install-eyebrow{display:block;color:#126a43;font-size:12px;letter-spacing:.5px;font-weight:500}
.app-install-header h2{margin:3px 0 0;color:#16372d;font-size:25px;font-weight:500;line-height:1.5}
.app-install-close{display:grid;place-items:center;flex:none;width:44px;height:44px;border:1px solid #cde0d5;border-radius:50%;background:#f0f7f3;color:#315d48;font:inherit;font-size:28px;line-height:1;cursor:pointer}
.app-install-brand{display:flex;align-items:center;gap:15px;margin:19px 0;padding:14px 17px;border:1px solid #d4e7db;border-radius:17px;background:linear-gradient(120deg,#edf6f0,#f8fbf9)}
.app-install-brand img{width:112px;height:76px;object-fit:cover;flex:none}
.app-install-brand span{font-size:16px;font-weight:500;color:#24583e;line-height:1.8}
.app-install-content h3{margin:0 0 8px;font-size:19px;font-weight:500;line-height:1.6}
.app-install-content p{margin:8px 0;font-size:15px;color:#64786e;line-height:1.8}
.app-install-steps{display:grid;gap:10px;counter-reset:install-step;margin:18px 0;padding:0;list-style:none}
.app-install-steps li{position:relative;counter-increment:install-step;min-height:47px;padding:12px 12px 12px 47px;border:1px solid #dae7df;border-radius:12px;background:#f7faf8;font-size:14px;line-height:1.7}
.app-install-steps li::before{content:counter(install-step);position:absolute;left:12px;top:12px;display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:#d9eee1;color:#126a43;font-size:13px;font-weight:500}
.app-install-content .app-install-hint{font-size:12px;color:#788b80}
.app-install-primary{width:100%;min-height:50px;margin-top:16px;padding:12px 15px;border:0;border-radius:13px;background:var(--app-shell-green);color:#fff;font:inherit;font-size:16px;font-weight:500;cursor:pointer;box-shadow:0 4px 12px #126a4320}
.app-install-primary:disabled{opacity:.55;cursor:wait}
.app-installed .app-nav [data-app-nav="install"] svg{color:#126a43}
.seo-fixtures{padding:4px 0 0}.seo-fixtures .seo-data-time{margin:0 0 12px;color:#62766c;font-size:12px;line-height:1.7}.seo-fixtures ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}.seo-fixtures li{display:flex;flex-direction:column;gap:5px;padding:12px 14px;border:1px solid #c9dacf;border-radius:12px;background:#fff;line-height:1.7}.seo-fixtures li a{color:#164d36;font-size:15px;font-weight:500;text-decoration:none;overflow-wrap:anywhere}.seo-fixtures li a:hover{text-decoration:underline;text-underline-offset:4px}.seo-fixtures li span{font-size:12px;color:#697d72}.seo-fixtures li a:focus-visible,.seo-summary a:focus-visible{outline:3px solid #4aa889;outline-offset:3px;border-radius:3px}
.seo-summary{max-width:960px;margin:22px auto 0;padding:20px 23px;border:1px solid #d2e1d8;border-radius:18px;background:#f9fcfa;color:#62776a;font-size:14px;line-height:1.9}.seo-summary h2{margin:0 0 11px;font-size:21px;font-weight:500;line-height:1.7;color:#264e3c}.seo-summary p{margin:9px 0}.seo-summary ul{margin:12px 0;padding-left:22px}.seo-summary li{margin:5px 0}.seo-summary a{color:#126a43;text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}.seo-match-heading{position:relative;margin:4px 0 13px;color:#fff;font-size:clamp(22px,4.5vw,32px);font-weight:500;line-height:1.6;text-align:center;overflow-wrap:anywhere}.hero:has(.seo-match-heading)>p{text-align:center;color:#c7ddd4;font-size:14px;position:relative}
@media(min-width:761px){.home-preview .app-nav{margin-bottom:20px}.webapp-shell .topbar+.app-nav,.webapp-shell .topbar+.app-nav+.app-network-notice{width:calc(100% - 48px)}}
@media(max-width:760px){
  html{scroll-padding-bottom:var(--app-nav-space)}
  body.webapp-shell:not(.account-body){padding-bottom:var(--app-nav-space)}
  .app-nav{position:fixed;z-index:20;inset:auto 0 0;max-width:none;margin:0;padding:5px max(7px,env(safe-area-inset-right,0px)) max(5px,env(safe-area-inset-bottom,0px)) max(7px,env(safe-area-inset-left,0px));gap:3px;border:0;border-top:1px solid #a9ccba;border-radius:20px 20px 0 0;background:#fffffffa;box-shadow:0 -5px 23px #173d391a;backdrop-filter:blur(12px)}
  .app-nav>a,.app-nav>button{min-height:62px;padding:7px 3px;flex-direction:column;gap:5px;border-radius:13px;font-size:12px;line-height:1.3}
  .app-nav svg{width:24px;height:24px}
  .app-nav .app-community{flex:1.7;min-height:68px;gap:3px;padding:5px 4px;border-radius:18px;transform:translateY(-6px)}
  .app-community-emoji{width:36px;height:32px;font-size:29px}
  .app-community-label{font-size:12px;line-height:1.45}
  .app-nav .is-active{background:#e2f2e8;color:#0f6540;box-shadow:none}
  .app-nav .is-active:hover{background:#d5ebde;color:#0f6540}
  .app-live-count{position:absolute;top:5px;right:calc(50% - 27px);margin-left:0}
  .app-network-notice{margin:0 12px 14px;font-size:12px;padding:10px 12px}
  body.webapp-shell .floating-tools{bottom:calc(var(--app-nav-obstruction,72px) + 12px)}
  .app-update-notice{left:12px;right:12px;bottom:calc(var(--app-nav-obstruction,72px) + 12px);max-width:none;padding:11px 12px;font-size:12px}
  .app-install-dialog{width:100%;max-height:calc(100dvh - env(safe-area-inset-top,0px));margin:0;inset:auto 0 0;max-width:100%;border-radius:25px 25px 0 0;padding:22px 20px max(22px,env(safe-area-inset-bottom,0px));border-bottom:0}
  .app-install-header h2{font-size:23px}
  .app-install-brand{padding:12px 14px;margin:17px 0}
  .app-install-content h3{font-size:18px}
  .seo-summary{margin-top:18px;padding:17px 16px;font-size:13px}.seo-summary h2{font-size:19px}.seo-fixtures li{padding:11px 12px}.seo-fixtures li a{font-size:14px}
}
@media(max-width:640px){
  .webapp-shell .topbar .preview-label{display:none}
  .webapp-shell .site-header .member-link,.webapp-shell .topbar .member-link{max-width:84px;min-height:44px;padding:8px 10px;font-size:12px;line-height:1.5;text-align:center;flex-shrink:0}
  .home-preview.webapp-shell .site-header>div{min-width:0}
  .home-preview.webapp-shell .site-header h1{white-space:nowrap}
  .home-preview.webapp-shell .site-header .eyebrow{white-space:nowrap;font-size:10px;letter-spacing:0}
}
@media(max-width:360px){.app-nav>a,.app-nav>button{font-size:11px}.app-install-dialog{padding-left:17px;padding-right:17px}.app-install-brand{gap:10px}.app-install-brand span{font-size:14px}}
@media(prefers-reduced-motion:reduce){.app-nav,.app-nav>a,.app-nav>button,.app-install-dialog,.app-update-notice{scroll-behavior:auto;transition:none;animation:none}}
@media(prefers-reduced-motion:reduce){.app-community-emoji{animation:none}}