:root { --ink:#11141a; --muted:#747c89; --line:#e5e8ed; --lime:#baf20c; --green:#719800; --canvas:#f1f4f6; --danger:#cc3851; }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:radial-gradient(circle at 5% 0,rgba(186,242,12,.2),transparent 30rem),var(--canvas); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
[hidden] { display:none!important; }
.admin-shell { width:min(1180px,calc(100% - 32px)); margin:0 auto; padding:28px 0 60px; }
.login-view { min-height:calc(100vh - 88px); display:grid; place-items:center; }
.login-card { width:min(440px,100%); padding:34px; border:1px solid rgba(17,20,26,.08); border-radius:28px; background:#fff; box-shadow:0 30px 80px rgba(17,20,26,.12); }
.admin-brand { display:flex; align-items:center; gap:11px; }.admin-brand>span { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:var(--lime); font-weight:900; }.admin-brand>div { display:grid; }.admin-brand strong { font-size:1rem; }.admin-brand small { color:var(--muted); font-size:.68rem; }
.login-card h1 { margin:30px 0 8px; font-size:2rem; letter-spacing:-.05em; }.login-card>p { margin:0 0 24px; color:var(--muted); line-height:1.5; }
label { display:grid; gap:7px; color:#39404a; font-size:.78rem; font-weight:700; }
input,textarea,select { width:100%; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:#fff; outline:none; transition:border-color .2s,box-shadow .2s; }
input,select { min-height:46px; padding:0 13px; }textarea { padding:12px 13px; resize:vertical; }
input:focus,textarea:focus,select:focus { border-color:#90bd00; box-shadow:0 0 0 4px rgba(186,242,12,.2); }
form button,.form-actions button { min-height:48px; padding:0 18px; border:0; border-radius:13px; color:var(--ink); background:var(--lime); font-weight:850; }
.login-card form { display:grid; gap:14px; }.login-card output,.form-actions output { min-height:20px; color:var(--danger); font-size:.72rem; }
.dashboard-head { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 20px; border:1px solid rgba(17,20,26,.08); border-radius:20px; background:rgba(255,255,255,.9); backdrop-filter:blur(12px); box-shadow:0 12px 35px rgba(17,20,26,.07); }
.head-actions { display:flex; align-items:end; gap:8px; }.head-actions label { gap:3px; font-size:.62rem; }.head-actions select { min-width:110px; min-height:39px; }.ghost { min-height:39px; padding:0 13px; border:1px solid var(--line); border-radius:11px; background:#fff; font-size:.74rem; font-weight:750; }.ghost.danger { color:var(--danger); }
.status-line { display:flex; align-items:center; gap:8px; margin:15px 3px; color:var(--muted); font-size:.7rem; }.status-line i { width:7px; height:7px; order:-1; border-radius:50%; background:#82ae00; box-shadow:0 0 0 4px rgba(130,174,0,.12); }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.metric-grid article { min-height:132px; display:flex; flex-direction:column; justify-content:center; padding:20px; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 10px 26px rgba(17,20,26,.05); }.metric-grid article.accent { background:var(--ink); color:#fff; }.metric-grid small { color:#8b939f; font-size:.61rem; font-weight:850; letter-spacing:.08em; }.metric-grid strong { margin:6px 0 3px; font-size:2rem; letter-spacing:-.06em; }.metric-grid .accent strong { color:var(--lime); }.metric-grid span { color:#8b939f; font-size:.72rem; }
.dashboard-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:14px; margin-top:14px; }.panel { padding:22px; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:0 10px 26px rgba(17,20,26,.05); }.panel-title { display:flex; justify-content:space-between; gap:15px; align-items:start; margin-bottom:20px; }.panel-title small { color:var(--green); font-size:.58rem; font-weight:900; letter-spacing:.1em; }.panel-title h2 { margin:4px 0 0; font-size:1.25rem; letter-spacing:-.04em; }.panel-title p { margin:7px 0 0; color:var(--muted); font-size:.75rem; }.panel-title>span { color:var(--muted); font-size:.66rem; }
.funnel-list { display:grid; gap:9px; }.funnel-row { display:grid; grid-template-columns:72px 1fr 60px; gap:10px; align-items:center; }.funnel-row>span { color:#59616d; font-size:.72rem; font-weight:750; }.funnel-row>div { height:28px; overflow:hidden; border-radius:8px; background:#f0f2f4; }.funnel-row i { width:var(--width); min-width:3px; height:100%; display:block; border-radius:inherit; background:linear-gradient(90deg,#88b500,var(--lime)); }.funnel-row b { text-align:right; font-size:.72rem; }
.source-list { display:grid; gap:12px; }.source-row { display:grid; gap:5px; }.source-row div { display:flex; justify-content:space-between; gap:10px; font-size:.73rem; }.source-row i { height:7px; display:block; border-radius:99px; background:#eff1f3; overflow:hidden; }.source-row i::after { content:""; width:var(--width); height:100%; display:block; border-radius:inherit; background:#6f56f8; }
.daily-chart { height:230px; display:flex; align-items:end; gap:5px; padding:20px 0 24px; border-bottom:1px solid var(--line); }.day-column { min-width:8px; flex:1; display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:2px; height:100%; position:relative; }.day-column i { display:block; min-height:2px; border-radius:5px 5px 0 0; background:var(--lime); }.day-column i.checkout { background:#6f56f8; }.day-column small { position:absolute; top:calc(100% + 7px); left:50%; transform:translateX(-50%); color:#959ca6; font-size:.49rem; }
.recent-list { max-height:230px; overflow:auto; display:grid; }.recent-row { display:grid; grid-template-columns:1fr auto; gap:8px; padding:10px 0; border-bottom:1px solid #eef0f2; }.recent-row:last-child { border:0; }.recent-row div { display:grid; gap:2px; }.recent-row strong { font-size:.73rem; }.recent-row small,.recent-row time { color:var(--muted); font-size:.61rem; }
.settings-panel { margin-top:14px; }.settings-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }.settings-grid label>span { color:var(--ink); font-size:.76rem; }.settings-grid label>small,.toggle small { color:var(--muted); font-size:.63rem; font-weight:500; }.toggle { display:flex; align-items:center; gap:12px; margin-top:18px; cursor:pointer; }.toggle>input { position:absolute; opacity:0; pointer-events:none; }.toggle>span { width:45px; height:25px; flex:0 0 auto; padding:3px; border-radius:99px; background:#dfe3e7; transition:.2s; }.toggle>span::after { content:""; width:19px; height:19px; display:block; border-radius:50%; background:#fff; box-shadow:0 2px 6px rgba(0,0,0,.15); transition:.2s; }.toggle>input:checked+span { background:#8cbb00; }.toggle>input:checked+span::after { transform:translateX(20px); }.toggle>div { display:grid; gap:2px; }.form-actions { display:flex; align-items:center; gap:14px; margin-top:20px; }.form-actions output.ok { color:#648700; }
.webhook-address{margin:16px 0;padding:14px 16px;border:1px solid #dce5d5;border-radius:12px;background:#f6faef;overflow:auto}.webhook-address code{color:#4f6800;font-size:.72rem;font-weight:750;white-space:nowrap}.integration-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.integration-grid article{display:flex;align-items:center;gap:10px;padding:13px;border:1px solid var(--line);border-radius:12px;background:#fff}.integration-grid i{width:11px;height:11px;flex:0 0 auto;border-radius:50%;background:#d6dbe0;box-shadow:0 0 0 4px #f0f2f4}.integration-grid i.ready{background:#7fa800;box-shadow:0 0 0 4px #efffc3}.integration-grid i.pending{background:#e5a000;box-shadow:0 0 0 4px #fff5d5}.integration-grid strong,.integration-grid small{display:block}.integration-grid strong{font-size:.7rem}.integration-grid small{margin-top:2px;color:var(--muted);font-size:.57rem}.integration-help{margin:14px 0 0;color:var(--muted);font-size:.65rem;line-height:1.55}
@media(max-width:800px){.admin-shell{width:min(100% - 20px,620px);padding-top:10px}.dashboard-head{align-items:flex-start}.head-actions{flex-wrap:wrap;justify-content:flex-end}.metric-grid{grid-template-columns:1fr 1fr}.dashboard-grid{grid-template-columns:1fr}.settings-grid,.integration-grid{grid-template-columns:1fr}}
@media(max-width:520px){.dashboard-head{display:grid}.head-actions{justify-content:start}.metric-grid{grid-template-columns:1fr 1fr}.metric-grid article{min-height:112px;padding:15px}.funnel-row{grid-template-columns:60px 1fr 50px}.panel{padding:17px}.settings-panel{padding:18px}.login-card{padding:25px}}