:root{color-scheme:light;--bg:#f5f7f5;--surface:#fff;--ink:#192b23;--muted:#718078;--line:#e4eae5;--green:#178554;--green-dark:#0d7045;--shadow:0 12px 36px rgba(19,53,38,.045)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}a{color:inherit}img{max-width:100%}[hidden]{display:none!important}
/* Front landing: strictly one image and one WhatsApp CTA. */
.landing-page{min-height:100vh;min-height:100dvh;background:linear-gradient(170deg,#eff9f2 0%,#e8f3ec 65%,#eff9f3 100%);padding:clamp(12px,3vw,26px);display:flex;align-items:center;justify-content:center}
.landing-frame{width:min(100%,470px);display:flex;flex-direction:column;gap:16px}
.showcase{overflow:hidden;min-height:220px;background:#ddeae0;border:1px solid rgba(31,97,52,.09);border-radius:23px;box-shadow:0 18px 56px rgba(20,68,43,.08)}
.showcase img{display:block;width:100%;height:auto;max-height:min(75dvh,720px);object-fit:contain}
.whatsapp-button{background:#20b566;border:1px solid #1aa55c;color:#fff;padding:17px 20px;display:flex;align-items:center;gap:13px;justify-content:center;text-align:center;font-size:17px;font-weight:750;border-radius:15px;min-height:66px;text-decoration:none;box-shadow:0 9px 22px rgba(26,151,81,.18);transition:transform .2s,box-shadow .2s,background .2s}
.whatsapp-button:hover{background:#15a75b;box-shadow:0 13px 28px rgba(26,151,81,.21);transform:translateY(-1px)}.whatsapp-button:active{transform:translateY(1px)}.whatsapp-button.is-loading{opacity:.7;pointer-events:none}.whatsapp-button svg{flex:none}.landing-error{margin:0;padding:11px 14px;border-radius:10px;background:#fff2ee;color:#9e382b;font-size:13px;text-align:center}
@media (max-width:520px){.landing-page{align-items:flex-start;padding:13px 11px 18px}.landing-frame{gap:13px}.showcase{border-radius:16px}.showcase img{max-height:calc(100dvh - 112px)}.whatsapp-button{border-radius:12px;min-height:60px}}
/* Operator console */
.admin-page{background:#f6f8f5;color:var(--ink);font-size:14px}
.admin-topbar{height:78px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 max(26px,calc((100vw - 1220px)/2));border-bottom:1px solid var(--line);gap:20px}
.brand{display:flex;align-items:center;gap:12px}.brand-icon{display:grid;place-items:center;width:42px;height:42px;background:#176b48;color:white;font-size:26px;font-weight:800;border-radius:13px}.brand strong{display:block;font-size:17px;letter-spacing:-.6px}.brand span:last-child{font-size:11px;color:#87958e}.admin-top-actions{display:flex;align-items:center;gap:20px}.admin-top-actions a{text-decoration:none;color:#277e53;font-weight:650}.subtle-btn{border:0;background:transparent;color:#58665e;padding:8px 0;font-size:13px}.subtle-btn:hover,.admin-top-actions a:hover{color:#0b673d}
.admin-content{width:min(1220px,calc(100% - 52px));margin:44px auto 24px}.dashboard-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:26px}.eyebrow{font-size:11px;letter-spacing:1.7px;color:#289465;font-weight:800}.dashboard-heading h1{font-size:30px;letter-spacing:-.8px;margin:8px 0}.dashboard-heading p,.panel-heading p{margin:0;color:var(--muted);line-height:1.55}.status-dot{white-space:nowrap;color:#377c57;font-size:12px;font-weight:700;background:#e5f3eb;border-radius:999px;padding:9px 14px}.status-dot i{display:inline-block;background:#29ae6b;width:7px;height:7px;border-radius:50%;margin-right:7px}
.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:23px 24px;min-height:148px;box-shadow:var(--shadow);display:flex;flex-direction:column}.stat-card span{color:#61766b;font-size:13px;font-weight:650}.stat-card em{font-style:normal;font-size:10px;font-weight:500;margin-left:4px;color:#9aa9a0}.stat-card strong{font-size:36px;letter-spacing:-1px;margin:12px 0 3px;font-variant-numeric:tabular-nums}.stat-card small{font-size:11px;color:#96a49c}
.admin-two-col{display:grid;grid-template-columns:1.02fr .98fr;gap:20px;align-items:stretch}.settings-stack{display:flex;flex-direction:column;gap:20px}.panel{background:#fff;border:1px solid var(--line);border-radius:17px;padding:24px;box-shadow:var(--shadow)}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:19px}.panel h2{font-size:18px;letter-spacing:-.25px;margin:0 0 5px}.panel-heading p{font-size:12px}.info-tag{font-size:11px;font-weight:700;border-radius:7px;background:#eef8f0;color:#3d9363;padding:6px 9px;white-space:nowrap}.image-preview{height:336px;background:#edf5ee;display:flex;justify-content:center;align-items:center;overflow:hidden;border:1px dashed #cdded0;border-radius:12px;margin-bottom:18px}.image-preview img{width:100%;height:100%;object-fit:contain}.stack{display:flex;flex-direction:column;gap:14px}.stack label{display:flex;flex-direction:column;gap:7px;font-weight:650;font-size:12px;color:#42554a}.stack input:not([type=file]):not([type=checkbox]),.admin-login input{min-height:42px;border:1px solid #dce6dd;border-radius:9px;padding:11px 12px;outline:0;background:#fff;font-size:13px;color:#203a2b;width:100%}.stack input:focus,.admin-login input:focus{border-color:#5db38a;box-shadow:0 0 0 3px #e7f6ec}.stack input::placeholder{color:#aab7ae}.file-label{display:block;background:#f7faf7;border:1px dashed #c8dfd0;border-radius:10px;padding:13px;font-size:12px;font-weight:650;color:#4f6856}.file-label input{display:block;width:100%;margin-top:9px;font-size:12px}.primary-btn{width:100%;background:var(--green);border:1px solid var(--green);border-radius:9px;color:#fff;font-size:13px;font-weight:800;padding:12px 16px;min-height:43px}.primary-btn:hover{background:var(--green-dark)}.small-note{background:#f3f8f3;border-radius:8px;padding:10px 12px;color:#7a8c80;font-size:11px;line-height:1.7}
.table-panel{margin-top:20px}.table-heading{margin-bottom:17px}.date-label{background:#f4f7f4;border:1px solid #e8efe9;padding:7px 10px;color:#7f8c82;border-radius:7px;font-size:11px;font-weight:700;white-space:nowrap}.table-scroll{overflow-x:auto}table{border-collapse:collapse;width:100%;text-align:left;font-size:12px}th{background:#f9fbf9;color:#83968a;font-weight:700;white-space:nowrap;border-bottom:1px solid var(--line);padding:14px 12px}td{padding:16px 12px;border-bottom:1px solid #eef2ee;vertical-align:middle;color:#506156}tbody tr:last-child td{border-bottom:0}.ws-name{color:#263f30;font-weight:800;white-space:nowrap}.ws-id{display:block;font-size:10px;color:#9aa89e;font-weight:500;margin-top:4px}.table-link{display:block;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#328257;text-decoration:none}.table-link:hover{text-decoration:underline}.number-cell{font-variant-numeric:tabular-nums;text-align:center}.count-main{font-size:17px;color:#186e46}.status{display:inline-block;white-space:nowrap;border-radius:999px;padding:6px 11px;font-size:11px;font-weight:800}.status.on{color:#268455;background:#e4f6ea}.status.off{color:#909994;background:#eff1ef}.tiny-btn{border:1px solid #dbe5dd;border-radius:7px;min-width:63px;padding:7px 10px;background:#fff;font-size:11px;font-weight:700}.tiny-btn.stop{color:#b06759}.tiny-btn.start{color:#177c4d}.tiny-btn:hover{background:#f6faf7}.empty-cell{text-align:center;padding:45px;color:#8d9d91}.admin-footer{text-align:center;color:#a1ada4;margin-top:25px;font-size:11px}
.admin-login{width:min(440px,calc(100% - 36px));margin:clamp(50px,12vh,150px) auto 0;padding:34px;background:white;border:1px solid #e3ebe4;border-radius:20px;box-shadow:0 19px 75px rgba(22,59,38,.07)}.login-mark{display:grid;place-items:center;width:55px;height:55px;border-radius:15px;background:#177c50;color:white;font-size:34px;font-weight:850}.login-mark span{color:#8ada9c}.admin-login h1{font-size:25px;margin:19px 0 7px}.admin-login p{color:#7e8d83;margin:0 0 29px;font-size:12px}.admin-login .stack{gap:19px}.admin-login label{font-size:12px;display:flex;flex-direction:column;gap:9px;font-weight:700}.form-msg{min-height:18px;font-size:12px;color:#b13e2e;margin-top:12px}.toast{position:fixed;z-index:50;right:22px;bottom:22px;background:#193f2d;color:white;padding:14px 20px;border-radius:10px;max-width:430px;box-shadow:0 10px 30px #17332230;font-size:13px}.toast.bad{background:#a64230}
@media(max-width:900px){.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-two-col{grid-template-columns:1fr}.image-preview{height:280px}.admin-topbar{padding:0 22px}.admin-content{width:calc(100% - 44px);margin:30px auto}}
@media(max-width:520px){.admin-topbar{height:auto;min-height:74px;padding:14px 16px;flex-wrap:wrap}.admin-top-actions{gap:16px;flex-wrap:wrap}.admin-content{width:calc(100% - 26px);margin:27px auto}.dashboard-heading{align-items:flex-start}.dashboard-heading h1{font-size:24px}.dashboard-heading .status-dot{display:none}.stat-grid{gap:10px}.stat-card{padding:17px 14px;min-height:127px}.stat-card strong{font-size:29px}.stat-card span{font-size:11px}.stat-card em{display:block;margin:2px 0 0}.panel{padding:17px}.panel-heading{flex-wrap:wrap}.admin-login{padding:27px 22px}}

.stack label.checkbox-row{display:flex;flex-direction:row;gap:10px;align-items:center}.stack label.checkbox-row input[type=checkbox]{width:17px;height:17px;flex:none;accent-color:#178554}.stack label.checkbox-row input[type=checkbox]:focus-visible{outline:2px solid #178554;outline-offset:3px}


/* iPhone-first landing viewport: keep the full banner and CTA inside the visible Safari area. */
@media (max-width:600px) {
  .landing-page {
    width:100%;
    height:100vh; height:100svh; height:100dvh;
    min-height:0;
    display:block;
    overflow:hidden;
    padding:max(12px, env(safe-area-inset-top, 0px))
            max(12px, env(safe-area-inset-right, 0px))
            max(12px, env(safe-area-inset-bottom, 0px))
            max(12px, env(safe-area-inset-left, 0px));
  }
  .landing-frame {
    width:100%; max-width:470px;
    height:100%; min-height:0;
    margin:0 auto;
    display:grid;
    grid-template-rows:minmax(0, 1fr) auto;
    gap:12px;
  }
  .showcase {
    width:100%; height:100%;
    min-width:0; min-height:0;
    max-height:100%;
    display:flex; align-items:center; justify-content:center;
    border-radius:17px;
  }
  .showcase img {
    width:100%; height:100%; max-height:none;
    object-fit:contain;
    object-position:center;
  }
  .whatsapp-button {
    width:100%; min-height:60px;
    padding:14px 12px;
    font-size:clamp(15px, 4.05vw, 17px);
    line-height:1.25;
    gap:10px;
    border-radius:14px;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
  }
  .whatsapp-button svg {width:26px;height:26px;}
  .landing-error {max-height:22dvh;overflow:auto;}
}
@media (max-width:600px) and (max-height:600px) {
  .landing-page {
    padding-top:max(8px, env(safe-area-inset-top, 0px));
    padding-bottom:max(8px, env(safe-area-inset-bottom, 0px));
  }
  .landing-frame {gap:8px;}
  .whatsapp-button {min-height:54px; padding:10px 12px;}
}
/* Small-height landscape Safari: scroll rather than cropping the CTA. */
@media (orientation:landscape) and (max-height:500px) and (max-width:950px) {
  .landing-page {
    height:auto;
    min-height:100vh; min-height:100svh; min-height:100dvh;
    overflow-x:hidden; overflow-y:auto;
    display:flex; align-items:center; justify-content:center;
    padding:max(10px, env(safe-area-inset-top, 0px))
            max(12px, env(safe-area-inset-right, 0px))
            max(10px, env(safe-area-inset-bottom, 0px))
            max(12px, env(safe-area-inset-left, 0px));
  }
  .landing-frame {
    height:auto; min-height:0; width:min(100%, 470px);
    display:flex; flex-direction:column; gap:10px;
  }
  .showcase {height:auto; min-height:0; max-height:none;}
  .showcase img {height:auto; max-height:min(62dvh, 360px); object-fit:contain;}
  .whatsapp-button {min-height:54px;}
}
@media (hover:none) and (pointer:coarse) {
  .whatsapp-button:hover {background:#20b566;box-shadow:0 9px 22px rgba(26,151,81,.18);transform:none;}
  .whatsapp-button:active {background:#159b57;transform:scale(.992);}
}