
:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#183e37;background:#f6f7f3;font-synthesis:none;--green:#195f50;--muted:#7c8c84;--border:#e1e7df}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:1px solid var(--border);background:white;color:#234b40;padding:10px 15px;border-radius:8px;font-weight:600}button:hover{background:#e9f2ec}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:var(--green);color:white;border-color:var(--green)}.primary:hover{background:#174d42}.danger{color:#aa403a}aside{position:fixed;inset:0 auto 0 0;width:236px;background:#123f35;color:#e7f3e9;padding:38px 25px}.brand{display:block;color:#fff;text-decoration:none;font-family:Georgia,serif;font-size:44px;letter-spacing:4px;border-bottom:1px solid #ffffff22;padding-bottom:32px}.brand span{display:block;font-family:Segoe UI,sans-serif;letter-spacing:3px;font-size:10px;margin-top:8px}nav{display:grid;gap:8px;margin-top:32px}nav button{text-align:left;background:transparent;border:0;color:#aac7b9;padding:14px}nav button.selected{background:#ffffff13;color:white}nav button:hover{background:#ffffff0d}.aside-bottom{position:absolute;bottom:32px;font-size:9px;letter-spacing:1.1px;color:#aac7b9}.aside-bottom p{font-size:11px;letter-spacing:0}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#cbb879;margin-right:5px}main{margin-left:236px;padding:35px 42px;max-width:1800px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:27px}small{letter-spacing:2px;font-size:10px;color:var(--muted)}h1{font-size:30px;font-weight:600;margin:8px 0}h2{font-size:20px;margin:0 0 18px}h3{font-size:16px;margin:0 0 10px}p{line-height:1.6}.header-right{display:flex;gap:16px;align-items:center;font-size:12px}.notice{background:#eeefe5;border:1px solid #e0e3cf;border-radius:8px;padding:12px 16px;font-size:12px;color:#73734e;margin-bottom:25px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:30px}.stat{background:white;border:1px solid var(--border);border-radius:12px;padding:22px}.stat label{font-size:12px;color:var(--muted)}.stat strong{display:block;font-size:28px;font-weight:600;margin-top:12px}.stat span{font-size:11px;color:var(--muted)}.section-head{display:flex;justify-content:space-between;align-items:center;margin:20px 0}.section-head h2{margin:0}.filter{display:flex;gap:8px;flex-wrap:wrap}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.card{background:white;border:1px solid var(--border);border-radius:12px;padding:22px;position:relative;min-height:212px}.card-top{display:flex;justify-content:space-between;align-items:center}.tile{background:#f1f4ec;border:1px solid #dbe3d6;border-radius:9px;font-family:Georgia,serif;font-size:24px;width:43px;height:48px;text-align:center;line-height:47px;color:#32634e}.badge{font-size:10px;letter-spacing:.5px;background:#e8f3e9;color:#398150;padding:6px 9px;border-radius:20px}.badge.active{background:#e3f0ef;color:#287568}.badge.grace{background:#fff0d8;color:#ad7b2f}.badge.offline,.badge.fault{background:#f9e8e4;color:#aa5548}.badge.maintenance{background:#eeeafa;color:#7660a2}.machine-name{font-size:20px;font-weight:650;margin:19px 0 4px}.muted{color:var(--muted);font-size:12px}.timer{font-size:19px;font-variant-numeric:tabular-nums;margin:12px 0}.card-actions{display:flex;gap:8px;margin-top:17px;flex-wrap:wrap}.card-actions button{font-size:11px;padding:8px 10px}.card-actions .primary{flex:1}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:12px;background:white}table{border-collapse:collapse;width:100%;font-size:12px;white-space:nowrap}th{background:#f0f3ec;text-align:left;color:#688078;font-size:10px;letter-spacing:.8px}th,td{padding:15px;border-bottom:1px solid var(--border)}td button{font-size:11px;padding:7px 9px;margin-right:4px}.empty{padding:45px;text-align:center;color:var(--muted);background:white;border:1px dashed var(--border);border-radius:12px}.panel{background:white;border:1px solid var(--border);border-radius:12px;padding:24px;margin-bottom:20px}.calls{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}.call{padding:12px 16px;background:#fff2dc;border-radius:8px;font-size:12px}.call button{margin-left:12px;font-size:11px}footer{font-size:11px;color:var(--muted);padding:28px 0}dialog{border:0;border-radius:15px;padding:32px;width:500px;max-width:95vw;max-height:90vh;color:#183e37}dialog::backdrop{background:#082d2666;backdrop-filter:blur(3px)}.dialog-close{position:absolute;right:12px;top:12px;border:0;font-size:22px;padding:1px 7px}form{display:grid;gap:15px}form label{display:grid;gap:7px;font-size:12px;font-weight:600}input,select{border:1px solid #d6e1d6;border-radius:7px;padding:11px;background:#fbfcf8;color:#234b40;width:100%}.form-note{font-size:12px;background:#f0f3e8;padding:12px;border-radius:7px;line-height:1.6}.row{display:flex;gap:12px}.row>*{flex:1}.qr{width:220px;height:220px;display:block;margin:auto}.qr-box{text-align:center}.bar-chart{display:flex;align-items:end;gap:6px;height:180px;margin-top:20px}.bar{flex:1;min-width:5px;background:#559782;border-radius:4px 4px 0 0;position:relative}.bar span{position:absolute;bottom:-22px;font-size:9px}.bar-chart-wrap{padding-bottom:26px}.audit-detail{max-width:300px;white-space:normal;word-break:break-word;font-family:monospace;font-size:10px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#143f35;color:white;border-radius:9px;padding:13px 24px;display:none;z-index:10;max-width:90vw;font-size:13px}.error{color:#ae3e35}.status-info{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.status-info div{padding:15px;background:#f5f7f0;border-radius:8px}.status-info strong{display:block;margin-bottom:8px}.order-info{margin:16px 0;padding:15px;background:#f1f5ed;border-radius:9px;font-size:13px}.order-actions{display:flex;gap:8px;flex-wrap:wrap}.pill{display:inline-block;padding:5px 10px;border-radius:20px;background:#f0f3ec;font-size:11px}.offbanner{background:#ffeadc;color:#9d4b29;padding:15px;border-radius:8px;margin-bottom:15px}@media(min-width:1450px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:1050px){aside{width:190px;padding:30px 20px}main{margin-left:190px;padding:25px}.grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){aside{position:relative;width:100%;padding:16px 20px}.brand{font-size:25px;border:0;padding:0}.brand span{display:inline;margin-left:10px;letter-spacing:1px}nav{display:flex;overflow:auto;margin-top:15px;gap:3px}nav button{padding:10px;font-size:11px;white-space:nowrap}.aside-bottom{display:none}main{margin-left:0;padding:20px 16px}h1{font-size:25px}.header-right{gap:8px;font-size:10px}.header-right button{font-size:11px;padding:8px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{padding:15px}.card-actions{flex-direction:column}.stats{gap:10px}.stat{padding:16px}.stat strong{font-size:24px}.status-info{grid-template-columns:1fr}.row{flex-direction:column}.notice{font-size:11px}.section-head{gap:10px}.filter{font-size:11px}}@media(max-width:390px){.grid{grid-template-columns:1fr}}

.payment-guide{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}.payment-qris img{display:block;width:100%;max-width:320px;height:auto;margin:auto}.payment-qris{text-align:center}.payment-guide p{font-size:13px}.bank-number{font-size:24px!important;font-weight:700;letter-spacing:1px;overflow-wrap:anywhere}.payment-other hr{border:0;border-top:1px solid var(--border);margin:24px 0}dialog .payment-guide{grid-template-columns:1fr}dialog .payment-qris img{max-width:280px}@media(max-width:700px){.payment-guide{grid-template-columns:1fr}}

.coach-info{margin-bottom:24px;border-left:4px solid #155e54}.coach-info h2{margin-top:0}.coach-wa{display:inline-block;background:#155e54;color:#fff;padding:12px 16px;border-radius:10px;text-decoration:none;font-weight:600}.coach-wa:hover{background:#104b43}.coach-wa:focus-visible{outline:3px solid #c9a961;outline-offset:3px}
