:root{--navy:#071b2b;--navy2:#0d3042;--ink:#122334;--muted:#687986;--lime:#b9ff38;--teal:#00bfb4;--blue:#4ea6ff;--coral:#ff826b;--bg:#f3f7f6;--card:#fff;--line:#dfe8e7;--shadow:0 12px 32px rgba(12,45,55,.09)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select{font:inherit}button{cursor:pointer}.topbar{position:sticky;z-index:20;top:0;height:75px;padding:12px max(16px,calc((100vw - 1160px)/2));display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,var(--navy2),var(--navy));color:#fff;border-bottom:1px solid rgba(255,255,255,.1)}.brand{display:flex;gap:10px;align-items:center;color:#fff;text-decoration:none}.brand>span{width:43px;height:43px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,var(--lime),var(--teal));color:var(--navy);font-size:25px}.brand b,.brand small{display:block}.brand b{font-size:18px}.brand small{font-size:10px;color:#a9bdc5;margin-top:2px}.top-actions{display:flex;gap:7px;align-items:center}.network,.soft,.role{border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.08);color:#fff;border-radius:12px;padding:9px 11px;font-weight:850}.network{color:var(--lime);font-size:10px}.network.offline{color:#ffd0c7}.role{display:flex;align-items:center;gap:7px}.role span:nth-child(2){text-align:left}.role b,.role small{display:block}.role b{font-size:11px}.role small{font-size:8px;color:#a9bdc5}main{max-width:1160px;margin:auto;padding:22px 20px 105px}.screen{display:none;animation:rise .22s ease}.screen.active{display:block}@keyframes rise{from{opacity:0;transform:translateY(7px)}}.hello,.screen-head,.section-head,.card-head{display:flex;align-items:center;justify-content:space-between}.hello{margin:3px 0 16px}.hello p{margin:0;color:var(--muted);font-size:13px}.hello h1,.screen-head h1{margin:3px 0 0;font-size:clamp(25px,4vw,34px)}.sample{padding:7px 9px;border-radius:999px;background:#e7fbd1;color:#49750c;font-size:9px;font-weight:950;letter-spacing:.06em}.hero-card{display:flex;align-items:center;justify-content:space-between;padding:23px;border-radius:24px;background:linear-gradient(135deg,#0d3d4d,#086e6a);color:#fff;box-shadow:0 18px 40px rgba(6,84,84,.2)}.hero-card span,.hero-card small{display:block;color:#b9d8d7}.hero-card strong{display:block;font-size:36px;margin:6px 0}.hero-pulse{text-align:right}.hero-pulse i{display:inline-block;width:11px;height:11px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 7px rgba(185,255,56,.14)}.hero-pulse b{display:block;color:var(--lime);margin-top:3px}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}.quick{border:0;border-radius:19px;text-align:left;padding:17px;min-height:125px;color:var(--ink);box-shadow:var(--shadow);transition:.2s}.quick:hover{transform:translateY(-2px)}.quick>span{font-size:29px}.quick b,.quick small{display:block}.quick b{margin:10px 0 4px}.quick small{color:var(--muted)}.quick.lime{background:#eeffd1}.quick.teal{background:#dffaf7}.quick.blue{background:#e9f4ff}.quick.coral{background:#fff0ec}.section-head{margin-top:24px}.section-head h2{font-size:18px}.section-head button,.card-head button{border:0;background:none;color:#087a72;font-weight:850}.kpi-grid,.owner-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.kpi-grid>div,.owner-kpis>div,.card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:16px;box-shadow:0 8px 25px rgba(12,45,55,.055)}.kpi-grid span,.kpi-grid small,.owner-kpis span,.owner-kpis small{display:block;color:var(--muted);font-size:11px}.kpi-grid b,.owner-kpis b{display:block;font-size:21px;margin:6px 0}.home-grid,.owner-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:11px;margin-top:12px}.card h3{margin:0}.up-row{display:grid;grid-template-columns:45px 1fr auto;gap:10px;align-items:center;padding:11px 0;border-top:1px solid var(--line)}.up-row:first-child{border-top:0}.up-row>span{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#eeffd1;font-size:20px}.up-row b,.up-row small{display:block}.up-row small{color:var(--muted);font-size:10px;margin-top:3px}.up-row em{font-style:normal;font-size:9px;padding:6px 8px;border-radius:999px;background:#e9f4ff;color:#23699d}.alerts p{margin:0;padding:10px 0;border-top:1px solid var(--line);font-size:12px;color:#596d78}.alerts .card-head span,.red{background:#fff0ec;color:#c2412d;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:900}.screen-head{margin-bottom:16px}.screen-head>div>small{color:#087a72;font-size:10px;font-weight:950;letter-spacing:.08em}.primary{border:0;background:linear-gradient(135deg,var(--lime),#8cec51);color:#143321;border-radius:12px;padding:12px 15px;font-weight:950}.primary.small{width:auto}.date-strip{display:grid;grid-template-columns:50px repeat(5,1fr) 50px;gap:7px;margin-bottom:13px}.date-strip button,.date-strip>div{border:1px solid var(--line);background:#fff;border-radius:13px;min-height:58px;display:grid;place-items:center;color:var(--muted)}.date-strip small,.date-strip b{display:block;text-align:center}.date-strip>div.active{background:var(--navy);color:#fff;border-color:var(--navy)}.date-strip>div.active small{color:var(--lime)}.legend{display:flex;gap:12px;flex-wrap:wrap;margin:10px 0;font-size:10px;color:var(--muted)}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px}.dot.lime{background:var(--lime)}.dot.blue{background:var(--blue)}.dot.coral{background:var(--coral)}.dot.gray{background:#9caeb5}.court-board{display:grid;gap:10px}.court-line{display:grid;grid-template-columns:90px 1fr;gap:10px;padding:13px;background:#fff;border:1px solid var(--line);border-radius:17px}.court-name{display:grid;place-items:center;border-radius:13px;background:#edf4f3;text-align:center}.court-name b,.court-name small{display:block}.court-name small{font-size:9px;color:var(--muted)}.court-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.court-slot{border-radius:12px;padding:10px;min-height:70px;color:#173038}.court-slot b,.court-slot small{display:block}.court-slot b{font-size:11px}.court-slot small{font-size:9px;margin-top:4px}.court-slot.lime{background:#e9ffc2}.court-slot.blue{background:#ddecff}.court-slot.coral{background:#ffe1da}.court-slot.gray{background:#edf1f2}.court-slot.open{border:1px dashed #b8c7cb;color:#7a8c93;background:#fff}.filters{display:grid;grid-template-columns:1fr 170px;gap:9px;margin-bottom:12px}.filters input,.filters select,.form-grid input,.form-grid select{width:100%;border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px;color:var(--ink)}.booking-list{display:grid;gap:9px}.booking{display:grid;grid-template-columns:55px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px;background:#fff;border:1px solid var(--line);border-radius:17px}.booking-time{width:54px;height:54px;border-radius:14px;background:var(--navy);color:#fff;display:grid;place-items:center;text-align:center;font-size:10px}.booking-time b{font-size:12px}.booking h3{margin:0;font-size:15px}.booking p{margin:4px 0;color:var(--muted);font-size:11px}.badges{display:flex;gap:5px;flex-wrap:wrap}.badge{padding:5px 7px;border-radius:999px;font-size:9px;font-weight:850;background:#edf4f3;color:#52666f}.badge.paid{background:#eafbdc;color:#4a7414}.badge.deposit{background:#fff2d6;color:#94620a}.booking-actions{display:flex;gap:6px}.booking-actions button{border:0;border-radius:9px;padding:8px 9px;font-size:10px;font-weight:850;background:#e5f8f5;color:#087a72}.player-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}.player-kpis>div{padding:17px;border-radius:17px;background:linear-gradient(135deg,#0c3345,#087a72);color:#fff}.player-kpis span,.player-kpis small{display:block;color:#b9d8d7;font-size:10px}.player-kpis b{display:block;font-size:23px;margin:5px 0}.program-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.program-grid article{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px}.program-grid article>span{font-size:25px}.program-grid b,.program-grid small{display:block}.program-grid small{color:var(--muted);font-size:10px;margin-top:3px}.program-grid em{font-style:normal;font-size:9px;padding:6px 7px;border-radius:999px;background:#eafbdc;color:#4f7718}.member-card{margin-top:12px}.member-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid var(--line)}.member-row b,.member-row small{display:block}.member-row small{color:var(--muted);font-size:10px}.member-row>span{font-size:9px;background:#eafbdc;color:#4f7718;padding:6px 8px;border-radius:999px}.member-row>span.warning{background:#fff2d6;color:#94620a}.owner-hero{display:grid;grid-template-columns:1fr .8fr;gap:10px;background:linear-gradient(135deg,#0b2c3d,#071b2b);color:#fff;border-radius:22px;padding:21px;margin-bottom:12px}.owner-hero span,.owner-hero small{display:block;color:#a7bac4}.owner-hero b{display:block;font-size:31px;margin:6px 0}.util span{height:9px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}.util span i{display:block;height:100%;border-radius:999px;background:var(--lime)}.util b{color:var(--lime)}.owner-layout{margin-top:12px}.bars{display:flex;height:180px;align-items:end;gap:12px;padding-top:15px}.bars div{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px}.bars i{display:block;width:100%;border-radius:8px 8px 3px 3px;background:linear-gradient(0deg,var(--teal),var(--lime))}.bars span{font-size:9px;color:var(--muted)}.exception{padding:11px 0;border-top:1px solid var(--line)}.exception b,.exception small{display:block}.exception small{color:var(--muted);font-size:10px;margin-top:3px}.menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.menu-grid button,.menu-grid a{display:grid;grid-template-columns:44px 1fr;gap:11px;align-items:center;text-align:left;text-decoration:none;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:16px;padding:14px}.menu-grid>*>span{font-size:26px}.menu-grid b,.menu-grid small{display:block}.menu-grid small{color:var(--muted);font-size:10px;margin-top:3px}.prototype-note{margin-top:15px;background:#fff8dc;border:1px solid #fde68a;border-radius:15px;padding:14px;color:#765b16}.prototype-note p{margin:5px 0 0;font-size:11px;line-height:1.45}.app-footer{display:flex;align-items:center;justify-content:center;gap:9px;background:var(--navy);color:#fff;padding:22px 18px 98px}.app-footer>span{font-size:24px;color:var(--lime)}.app-footer b,.app-footer small{display:block}.app-footer small{color:#99aeb8;font-size:9px}.app-footer strong{color:var(--lime);font-size:10px;margin-left:10px}.bottom-nav{position:fixed;z-index:30;left:0;right:0;bottom:0;height:76px;display:flex;justify-content:center;gap:min(5vw,56px);background:rgba(7,27,43,.97);border-top:1px solid rgba(255,255,255,.1);padding-bottom:env(safe-area-inset-bottom);backdrop-filter:blur(14px)}.bottom-nav button{min-width:50px;border:0;background:none;color:#9fb0b9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.bottom-nav button span{font-size:19px}.bottom-nav button small{font-size:9px}.bottom-nav button.active{color:var(--lime);font-weight:900}.modal-wrap{display:none;position:fixed;z-index:80;inset:0}.modal-wrap.open{display:block}.backdrop{position:absolute;inset:0;background:rgba(2,15,24,.6);backdrop-filter:blur(4px)}.modal{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(570px,calc(100% - 22px));max-height:calc(100dvh - 28px);overflow:auto;background:#fff;border-radius:23px;padding:25px 20px 28px;box-shadow:0 24px 65px rgba(0,0,0,.28)}.modal-x{position:sticky;z-index:2;float:right;top:0;border:0;width:34px;height:34px;border-radius:50%;background:#edf4f3;font-size:20px}.modal h2{margin:3px 42px 7px 0}.lead{margin:0 0 16px;color:var(--muted);font-size:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-grid label{color:var(--muted);font-size:10px;font-weight:850}.form-grid label.full{grid-column:1/-1}.modal .primary{width:100%;margin-top:13px}.guide-list{display:grid;gap:8px}.guide-list div{display:grid;grid-template-columns:34px 1fr;gap:9px;padding:10px;border:1px solid var(--line);border-radius:13px}.guide-list span{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#e9ffc2;font-weight:950}.guide-list b,.guide-list small{display:block}.guide-list small{color:var(--muted);font-size:10px;margin-top:3px}.cash-grid{display:grid;gap:8px;background:#f5f8f7;border-radius:14px;padding:13px}.cash-grid div{display:flex;justify-content:space-between}.cash-grid span{color:var(--muted);font-size:11px}.toast{position:fixed;z-index:100;left:50%;bottom:92px;transform:translate(-50%,15px);opacity:0;pointer-events:none;background:#112633;color:#fff;padding:11px 16px;border-radius:999px;font-size:11px;transition:.22s}.toast.show{opacity:1;transform:translate(-50%,0)}body[data-role="staff"] .owner-only,body[data-role="staff"] .bottom-nav button[data-screen="owner"]{display:none}@media(max-width:800px){.quick-grid,.kpi-grid,.owner-kpis{grid-template-columns:repeat(2,1fr)}.home-grid,.owner-layout,.owner-hero{grid-template-columns:1fr}.court-slots{grid-template-columns:repeat(2,1fr)}.program-grid{grid-template-columns:1fr}.top-actions .soft{display:none}}@media(max-width:560px){main{padding:17px 14px 102px}.topbar{height:69px;padding:10px 12px}.brand b{font-size:15px}.network{display:none}.quick-grid{gap:8px}.quick{min-height:113px;padding:14px}.kpi-grid,.owner-kpis,.player-kpis{grid-template-columns:1fr 1fr}.kpi-grid>div:nth-child(4),.owner-kpis>div:nth-child(4){grid-column:1/-1}.date-strip{grid-template-columns:37px repeat(5,1fr) 37px;gap:4px}.court-line{grid-template-columns:1fr}.court-name{padding:8px}.court-slots{grid-template-columns:1fr 1fr}.booking{grid-template-columns:46px 1fr}.booking-time{width:45px;height:45px}.booking-actions{grid-column:1/-1;justify-content:flex-end}.menu-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-grid label.full{grid-column:auto}.bottom-nav{gap:0;justify-content:space-around}.bottom-nav button{min-width:44px}.app-footer{padding-bottom:96px}}
