.mock{inline-size:100%;min-inline-size:0;font-family:var(--font-body);color:var(--ink);position:relative}.mock:before{content:"";z-index:-1;background:radial-gradient(closest-side, color-mix(in srgb, var(--accent) 38%, transparent), transparent);filter:blur(40px);opacity:.35;border-radius:40px;position:absolute;inset:8% 6%}.mock-window{border:1px solid var(--line-strong);background:linear-gradient(180deg, #ffffff0d, transparent 30%), var(--glass-strong);-webkit-backdrop-filter:blur(22px)saturate(150%);backdrop-filter:blur(22px)saturate(150%);border-radius:22px;overflow:hidden;box-shadow:0 50px 120px -40px #000000e6,inset 0 0 0 1px #ffffff05,inset 0 1px #ffffff14}.mock-window__bar{border-block-end:1px solid var(--line);background:#ffffff05;align-items:center;gap:12px;padding:13px 18px;display:flex}.mock-window__dots{gap:6px;display:inline-flex}.mock-window__dots i{background:var(--line-strong);border-radius:50%;block-size:10px;inline-size:10px}.mock-window__dots i:first-child{background:color-mix(in srgb, var(--accent) 80%, transparent)}.mock-window__title{text-overflow:ellipsis;white-space:nowrap;min-inline-size:0;font-family:var(--font-display);flex:1;font-size:14px;font-weight:600;overflow:hidden}.mock-window__body{gap:16px;padding:18px;display:grid}.mock-live{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent);border:1px solid color-mix(in srgb, var(--accent) 35%, transparent);border-radius:999px;align-items:center;gap:7px;padding:4px 10px;font-size:12px;font-weight:600;display:inline-flex}.mock-live__dot{background:var(--accent);border-radius:50%;block-size:7px;inline-size:7px;animation:1.6s ease-in-out infinite mock-blink}.sa-avatar,.hr-avatar{block-size:46px;inline-size:46px;font-family:var(--font-display);color:var(--gold-fg);background:linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 50%, white));border-radius:14px;place-items:center;font-weight:700;display:grid}.mock-number{font-family:var(--font-mono);font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}@keyframes mock-blink{50%{opacity:.25}}@keyframes mock-enter{0%{opacity:0;transform:translateY(-14px)scale(.98)}}@keyframes mock-pop{0%{opacity:0;transform:translateY(10px)scale(.94)}}@media (prefers-reduced-motion:reduce){.mock *,.mock :before,.mock :after{transition:none!important;animation:none!important}}
.wh-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.wh-kpi{border:1px solid var(--line);background:#ffffff08;border-radius:16px;gap:4px;padding:14px 16px;display:grid}.wh-kpi span{color:var(--ink-soft);font-size:12.5px}.wh-kpi b{text-align:start;font-size:clamp(22px,2.6vw,30px);font-weight:600}.wh-kpi__bar{background:var(--accent);block-size:4px;box-shadow:0 0 12px var(--accent);transition:inline-size 1.6s var(--ease-out);border-radius:4px;display:block}.wh-kpi__bar--soft{opacity:.55}.wh-feed{gap:8px;margin:0;padding:0;list-style:none;display:grid;-webkit-mask-image:linear-gradient(#000 70%,#0000);mask-image:linear-gradient(#000 70%,#0000)}.wh-row{border:1px solid var(--line);animation:mock-enter .7s var(--ease-out) both;background:#ffffff06;border-radius:14px;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"chip ref qty""chip where time";align-items:center;gap:2px 12px;padding:10px 14px;display:grid}.wh-row:first-child{border-color:color-mix(in srgb, var(--accent) 45%, transparent);background:color-mix(in srgb, var(--accent) 7%, transparent)}.wh-chip{white-space:nowrap;border-radius:9px;grid-area:chip;padding:5px 10px;font-size:12px;font-weight:600}.wh-chip--in{color:var(--accent);background:color-mix(in srgb, var(--accent) 15%, transparent)}.wh-chip--move{color:var(--info);background:color-mix(in srgb, var(--info) 15%, transparent)}.wh-chip--out{color:var(--danger);background:color-mix(in srgb, var(--danger) 15%, transparent)}.wh-ref,.wh-where,.wh-time{font-family:var(--font-mono);color:var(--ink-soft);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.wh-ref{color:var(--ink);grid-area:ref}.wh-where{grid-area:where}.wh-time{text-align:end;grid-area:time}.wh-qty{font-family:var(--font-mono);text-align:end;direction:ltr;grid-area:qty;font-size:14px}.wh-qty--in{color:var(--c-live)}.wh-qty--out{color:var(--danger)}
.sa-head{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;display:grid}.sa-who{gap:2px;min-inline-size:0;display:grid}.sa-who>b:first-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sa-balance-label{color:var(--ink-soft);font-size:12px}.sa-balance{text-align:start;font-size:22px}.sa-rating{block-size:58px;inline-size:58px;font-family:var(--font-display);color:var(--accent);border:1px solid color-mix(in srgb, var(--accent) 50%, transparent);background:color-mix(in srgb, var(--accent) 10%, transparent);opacity:0;transition:transform .9s var(--ease-out), opacity .9s, box-shadow .9s;border-radius:18px;place-items:center;font-size:28px;font-weight:800;display:grid;transform:scale(.6)}.sa-rating.is-on{opacity:1;box-shadow:0 0 36px color-mix(in srgb, var(--accent) 45%, transparent);transform:none}.sa-aging{border:1px solid var(--line);background:#ffffff06;border-radius:16px;gap:10px;padding:14px 16px;display:grid}.sa-aging__title{color:var(--ink-soft);font-size:12.5px}.sa-bars{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:14px;block-size:120px;display:grid}.sa-bar{text-align:center;block-size:100%;color:var(--ink-soft);grid-template-rows:minmax(0,1fr) auto;gap:6px;font-size:11px;display:grid}.sa-bar i{background:linear-gradient(to top, color-mix(in srgb, var(--accent) 45%, transparent), var(--accent));box-shadow:0 0 18px color-mix(in srgb, var(--accent) 40%, transparent);transition:block-size 1.4s var(--ease-out);border-radius:8px 8px 3px 3px;align-self:end;display:block}.sa-cheques{flex-wrap:wrap;gap:8px;display:flex}.sa-cheque{border:1px solid var(--line);opacity:.35;background:#ffffff08;border-radius:12px;align-items:center;gap:8px;padding:8px 12px;font-size:13px;transition:opacity .6s,border-color .6s;display:inline-flex}.sa-cheque.is-on{opacity:1}.sa-cheque i{border-radius:50%;block-size:8px;inline-size:8px}.sa-cheque b{font-weight:600}.sa-cheque--cleared i,.sa-cheque--cleared b{color:var(--c-live);background-color:#0000}.sa-cheque--cleared i{background:var(--c-live)}.sa-cheque--pending i{background:var(--c-building);animation:1.2s ease-in-out infinite mock-blink}.sa-cheque--pending b{color:var(--c-building)}
.hr-feed{gap:8px;margin:0;padding:0;list-style:none;display:grid}.hr-punch{border:1px solid var(--line);opacity:0;transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);background:#ffffff06;border-radius:14px;grid-template-columns:auto minmax(0,1fr) auto auto;grid-template-areas:"avatar name state time""avatar device state time";align-items:center;column-gap:12px;padding:9px 12px;display:grid;transform:translateY(8px)}.hr-punch.is-on{opacity:1;transform:none}.hr-avatar{border-radius:11px;grid-area:avatar;block-size:36px;inline-size:36px;font-size:14px}.hr-punch b{grid-area:name;font-size:14px}.hr-device{color:var(--ink-soft);grid-area:device;font-size:12px}.hr-state{border-radius:8px;grid-area:state;padding:4px 9px;font-size:12px;font-weight:600}.hr-state--in{color:var(--c-live);background:color-mix(in srgb, var(--c-live) 14%, transparent)}.hr-state--out{color:var(--c-building);background:color-mix(in srgb, var(--c-building) 14%, transparent)}.hr-punch time{color:var(--ink-soft);grid-area:time;font-size:13px}.hr-month{border:1px solid var(--line);background:#ffffff06;border-radius:16px;gap:10px;padding:14px 16px;display:grid}.hr-month__title{color:var(--ink-soft);font-size:12.5px}.hr-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;display:grid}.hr-grid i{aspect-ratio:1.6;transition:background-color .7s var(--ease-out), box-shadow .7s;background:#ffffff0d;border-radius:6px}.hr-grid i.is-on{background:color-mix(in srgb, var(--accent) calc(var(--level) * 100%), #ffffff0a)}
.st-stage{justify-items:center;padding-block:10px 30px;display:grid;position:relative}.st-phone{border:1px solid var(--line-strong);background:linear-gradient(180deg, #ffffff0f, transparent 30%), var(--glass-strong);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border-radius:38px;inline-size:min(290px,100%);padding:44px 16px 22px;position:relative;overflow:hidden;box-shadow:0 50px 120px -40px #000000e6,0 0 0 6px #ffffff08}.st-notch{background:var(--canvas);border-radius:12px;block-size:20px;inline-size:86px;margin-inline-start:-43px;position:absolute;inset-block-start:12px;inset-inline-start:50%}.st-header{font-family:var(--font-display);justify-content:space-between;align-items:center;margin-block-end:14px;font-size:18px;display:flex}.st-cart{border:1px solid var(--line);block-size:38px;inline-size:38px;color:var(--ink-soft);border-radius:12px;place-items:center;transition:color .4s,border-color .4s;display:grid;position:relative}.st-cart svg{block-size:20px;inline-size:20px}.st-cart i{block-size:18px;min-inline-size:18px;color:var(--gold-fg);background:var(--ink-mute);transition:background-color .4s, transform .4s var(--ease-out);border-radius:9px;place-items:center;font-size:11px;font-style:normal;display:grid;position:absolute;inset-block-start:-6px;inset-inline-end:-6px}.st-cart.is-on{color:var(--accent);border-color:color-mix(in srgb, var(--accent) 50%, transparent)}.st-cart.is-on i{background:var(--accent);transform:scale(1.15)}.st-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.st-product{border:1px solid var(--line);transition:transform .3s var(--ease-out), border-color .3s;background:#ffffff08;border-radius:16px;gap:5px;padding:8px;font-size:12.5px;display:grid}.st-product.is-pressed{border-color:var(--accent);transform:scale(.95)}.st-product>span:last-child{color:var(--accent);text-align:start}.st-art{aspect-ratio:1;border-radius:12px;display:block}.st-art--one{background:radial-gradient(circle at 30% 30%, #ffffff59, transparent 40%), linear-gradient(150deg, #ffd27a, var(--gold-deep) 55%, #b86e00)}.st-art--two{background:radial-gradient(circle at 70% 35%, #ffffff4d, transparent 42%), linear-gradient(150deg, #7fb6ff, var(--info) 50%, #1d4f99)}.st-toast{text-align:center;color:var(--gold-fg);background:var(--accent);transition:transform .6s var(--ease-out);border-radius:14px;padding:10px 14px;font-size:13px;font-weight:600;position:absolute;inset-block-end:14px;inset-inline:16px;transform:translateY(140%)}.st-toast.is-on{transform:none}.st-order{border:1px solid color-mix(in srgb, var(--accent) 50%, transparent);background:var(--glass-strong);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);inline-size:min(220px,70%);box-shadow:0 24px 60px -20px #000c, 0 0 30px color-mix(in srgb, var(--accent) 25%, transparent);opacity:0;transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);border-radius:16px;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon title""icon price";column-gap:10px;padding:12px 14px;font-size:13px;display:grid;position:absolute;inset-block-start:38%;inset-inline-end:0;transform:translateY(16px)scale(.92)}.st-order.is-on{opacity:1;transform:none}.st-order__icon{background:linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 40%, white));border-radius:11px;grid-area:icon;block-size:34px;inline-size:34px}.st-order b{grid-area:title}.st-order>span:last-child{color:var(--accent);text-align:start;grid-area:price}
.si-editor{grid-template-columns:58px minmax(0,1fr);gap:12px;display:grid}.si-layers{border:1px solid var(--line);border-radius:14px;align-content:start;gap:8px;padding:10px;display:grid}.si-layers i{background:#ffffff14;border-radius:4px;block-size:8px;transition:background-color .5s}.si-layers i.is-on{background:color-mix(in srgb, var(--accent) 65%, transparent)}.si-canvas{border:1px dashed var(--line-strong);background-image:radial-gradient(#ffffff14 1px,#0000 1px);background-size:14px 14px;border-radius:14px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;min-block-size:170px;padding:12px;display:grid}.si-block{border:1px solid color-mix(in srgb, var(--accent) 55%, transparent);background:color-mix(in srgb, var(--accent) 14%, transparent);opacity:0;transition:opacity .5s var(--ease-out), transform .6s var(--ease-out);border-radius:10px;transform:translateY(12px)scale(.96)}.si-block.is-on{opacity:1;transform:none}.si-block--hero{background:linear-gradient(120deg, color-mix(in srgb, var(--accent) 35%, transparent), color-mix(in srgb, var(--info) 30%, transparent));grid-column:1/-1;min-block-size:70px}.si-block--col{min-block-size:46px}.si-block--button{background:var(--accent);border-radius:999px;grid-column:1/-1;justify-self:center;block-size:22px;inline-size:40%}.si-ai{border:1px solid var(--line);background:#ffffff08;border-radius:16px;gap:10px;padding:14px;display:grid}.si-ai__chip{color:var(--gold-fg);background:var(--brand-gradient);border-radius:999px;justify-self:start;padding:4px 10px;font-size:12px;font-weight:600}.si-ai__prompt{color:var(--ink-soft);font-size:14px}.si-ai__row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.si-progress{color:var(--ink-soft);align-items:center;gap:8px;font-size:12.5px;transition:opacity .4s;display:inline-flex;position:relative}.si-progress i{background:linear-gradient(90deg, transparent, var(--accent), transparent) 0 0 / 200% 100%, #ffffff14;border-radius:4px;block-size:4px;inline-size:60px;animation:1.2s linear infinite si-shimmer}.si-progress.is-done{opacity:.3}.si-approve{border:1px solid var(--line-strong);color:var(--ink-soft);border-radius:999px;align-items:center;gap:6px;padding:7px 14px;font-size:13px;font-weight:600;transition:color .4s,background-color .4s,border-color .4s;display:inline-flex}.si-approve svg{opacity:0;block-size:14px;inline-size:14px;transition:opacity .4s}.si-approve.is-on{color:var(--gold-fg);background:var(--c-live);border-color:var(--c-live)}.si-approve.is-on svg{opacity:1}@keyframes si-shimmer{to{background-position:-200% 0,0 0}}
.ma-stage{border:1px solid var(--line-strong);background:linear-gradient(180deg, #ffffff0d, transparent 30%), var(--glass-strong);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border-radius:22px;gap:14px;padding:18px;display:grid;box-shadow:0 50px 120px -40px #000000e6}.ma-search{border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);box-shadow:0 0 30px color-mix(in srgb, var(--accent) 18%, transparent);background:#ffffff0a;border-radius:16px;align-items:center;gap:10px;padding:13px 16px;display:flex}.ma-search svg{block-size:20px;inline-size:20px;color:var(--accent);flex:none}.ma-placeholder{color:var(--ink-mute)}.ma-query{font-weight:600}.ma-caret{background:var(--accent);block-size:20px;inline-size:2px;margin-inline-start:-8px;animation:1s step-end infinite mock-blink}.ma-results{color:var(--ink-soft);opacity:0;font-size:13px;transition:opacity .5s}.ma-results.is-on{opacity:1}.ma-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.ma-store{border:1px solid var(--line);opacity:0;transition:opacity .5s var(--ease-out), transform .6s var(--ease-out);background:#ffffff08;border-radius:16px;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"logo name""logo lines";align-items:center;gap:6px 10px;padding:12px;display:grid;transform:translateY(10px)scale(.94)}.ma-store.is-on{opacity:1;transform:none}.ma-logo{block-size:40px;inline-size:40px;font-family:var(--font-display);color:var(--gold-fg);background:linear-gradient(135deg, #ffd27a, var(--gold-deep));border-radius:12px;grid-area:logo;place-items:center;font-weight:700;display:grid}.ma-store[data-tone="1"] .ma-logo{background:linear-gradient(135deg, #6ee7b7, var(--success))}.ma-store[data-tone="2"] .ma-logo{background:linear-gradient(135deg, #93c5fd, var(--info))}.ma-store[data-tone="3"] .ma-logo{background:linear-gradient(135deg, #fda4af, var(--danger))}.ma-store b{text-overflow:ellipsis;white-space:nowrap;grid-area:name;font-size:13.5px;overflow:hidden}.ma-lines{grid-area:lines;gap:4px;display:grid}.ma-lines i{background:#ffffff14;border-radius:3px;block-size:5px}.ma-lines i:last-child{inline-size:60%}
.jo-stage{gap:14px;display:grid}.jo-job{border:1px solid var(--line-strong);background:linear-gradient(180deg, #ffffff0d, transparent 40%), var(--glass-strong);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border-radius:22px;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px;padding:18px;display:grid;box-shadow:0 40px 100px -40px #000000e6}.jo-logo{background:radial-gradient(circle at 30% 30%, #fff6, transparent 45%), linear-gradient(135deg, var(--gold), var(--info));border-radius:16px;block-size:52px;inline-size:52px}.jo-job__text{gap:2px;min-inline-size:0;display:grid}.jo-job__text b{font-family:var(--font-display);font-size:17px}.jo-job__text span{color:var(--ink-soft);font-size:13px}.jo-apply{text-align:center;border:1px solid color-mix(in srgb, var(--accent) 50%, transparent);color:var(--accent);border-radius:14px;grid-column:1/-1;justify-self:stretch;padding:11px;font-size:14px;font-weight:600;transition:background-color .5s,color .5s}.jo-apply.is-on{color:var(--gold-fg);background:var(--accent)}.jo-chat{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:22px;align-content:start;gap:10px;min-block-size:150px;padding:16px;display:grid}.jo-bubble{max-inline-size:82%;animation:mock-pop .5s var(--ease-out) both;border-radius:18px;padding:10px 14px;font-size:14px}.jo-bubble--them{border:1px solid var(--line);background:#ffffff0d;border-end-start-radius:6px;justify-self:start}.jo-bubble--me{color:var(--gold-fg);background:var(--accent);border-end-end-radius:6px;justify-self:end;font-weight:500}.jo-typing{border-radius:18px;gap:5px;inline-size:fit-content;padding:12px 14px;display:inline-flex}.jo-typing.jo-bubble--me{background:color-mix(in srgb, var(--accent) 35%, transparent)}.jo-typing i{background:var(--ink-soft);border-radius:50%;block-size:7px;inline-size:7px;animation:1s ease-in-out infinite jo-bounce}.jo-typing i:nth-child(2){animation-delay:.15s}.jo-typing i:nth-child(3){animation-delay:.3s}@keyframes jo-bounce{40%{opacity:1;transform:translateY(-5px)}0%,80%,to{opacity:.4}}