:root{--navy: #222552;--gold: #ebc574;--light-gray: #f5f5f5;--border: #ddd;--text: #333;--ua-green: #007A33;--ua-dark-green: #275D38;--ua-gold: #F2CD00}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--light-gray);color:var(--text);line-height:1.6;overflow-x:hidden}header{background-color:var(--ua-green);color:#fff;padding:20px;text-align:center;position:sticky;top:0;z-index:100}header h1{font-size:1.5rem;margin-bottom:5px}header p{color:var(--ua-gold);font-size:.9rem}.container{max-width:1200px;margin:0 auto;padding:20px}.btn{padding:12px 20px;border:2px solid var(--navy);background:#fff;color:var(--navy);border-radius:8px;cursor:pointer;font-weight:700;font-size:.9rem;transition:all .2s ease}.btn:hover{background:var(--navy);color:var(--gold);box-shadow:0 3px 10px #2225524d}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-ghost{padding:8px 14px;font-size:.8rem;border-color:var(--border);color:var(--navy)}.btn-ghost:hover{background:var(--light-gray);color:var(--navy);box-shadow:none}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:20px;height:20px;border:3px solid rgba(0,0,0,.1);border-top-color:var(--navy);border-radius:50%;animation:spin .8s linear infinite}.bracket-shell{display:flex;flex-direction:column;gap:18px}.panel-header h2{font-size:1.25rem;color:var(--navy);margin-bottom:4px}.panel-header p{color:#4b5563;font-size:.95rem}.groups-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.group-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px;box-shadow:0 1px 3px #0f172a0f}.group-card h3{margin-bottom:10px;color:var(--navy);font-size:1rem}.group-card ul{list-style:none;display:flex;flex-direction:column;gap:8px}.team-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #e5e7eb}.team-row:first-child{border-top:0}.team-flag{width:1.6rem;text-align:center;font-size:1rem}.team-name{font-weight:600;color:#1f2937}.alert{padding:15px;border-radius:4px;margin-bottom:20px}.alert.error{background:#ffebee;color:#c62828;border:1px solid #ef5350}.alert.success{background:#e8f5e9;color:#2e7d32;border:1px solid #4caf50}.alert.info{background:#e3f2fd;color:#1565c0;border:1px solid #42a5f5}.user-info{margin-bottom:16px;padding:10px 12px;background:#eef2ff;border:1px solid #c7d2fe;border-radius:8px;font-size:.9rem}.bracket-topbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.bracket-topbar .user-info{margin-bottom:0;flex:1}.feedback-fab{position:fixed;right:20px;bottom:20px;z-index:200;background:#fff;color:var(--navy);border:1px solid var(--border);border-radius:999px;padding:10px 16px;font-size:.85rem;font-weight:700;text-decoration:none;box-shadow:0 4px 14px #0f172a26}.feedback-fab:hover{background:var(--navy);color:var(--gold);box-shadow:0 6px 18px #0f172a38}.bracket-export{position:fixed;left:-10000px;top:0;width:1024px;background:#fff;padding:24px;box-sizing:border-box}.bracket-export__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;background:var(--ua-green);color:#fff;padding:14px 18px;border-radius:12px;margin-bottom:16px}.bracket-export__head h2{margin:0;font-size:1.4rem}.bracket-export__head span{color:var(--ua-gold);font-weight:700;font-size:.9rem}.bracket-toolbar{position:sticky;top:84px;z-index:50;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin-bottom:18px;box-shadow:0 6px 18px #0f172a14}.bracket-progress{display:flex;flex-direction:column;gap:6px;min-width:200px;flex:1}.progress-text{font-size:.85rem;font-weight:700;color:var(--navy)}.progress-track{height:8px;background:#e5e7eb;border-radius:999px;overflow:hidden}.progress-fill{height:100%;width:0;background:var(--gold);transition:width .25s ease}.bracket-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px}.save-status{font-size:.8rem;color:#6b7280;min-width:110px;text-align:right}.btn-primary{background:var(--navy);color:var(--gold)}.btn-primary:hover{background:#1a1c40;color:var(--gold)}.group-card__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.group-card__head h3{margin:0}.group-card__count{font-size:.75rem;font-weight:700;color:#6b7280;background:var(--light-gray);border-radius:999px;padding:2px 8px}.group-card.is-complete{border-color:var(--gold);box-shadow:0 1px 3px #22255214}.group-card ul{gap:6px}.group-card .team-row{width:100%;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:8px 10px;border:1px solid transparent;border-radius:8px;background:var(--light-gray);cursor:pointer;text-align:left;font:inherit;color:var(--text);transition:background .15s ease,border-color .15s ease}.group-card .team-row:hover{border-color:var(--navy)}.group-card .team-row.is-ranked{background:#eef2ff;border-color:#c7d2fe}.group-card .team-row.is-advancing{background:#fff7e6;border-color:var(--gold)}.rank-badge{width:22px;height:22px;flex:0 0 22px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-size:.75rem;font-weight:800;color:#9ca3af;background:#e5e7eb}.team-row.is-ranked .rank-badge{color:#fff;background:var(--navy)}.team-row.is-advancing .rank-badge{color:var(--navy);background:var(--gold)}.team-row .team-name{flex:1 1 auto;min-width:0}.advance-tag{flex:0 0 auto;margin-left:auto;white-space:nowrap;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--navy);background:var(--gold);border-radius:999px;padding:2px 8px}
