@import "https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400..700;1,9..40,400..700&family=Outfit:wght@500;600;700&display=swap";:root{--bg:#070a0e;--bg-elevated:#0f1419;--bg-card:#121922;--border:#ffffff14;--text:#c4cdd6;--text-heading:#f2f5f8;--muted:#7d8a99;--accent:#22c55e;--accent-dim:#22c55e26;--accent-2:#eab308;--shadow:0 24px 80px #00000073;--radius:14px;--font-sans:"DM Sans", system-ui, sans-serif;--font-display:"Outfit", var(--font-sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:var(--font-sans);color:var(--text);background-color:var(--bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-size:17px;line-height:1.55}*,:before,:after{box-sizing:border-box}body{min-height:100svh;margin:0}#root{min-height:100svh}a{color:inherit}img{max-width:100%;height:auto;display:block}.landing{flex-direction:column;min-height:100svh;display:flex}.skip-link{z-index:100;background:var(--accent);color:#052e14;border-radius:0 0 var(--radius) 0;padding:.75rem 1rem;font-weight:600;position:absolute;top:0;left:-9999px}.skip-link:focus{outline:2px solid var(--text-heading);outline-offset:2px;left:0}.site-header{z-index:50;border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--bg) 88%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0}.site-header__inner{justify-content:space-between;align-items:center;gap:1rem;max-width:1120px;margin:0 auto;padding:.85rem 1.25rem;display:flex}.site-logo{align-items:center;text-decoration:none;display:inline-flex}.site-logo__image{object-fit:contain;width:78px;height:78px}.site-logo:hover{color:var(--accent)}.site-nav ul{flex-wrap:wrap;justify-content:flex-end;gap:.35rem 1.1rem;margin:0;padding:0;list-style:none;display:flex}.site-nav a{color:var(--muted);font-size:.9rem;text-decoration:none}.site-nav a:hover{color:var(--text-heading)}@media (width<=720px){.site-nav{display:none}}.container{width:100%;max-width:1120px;margin:0 auto;padding:0 1.25rem}.section{padding:clamp(3rem,6vw,5rem) 0}.section--alt{border-block:1px solid var(--border);background:linear-gradient(#ffffff05,#0000)}.section__title{font-family:var(--font-display);letter-spacing:-.03em;color:var(--text-heading);margin:0 0 .65rem;font-size:clamp(1.65rem,3vw,2.1rem);font-weight:700}.section__lead{color:var(--muted);max-width:42ch;margin:0 0 1.75rem}.section__split{align-items:start;gap:2.5rem;display:grid}@media (width>=900px){.section__split{grid-template-columns:1fr 1fr;gap:3rem}}.hero{padding:clamp(3.5rem,10vw,7rem) 1.25rem 4rem;position:relative;overflow:hidden}.hero__glow{pointer-events:none;background:radial-gradient(#22c55e33,#0000 60%);height:60%;position:absolute;inset:-20% 20% auto}.hero__grid{pointer-events:none;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:48px 48px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(70% 60% at 50% 0,#000,#0000);mask-image:radial-gradient(70% 60% at 50% 0,#000,#0000)}.hero__content{text-align:center;max-width:720px;margin:0 auto;position:relative}.hero__badge{letter-spacing:.04em;text-transform:uppercase;color:var(--accent-2);background:#eab3081f;border:1px solid #eab30840;border-radius:999px;margin:0 0 1rem;padding:.35rem .85rem;font-size:.78rem;font-weight:600;display:inline-block}.hero__title{font-family:var(--font-display);letter-spacing:-.035em;color:var(--text-heading);margin:0 0 1rem;font-size:clamp(2.1rem,5vw,3.25rem);font-weight:700;line-height:1.1}.hero__subtitle{max-width:48ch;color:var(--muted);margin:0 auto 2rem;font-size:1.05rem}.hero__actions{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.btn{font-family:var(--font-sans);cursor:pointer;border:none;border-radius:999px;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.35rem;font-size:.95rem;font-weight:600;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s,color .2s;display:inline-flex}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.btn--primary{color:#052e14;background:linear-gradient(135deg,#22c55e,#16a34a);box-shadow:0 8px 32px #22c55e59}.btn--primary:hover{transform:translateY(-2px);box-shadow:0 12px 40px #22c55e73}.btn--ghost{color:var(--text-heading);border:1px solid var(--border);background:0 0}.btn--ghost:hover{background:#ffffff0a;border-color:#fff3}.steps{flex-direction:column;gap:1.25rem;margin:0;padding:0;list-style:none;display:flex}.steps__item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);text-align:left;grid-template-columns:auto 1fr;gap:1rem;padding:1.1rem 1.2rem;display:grid}.steps__num{width:2rem;height:2rem;font-family:var(--font-display);color:var(--accent);background:var(--accent-dim);border-radius:10px;place-items:center;font-size:.95rem;font-weight:700;display:grid}.steps__title{font-family:var(--font-display);color:var(--text-heading);margin:0 0 .25rem;font-size:1.05rem}.steps__body{color:var(--muted);margin:0;font-size:.95rem}.video-panel__title{font-family:var(--font-display);color:var(--text-heading);text-align:left;margin:0 0 1rem;font-size:1.1rem}.how-section__split{align-items:center}.video-frame{border-radius:var(--radius);border:1px solid var(--border);aspect-ratio:16/9;box-shadow:var(--shadow);background:#000;position:relative;overflow:hidden}.video-frame iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.video-frame video{object-fit:cover;border:0;width:100%;height:100%;position:absolute;inset:0}.video-panel__hint{color:var(--muted);margin:.65rem 0 0;font-size:.83rem}.video-panel__empty{text-align:left;color:var(--muted);background:var(--bg-card);border:1px dashed var(--border);border-radius:var(--radius);margin:0;padding:1.25rem;font-size:.95rem;line-height:1.5}.meeting-card{background:var(--bg-card);border:1px solid var(--border);border-radius:calc(var(--radius) + 4px);box-shadow:var(--shadow);text-align:left;padding:clamp(1.5rem,4vw,2.25rem)}.meeting-card .section__title{margin-bottom:1rem}.meeting-card__title{font-family:var(--font-display);color:var(--text-heading);margin:0 0 .5rem;font-size:1.2rem;font-weight:600}.meeting-card__text{color:var(--muted);max-width:60ch;margin:0 0 1.25rem}.meeting-map-frame{border:1px solid var(--border);border-radius:var(--radius);aspect-ratio:16/9;background:#0b0f15;margin:0 0 1.25rem;overflow:hidden}.meeting-map-frame iframe{border:0;width:100%;height:100%}.meeting-card__cta{display:inline-flex}.join-grid{align-items:center;gap:2rem;display:grid}@media (width>=800px){.join-grid{grid-template-columns:1fr auto;gap:3rem}}.join-actions{flex-wrap:wrap;gap:.75rem;display:flex}.join-empty{color:var(--muted);max-width:48ch;margin:0;line-height:1.55}.qr-wrap{justify-self:center}.qr-box{border-radius:var(--radius);box-shadow:var(--shadow);background:#f4f6f8;padding:1rem}.qr-box--placeholder{width:232px;height:232px;font-family:var(--font-display);color:var(--muted);background:var(--bg-card);border:1px dashed var(--border);place-items:center;font-size:2rem;font-weight:700;display:grid}.flags-section__lead{margin-bottom:2rem}.flags-marquee{width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 8% 92%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0,#000 8% 92%,#0000 100%)}.flags-marquee__track{gap:1rem;width:max-content;padding:.25rem 1.25rem 1.25rem;animation:70s linear infinite flags-scroll;display:flex}.flags-marquee__track--reduced{animation:none}.flags-marquee__item{flex:none}.flag-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);text-align:center;width:148px;padding:1rem .75rem;transition:border-color .2s,transform .2s}.flag-card:hover{border-color:#22c55e59;transform:translateY(-3px)}.flag-card__img{object-fit:cover;aspect-ratio:4/3;border-radius:8px;width:100%;height:auto;margin:0 auto .65rem}.flag-card__name{color:var(--text-heading);margin:0;font-size:.82rem;font-weight:600;line-height:1.25}@keyframes flags-scroll{0%{transform:translate(0)}to{transform:translate(calc(-50% - .5rem))}}.groups-grid{grid-template-columns:1fr;align-items:stretch;gap:1rem;display:grid}@media (width>=700px){.groups-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1080px){.groups-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.group-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:1rem;height:100%;padding:1rem;display:flex}.group-card__head{justify-content:space-between;align-items:baseline;gap:.75rem;display:flex}.group-card__head h3{color:var(--text-heading);font-family:var(--font-display);margin:0}.group-card__head span{color:var(--muted);font-size:.78rem}.group-card__table{border:1px solid var(--border);border-radius:10px;overflow:hidden}.group-card__table-head,.group-card__standings li{grid-template-columns:minmax(0,1fr) 28px 28px 32px;align-items:center;gap:.5rem;padding:.45rem .6rem;display:grid}.group-card__table-head{border-bottom:1px solid var(--border);color:var(--muted);text-transform:uppercase;letter-spacing:.03em;background:#ffffff05;font-size:.72rem}.group-card__standings{margin:0;padding:0;list-style:none}.group-card__standings li{color:var(--text-heading);border-bottom:1px solid var(--border);font-size:.85rem}.group-card__standings li:last-child{border-bottom:none}.group-card__standings li span:not(:first-child),.group-card__table-head span:not(:first-child){text-align:center}.team-name{min-width:0}.team-name--with-flag{align-items:center;gap:.45rem;display:inline-flex}.team-flag{object-fit:cover;border:1px solid #ffffff4d;border-radius:50%;flex-shrink:0;width:18px;height:18px}.group-card .btn{margin-top:auto}.groups-source-link{color:var(--accent);margin:-.25rem 0 1.2rem;font-size:.9rem;text-decoration:none;display:inline-flex}.groups-source-link:hover{text-decoration:underline}.groups-title-row{align-items:center;gap:.7rem;margin-bottom:.45rem;display:flex}.groups-title-row .section__title{margin:0}.groups-title-logo{object-fit:contain;filter:drop-shadow(0 8px 12px #0000004d);width:46px;height:auto}.group-modal-backdrop{z-index:120;background:#0000009e;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.group-modal{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);width:min(760px,100%);max-height:92vh;box-shadow:var(--shadow);overflow:auto}.group-modal__header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.2rem;display:flex}.group-modal__header h3{color:var(--text-heading);font-family:var(--font-display);margin:0}.group-modal__close{border:1px solid var(--border);color:var(--text-heading);cursor:pointer;background:0 0;border-radius:8px;width:36px;height:36px}.group-modal__body{padding:1rem 1.2rem 1.2rem;display:block}.group-modal__body h4{color:var(--text-heading);font-family:var(--font-display);margin:0 0 .8rem}.group-matches{grid-template-columns:1fr;gap:.65rem;margin:0;padding:0;list-style:none;display:grid}@media (width>=720px){.group-matches{grid-template-columns:repeat(2,minmax(0,1fr))}}.match-legend{flex-wrap:wrap;align-items:center;gap:.6rem;margin:-.2rem 0 .75rem;display:flex}.match-legend__item{display:inline-flex}.group-matches li,.group-matches li{border:1px solid var(--border);background:var(--bg-card);border-radius:10px;flex-direction:column;gap:.2rem;padding:.75rem .85rem;display:flex}.group-matches li strong,.group-matches li span:first-child{color:var(--text-heading)}.group-matches li span,.group-matches li span:last-child{color:var(--muted);font-size:.88rem}.group-match__watch-link{color:var(--accent);margin-top:.25rem;font-size:.84rem;font-weight:600;text-decoration:none}.group-match__watch-link:hover{text-decoration:underline}.group-match__teams{font-weight:600}.match-teams{flex-wrap:wrap;align-items:center;gap:.55rem;display:inline-flex}.match-teams__vs{color:var(--muted);font-weight:700}.match-chip{border:1px solid var(--border);border-radius:999px;align-items:center;padding:.18rem .5rem;display:inline-flex}.match-chip--home{background:#22c55e1f;border-color:#22c55e52}.match-chip--away{background:#3b82f61f;border-color:#3b82f64d}.match-chip .team-name{align-items:center;gap:.4rem;display:inline-flex}.group-match__teams .team-flag{width:16px;height:16px}.site-footer{border-top:1px solid var(--border);background:var(--bg-elevated);margin-top:auto;padding:2rem 0}.site-footer__inner{text-align:center;color:var(--muted);font-size:.88rem}.site-footer__inner p{margin:0 0 .5rem}.site-footer__muted{opacity:.85}main{flex:1}
