.ooh{--a:var(--ooh-a,#6d28d9);--fg:#0f172a;--mut:#64748b;--ln:#e8eaf0;--bg:#fff;--soft:#f6f7fb;--r:16px;color:var(--fg);font-size:14px;line-height:1.7;box-sizing:border-box}
.ooh *,.ooh *::before,.ooh *::after{box-sizing:border-box}
.ooh button,.ooh input,.ooh select,.ooh textarea{font:inherit}
.ooh a{color:inherit;text-decoration:none}
.ooh-mut{color:var(--mut)}.ooh-err{color:#dc2626;margin:6px 0}.ooh-note{background:var(--soft);padding:14px;border-radius:12px}
.ooh-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;color:#fff!important;background:linear-gradient(135deg,var(--a),color-mix(in srgb,var(--a) 70%,#000));padding:12px 22px;border-radius:14px;font-weight:700;box-shadow:0 8px 22px -8px var(--a);transition:transform .15s,opacity .15s}
.ooh-btn:hover{transform:translateY(-1px)}.ooh-btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.ld{position:relative;pointer-events:none;opacity:.7}
.ooh-sk{height:70px;border-radius:14px;margin:10px 0;background:linear-gradient(90deg,#eef0f5 25%,#f7f8fb 37%,#eef0f5 63%);background-size:400% 100%;animation:ooh-sh 1.3s infinite}.ooh-sk.sm{height:44px}
@keyframes ooh-sh{0%{background-position:100% 0}100%{background-position:0 0}}

/* floating bar */
.ooh-bar{position:fixed;inset-inline:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:9990;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 14px;background:rgba(255,255,255,.82);backdrop-filter:blur(16px) saturate(1.6);-webkit-backdrop-filter:blur(16px) saturate(1.6);border:1px solid rgba(15,23,42,.08);border-radius:20px;box-shadow:0 18px 40px -14px rgba(15,23,42,.35)}
.ooh-bar b{font-size:16px}.ooh-bar small{color:var(--mut)}
@media(min-width:900px){.ooh-bar{inset-inline:auto 28px;width:380px}}
.ooh-ov{position:fixed;inset:0;z-index:9999;background:rgba(15,23,42,.5);backdrop-filter:blur(3px);display:flex;align-items:flex-end;justify-content:center;animation:ooh-f .2s}
.ooh-ov[hidden]{display:none}
.ooh-dr{position:relative;width:100%;max-width:520px;max-height:92vh;overflow:auto;background:var(--bg);border-radius:26px 26px 0 0;padding:22px 20px 28px;animation:ooh-u .28s cubic-bezier(.2,.8,.2,1);overscroll-behavior:contain}
.ooh-dr h3{margin:0 0 12px;font-size:17px;padding-inline-end:40px}
.ooh-x{position:absolute;top:14px;inset-inline-end:14px;width:36px;height:36px;border-radius:50%;border:0;background:var(--soft);font-size:22px;line-height:1;cursor:pointer}
@media(min-width:900px){.ooh-ov{align-items:center}.ooh-dr{border-radius:26px;animation-name:ooh-f}}
@keyframes ooh-u{from{transform:translateY(40px);opacity:0}}@keyframes ooh-f{from{opacity:0}}
html.ooh-lock{overflow:hidden}

/* widget */
.ooh-w{background:var(--bg)}
.ooh-widget.ooh-w{border:1px solid var(--ln);border-radius:var(--r);padding:18px}
.ooh-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.ooh-chip{background:var(--soft);border-radius:999px;padding:3px 11px;font-size:12px;font-weight:600}
.ooh-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;margin-bottom:12px}.ooh-price b{font-size:22px;color:var(--a)}.ooh-price small{color:var(--mut)}
.ooh-price em{font-style:normal;background:#ecfdf5;color:#047857;border-radius:8px;padding:1px 8px;font-size:12px;font-weight:700}
.ooh-cal{background:var(--soft);border-radius:var(--r);padding:12px}
.ooh-ch{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.ooh-ch button{width:34px;height:34px;border-radius:10px;border:0;background:#fff;cursor:pointer;font-size:20px;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.ooh-cg{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center}
.ooh-cg i{font-style:normal;color:var(--mut);font-size:12px;padding:4px 0}
.ooh-d{aspect-ratio:1;border:0;border-radius:10px;background:#fff;cursor:pointer;font-weight:600;transition:background .12s,transform .12s}
.ooh-d:hover:not(:disabled){background:color-mix(in srgb,var(--a) 14%,#fff)}
.ooh-d.off{color:#c3c8d4;background:transparent;cursor:not-allowed}
.ooh-d.bk{background:repeating-linear-gradient(135deg,#fee2e2,#fee2e2 4px,#fff1f1 4px,#fff1f1 8px);color:#ef4444;text-decoration:line-through;cursor:not-allowed}
.ooh-d.in{background:color-mix(in srgb,var(--a) 16%,#fff);border-radius:4px}
.ooh-d.on{background:var(--a);color:#fff;box-shadow:0 6px 14px -6px var(--a)}
.ooh-hint{color:var(--mut);font-size:12px;margin:8px 2px}
.ooh-q{margin:10px 0}.ooh-ln{display:flex;justify-content:space-between;padding:6px 2px;border-bottom:1px dashed var(--ln)}
.ooh-ln.tot{border:0;font-size:16px;padding-top:10px}.ooh-ln.tot b{color:var(--a);font-size:18px}
.ooh-w textarea{width:100%;min-height:66px;border:1px solid var(--ln);border-radius:12px;padding:10px;margin:6px 0 12px;resize:vertical;background:#fff}
.ooh-w .ooh-go{width:100%;padding:14px}.ooh-msg{margin-top:8px}
.ooh-ok{text-align:center;padding:16px 4px}.ooh-ok h4{margin:8px 0 4px;font-size:18px}.ooh-ok p{color:var(--mut);margin:0 0 16px}
.ooh-tick{width:64px;height:64px;margin:auto;border-radius:50%;background:#ecfdf5;color:#059669;font-size:32px;display:grid;place-items:center;animation:ooh-p .5s cubic-bezier(.2,1.4,.4,1)}
@keyframes ooh-p{from{transform:scale(.3);opacity:0}}

/* dashboard */
.ooh-dash{max-width:1000px;margin-inline:auto}
.ooh-tabs{display:flex;gap:6px;overflow-x:auto;padding:4px;background:var(--soft);border-radius:16px;margin-bottom:16px;scrollbar-width:none}
.ooh-tabs::-webkit-scrollbar{display:none}
.ooh-tabs button{flex:1 0 auto;border:0;background:transparent;padding:10px 16px;border-radius:12px;cursor:pointer;font-weight:700;color:var(--mut);white-space:nowrap}
.ooh-tabs button[aria-selected=true]{background:#fff;color:var(--a);box-shadow:0 2px 10px rgba(15,23,42,.1)}
.ooh-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:14px}
.ooh-sc{background:linear-gradient(160deg,#fff,var(--soft));border:1px solid var(--ln);border-radius:var(--r);padding:14px}
.ooh-sc small{color:var(--mut);display:block}.ooh-sc b{font-size:17px}
.ooh-fl{display:flex;gap:6px;overflow-x:auto;margin-bottom:14px;scrollbar-width:none;padding-bottom:2px}
.ooh-fl button{flex:0 0 auto;border:1px solid var(--ln);background:#fff;padding:5px 14px;border-radius:999px;cursor:pointer;font-size:13px}
.ooh-fl button[aria-pressed=true]{background:var(--a);border-color:var(--a);color:#fff}
.ooh-fl i{font-style:normal;opacity:.7;margin-inline-start:3px}
.ooh-card{background:#fff;border:1px solid var(--ln);border-radius:var(--r);padding:16px;margin-bottom:12px;box-shadow:0 1px 2px rgba(15,23,42,.04);transition:box-shadow .2s}
.ooh-card:hover{box-shadow:0 10px 30px -14px rgba(15,23,42,.25)}
.ooh-card header{display:flex;align-items:center;gap:12px}
.ooh-card header img,.ooh-card header .ph{width:54px;height:54px;border-radius:12px;object-fit:cover;background:var(--soft);flex:none}
.ooh-card header>div{flex:1;min-width:0}.ooh-card h4{margin:0;font-size:15px}.ooh-card header p{margin:2px 0 0;color:var(--mut);font-size:12.5px}
.amt{color:var(--a);white-space:nowrap}
.ooh-steps{list-style:none;display:flex;margin:16px 0 6px;padding:0}
.ooh-steps li{flex:1;text-align:center;position:relative;font-size:11px;color:var(--mut)}
.ooh-steps li i{display:block;width:14px;height:14px;margin:0 auto 4px;border-radius:50%;background:var(--ln);position:relative;z-index:1}
.ooh-steps li::before{content:"";position:absolute;top:6px;inset-inline:50% -50%;height:2px;background:var(--ln)}
.ooh-steps li:last-child::before{display:none}
.ooh-steps li.done i,.ooh-steps li.done::before{background:var(--a)}
.ooh-steps li.cur{color:var(--fg);font-weight:700}.ooh-steps li.cur i{background:var(--a);box-shadow:0 0 0 5px color-mix(in srgb,var(--a) 22%,transparent);animation:ooh-pl 1.8s infinite}
@keyframes ooh-pl{50%{box-shadow:0 0 0 8px color-mix(in srgb,var(--a) 8%,transparent)}}
.ooh-st{display:inline-block;margin-top:10px;padding:3px 12px;border-radius:999px;background:#fee2e2;color:#b91c1c;font-weight:700;font-size:12px}
.ooh-ass{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:12px;padding:10px;background:var(--soft);border-radius:12px}
.ooh-cr{display:flex;align-items:center;gap:8px}.ooh-cr img{width:46px;height:46px;border-radius:8px;object-fit:cover}
.ooh-cr em{font-style:normal;font-size:12px;font-weight:700}.ooh-cr em.ok{color:#059669}.ooh-cr em.wt{color:#d97706}.ooh-cr.need{color:#d97706;font-size:12.5px}
.ooh-pop{display:flex;align-items:center;gap:6px}.ooh-pop small{color:var(--mut)}.ooh-pop img{width:38px;height:38px;border-radius:8px;object-fit:cover}
.ooh-nt{margin:10px 0 0;color:var(--mut);font-size:12.5px}
.ooh-card footer{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;align-items:center}
.ooh-b{border:1px solid var(--ln);background:#fff;padding:8px 16px;border-radius:12px;cursor:pointer;font-weight:700;font-size:13px;transition:all .15s}
.ooh-b:hover{border-color:var(--a)}.ooh-b.p{background:var(--a);border-color:var(--a);color:#fff}.ooh-b.d{color:#dc2626}.ooh-b.d:hover{border-color:#dc2626;background:#fef2f2}
.ooh-empty{text-align:center;padding:44px 16px;color:var(--mut);background:var(--soft);border-radius:var(--r)}
.ooh-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:12px 0}
.ooh-lf label{display:block;font-size:12px;color:var(--mut)}
.ooh-lf input:not([type=checkbox]),.ooh-lf select{width:100%;margin-top:4px;padding:9px 10px;border:1px solid var(--ln);border-radius:10px;background:#fff;color:var(--fg)}
.ooh-lf .ck{display:flex;gap:8px;align-items:center;color:var(--fg)}
.ooh-login{text-align:center;padding:40px 16px;background:var(--soft);border-radius:var(--r)}
#ooh-toast{position:fixed;inset-inline:0;bottom:90px;z-index:10001;display:flex;justify-content:center;pointer-events:none}
.ooh-toast{background:#0f172a;color:#fff;padding:10px 20px;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.3);animation:ooh-u .25s}.ooh-toast.bad{background:#dc2626}
@media(max-width:560px){.ooh-card header{flex-wrap:wrap}.amt{width:100%}.ooh-steps li span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.ooh *{animation:none!important;transition:none!important}}