:root{--dark:#173a2d;--dark2:#22533d;--green:#167b51;--muted:#68776f;--orange:#ffdd9d;--cream:#faf8f3;--border:#e6e9e3;--shadow:0 12px 34px rgba(22,47,34,.07);font-family:system-ui,-apple-system,'Segoe UI',Roboto,'Noto Sans',Arial,sans-serif;color:#23362b;font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);min-width:320px}input,button,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}a{color:var(--green)}[hidden]{display:none!important}img{max-width:100%}h1,h2,h3,p{margin-top:0}h1,h2,h3{letter-spacing:-.045em}h1{font-size:clamp(1.9rem,4vw,3.1rem);line-height:1.15}h2{font-size:1.28rem;line-height:1.35}h3{font-size:1.06rem}.page-width{width:min(1180px,calc(100% - 40px));margin-inline:auto}.topbar{background:white;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}.topbar-inner{display:flex;min-height:75px;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-symbol{width:43px;height:43px;background:var(--dark);color:var(--orange);border-radius:14px;display:grid;place-items:center;font-weight:900;letter-spacing:-2px;font-size:1.15rem;flex-shrink:0}.brand strong,.brand small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.brand strong{font-size:1rem}.brand small{font-size:.73rem;color:var(--muted);margin-top:2px}.top-actions{display:flex;gap:10px;align-items:center;flex-shrink:0}.button{border:0;border-radius:13px;padding:13px 17px;font-weight:800;font-size:.87rem;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:transform .15s,background .15s;text-decoration:none}.button:active{transform:scale(.98)}.button.primary{background:var(--green);color:white}.button.primary:hover{background:#096642}.button.secondary{background:#ecf5ed;color:var(--dark)}.button.ghost{background:#f2f5f1;color:var(--dark)}.button.whatsapp{background:#25a767;color:white}.button.sm{font-size:.77rem;min-height:38px;padding:8px 12px}.button.full{width:100%}.table-badge,.owner-chip{font-size:.76rem;font-weight:800;background:#f4f4ec;color:#54705a;border-radius:100px;padding:10px 13px;max-width:160px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.owner-chip{background:#e9f4ed}.customer-main{padding-top:24px}.hero{min-height:265px;border-radius:29px;background:radial-gradient(circle at 78% 20%,#31674a,transparent 42%),linear-gradient(112deg,#143629,#234e3d);color:white;padding:clamp(27px,5vw,53px);display:flex;align-items:center;justify-content:space-between;overflow:hidden;position:relative}.hero-text{max-width:640px;position:relative;z-index:1}.hero h1{margin:9px 0 15px}.hero h1 em{font-style:normal;color:var(--orange)}.hero p{color:#d5e5db;line-height:1.75;max-width:510px;font-size:.91rem}.eyebrow,.overline{font-size:.68rem;letter-spacing:.14em;font-weight:900;color:var(--green)}.eyebrow{color:#ffdb9e}.hero-art{font-size:clamp(7rem,16vw,12rem);line-height:1;transform:rotate(-8deg);filter:drop-shadow(0 20px 24px #0a231e90);flex-shrink:0;margin-right:4%;position:relative}.hero-art span{position:absolute;font-size:.3em;bottom:-2px;right:-22px}.hero-pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.hero-pills span{background:#ffffff18;color:#e4f3e9;border:1px solid #ffffff17;border-radius:22px;padding:7px 12px;font-size:.72rem;font-weight:700}.identity-card,.panel-card{background:white;border:1px solid var(--border);border-radius:23px;box-shadow:var(--shadow)}.identity-card{margin-top:-13px;position:relative;padding:24px 27px;z-index:1}.identity-heading,.section-heading,.panel-title{display:flex;justify-content:space-between;align-items:flex-end;gap:14px}.identity-heading h2{margin:7px 0 0}.hint{font-size:.71rem;color:var(--muted)}label{display:flex;flex-direction:column;gap:8px;font-weight:800;font-size:.79rem;color:#405247}input:not([type=checkbox]):not([type=file]),textarea,select{width:100%;border:1px solid #dae1d8;border-radius:12px;background:white;color:#203a2a;padding:13px 14px;outline:0;min-width:0;min-height:46px}textarea{resize:vertical}input:focus,textarea:focus,select:focus{border-color:#63a582!important;box-shadow:0 0 0 3px #d8f0dc}input[readonly]{background:#f5f6f3}.identity-fields{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:17px}.section-heading{margin-top:36px;margin-bottom:17px}.section-heading h2{margin:5px 0}.section-heading p,.panel-title p{font-size:.81rem;color:var(--muted);margin:0}.count-chip{background:#fff1d9;color:#896228;border-radius:20px;font-size:.73rem;font-weight:800;padding:8px 12px;white-space:nowrap}.menu-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:20px}#menu-search{flex:1 1 220px;max-width:350px}.category-filters{display:flex;gap:8px;overflow-x:auto;min-width:0;padding-block:3px;scrollbar-width:thin}.category-filters button{background:#fff;border:1px solid var(--border);border-radius:13px;font-size:.74rem;font-weight:800;white-space:nowrap;padding:12px 14px;color:#596b60}.category-filters button.active{background:var(--dark);color:white}.menu-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.food-card{background:white;border:1px solid var(--border);border-radius:21px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 3px 9px #09230b06}.food-card:hover{box-shadow:var(--shadow)}.food-image{width:100%;aspect-ratio:1.46;object-fit:cover;background:#f1f2ec;display:block}.image-placeholder{display:grid;place-items:center;background:#eaf0e7;font-size:3rem}.food-body{padding:16px;display:flex;flex-direction:column;flex:1}.food-category{font-size:.62rem;color:var(--green);font-weight:900;text-transform:uppercase;letter-spacing:.05em}.food-body h3{font-size:.92rem;line-height:1.42;margin:7px 0 8px;min-height:2.5em}.food-body p{color:var(--muted);font-size:.71rem;line-height:1.6;margin:0 0 15px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.food-bottom{margin-top:auto;border-top:1px solid #edf0ea;padding-top:12px;display:flex;justify-content:space-between;gap:7px;align-items:center}.food-price{font-weight:900;font-size:.92rem;white-space:nowrap}.qty-control{display:flex;align-items:center;gap:7px;flex-shrink:0}.qty-control button{width:34px;height:34px;border:0;border-radius:10px;background:#def0e3;color:#12583a;font-size:1.2rem;font-weight:900}.qty-control span{font-size:.82rem;font-weight:800;min-width:15px;text-align:center}.qty-control .add{background:var(--green);color:white}.empty-state{padding:50px 20px;text-align:center;color:var(--muted);background:white;border-radius:20px}.public-footer{text-align:center;font-size:.74rem;color:#8f9890;padding:40px 0 95px}.cart-dock{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:30;width:min(560px,calc(100% - 28px))}.dock-button{display:flex;align-items:center;width:100%;padding:12px 16px;gap:11px;text-align:left;color:white;background:var(--dark);border:1px solid #41614e;border-radius:18px;box-shadow:0 16px 40px #102e2266}.dock-count{background:#e8b953;color:#1c3221;padding:10px 13px;border-radius:12px;font-weight:900}.dock-button small,.dock-button strong{display:block}.dock-button small{font-size:.67rem;color:#c4d6c7}.dock-button strong{font-size:1rem}.dock-cta{margin-left:auto;background:#27764b;padding:11px 12px;font-size:.73rem;font-weight:800;border-radius:10px}.drawer-backdrop{position:fixed;inset:0;background:#071b13b0;z-index:50}.cart-drawer{position:fixed;z-index:51;top:0;bottom:0;right:0;width:min(440px,100%);background:#fff;display:flex;flex-direction:column;box-shadow:-12px 0 50px #0624163b}.drawer-header{padding:21px 23px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:12px}.drawer-header h2{margin:3px 0 0}.close-icon{width:36px;height:36px;flex-shrink:0;border:0;border-radius:11px;background:#f0f2ee;color:#24392a;font-weight:800}.drawer-scroll{padding:15px 20px;overflow-y:auto;flex:1}.cart-item{display:flex;align-items:center;gap:12px;border:1px solid var(--border);border-radius:15px;padding:11px;margin-bottom:10px}.cart-item img{width:60px;height:60px;object-fit:cover;border-radius:10px;background:#e6ede5}.cart-item .item-info{flex:1;min-width:0}.cart-item strong{display:block;font-size:.79rem;line-height:1.45}.cart-item small{font-weight:800;color:var(--green)}.checkout-box{border-top:1px solid var(--border);padding:17px 23px 22px;box-shadow:0 -6px 25px #142d170b}.total-line{display:flex;justify-content:space-between;margin:17px 0;font-size:.9rem}.total-line strong{font-size:1.14rem}.checkout-identity{background:#f3f7f1;padding:12px;border-radius:11px;margin-bottom:12px;font-size:.78rem}.microcopy{font-size:.71rem;color:#758077;line-height:1.7;margin:9px 0 0}.dialog-card{border:0;border-radius:22px;padding:0;width:min(510px,calc(100% - 20px));max-height:min(90dvh,900px);overflow-y:auto;box-shadow:0 25px 90px #061d1555;background:white;color:inherit}.dialog-card::backdrop{background:#0b201ab5;backdrop-filter:blur(3px)}.dialog-content{padding:clamp(17px,4vw,28px);display:flex;flex-direction:column;gap:13px}.dialog-content.centered{text-align:center}.dialog-content h2{margin:3px 0 0}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.success-icon{width:65px;height:65px;border-radius:50%;background:#dcf7e4;color:#197649;display:grid;place-items:center;font-size:2rem;margin:0 auto 8px}.success-items{background:#f5f7f3;padding:15px;border-radius:14px;text-align:left;font-size:.79rem}.wifi-info{background:#f7f8f3;padding:15px;border-radius:13px;display:grid;grid-template-columns:auto 1fr;gap:13px;font-size:.84rem}.wifi-info span{color:var(--muted)}.wifi-info strong{text-align:right;overflow-wrap:anywhere}.wifi-qr{display:block;width:180px;height:180px;margin:auto}.muted{color:var(--muted);font-size:.82rem;line-height:1.7}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:150;background:#173e2e;color:white;border-radius:13px;padding:13px 18px;box-shadow:0 10px 35px #071a1380;font-size:.8rem;font-weight:800;text-align:center;max-width:calc(100vw - 32px)}.toast.error{background:#a6382e}.initial-loading{text-align:center;padding:25vh 25px;font-weight:800;color:var(--dark)}
/* PEMILIK */
.owner-main{padding-top:32px;padding-bottom:60px}.owner-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:15px}.owner-intro h1{font-size:clamp(1.8rem,3.5vw,2.45rem);margin:7px 0}.owner-intro p{font-size:.82rem;color:var(--muted);margin:0}.owner-tabs{display:flex;gap:9px;overflow-x:auto;border-bottom:1px solid #dfe5da;margin:24px 0;scrollbar-width:thin;padding-bottom:10px}.owner-tabs button{white-space:nowrap;border:0;border-radius:11px;padding:12px 17px;background:white;color:#4b6255;font-weight:800;font-size:.8rem}.owner-tabs button.active{background:var(--dark);color:white}.metrics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:18px}.metric{border:1px solid var(--border);background:white;border-radius:17px;padding:20px;min-width:0}.metric small{display:block;color:var(--muted);font-weight:800;font-size:.75rem;line-height:1.5}.metric strong{display:block;font-size:clamp(1.15rem,2vw,1.65rem);font-weight:900;letter-spacing:-.055em;margin-top:7px;overflow-wrap:anywhere}.metric .sub{font-size:.68rem;color:#829086;margin-top:5px}.panel-card{padding:clamp(16px,2.6vw,27px);margin-bottom:20px}.panel-title{align-items:center;margin-bottom:18px}.panel-title h2{margin-bottom:3px}.panel-title input{max-width:270px}.order-list{display:grid;gap:12px}.order-card{padding:15px;border:1px solid var(--border);border-radius:16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}.order-card-header{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.order-card strong{font-size:.84rem}.order-meta{font-size:.73rem;color:var(--muted);margin-top:6px;line-height:1.65;overflow-wrap:anywhere}.order-card-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;max-width:400px}.order-card-actions .button{font-size:.73rem;min-height:36px;padding:8px 10px}.status-pill{font-size:.66rem;font-weight:900;border-radius:30px;padding:6px 9px;background:#f0f1eb;color:#5c6661}.status-pill.baru{background:#fff3d2;color:#8a6317}.status-pill.diproses{background:#e3f1fc;color:#246e99}.status-pill.selesai{background:#e1f5e6;color:#27754b}.status-pill.dibatalkan{background:#ffe9e8;color:#9b3835}.paid{color:#18814b}.not-paid{color:#c1832c}.owner-menu-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.owner-menu-item{display:flex;gap:13px;align-items:center;border:1px solid var(--border);padding:13px;border-radius:15px;min-width:0}.owner-menu-item img,.owner-menu-item .image-placeholder{width:80px;height:74px;border-radius:11px;object-fit:cover;flex-shrink:0}.owner-menu-item .image-placeholder{font-size:2.2rem}.owner-menu-item .info{min-width:0;flex:1}.owner-menu-item h3{font-size:.83rem;line-height:1.4;margin:0 0 4px}.owner-menu-item p{font-size:.72rem;color:var(--muted);margin:0}.owner-menu-item .controls{display:flex;gap:5px;flex-shrink:0}.owner-menu-item button{background:#eff5ee;border:0;border-radius:9px;padding:9px;font-weight:800;font-size:.71rem}.owner-menu-item .delete{background:#fff0ed;color:#c04840}.sold-items{display:grid;gap:10px}.sold-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto auto;gap:12px;align-items:center;border-bottom:1px solid var(--border);padding:12px 2px;font-size:.8rem}.sold-row strong{overflow-wrap:anywhere}.sold-row .number{background:#eaf5e9;width:31px;height:31px;display:grid;place-items:center;border-radius:8px;font-weight:900}.sold-row span{color:var(--muted)}.settings-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0 26px}.settings-form .button{align-self:end}.panel-card hr{border:0;border-top:1px solid var(--border);margin:25px 0}.qr-panel{display:grid;grid-template-columns:1fr auto;gap:35px;align-items:start}.qr-panel>div:first-child{display:grid;gap:14px}.qr-panel p{color:var(--muted);font-size:.8rem;line-height:1.65;margin:0}.button-row{display:flex;flex-wrap:wrap;gap:9px}.qr-display{text-align:center;border:2px dashed #c9dfce;padding:20px;border-radius:20px;width:270px;background:#fff;display:grid;justify-items:center;gap:9px}.qr-display img{width:225px;height:225px;object-fit:contain}.qr-display strong{font-size:.98rem}.qr-display span{font-size:.7rem;color:var(--muted)}.auth-wrapper{display:grid;min-height:calc(100vh - 76px);place-items:center;padding:28px 15px}.auth-card{background:#fff;border:1px solid var(--border);border-radius:24px;box-shadow:var(--shadow);width:min(420px,100%);padding:35px;display:grid;gap:13px}.auth-icon{font-size:2.1rem}.auth-card h1{font-size:1.8rem;margin:0}.auth-card p{font-size:.83rem;color:var(--muted);line-height:1.6;margin:0}.auth-card form{display:grid;gap:16px;margin-top:8px}.small-link{font-size:.76rem;font-weight:800;text-align:center;margin-top:9px}.auth-help{font-size:.74rem!important}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.checkbox-line{flex-direction:row;align-items:center;gap:9px}.checkbox-line input{width:18px;height:18px;accent-color:var(--green)}.edit-photo-preview{max-height:180px;width:100%;object-fit:cover;border-radius:13px;background:#f0f4ed}.detail-items{border-top:1px dashed var(--border);border-bottom:1px dashed var(--border);padding:10px 0}.detail-items .line,.detail-total{display:flex;justify-content:space-between;gap:15px;font-size:.81rem;padding:7px 0}.detail-total strong{font-size:1.15rem}.detail-meta{font-size:.82rem;line-height:1.8;color:#52665a}.detail-meta strong{color:var(--dark)}.print-only{display:none}
@media(max-width:1040px){.menu-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.owner-menu-list{grid-template-columns:1fr}}
@media(max-width:740px){.page-width{width:calc(100% - 28px)}.topbar-inner{min-height:65px}.brand strong{font-size:.84rem}.brand small{font-size:.65rem}.brand-symbol{width:39px;height:39px}.hero{min-height:225px;border-radius:20px;padding:24px}.hero-art{font-size:6rem;opacity:.6;margin:0 -10px}.hero p{font-size:.78rem}.hero-pills span{font-size:.64rem;padding:6px 8px}.identity-card{padding:18px;border-radius:19px}.section-heading{margin-top:29px}.menu-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.food-image{aspect-ratio:1.3}.food-body{padding:12px}.food-body h3{font-size:.79rem;min-height:0}.food-price{font-size:.77rem}.food-body p{font-size:.68rem}.qty-control{gap:4px}.qty-control button{width:30px;height:30px}.owner-main{padding-top:22px}.owner-intro{align-items:flex-start}.owner-intro .button{font-size:.72rem;padding:8px}.owner-tabs{margin:18px 0}.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{padding:14px}.order-card{grid-template-columns:1fr}.order-card-actions{justify-content:flex-start}.panel-title{align-items:flex-start;flex-wrap:wrap}.panel-title input{max-width:100%}.qr-panel{grid-template-columns:1fr}.qr-display{margin:auto}.settings-form{grid-template-columns:1fr}.owner-menu-item{flex-wrap:wrap}.owner-menu-item .controls{margin-left:auto}}
@media(max-width:440px){.brand small{display:none}.brand strong{max-width:132px}.table-badge{font-size:.65rem;max-width:92px;padding:9px 8px}.top-actions{gap:5px}.top-actions .button.sm{padding:7px 8px;min-height:35px}.hero h1{font-size:1.9rem}.hero-art{font-size:4.5rem;margin-left:-40px;margin-right:-15px;opacity:.5}.hero-text{max-width:94%}.identity-heading .hint{display:none}.identity-fields{grid-template-columns:1fr;gap:10px}.section-heading h2{font-size:1.1rem}.category-filters{width:100%}.food-card{border-radius:15px}.food-body{padding:10px}.food-body h3{font-size:.75rem;min-height:2em}.food-bottom{flex-wrap:wrap}.food-price{width:100%}.qty-control{width:100%;justify-content:flex-end}.food-body p{margin-bottom:10px}.hero-pills{gap:5px}.hero-pills span:last-child{display:none}.owner-chip{font-size:.65rem;padding:7px}.owner-intro h1{font-size:1.55rem}.form-grid{grid-template-columns:1fr}.sold-row{grid-template-columns:30px 1fr auto}.sold-row span:last-child{grid-column:2 / -1;text-align:right}.dialog-content{gap:11px}.dock-cta{font-size:.65rem;padding:10px 6px}}
@media print{ @page{margin:5mm;size:auto}body{background:white!important}.topbar,#customer-app,#owner-app,.toast,.initial-loading,dialog{display:none!important}#receipt-print{display:block!important;position:static;background:white;color:#000;width:76mm;max-width:100%;margin:0 auto;font-family:ui-monospace,monospace;font-size:11px;line-height:1.5}#receipt-print .receipt-center{text-align:center}#receipt-print h2{font:900 15px ui-monospace,monospace;margin:4px 0}#receipt-print .receipt-row{display:flex;justify-content:space-between;gap:10px;break-inside:avoid}#receipt-print hr{border:0;border-top:1px dashed #777;margin:10px 0}#receipt-print .receipt-total{font-weight:900;font-size:13px}.qr-printing #qr-print-area{display:grid!important}body.qr-printing #receipt-print{display:none!important}body.qr-printing #owner-app{display:block!important}body.qr-printing #owner-app > *{display:none!important}body.qr-printing #owner-main{display:block!important;padding:0}body.qr-printing #owner-main > *{display:none!important}body.qr-printing #panel-qr{display:block!important}body.qr-printing #panel-qr > *{border:0;box-shadow:none;padding:0}body.qr-printing #panel-qr .qr-panel>div:first-child{display:none!important}body.qr-printing #panel-qr .qr-display{display:grid!important;border:1px solid #ccc}}

/* LOGIN, PENDAFTARAN & MASTER ADMIN */
.auth-card{width:min(540px,100%);max-width:calc(100vw - 24px)}
.auth-card [hidden],.auth-form [hidden]{display:none!important}
.auth-form{display:grid;gap:14px;margin:12px 0}
.auth-form label{display:grid;gap:7px;min-width:0;font-weight:750;font-size:.82rem}
.auth-form label > input,.auth-form label > textarea{width:100%;min-width:0}
.auth-form textarea{resize:vertical;min-height:90px}
.auth-card p{line-height:1.6}
.auth-notice{padding:13px;background:#f0f7f0;border:1px solid #d9e9dc;border-radius:12px;font-size:.81rem;color:#28543d}
.password-field{position:relative;display:flex;min-width:0;align-items:center}
.password-field input{width:100%;padding-right:49px!important;min-width:0}
.password-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);border:0;background:transparent;cursor:pointer;border-radius:8px;min-width:36px;min-height:36px;font-size:1.05rem}
.password-toggle:focus-visible{outline:2px solid #258154;outline-offset:2px}
.auth-card .back-customer{text-align:center;display:block;margin-top:12px}
.user-approval-list{display:grid;gap:12px}
.user-approval-card{border:1px solid var(--border);padding:18px;border-radius:15px;background:white;min-width:0}
.user-approval-heading{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.user-approval-card p{color:var(--muted);font-size:.79rem;line-height:1.8;overflow-wrap:anywhere}
.user-approval-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.status-pill.pending{background:#fff3d2;color:#84600e}
.status-pill.approved{background:#dbf5e2;color:#176c37}
.status-pill.rejected,.status-pill.disabled{background:#ffe6e6;color:#9b3737}
.top-actions .login-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
@media (max-width:600px){
  .auth-wrapper{padding:15px 10px;min-height:auto}
  .auth-card{padding:20px 16px;border-radius:17px;width:100%}
  .auth-form{gap:11px}
  .user-approval-card{padding:13px}
  .user-approval-actions>*{flex:1 1 120px;text-align:center}
  .topbar-inner{gap:6px}
  .top-actions .login-link{padding:7px 8px;min-height:35px;font-size:.72rem}
  .owner-topbar .top-actions{flex-wrap:wrap;justify-content:end}
  .owner-topbar .owner-chip{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* Pemisahan antarmuka Master Admin & Owner (21 Oktober 2026) */
.master-shell{display:grid;grid-template-columns:255px minmax(0,1fr);min-height:100vh;background:#f7f9f6;color:#203c2e}
.master-sidebar{background:#153a2b;color:#fff;min-height:100vh;padding:24px 15px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.master-identity{display:flex;align-items:center;gap:12px;padding:7px 9px 25px;border-bottom:1px solid #ffffff24}
.master-identity .brand-symbol{flex-shrink:0;background:#fff;color:#17603d}
.master-identity strong{display:block;font-size:.8rem;letter-spacing:.08em}
.master-identity small{display:block;margin-top:4px;color:#b6d5c3;font-size:.65rem}
.master-nav{display:grid;gap:7px;margin-top:22px}
.master-nav button{border:0;text-align:left;color:#d9e9df;padding:15px 14px;border-radius:11px;background:transparent;display:flex;align-items:center;gap:13px;font-size:.87rem;font-weight:800}
.master-nav button span{flex:1}
.master-nav button.active,.master-nav button:hover{background:#ffffff1c;color:#fff}
.master-nav small{display:grid;place-items:center;border-radius:50%;background:#fff;color:#1c744b;min-width:20px;min-height:20px;font-size:.68rem}
.master-nav small:empty{display:none}
.master-sidebar-bottom{margin-top:auto;display:grid;gap:10px}
.master-sidebar-bottom .button{color:#fff;border:1px solid #ffffff35}
.master-content{min-width:0}
.master-topbar{background:#fff;border-bottom:1px solid var(--border);height:75px;padding:13px clamp(16px,3vw,35px);display:flex;align-items:center;justify-content:space-between;gap:12px}
.master-topbar strong{display:block;font-size:.98rem}.master-topbar small{font-size:.73rem;color:var(--muted)}
.master-main{max-width:1450px;margin:0 auto;padding:32px clamp(15px,3vw,36px)}
.master-page>h1,.master-section-head h1{font-size:clamp(1.5rem,3vw,2.1rem);margin:5px 0 12px}
.master-page>.metrics-grid{margin:28px 0}
.master-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 24px;flex-wrap:wrap}
.master-filters{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.master-filters input{min-width:200px;flex:1;max-width:510px}.master-filters select{width:180px}
.master-table-scroll{width:100%;overflow-x:auto;overscroll-behavior-x:contain}
.master-user-table{width:100%;border-collapse:collapse;font-size:.76rem;text-align:left;min-width:1020px}
.master-user-table th{padding:14px 11px;background:#edf3ee;color:#365644;white-space:nowrap;font-size:.73rem}
.master-user-table td{padding:15px 11px;border-bottom:1px solid var(--border);vertical-align:middle}
.master-user-table td strong{display:block;font-size:.79rem}.master-user-table td small{display:block;max-width:180px;color:var(--muted);overflow-wrap:anywhere;margin-top:5px}
.master-user-table td code{background:#f3f7f4;border-radius:7px;padding:5px;color:#335c45;font-size:.74rem}
.password-mask{letter-spacing:.16em;color:#7b8d81}
.role-pill{padding:6px 10px;background:#e7f3eb;border-radius:20px;color:#226747;font-size:.7rem;font-weight:800}
.user-status{display:inline-flex;border-radius:25px;padding:6px 10px;font-size:.67rem;font-weight:900;white-space:nowrap;background:#eee;color:#556}
.user-status.approved{background:#e0f6e6;color:#1e7648}.user-status.pending{background:#fff1d0;color:#9a670c}.user-status.disabled,.user-status.rejected{background:#fbe6e6;color:#ae4141}
.master-row-actions{display:flex;gap:5px;flex-wrap:nowrap}
.master-icon-button{border:1px solid #e2e9e1;background:#f8faf8;color:#2e6749;min-width:32px;height:32px;display:grid;place-items:center;border-radius:9px;font-size:1.05rem;font-weight:900}
.master-icon-button:hover{background:#e5f2e8}.master-icon-button[data-master-action=delete]{color:#b84444;background:#fff5f4}
.master-pagination{margin-top:19px;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-size:.72rem;color:var(--muted)}
.master-pagination>div{display:flex;align-items:center;gap:12px}
.master-pagination .button{font-size:.7rem}
.master-recent{margin-top:18px}.master-recent-row{display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--border);padding:13px 0}.master-recent-row:last-child{border-bottom:0}.master-recent-row strong{display:block;font-size:.8rem}.master-recent-row small{display:block;color:var(--muted);margin-top:4px;font-size:.72rem}
.master-user-dialog{width:min(660px,calc(100vw - 20px));max-width:100%}.master-user-dialog .dialog-content{max-height:min(86vh,900px);overflow-y:auto}.master-user-dialog #master-new-store{display:grid;gap:14px}
.master-user-dialog .dialog-content label{display:grid;gap:7px;margin-bottom:4px;font-size:.8rem;font-weight:750}
.master-user-dialog textarea{resize:vertical}
.finance-date-tools{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:0 0 20px}.finance-date-tools label{display:grid;gap:8px;font-size:.82rem;font-weight:800}.finance-date-tools input{max-width:230px}
.owner-main .owner-intro h1{font-size:clamp(1.4rem,3vw,1.95rem)}
.owner-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:6px}.owner-tabs button{white-space:nowrap;flex:0 0 auto}
.master-user-table .empty-cell{text-align:center;color:var(--muted);padding:35px 10px}
@media(max-width:900px){.master-shell{grid-template-columns:210px minmax(0,1fr)}.master-sidebar{padding:15px 9px}.master-main{padding:20px 13px}}
@media(max-width:660px){.master-shell{display:block}.master-sidebar{height:auto;min-height:0;position:static;padding:13px 12px}.master-identity{padding:3px 5px 13px}.master-nav{margin:10px 0 0;display:flex}.master-nav button{flex:1;justify-content:center;padding:12px 9px;gap:7px;font-size:.74rem}.master-nav button span{flex:0 1 auto}.master-sidebar-bottom{display:none}.master-topbar{height:65px}.master-topbar strong{font-size:.87rem}.master-main{padding:20px 12px}.master-page>.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.master-user-dialog .form-grid{grid-template-columns:1fr}.master-section-head .button{width:100%}.master-filters input,.master-filters select{width:100%;max-width:none}.master-pagination>div{width:100%;justify-content:space-between}}
/* Perapihan aksi master dan navigasi, termasuk layar HP */
.master-sidebar-bottom .button{background:transparent;color:#f5fff8;border:1px solid #ffffff35}
.master-sidebar-bottom .button:hover{background:#ffffff1c}
.master-user-table{min-width:940px}
.master-user-table th,.master-user-table td{padding-left:8px;padding-right:8px}
.master-icon-button{min-width:29px;width:29px;height:30px;font-size:.94rem}
.master-row-actions{gap:4px}
.mobile-table-hint{font-size:.72rem;color:var(--muted);display:none;margin:0 0 10px}
@media(max-width:660px){.mobile-table-hint{display:block}}

/* Tombol dan formulir khusus ganti password Master Admin */
.master-header-actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px}
.master-header-actions .button{white-space:nowrap}
.master-password-dialog{width:min(480px,calc(100vw - 20px))}
.master-password-dialog .dialog-content{gap:17px}
.master-password-label{display:grid;gap:9px;font-size:.8rem;font-weight:800}
.master-password-label .password-field{width:100%}
.master-password-label .password-field input{width:100%;padding-right:50px}
@media(max-width:660px){.master-header-actions{width:100%;display:grid;grid-template-columns:1fr}.master-header-actions .button{width:100%;white-space:normal}}

/* Multi-tenant / multi-warung SELERA */
.owner-store-choice{display:flex;flex-direction:column;gap:3px;font-size:.65rem;font-weight:800;color:#496854;max-width:235px}
.owner-store-choice select{width:100%;min-width:135px;padding:8px;border:1px solid #c9ddcf;border-radius:9px;background:#fff;color:#1f4630;font-size:.76rem}
.owner-header-actions{display:flex;gap:9px;flex-wrap:wrap}
#finance-scope{min-width:210px}
#finance-stores-panel{margin-top:16px}
.master-page .master-user-table a{color:#14704a;text-decoration:underline}
#master-stores-body td:nth-child(3){min-width:200px;max-width:470px;line-height:1.6}
#master-membership-dialog{width:min(490px,calc(100vw - 20px))}
#master-membership-dialog label,#owner-store-dialog label{display:grid;gap:7px;font-weight:750}
@media(max-width:760px){.owner-topbar .topbar-inner{flex-wrap:wrap;gap:8px}.owner-store-choice{max-width:45vw}.owner-topbar .owner-chip{display:none}.owner-header-actions{width:100%}.owner-header-actions .button{flex:1}.finance-date-tools label{max-width:100%}#finance-scope{min-width:0;width:100%}}

/* Aset ikon lokal: tidak menggunakan CDN ataupun font ikon pihak ketiga */
.ui-icon{display:inline-block;width:1.1em;height:1.1em;flex-shrink:0;vertical-align:-.16em;fill:none;stroke:currentColor;stroke-width:1.8}button .ui-icon,a .ui-icon{margin-right:.28em} .master-nav .ui-icon{width:19px;height:19px;margin-right:8px;vertical-align:middle} .photo-upload-hint{font-size:.75rem;color:var(--muted);line-height:1.55;margin:0}#edit-upload{max-width:100%}