/* Empire Padel Wars mobile-first polish — v5 */
:root { --court-green:#179565; --court-red:#e54d56; --court-blue:#367ae9 }
.logo-wars{display:block;width:100%;height:100%;object-fit:contain}
.brand-mark.wars-brand{border:0;border-radius:14px;overflow:hidden;background:transparent;padding:0;letter-spacing:normal}
.match .field{min-width:77px;padding:9px 7px;border-radius:11px;display:flex;flex-direction:column;justify-content:center;gap:3px;max-width:110px}
.match .field strong{font-size:12px;letter-spacing:-.12px;line-height:1.16;overflow-wrap:anywhere}
.match .field span{margin:0;font-weight:750;font-size:12px;color:#464d5d}
.match[data-court="verde"] .field{background:#e7f8ef;color:#13734c}
.match[data-court="rosso"] .field{background:#fff0f0;color:#ab2b38}
.match[data-court="blu"] .field{background:#eaf1ff;color:#245fb6}
.tab-glyph{display:none}
@media(max-width:679px){
 html{scroll-padding-top:16px}
 body{background:#f5f6fa}
 .app-shell{padding:0 14px calc(102px + env(safe-area-inset-bottom));max-width:100vw}
 .hero{margin:0 -14px;padding:17px 15px 15px;border-radius:0 0 25px 25px;box-shadow:0 12px 22px #11111f14}
 .hero-top{gap:11px}
 .brand-mark.wars-brand{width:51px;height:51px;flex:0 0 51px}
 .eyebrow{font-size:9px;letter-spacing:1.4px;margin-bottom:4px}
 .brand-copy h1{font-size:24px;line-height:1.05;letter-spacing:-.8px}
 .brand-copy p{font-size:11px;margin-top:5px;line-height:1.25}
 .hero .icon-btn{width:33px;height:33px}
 .metrics{margin-top:13px;gap:7px;max-width:none}
 .metric{padding:10px 9px;border:1px solid #ffffff12;border-radius:12px;background:#26283a}
 .metric strong{font-size:20px}
 .metric.highlight strong{font-size:21px}
 .metric span{font-size:10px;line-height:1.25;margin-top:4px}
 .cloud-bar{padding-top:10px;margin-top:12px;gap:8px}
 .cloud-bar strong{font-size:11px}
 .cloud-bar small{font-size:10px;margin-top:2px}
 .cloud-btn{padding:10px 9px;min-height:39px;font-size:11px}
 .tabs{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:12;margin:0;padding:8px 8px calc(7px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #e8e9ed;box-shadow:0 -9px 32px rgba(17,17,31,.09);overflow:visible;gap:3px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
 .tab{background:transparent;border:0;border-radius:13px;padding:6px 2px 5px;font-size:10px;line-height:1.2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-weight:800;min-height:52px;white-space:nowrap;overflow:visible}
 .tab.active{background:#fff5d3;color:#17171f;border:0}
 .tab-glyph{display:block;font-size:20px;line-height:23px}
 .panel-head{margin:17px 0 10px;align-items:flex-start}
 .panel-head h2{font-size:21px}
 .panel-head .sub{font-size:12px;margin:6px 0 0}
 .panel-head .progress{margin-top:8px;min-width:68px;width:68px}
 .chip-row{display:flex;flex-wrap:nowrap;overflow:auto;scrollbar-width:none;margin:10px -14px 13px;padding:2px 14px 5px;gap:6px}
 .chip-row::-webkit-scrollbar{display:none}
 .chip{flex:0 0 auto;padding:10px 13px;border-radius:12px;background:#fff;box-shadow:0 2px 10px #11111f06;min-height:39px}
 .matches-list{display:block}
 .slot-label{margin:17px 0 8px;font-size:11px;letter-spacing:1px;font-weight:950}
 .match{min-height:72px;padding:11px;gap:8px;border:1px solid #e7e8ee;border-radius:14px;margin-bottom:7px;box-shadow:0 5px 16px #11111f06}
 .match .field{min-width:74px;max-width:82px;padding:9px 5px}
 .match .field strong{font-size:11px;line-height:1.15}
 .match .field span{font-size:11px}
 .versus{gap:6px}
 .side strong{font-size:13px;line-height:1.18;overflow-wrap:anywhere}
 .side .meta{font-size:9px;margin-top:5px}
 .score-pill{min-width:42px;font-size:15px;flex:0 0 42px}
 .score-pill.pending{font-size:10px}
 .match .edit-chevron{font-size:15px;padding:0}
 .section-note{padding:12px;border-radius:12px}
 .table-scroll{margin-top:9px;max-width:100%;border-radius:13px}
 table{font-size:12px}
 th,td{padding:11px 7px}
 th:first-child,td:first-child{padding-left:9px}
 th:last-child,td:last-child{padding-right:9px}
 .roster-list{gap:7px}
 .roster{padding:13px;border-radius:12px}
 .payment-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
 .payment-stats>div{padding:10px 3px;border-radius:11px}
 .payment-stats strong{font-size:19px}
 .payment-stats span{font-size:10px}
 .payment-list{border-radius:14px}
 .payment-row{gap:6px;padding:10px}
 .payment-person strong{font-size:13px}
 .payment-person span{font-size:10px}
 .payment-select{min-width:117px;max-width:128px;padding:11px 6px;border-radius:9px}
 .footer{margin-top:24px;padding-top:14px;flex-wrap:wrap}
 .modal-backdrop{padding:8px;align-items:flex-end}
 .modal{padding:22px 19px calc(20px + env(safe-area-inset-bottom));max-height:95dvh;width:100%;border-radius:22px 22px 0 0}
 .score-side input{font-size:42px;min-height:80px}
 .modal-actions>*{min-height:48px;font-size:13px}
 #settings{margin-bottom:35px}
}
@media(max-width:355px){
 .tab{font-size:9px}
 .tab-glyph{font-size:18px}
 .match{padding:9px 7px;gap:5px}
 .match .field{min-width:62px;max-width:65px}
 .side strong{font-size:12px}
 .brand-copy h1{font-size:22px}
 .payment-select{min-width:108px;max-width:116px}
}