/* ماژان — طراحی مشترک همه‌ی صفحه‌ها (بعد از استایل خود صفحه بارگذاری می‌شود و آن را یکدست می‌کند)
   رنگ‌ها از کیت برند (brand/brand.json): سبز تیره برای کار اصلی، قرمز ماژان فقط برای لوگو و هشدار واقعی،
   طلایی برای «این را پر کن»، زمینه‌ی کرم روشن. */
:root{
  --bg:#FAF6EF;--cd:#FFFFFF;--sf:#F3ECE1;--tx:#2B1D14;--mu:#7C6B5D;--bd:#ECE3D5;
  --ac:#17452B;--on:#FFF8EC;--rd:#B8322A;--gr:#2F7A3F;--br:#C73A31;--gd:#B7863B;--lf:#3E8E4E;
  --sh:0 1px 2px rgba(43,29,20,.05),0 0 0 1px var(--bd);
  --sh2:0 10px 30px rgba(43,29,20,.12),0 0 0 1px var(--bd);
}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;
  --bg:#0E1712;--cd:#16221A;--sf:#1E2C23;--tx:#F3ECDF;--mu:#A99C8C;--bd:#26362C;
  --ac:#86C994;--on:#0E1712;--rd:#F07A6E;--gr:#86C994;--br:#E8655C;--gd:#E9C46A;--lf:#86C994;
  --sh:0 0 0 1px var(--bd);--sh2:0 10px 30px rgba(0,0,0,.4),0 0 0 1px var(--bd)}}
:root[data-theme="dark"]{color-scheme:dark;
  --bg:#0E1712;--cd:#16221A;--sf:#1E2C23;--tx:#F3ECDF;--mu:#A99C8C;--bd:#26362C;
  --ac:#86C994;--on:#0E1712;--rd:#F07A6E;--gr:#86C994;--br:#E8655C;--gd:#E9C46A;--lf:#86C994;
  --sh:0 0 0 1px var(--bd);--sh2:0 10px 30px rgba(0,0,0,.4),0 0 0 1px var(--bd)}

body{background:var(--bg);color:var(--tx);font-size:15px;line-height:1.65;-webkit-tap-highlight-color:transparent;font-feature-settings:"ss01"}
main{padding-top:4px}
h2{font-size:21px;font-weight:700;letter-spacing:-.2px;margin:6px 0 14px;text-wrap:balance}
h3{font-size:15px;font-weight:700;margin:0 0 10px}
small,.mu{color:var(--mu);font-size:12.5px}

/* کارت‌ها: بدون خط دور سنگین، سایه‌ی نرم */
.k,.cd{background:var(--cd);border:0!important;box-shadow:var(--sh);border-radius:18px}
.k{padding:16px;margin-bottom:12px}
.cd{min-height:60px;padding:12px 16px}
.k[style*="border:2px solid var(--rd)"]{box-shadow:0 0 0 1.5px var(--rd),0 1px 2px rgba(43,29,20,.05)!important}
/* ردیف کار عقب‌افتاده: فقط یک نوار باریک قرمز در ابتدای ردیف */
.cd[style*="var(--rd)"]{box-shadow:inset -4px 0 0 var(--rd),var(--sh)!important}
.k .cd{box-shadow:0 0 0 1px var(--bd)}.k .cd[style*="var(--rd)"]{box-shadow:inset -4px 0 0 var(--rd),0 0 0 1px var(--bd)!important}
.k[style*="border:2px solid var(--ac)"]{box-shadow:0 0 0 1.5px var(--ac),0 1px 2px rgba(43,29,20,.05)!important}

/* دکمه‌ها */
.ch{border:0!important;background:var(--sf);color:var(--tx);border-radius:12px;min-height:44px;font-size:13.5px;font-weight:600;transition:background .15s,transform .1s}
.ch:active,.pb:active,.cd:active{transform:scale(.98)}
.ch.on{background:var(--ac);color:var(--on)}
.ch.rd,button.rd{background:transparent;color:var(--rd)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rd) 35%,transparent)}
.pb{height:52px;border-radius:14px;background:var(--ac);color:var(--on);font-weight:700;font-size:15.5px;box-shadow:0 2px 8px color-mix(in srgb,var(--ac) 25%,transparent)}
.bk{color:var(--ac);font-weight:600}
a{color:var(--ac)}

/* فیلدها */
input,select,textarea{background:var(--cd);border:1px solid var(--bd);border-radius:12px;color:var(--tx);font-size:15px}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--ac);box-shadow:0 0 0 3px color-mix(in srgb,var(--ac) 16%,transparent)}
::placeholder{color:color-mix(in srgb,var(--mu) 80%,transparent)}
/* «این را پر کن»: طلایی آرام به‌جای قرمز ترسناک */
.need{border:1.5px solid var(--gd)!important;background:color-mix(in srgb,var(--gd) 7%,var(--cd))!important}
.needg{outline:1.5px solid var(--gd)!important;background:color-mix(in srgb,var(--gd) 6%,transparent)!important}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px}

/* نوار پایین */
nav{background:color-mix(in srgb,var(--cd) 94%,transparent)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:0!important;box-shadow:0 -1px 0 var(--bd)}
nav button{color:var(--mu);font-size:11.5px;font-weight:600;min-height:64px;gap:4px}
nav button>svg,nav button>b{padding:3px 16px;border-radius:999px;transition:background .2s;box-sizing:content-box}
nav button.on{color:var(--ac)}
nav button.on>svg,nav button.on>b{background:color-mix(in srgb,var(--ac) 14%,transparent)}

/* پیام کوتاه بالای صفحه */
#t{background:var(--ac)!important;color:var(--on)!important;border-radius:14px!important;box-shadow:var(--sh2);font-weight:600}

/* نوار بالا با لوگو */
#mzh{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;max-width:640px;margin:0 auto;padding:calc(env(safe-area-inset-top,0px) + 10px) max(16px,env(safe-area-inset-left,0px)) 8px;background:var(--bg)}
body:has(#mzh){padding-top:0}
:root:has(#mzh){padding-top:0!important}
#mzh .logo{display:block;width:52px;height:34px;background:var(--br);-webkit-mask:url(/brand/logo/logo.svg) center/contain no-repeat;mask:url(/brand/logo/logo.svg) center/contain no-repeat;border:0;padding:0;flex:none}
#mzh .sp{flex:1}
#mzh .ib{position:relative;width:44px;height:44px;border-radius:14px;border:0;background:var(--sf);color:var(--tx);display:flex;align-items:center;justify-content:center}
#mzh .ib i{position:absolute;top:-3px;left:-3px;min-width:20px;height:20px;border-radius:10px;background:var(--br);color:#fff;font:700 11px/20px Vazirmatn,Tahoma,sans-serif;font-style:normal;padding:0 5px;text-align:center}
#mzh .who{font-size:13px;color:var(--mu);font-weight:600}

/* جوانه: نماد کوچک برای حالت‌های خالی */
.leaf{display:inline-block;width:28px;height:25px;background:var(--lf);-webkit-mask:url(/brand/logo/leaf.svg) center/contain no-repeat;mask:url(/brand/logo/leaf.svg) center/contain no-repeat;vertical-align:middle}
.empty{text-align:center;padding:28px 16px;color:var(--mu)}.empty .leaf{width:40px;height:36px;display:block;margin:0 auto 10px;opacity:.85}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}