/* One visual component for the site and its live admin preview. */
:is(#dashboard,.metrics-preview){--metrics-title:#082b5c;--metrics-value:#0e59c7;--metrics-accent:#d9ad2b;--metrics-font:Vazirmatn,Tahoma,sans-serif;--metrics-surface:#fff;--metrics-muted:#76859e}
:is(#dashboard,.metrics-preview) .section-title{font-family:var(--metrics-font);text-align:center;margin-bottom:34px}
:is(#dashboard,.metrics-preview) .section-title>span{color:var(--metrics-accent);font-weight:700}
:is(#dashboard,.metrics-preview) .section-title h2{color:var(--metrics-title)}
:is(#dashboard,.metrics-preview) .section-title p{color:var(--metrics-muted)}
:is(#dashboard,.metrics-preview) .metrics-module{position:relative;isolation:isolate;width:min(1000px,100%);max-width:1000px;height:var(--metrics-height,650px);margin:10px auto 0;padding:0;font-family:var(--metrics-font)}
:is(#dashboard,.metrics-preview) .metrics-module .metrics-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:214px;height:190px;padding:25px;text-align:center;isolation:isolate;filter:drop-shadow(0 8px 20px #082b5c14)}
:is(#dashboard,.metrics-preview) .metrics-module .metrics-core:before,:is(#dashboard,.metrics-preview) .metrics-module .stat-grid article:before{content:'';position:absolute;inset:0;z-index:-2;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(135deg,#c5d7ee,var(--metrics-accent) 55%,#c5d7ee)}
:is(#dashboard,.metrics-preview) .metrics-module .metrics-core:after,:is(#dashboard,.metrics-preview) .metrics-module .stat-grid article:after{content:'';position:absolute;inset:1px;z-index:-1;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:var(--metrics-surface)}
:is(#dashboard,.metrics-preview) .metrics-module .metrics-core:after{inset:2px;background:linear-gradient(145deg,var(--metrics-surface),#edf5ff)}
:is(#dashboard,.metrics-preview) .metrics-module .metrics-core img{width:125px;height:62px;object-fit:contain;filter:none;mix-blend-mode:normal}
:is(#dashboard,.metrics-preview) .metrics-module .metrics-core strong{font-size:16px;line-height:1.5;color:var(--metrics-title);overflow-wrap:anywhere}
:is(#dashboard,.metrics-preview) .metrics-module .metrics-core small{font-size:10px;line-height:1.6;color:var(--metrics-muted);white-space:normal;overflow-wrap:anywhere}
:is(#dashboard,.metrics-preview) .metrics-module .stat-grid{position:absolute;inset:0;display:block;margin:0;padding:0}
:is(#dashboard,.metrics-preview) .metrics-module .stat-grid article.metric-card{position:absolute;left:var(--metric-x);top:var(--metric-y);transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:250px;height:205px;min-width:0;padding:18px 45px;margin:0;text-align:center;border:0;border-radius:0;background:transparent;box-shadow:none;isolation:isolate;filter:drop-shadow(0 10px 16px #082b5c0c)}
:is(#dashboard,.metrics-preview) .metrics-module .stat-grid i{font-size:14px;line-height:1.7;font-weight:700;font-style:normal;color:var(--metrics-title);overflow-wrap:anywhere;max-width:100%}
:is(#dashboard,.metrics-preview) .metrics-module .stat-grid b{display:block;margin:0;color:var(--metrics-value);font-size:36px;line-height:1.35;font-weight:900;font-variant-numeric:tabular-nums;direction:ltr;max-width:100%}
:is(#dashboard,.metrics-preview) .metrics-module .stat-grid article>span{font-size:12px;line-height:1.6;color:var(--metrics-muted);overflow-wrap:anywhere;max-width:100%}
:is(#dashboard,.metrics-preview) .metrics-module .metric-symbol{width:33px;height:33px;flex-shrink:0;margin-bottom:3px;color:var(--metrics-value);animation:metricFloat 4.8s ease-in-out infinite}
:is(#dashboard,.metrics-preview) .metrics-module .metric-symbol svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
:is(#dashboard,.metrics-preview) .metrics-module .metric-symbol .metric-gold{stroke:var(--metrics-accent)}
.metrics-module .metrics-connections{position:absolute;inset:0;width:100%;height:100%;fill:none;pointer-events:none;stroke-linecap:round}
.metrics-module .metrics-perimeter{stroke:#dce5f1;stroke-width:2;stroke-dasharray:5 12;animation:metricFlow 20s linear infinite}.metrics-module .metrics-spokes{stroke:#c4d5ec;stroke-width:1.5}
:is(#dashboard,.metrics-preview) .metrics-module.is-narrow .stat-grid article{width:216px;height:190px;padding:16px 38px}
:is(#dashboard,.metrics-preview) .metrics-module.is-narrow .metrics-core{width:185px;height:170px;padding:22px}
:is(#dashboard,.metrics-preview) .metrics-module.is-narrow .metrics-core img{width:107px;height:54px}
:is(#dashboard,.metrics-preview) .metrics-module.is-grid{height:auto;padding-bottom:28px}
:is(#dashboard,.metrics-preview) .metrics-module.is-grid .metrics-core{position:relative;left:auto;top:auto;transform:none;margin:0 auto 22px}
:is(#dashboard,.metrics-preview) .metrics-module.is-grid .stat-grid{position:relative;inset:auto;display:flex;justify-content:center;flex-wrap:wrap;gap:16px 12px;direction:rtl}
:is(#dashboard,.metrics-preview) .metrics-module.is-grid .stat-grid article{position:relative;left:auto;top:auto;transform:none;width:calc(25% - 12px);height:205px;padding:16px 36px}
:is(#dashboard,.metrics-preview) .metrics-module.is-compact{max-width:510px}
:is(#dashboard,.metrics-preview) .metrics-module.is-compact .stat-grid article{width:calc(50% - 6px);height:205px;padding:16px 32px}
:is(#dashboard,.metrics-preview) .metrics-module.is-compact .stat-grid b{font-size:32px}
:is(#dashboard,.metrics-preview) .metrics-module.is-small .stat-grid article{height:205px;padding:14px 26px}
:is(#dashboard,.metrics-preview) .metrics-module.is-small .stat-grid i{font-size:12px}
:is(#dashboard,.metrics-preview) .metrics-module.is-small .stat-grid b{font-size:28px}
:is(#dashboard,.metrics-preview) .metrics-module.is-small .stat-grid article>span{font-size:10px}
:is(#dashboard,.metrics-preview) .metrics-module.motion-off :is(.metric-symbol,.metrics-perimeter){animation:none}
html[data-theme=dark] #dashboard{--metrics-surface:#111f31;--metrics-muted:#a7b9d0}
html[data-theme=dark] #dashboard .metrics-module .metrics-core:after{background:linear-gradient(145deg,#183352,#111f31)}
html[data-theme=dark] #dashboard .metrics-module .metrics-core img{background:#fff;border-radius:8px}
@keyframes metricFloat{0%,100%{translate:0 0}50%{translate:0 -3px}}@keyframes metricFlow{to{stroke-dashoffset:-170}}
@media(prefers-reduced-motion:reduce){.metrics-module :is(.metric-symbol,.metrics-perimeter){animation:none!important}}
.metrics-editor .metrics-preview{background:#faf9f5;padding:32px 16px;border:1px solid #dce5f1;border-radius:20px;margin:20px 0;overflow:hidden}
.metrics-preview .section-title h2{font-size:clamp(22px,3vw,36px);line-height:1.7;margin:12px 0}.metrics-preview .section-title p{margin:8px 0;line-height:1.9}
.metrics-editor .metric-edit-card{padding:20px;border:1px solid #dce5f1;border-radius:16px;margin:16px 0;background:#f8fbff}
.metrics-editor .metric-edit-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:12px}.metrics-editor .metric-edit-actions button{padding:8px 14px}.metrics-editor .metric-delete{color:#a32727;background:#fff5f5}
.metrics-editor .metrics-actions{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.metrics-editor .metrics-actions button{padding:12px 20px}
.metrics-editor .check{display:flex;align-items:center;gap:8px}.metrics-editor .check input{width:auto}.metrics-editor .metric-settings{border:1px solid #dce5f1;border-radius:16px;padding:20px;margin-bottom:20px}
.metrics-editor .metric-settings summary{cursor:pointer;font-weight:700;margin-bottom:16px}.metrics-editor input[type=color]{height:44px;padding:4px}.metrics-editor .metrics-status{min-height:28px;line-height:1.8;color:#175b43}
.metrics-editor button{font:inherit;border:1px solid #c7d8ef;background:#fff;color:#124889;border-radius:10px;cursor:pointer;transition:background .2s}
.metrics-editor button:hover:not(:disabled){background:#edf4ff}.metrics-editor button:disabled{opacity:.5;cursor:default}
.metrics-editor #saveMetrics,.metrics-editor #addMetric{background:#0e59c7;border-color:#0e59c7;color:#fff}.metrics-editor #saveMetrics:hover,.metrics-editor #addMetric:hover{background:#084cae}
.metrics-editor :is(input,textarea,select,button):focus-visible{outline:3px solid #1764d533;outline-offset:2px}