/* Shared minimum action size, explicitly requested for desktop and mobile. */
:root{--action-font:18px;--action-height:44px}
body a,body button,body summary,body select,body input[type=submit],body input[type=button]{font-size:var(--action-font)!important;line-height:1.25;min-height:var(--action-height);white-space:normal;overflow-wrap:anywhere;touch-action:manipulation}
body a{display:inline-flex;align-items:center}
body button,body summary{min-width:var(--action-height)}
body .button,body .text-button,body .text-link{padding:8px 12px;max-width:100%;text-align:left}
body .icon-button{width:44px;min-width:44px;height:44px;flex-shrink:0}
body button svg,body .button svg{width:26px;height:26px}
body .actions,body .vote-buttons,body .toolbar,body .panel-head,body .page-heading,body .dialog-actions{flex-wrap:wrap}
body .button,body .nav-button,body .sidebar-utility{gap:12px}
body .button:focus-visible,body a:focus-visible,body summary:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
/* Public website navigation remains directly accessible at every width. */
body .club-bar{font-size:18px;gap:12px;flex-wrap:wrap}
body .header{max-width:1280px;gap:24px;align-items:center}
body .header nav{gap:12px;flex-wrap:wrap}
body .header nav a{padding:8px;white-space:normal}
body .header .brand{flex-shrink:0}
body .brand span{white-space:normal}
body .brand b{font-size:18px}
.site-navigation{min-width:0}
body .header-portal-mobile{display:none}
body footer{flex-wrap:wrap;align-items:flex-start}
body footer p,body .footer{font-size:18px}
body .footer-links{gap:12px 24px;max-width:800px}
body .footer-links a{padding:8px 0}
body .club-table-tabs button{padding:8px 12px;white-space:normal;max-width:calc(100vw - 48px)}
body .club-news-pagination,body .news-pagination{flex-wrap:wrap}
body .live-heading{flex-wrap:wrap}
body .stream-close{margin-left:auto}
@media(max-width:1100px){
 body .header{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:10px 12px;padding:12px 20px}
 body .header .brand{min-width:0;gap:10px}
 body .header .brand img{width:40px;height:40px;flex-shrink:0}
 body .header-portal-mobile{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line);border-radius:8px;color:var(--ink)}
 .header-portal-mobile svg{width:24px;height:24px}
 .site-navigation{grid-column:1/-1;width:100%;min-width:0;margin:0;border-top:1px solid var(--line)}
 body .site-navigation nav{display:flex;flex-wrap:nowrap;gap:8px;width:100%;margin:0;padding:6px 3px 3px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
 body .site-navigation nav a{flex:0 0 auto;white-space:nowrap;padding:8px 10px;min-height:44px}
 body .site-navigation nav .portal-link{display:none}
 body .site-navigation nav a[aria-current=page]{box-shadow:inset 0 -2px var(--yellow)}
}
@media(max-width:760px){
 body .header{padding:10px 16px}
 body .header .brand{flex-shrink:1;min-width:0}
 body .header .brand img{width:40px;flex-shrink:0}
 .site-navigation{width:100%;margin:0}

 body .club-bar{display:none}
 body .club-bar .text-link{padding:8px 0}
 body .site-header{position:sticky;top:0}
 body .footer-links{display:grid;grid-template-columns:minmax(0,1fr);width:100%}
 body .actions>.button{width:100%}
 body .hero-club{min-width:0}
}
/* Team portal: larger actions must wrap instead of escaping their containers. */
body .sidebar{width:260px}
body .workspace{margin-left:260px}
body .nav-button,body .sidebar-utility{align-items:center;min-height:44px;padding:8px 10px}
body .nav-button svg,body .sidebar-utility>svg{width:26px;height:26px}
body .sidebar-utility span{min-width:0}
body .sidebar .brand{padding:0 0 20px;min-width:0}
body .sidebar .brand strong{font-size:26px}
body .sidebar .brand small,body .nav-label,body .sidebar-connection{font-size:16px}
body .team-select{padding:8px 10px;min-width:0}
body .profile-panel{width:min(360px,calc(100vw - 28px))}
body .profile-panel select{max-width:100%}
body .profile-trigger{max-width:100%;gap:8px}
body .notification-heading{flex-wrap:wrap}
body .notification-item strong{font-size:var(--action-font);line-height:1.25}
body .notification-item small{font-size:16px;line-height:1.5}
body .notification-item>svg{flex-shrink:0}
body .top-actions{flex-wrap:nowrap}
body .topbar{flex-wrap:wrap}
body .breadcrumb{font-size:18px}
body .team-chat{width:440px}
body .chat-message-actions{gap:8px}
body #chat-form{flex-wrap:wrap}
body #chat-input{width:100%}
body #chat-form>.button{margin-left:auto}
body .notification-heading .button{min-width:0}
body .toolbar>*,body .panel-head>*,body .page-heading>*{min-width:0;max-width:100%}
body .view-switch{flex-wrap:wrap}
body .form-grid{min-width:0}
body .field{min-width:0}
body .field select{max-width:100%;width:100%}
body .landing-nav{flex-wrap:wrap;gap:20px}
@media(max-width:900px){
 body .sidebar{transform:translateX(-100%);visibility:hidden;width:min(300px,calc(100vw - 24px))}
 body .sidebar.open{transform:translateX(0);visibility:visible}
 body .workspace{margin-left:0}
 body .mobile-menu,body .sidebar-close{display:grid}
 body .sidebar-close{align-self:flex-end;margin:-16px 0 8px}
 body .sidebar.open+.sidebar-backdrop{display:block;position:fixed;inset:0;width:100%;height:100%;background:#03091299;z-index:29}
}
@media(max-width:650px){
 body .topbar{gap:8px}
 body .top-actions{margin-left:auto;gap:8px}
 body .profile-name{display:none}
 body .main{padding-left:12px;padding-right:12px}
 body .event{flex-wrap:wrap}
 body .event-info{min-width:0;flex-basis:100%}
 body .vote-buttons{display:grid;grid-template-columns:minmax(0,1fr)}
 body .chat-bar{flex-wrap:wrap}
 body .chat-count{font-size:16px}
 body .notification-panel{right:14px}
 body .notification-item{padding:12px;gap:8px}
 body .team-chat{max-width:calc(100vw - 24px)}
 body .news-heading-actions{flex-wrap:wrap}
}
body .hero-content{min-width:0;max-width:100%}
body .hero-content>.button{white-space:normal;max-width:100%}
body .notification-trigger svg,body .icon-button svg{width:24px;height:24px}
@media(max-width:760px){
 body .news-filters{flex-wrap:wrap;justify-content:flex-start;overflow-x:visible}
 body .news-filters .field{flex:1 1 220px;max-width:100%}
 body .news-filters>.button{height:auto}
}

/* Slightly denser desktop actions; retain the large controls on mobile/tablet. */
@media(min-width:1101px) and (hover:hover) and (pointer:fine){
 body button,body .button,body .text-button,body input[type=submit],body input[type=button]{--action-font:16px;--action-height:40px}
 body .button,body .text-button{padding:6px 10px;gap:8px}
 body .button svg{width:22px;height:22px}
 body .icon-button{--action-height:44px}
}

/* Imported club crests in standings, results and the latest match. */
.club-label{display:inline-flex;align-items:center;gap:10px;vertical-align:middle}
.club-crest{position:relative;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;flex:0 0 30px;border-radius:7px;background:var(--surface,#101e31);font-size:10px;font-weight:700;line-height:1;overflow:hidden}
.club-crest img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--surface,#101e31)}
.club-crest img[hidden]{display:none}
.crest>.club-crest{width:100%;height:100%;font-size:17px;background:transparent}
@media(max-width:600px){.club-label{gap:7px}.club-crest{width:26px;height:26px;flex-basis:26px}}
.club-table-crest{width:30px;height:30px;object-fit:contain;flex:0 0 30px}
.club-table-crest[hidden]{display:none}