:root{--bg: #f6f7f9;--surface: #ffffff;--text: #111827;--muted: #6b7280;--line: #eceef1;--primary: #0f766e;--primary-dark: #0b5d57;--primary-soft: #e6f4f2;--amber: #b45309;--amber-soft: #fef3c7;--blue: #1d4ed8;--blue-soft: #e0eaff;--violet: #6d28d9;--violet-soft: #efe9ff;--green: #15803d;--green-soft: #dcfce7;--gray: #4b5563;--gray-soft: #f0f1f3;--red: #c81e1e;--red-soft: #fde8e8;--radius: 18px;--tabbar-h: 66px}*{box-sizing:border-box}html,body{margin:0}body{font-family:IBM Plex Sans Arabic,Segoe UI,Tahoma,Noto Sans Arabic,system-ui,sans-serif;font-size:16px;line-height:1.5;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit;color:inherit}button{touch-action:manipulation}h1,h2,p{margin:0}a{color:inherit;text-decoration:none}.app{max-width:520px;margin:0 auto;min-height:100dvh;padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 24px)}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(14px + env(safe-area-inset-top)) 20px 12px;background:#f6f7f9eb;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.topbar-text{min-width:0}.topbar h1{font-size:24px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar p{margin-top:2px;font-size:14px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.content{padding:4px 16px 16px;display:flex;flex-direction:column;gap:12px}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:520px;z-index:20;display:flex;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.tabbar button{flex:1;height:var(--tabbar-h);border:0;background:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:12px;font-weight:500;color:var(--muted)}.tabbar button.active{color:var(--primary);font-weight:650}.tab-icon{position:relative;display:inline-flex}.tabbar button.main .tab-icon{background:var(--primary);color:#fff;border-radius:12px;padding:4px 14px}.tabbar button.main.active .tab-icon{background:var(--primary-dark)}.tabbar .count{position:absolute;top:-6px;inset-inline-end:-10px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;font-style:normal;font-weight:700;line-height:18px;text-align:center;border:2px solid var(--surface);box-sizing:content-box}.icon{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}.card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--line);padding:16px}.list{display:flex;flex-direction:column;gap:10px}.row{display:flex;align-items:center;gap:8px}.between{justify-content:space-between}.grow{flex:1;min-width:0}.center{text-align:center;justify-content:center}.muted{color:var(--muted)}.small{font-size:13px}.pos{color:var(--green);font-weight:700;white-space:nowrap}.warn-text{color:var(--amber)}.section-title{font-size:13px;font-weight:650;color:var(--muted);margin:8px 4px -2px}.badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:650;white-space:nowrap}.badge-amber{background:var(--amber-soft);color:var(--amber)}.badge-blue{background:var(--blue-soft);color:var(--blue)}.badge-violet{background:var(--violet-soft);color:var(--violet)}.badge-green{background:var(--green-soft);color:var(--green)}.badge-gray{background:var(--gray-soft);color:var(--gray)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:54px;padding:0 20px;border-radius:16px;border:0;background:var(--primary);color:#fff;font-size:16px;font-weight:650;cursor:pointer;white-space:nowrap}.btn:active:not(:disabled){background:var(--primary-dark)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.block{width:100%}.btn.grow{flex:1}.btn.sm{height:42px;padding:0 18px;font-size:15px;border-radius:12px}.btn.secondary{background:var(--gray-soft);color:var(--text)}.btn.secondary:active:not(:disabled){background:var(--line)}.btn.success{background:var(--green)}.btn.danger-text{background:transparent;color:var(--red)}.btn-row{display:flex;gap:10px}.link-btn{display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:8px 0;color:var(--primary);font-weight:600;font-size:15px;cursor:pointer}.link-btn.inline{padding:0}.link-btn.center{align-self:center;width:100%;justify-content:center}.link-btn.muted{color:var(--muted);font-weight:500}.icon-btn{width:44px;height:44px;flex:none;border-radius:14px;border:0;background:var(--gray-soft);color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.icon-btn.plain{background:transparent;color:var(--muted)}.icon-btn.primary{background:var(--primary);color:#fff}.form{display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:6px;min-width:0}.field-label{font-size:14px;font-weight:600}.field-hint{font-size:13px;color:var(--muted)}.input{width:100%;min-width:0;height:54px;padding:0 16px;border:1.5px solid var(--line);border-radius:14px;background:var(--surface);font-size:17px}.input::placeholder{color:#a3a8b0}textarea.input{height:auto;padding:14px 16px;resize:none;line-height:1.4}select.input{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-inline-end:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 14px center}.input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.more{display:flex;flex-direction:column;gap:16px;padding:16px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line)}.check{display:flex;align-items:center;gap:12px;font-size:15px;cursor:pointer}.check input{width:22px;height:22px;accent-color:var(--primary);flex:none}.search{position:relative}.search .icon{position:absolute;inset-inline-start:16px;top:50%;transform:translateY(-50%);color:var(--muted)}.search .input{padding-inline-start:44px;height:48px;font-size:16px}.submit-bar{position:sticky;bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 8px);display:flex;align-items:center;gap:12px;padding:10px;padding-inline:16px 10px;margin-top:4px;border-radius:20px;background:var(--text);color:#fff;box-shadow:0 10px 30px #11182740}.submit-sum{flex:1;min-width:0;display:flex;flex-direction:column}.submit-sum span{font-size:13px;opacity:.7}.submit-sum b{font-size:17px}.seg{display:flex;gap:4px;padding:4px;background:var(--gray-soft);border-radius:14px}.seg button{flex:1;height:42px;border:0;border-radius:11px;background:transparent;font-weight:600;font-size:15px;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}.seg button.on{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #00000014}.seg-count{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--primary);color:#fff;font-size:12px;line-height:20px}.kv{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}.kv>span:first-child{color:var(--muted);flex:none}.kv>span:last-child{text-align:end;overflow-wrap:anywhere}.kv:first-child{padding-top:0}.kv:last-child{border-bottom:0;padding-bottom:0}.kv.total{font-weight:700;font-size:17px}.kv.total>span:first-child{color:var(--text)}.kv.sub{font-size:14px;padding-inline-start:8px}.notice{background:var(--amber-soft);color:var(--amber);padding:12px 16px;border-radius:14px;font-size:14px}.notice.ok{background:var(--green-soft);color:var(--green)}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}.stat b{display:block;font-size:26px;line-height:1.2}.stat b.stat-money{font-size:19px;line-height:31px}.stat span{font-size:13px;color:var(--muted)}.stat.alert{background:var(--amber-soft);border-color:transparent}.stat.alert b,.stat.alert span{color:var(--amber)}.hero{display:flex;flex-direction:column;gap:4px;padding:22px 20px;border-radius:22px;background:var(--primary);color:#fff}.hero b{font-size:34px}.hero span{opacity:.85;font-size:14px}.empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:56px 16px;color:var(--muted)}.empty-icon{width:64px;height:64px;border-radius:50%;background:var(--gray-soft);display:grid;place-items:center}.empty p{color:var(--text);font-weight:650;font-size:17px;margin:14px 0 4px}.empty>span{font-size:15px;max-width:280px}.avatar{position:relative;width:44px;height:44px;flex:none;border-radius:50%;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center;font-weight:700;font-size:17px}.avatar.lg{width:54px;height:54px;font-size:21px}.avatar .dot{position:absolute;inset-inline-end:0;bottom:0;border:2px solid var(--surface)}.dot{width:11px;height:11px;flex:none;border-radius:50%;background:#c9cdd3}.dot.on{background:#22c55e}.person-row{display:flex;align-items:center;gap:12px}.list-card{padding:0 16px}.list-row{width:100%;display:flex;align-items:center;gap:12px;padding:14px 0;border:0;border-bottom:1px solid var(--line);background:none;text-align:start;cursor:pointer}.list-row:last-child{border-bottom:0}.list-row>.icon:last-child{color:#c3c7cd}.list-row.disabled{opacity:.5}.list-row.add-row{color:var(--primary);font-weight:600;gap:8px}.price{font-size:17px;white-space:nowrap}.ocard{width:100%;text-align:start;cursor:pointer;display:flex;flex-direction:column;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}.ocard:active{background:#fafbfc}.ocard.flag{border-color:#f5c66b}.ocard-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.ocard-title{font-weight:650;font-size:17px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ocard-addr{color:var(--muted);font-size:15px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.ocard-addr b{color:var(--text);font-weight:600}.ocard-meta{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--muted)}.ocard-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;color:var(--muted);margin-top:2px}.ocard-foot b{color:var(--text);font-size:15px;white-space:nowrap}.status-head{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:4px 0 6px}.status-head .badge{font-size:15px;padding:6px 14px}.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);width:100%}.steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;color:var(--muted);text-align:center}.steps li:before{content:"";position:absolute;top:6px;inset-inline-end:50%;width:100%;height:3px;background:var(--line)}.steps li:first-child:before{display:none}.steps .step-dot{width:15px;height:15px;border-radius:50%;background:var(--line);position:relative;z-index:1}.steps li.done{color:var(--text);font-weight:600}.steps li.done:before,.steps li.done .step-dot{background:var(--primary)}.timeline-wrap summary{list-style:none;display:flex;align-items:center;justify-content:space-between;font-weight:600;cursor:pointer}.timeline-wrap summary::-webkit-details-marker{display:none}.timeline-wrap[open] summary .icon{transform:rotate(180deg)}.timeline{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}.timeline li{display:flex;gap:12px;align-items:flex-start;font-size:14px}.tl-dot{width:10px;height:10px;margin-top:5px;flex:none;border-radius:50%}.tone-amber{background:var(--amber)}.tone-blue{background:var(--blue)}.tone-violet{background:var(--violet)}.tone-green{background:var(--green)}.tone-gray{background:var(--gray)}.pool{display:flex;flex-direction:column;gap:8px}.pool-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.pool-city{font-size:20px;font-weight:750}.pool-addr{font-size:16px}.pool-meta{display:flex;gap:16px;font-size:14px;color:var(--muted)}.pool-meta span{display:inline-flex;align-items:center;gap:5px}.pool-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;margin-top:4px;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}.pool-foot b{color:var(--text)}.pill-money{background:var(--green-soft);color:var(--green);font-weight:700;font-size:15px;padding:5px 12px;border-radius:999px;white-space:nowrap}.job{display:flex;flex-direction:column;gap:14px}.job-step{display:flex;gap:14px;align-items:flex-start}.job-num{width:32px;height:32px;flex:none;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-weight:700}.job-label{font-size:13px;font-weight:600;color:var(--muted)}.job-title{display:block;font-size:19px;margin:2px 0}.job-note{background:var(--gray-soft);border-radius:12px;padding:12px 14px;font-size:15px;display:flex;flex-direction:column;gap:4px}.collect{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:14px;background:var(--amber-soft);color:var(--amber);font-weight:600}.collect b{font-size:21px;color:var(--text);white-space:nowrap}.collect.none{background:var(--green-soft);color:var(--green)}.collect.none b{color:var(--green)}.switch{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0;padding-inline:4px 14px;border-radius:999px;border:0;cursor:pointer;font-size:14px;font-weight:650;background:var(--gray-soft);color:var(--muted)}.switch .knob{width:30px;height:30px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #00000026;position:relative}.switch .knob:after{content:"";position:absolute;top:10px;right:10px;bottom:10px;left:10px;border-radius:50%;background:#c9cdd3}.switch.on{background:var(--green-soft);color:var(--green)}.switch.on .knob:after{background:#22c55e}.card-head{margin-bottom:4px}.pick-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.pick-row:last-child{border-bottom:0;padding-bottom:0}.cred{font-family:ui-monospace,Cascadia Mono,Consolas,monospace;background:var(--gray-soft);padding:14px;border-radius:12px;display:flex;flex-direction:column;gap:4px;font-size:15px;margin:10px 0 12px;word-break:break-all}.split{display:grid;grid-template-columns:1fr 1fr;gap:10px}.split>div{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column}.split span{font-size:13px;color:var(--muted)}.split b{font-size:18px}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#11182766;display:flex;align-items:flex-end;justify-content:center;animation:fade .15s ease-out}.sheet{width:100%;max-width:520px;max-height:92dvh;display:flex;flex-direction:column;background:var(--bg);border-radius:24px 24px 0 0;animation:up .22s cubic-bezier(.2,.8,.2,1)}.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px 8px 12px}.sheet-head h2{font-size:20px}.sheet-body{overflow-y:auto;padding:4px 16px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px}@media (min-width: 640px){.sheet-backdrop{align-items:center;padding:24px}.sheet{border-radius:24px;max-height:88dvh}}.toasts{position:fixed;top:calc(12px + env(safe-area-inset-top));left:50%;transform:translate(-50%);z-index:100;width:calc(100% - 32px);max-width:420px;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{padding:14px 18px;border-radius:16px;background:var(--text);color:#fff;font-size:15px;font-weight:500;box-shadow:0 10px 30px #11182740;animation:down .2s ease-out}.toast-err{background:var(--red)}.splash{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;text-align:center}.splash p{font-weight:650;font-size:17px;margin-top:8px}.offline{position:sticky;top:0;z-index:60;background:var(--amber);color:#fff;text-align:center;font-size:14px;font-weight:600;padding:calc(8px + env(safe-area-inset-top)) 16px 8px}.auth{max-width:420px;min-height:100dvh;margin:0 auto;padding:calc(36px + env(safe-area-inset-top)) 20px 32px;display:flex;flex-direction:column;gap:22px}.brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:800}.brand-mark{width:44px;height:44px;border-radius:14px;background:var(--primary);color:#fff;display:grid;place-items:center}.auth-title{font-size:30px;margin-bottom:4px}.demo{display:flex;flex-direction:column;gap:12px;padding-top:18px;border-top:1px solid var(--line)}.demo .section-title{margin:0;text-align:center}.demo-grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px}.demo-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 6px;border-radius:16px;border:1px solid var(--line);background:var(--surface);cursor:pointer;min-width:0}.demo-btn .icon{color:var(--primary)}.demo-btn code{font-size:11px;color:var(--muted);overflow-wrap:anywhere;text-align:center}@keyframes fade{0%{opacity:0}}@keyframes up{0%{transform:translateY(40px);opacity:0}}@keyframes down{0%{transform:translateY(-12px);opacity:0}}.icon.mirror{transform:scaleX(-1)}.ltr{direction:ltr;unicode-bidi:isolate}.ltr-input{direction:ltr;text-align:right}.ltr-input::placeholder{text-align:right}.danger-text{color:var(--red)}.notice.danger{background:var(--red-soft);color:var(--red);font-weight:600}button.notice{width:100%;border:0;text-align:start;cursor:pointer;font:inherit;font-size:14px}.owe-total{display:flex;flex-direction:column;gap:4px;background:var(--text);color:#fff;border:0}.owe-total b{font-size:30px}.owe-total span:first-child{opacity:.8;font-size:14px}.owe-total .small{opacity:.75}.owe-total.clear{background:var(--green-soft);color:var(--green)}.list-row.static{cursor:default}.empty-line{margin:0;padding:14px 0}.pay-request{display:flex;flex-direction:column;gap:12px;border:2px solid var(--primary);background:var(--primary-soft)}.pending-box{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding-top:24px}
