/* دیباگ — ابزارهای آنلاین: صفحه‌ها + کیت رابط مشترک ابزارها (کلاس‌های w-*). همه‌ی رنگ‌ها از متغیرهای قالب، پس تم روشن و تیره هر دو درست‌اند. */

/* ---------- صفحه‌ی ابزار ---------- */
.di9w-head{max-inline-size:68rem;margin-inline:auto;padding-block:.6rem 1rem}
.di9w-h1{font-size:clamp(1.45rem,3.6vw,2.1rem);line-height:1.6;margin-block:.6rem .5rem}
.di9w-lead{margin:0;color:var(--ink-2);font-size:1.02rem;line-height:2;max-inline-size:75ch}
.di9w-trust{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem;margin:.9rem 0 0;padding:0;list-style:none;color:var(--muted);font-size:var(--fs-xs)}
.di9w-trust li{display:inline-flex;align-items:center;gap:.35rem}
.di9w-trust .ico{inline-size:1rem;block-size:1rem;color:var(--ok)}

.di9w-stage{max-inline-size:68rem;margin-inline:auto}
#di9w-app{position:relative;min-block-size:22rem;padding:clamp(1rem,2.5vw,1.6rem);border:1px solid var(--line);border-radius:var(--r-lg);
    background:var(--surface);box-shadow:var(--shadow-1)}
#di9w-app:not(.is-ready)::before{content:"";position:absolute;inset-block-start:50%;inset-inline-start:50%;inline-size:2.2rem;block-size:2.2rem;margin:-1.1rem;
    border:3px solid var(--line);border-block-start-color:var(--accent);border-radius:50%;animation:w-spin .8s linear infinite}
#di9w-app noscript{display:block;text-align:center;color:var(--muted)}

.di9w-wrap{max-inline-size:56rem;margin-inline:auto;padding-block:var(--space-l) var(--space-xl)}
.di9w-section{margin-block-start:2.2rem}
.di9w-section h2{font-size:1.3rem;margin-block-end:.9rem}
.di9w-steps{margin:0;padding:0;list-style:none;counter-reset:w}
.di9w-steps li{position:relative;padding:.7rem 1rem;padding-inline-start:3.2rem;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);line-height:2;color:var(--ink-2)}
.di9w-steps li+li{margin-block-start:.55rem}
.di9w-steps li::before{counter-increment:w;content:counter(w);position:absolute;inset-inline-start:.8rem;inset-block-start:.75rem;display:grid;place-items:center;
    inline-size:1.7rem;block-size:1.7rem;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-weight:800;font-size:.85rem}
.di9w-features{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:.6rem;margin:0;padding:0;list-style:none}
.di9w-features li{display:flex;gap:.5rem;align-items:flex-start;padding:.75rem .9rem;border-radius:var(--r);background:var(--bg-2);line-height:1.9;font-size:var(--fs-sm);color:var(--ink-2)}
.di9w-features li .ico{flex:none;inline-size:1.1rem;block-size:1.1rem;margin-block-start:.35rem;color:var(--accent-text)}
.di9w-body{margin-block-start:2rem}
.di9w-related{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,16rem),1fr));gap:var(--space-s)}
.di9w-links{margin:0;padding-inline-start:1.2rem;line-height:2.2}
.di9w-links a{color:var(--accent-text);font-weight:600}
.di9w-updated{margin-block-start:1.2rem;color:var(--muted);font-size:var(--fs-xs)}

/* ---------- کارت و فهرست ---------- */
.di9w-card{display:flex;gap:.9rem;align-items:flex-start;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);color:inherit;
    transition:border-color var(--dur-1) var(--ease),transform var(--dur-1) var(--ease);block-size:100%}
.di9w-card:hover{border-color:var(--accent-300);transform:translateY(-2px)}
.di9w-card.has-media{flex-direction:column;gap:0;padding:0;overflow:hidden}
.di9w-card__row{display:flex;gap:.9rem;align-items:flex-start}
.di9w-card.has-media .di9w-card__row{padding:.95rem 1.05rem 1.1rem}
.di9w-card__media{display:block;aspect-ratio:16/9;background:#0b132c;overflow:hidden}
.di9w-card__media img{display:block;inline-size:100%;block-size:100%;object-fit:cover;transition:transform .35s ease}
.di9w-card:hover .di9w-card__media img{transform:scale(1.04)}
.di9w-card__ico{flex:none;display:grid;place-items:center;inline-size:3rem;block-size:3rem;border-radius:.9rem;background:var(--accent-050);color:var(--accent-text);border:1px solid var(--accent-200)}
.di9w-card__ico .ico{inline-size:1.45rem;block-size:1.45rem}
.di9w-card__body{display:flex;flex-direction:column;gap:.3rem}
.di9w-card__body strong{font-size:1.04rem;line-height:1.6}
.di9w-card:hover strong{color:var(--accent-text)}
.di9w-card__body span{color:var(--ink-2);font-size:var(--fs-sm);line-height:1.9}
.di9w-hub{margin-block:var(--space-m) var(--space-xl)}
.di9w-group{padding-block:1.2rem;border-block-start:1px solid var(--line)}
.di9w-group h2{display:flex;align-items:center;gap:.5rem;font-size:1.25rem;margin-block:0 1rem}
.di9w-group h2 .ico{inline-size:1.2rem;block-size:1.2rem;color:var(--accent-text)}
.di9w-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr));gap:var(--space-s)}
.di9w-stats{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin-block-start:1rem;padding:0;list-style:none;color:var(--muted);font-size:var(--fs-sm)}
.di9w-stats strong{color:var(--ink);font-size:1.15rem}

/* =================================================================
   کیت رابط مشترک ابزارها (w-*) — ابزارها فقط از این‌ها استفاده کنند
   ================================================================= */
#di9w-app,.w-toasts{--w-ok:var(--ok);--w-err:var(--err);--w-info:var(--info);font-size:1rem;line-height:1.8;color:var(--ink)}
.w-sr{position:absolute!important;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.w-ico{inline-size:1.15em;block-size:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.w-stack{display:flex;flex-direction:column;gap:1rem}
.w-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.w-bar--end{justify-content:flex-end}
.w-spacer{flex:1}
.w-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--w-col,14rem)),1fr))}
.w-panel{padding:1rem 1.1rem;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2)}
.w-title{margin:0 0 .5rem;font-size:1.05rem;font-weight:800}
.w-muted{color:var(--muted);font-size:var(--fs-sm)}
.w-mono{font-family:Consolas,'Courier New',monospace;direction:ltr;unicode-bidi:isolate}

/* دکمه */
.w-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-block-size:2.75rem;padding:.5rem 1.15rem;border-radius:.8rem;border:1px solid var(--line);
    background:var(--surface);color:var(--ink);font:inherit;font-weight:700;font-size:.95rem;cursor:pointer;transition:background var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease),transform .08s}
.w-btn:hover{border-color:var(--accent-300);color:var(--accent-text)}
.w-btn:active{transform:scale(.97)}
.w-btn:focus-visible{outline:3px solid var(--accent-300);outline-offset:2px}
.w-btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.w-btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.w-btn--primary:hover{background:var(--accent-2);color:var(--accent-ink)}
.w-btn--ghost{background:transparent}
.w-btn--danger{color:var(--err);border-color:color-mix(in oklab,var(--err) 40%,var(--line))}
.w-btn--lg{min-block-size:3.3rem;padding-inline:1.6rem;font-size:1.05rem;border-radius:1rem}
.w-btn.is-on{background:var(--accent-050);border-color:var(--accent);color:var(--accent-text)}

/* گزینه‌ها */
.w-seg{display:inline-flex;flex-wrap:wrap;padding:.25rem;gap:.25rem;border:1px solid var(--line);border-radius:.9rem;background:var(--bg-2)}
.w-seg button{min-block-size:2.3rem;padding:.3rem .9rem;border:0;border-radius:.65rem;background:transparent;color:var(--ink-2);font:inherit;font-weight:700;font-size:.9rem;cursor:pointer}
.w-seg button.is-on{background:var(--surface);color:var(--accent-text);box-shadow:var(--shadow-1)}
.w-field{display:flex;flex-direction:column;gap:.35rem;font-size:var(--fs-sm);font-weight:700;color:var(--ink-2)}
.w-field input,.w-field select,.w-field textarea,.w-input{font:inherit;font-weight:500;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:.7rem;padding:.55rem .75rem;min-block-size:2.6rem}
.w-field input:focus,.w-field select:focus,.w-field textarea:focus,.w-input:focus{outline:2px solid var(--accent-300);border-color:var(--accent)}
.w-range{inline-size:100%;accent-color:var(--accent)}
.w-check{display:inline-flex;align-items:center;gap:.45rem;font-size:var(--fs-sm);cursor:pointer}
.w-check input{accent-color:var(--accent);inline-size:1.1rem;block-size:1.1rem}
textarea.w-input{min-block-size:12rem;line-height:2;resize:vertical}

/* آمار */
.w-stats{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,9rem),1fr))}
.w-stat{padding:.8rem 1rem;border-radius:var(--r);background:var(--bg-2);border:1px solid var(--line)}
.w-stat b{display:block;font-size:1.5rem;font-weight:900;line-height:1.3;color:var(--ink);font-variant-numeric:tabular-nums}
.w-stat span{font-size:var(--fs-xs);color:var(--muted);font-weight:600}
.w-stat--ok b{color:var(--w-ok)}
.w-stat--bad b{color:var(--w-err)}
.w-stat--accent b{color:var(--accent-text)}

/* نوار سطح */
.w-meter{position:relative;block-size:1.1rem;border-radius:999px;background:var(--bg-2);border:1px solid var(--line);overflow:hidden}
.w-meter__fill{position:absolute;inset-block:0;inset-inline-start:0;inline-size:0;border-radius:inherit;background:linear-gradient(90deg,var(--w-ok),var(--accent) 70%,var(--w-err));transition:inline-size .06s linear}
.w-meter__peak{position:absolute;inset-block:0;inline-size:3px;background:var(--ink);opacity:.6}

/* بوم و پیش‌نمایش */
.w-canvas{display:block;inline-size:100%;border-radius:var(--r);background:var(--bg-2);border:1px solid var(--line)}
.w-media{position:relative;border-radius:var(--r);overflow:hidden;background:#000}
.w-media video,.w-media img{display:block;inline-size:100%;block-size:auto}

/* فایل */
.w-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;min-block-size:11rem;padding:1.4rem;border:2px dashed var(--line-2,var(--line));
    border-radius:var(--r-lg);background:var(--bg-2);text-align:center;cursor:pointer;transition:border-color var(--dur-1) var(--ease),background var(--dur-1) var(--ease)}
.w-drop:hover,.w-drop.is-over,.w-drop:focus-visible{border-color:var(--accent);background:var(--accent-050);outline:0}
.w-drop .w-ico{inline-size:2.4rem;block-size:2.4rem;color:var(--accent-text)}
.w-drop strong{font-size:1.05rem}
.w-drop span{color:var(--muted);font-size:var(--fs-sm)}
.w-files{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,11rem),1fr))}
.w-file{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden}
.w-file img{display:block;inline-size:100%;aspect-ratio:4/3;object-fit:cover;background:var(--bg-2)}
.w-file__meta{padding:.45rem .6rem;font-size:var(--fs-xs);color:var(--ink-2);line-height:1.7;word-break:break-all}

/* پیام */
.w-note{display:flex;gap:.6rem;align-items:flex-start;padding:.75rem .95rem;border-radius:var(--r);border:1px solid var(--line);background:var(--bg-2);font-size:var(--fs-sm);line-height:1.9}
.w-note .w-ico{margin-block-start:.35rem}
.w-note--ok{border-color:color-mix(in oklab,var(--w-ok) 40%,var(--line));color:var(--w-ok)}
.w-note--ok span{color:var(--ink)}
.w-note--warn{border-color:color-mix(in oklab,var(--w-err) 40%,var(--line));color:var(--w-err)}
.w-note--warn span{color:var(--ink)}
.w-note--info .w-ico{color:var(--w-info)}
.w-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.12rem .6rem;border-radius:999px;font-size:var(--fs-xs);font-weight:700;background:var(--bg-2);border:1px solid var(--line)}
.w-badge--ok{color:var(--w-ok);border-color:color-mix(in oklab,var(--w-ok) 40%,var(--line))}
.w-badge--bad{color:var(--w-err);border-color:color-mix(in oklab,var(--w-err) 40%,var(--line))}
.w-progress{block-size:.55rem;border-radius:999px;background:var(--bg-2);overflow:hidden}
.w-progress i{display:block;block-size:100%;inline-size:0;background:var(--accent);transition:inline-size .2s}

/* کلید کیبورد */
.w-kbd{display:inline-grid;place-items:center;min-inline-size:2.4rem;block-size:2.4rem;padding-inline:.45rem;border-radius:.55rem;border:1px solid var(--line);
    border-block-end-width:3px;background:var(--surface);font:700 .85rem/1 Consolas,'Segoe UI',sans-serif;color:var(--ink-2)}

/* تمام‌صفحه */
.w-full{position:fixed;inset:0;z-index:2147483000;background:#000;touch-action:none}

/* اعلان */
.w-toasts{position:fixed;inset-block-end:1.2rem;inset-inline:0;z-index:2147483600;display:flex;flex-direction:column;align-items:center;gap:.5rem;pointer-events:none}
.w-toast{padding:.6rem 1.1rem;border-radius:.8rem;background:var(--ink);color:var(--bg);font-weight:700;font-size:.92rem;box-shadow:var(--shadow-2);transition:opacity .4s,transform .4s}
.w-toast--ok{background:var(--w-ok);color:#fff}
.w-toast--warn{background:var(--w-err);color:#fff}
.w-toast.is-out{opacity:0;transform:translateY(8px)}

@keyframes w-spin{to{transform:rotate(360deg)}}

@media (max-width:40rem){
    #di9w-app{padding:.9rem;border-radius:var(--r)}
    .w-btn{padding-inline:.9rem}
}

@media (prefers-reduced-motion:reduce){
    .w-meter__fill,.w-btn,.di9w-card{transition:none}
}

/* نوار ابزارها در صفحه‌ی اول بلاگ */
.di9w-homestrip{margin-block:var(--space-m,2rem)}
.di9w-cards--strip{grid-template-columns:repeat(auto-fill,minmax(min(100%,16rem),1fr))}
.di9w-cards--strip .di9w-card__body span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.di9w-cards--strip .di9w-card__body strong{font-size:.98rem}