/* ==========================================================================
   theme.css — تم نارنجی نرم (الهام از اپ‌های بانکی ایرانی)
   هدر روشن با گرادینت نارنجی ملایم، دکمه‌های دایره‌ای، بدنه سفید با لبه گرد و دستگیره،
   فهرست‌های تخت با آیکون دایره‌ای خاکستری، سبز ملایم برای مثبت‌ها.
   بعد از app.css بارگذاری می‌شود.
   ========================================================================== */
:root{
  --bg:#FFFFFF;
  --surface:#F4F5F7;
  --surface-2:#FFFFFF;
  --fill:#ECEEF1;
  --fill-2:#D3D8DE;
  --ink:#2B2F36;
  --ink-2:#5D6874;
  --ink-3:#9AA6B2;
  --line:#E7E9EC;
  --line-2:#EEF0F2;

  --acc:#F27A1A;
  --acc-2:#B8570C;
  --acc-soft:#F5852F;
  --acc-bg:#FFF1E5;
  --acc-line:#FCD8BA;
  --hdr:#FFE9D6;
  --hdr-2:#FFF8F2;

  --ok:#2E9A4F;   --ok-bg:#E8F6EC;
  --warn:#B06A00; --warn-bg:#FCF2DF;
  --bad:#C9443A;  --bad-bg:#FCEBE8;
  --icon:#728391;
  --circle:#F2F3F5;
}
body,#app{background:var(--bg)}
@media (min-width:560px){ body{background:#F7EFE8} #app{box-shadow:0 0 0 1px var(--line),0 24px 60px rgba(43,47,54,.08)} }
html.win-titlebar .titlebar{background:var(--hdr);color:var(--ink-2)}
#screen{padding-top:0}

/* ---------- هدر: گرادینت نارنجی خیلی نرم، متن تیره ---------- */
.hdr{
  position:relative;color:var(--ink);padding:calc(var(--safe-t) + 4px) 0 34px;overflow:hidden;
  background:
    radial-gradient(110% 80% at 100% 0%,rgba(255,170,105,.50) 0%,rgba(255,170,105,0) 62%),
    radial-gradient(90% 70% at 0% 0%,rgba(255,212,175,.55) 0%,rgba(255,212,175,0) 64%),
    linear-gradient(180deg,#FFEEDF 0%,#FFF8F2 72%,#FFFDFB 100%);
}
.hdr::before,.hdr::after{display:none}
.appbar{
  position:relative;z-index:1;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;
  min-height:0;padding:14px 16px 4px 12px;box-shadow:none!important;color:var(--ink);
}
.appbar::after{display:none}
.ab-title small{color:var(--ink-3);font-size:12px}
.ab-title h1{color:var(--ink);font-size:21px;font-weight:800}
.ab-switch .ic{color:var(--ink-3)}
.appbar .ib{background:#fff;color:var(--ink-2);border-radius:50%;width:42px;height:42px;box-shadow:0 2px 10px rgba(220,105,25,.14),inset 0 0 0 1px rgba(245,140,70,.28)}
.appbar .ib:active,.appbar .ib:hover{background:var(--acc-bg);color:var(--acc-2)}

/* دکمه‌های دایره‌ای بزرگ زیر عنوان */
.qa{position:relative;z-index:1;display:flex;justify-content:space-around;align-items:flex-start;padding:16px 8px 0}
.qa-b{display:flex;flex-direction:column;align-items:center;gap:9px;width:84px;color:var(--ink-2);font-size:12.5px;font-weight:600;line-height:1.4;text-align:center}
.qa-c{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--acc);box-shadow:0 6px 16px rgba(220,105,25,.14),inset 0 0 0 1px rgba(245,140,70,.3);transition:transform .18s var(--ease),background .18s}
.qa-b.pri .qa-c{background:linear-gradient(145deg,#FF9A4A,#F27A1A);color:#fff;box-shadow:0 8px 20px rgba(242,122,26,.38)}
.qa-b:active .qa-c{transform:scale(.9)}
.qa-t{opacity:1}

/* لبه سفید گرد با دستگیره، مثل شیت */
.sheet-top{position:relative;z-index:2;height:28px;margin-top:-24px;background:var(--bg);border-radius:24px 24px 0 0}
.sheet-top i{position:absolute;top:10px;left:50%;width:44px;height:5px;margin-left:-22px;border-radius:5px;background:#D3D8DD}

/* عدد اصلی داخل هدر */
.hero{position:relative;z-index:1;margin:0;padding:6px 20px 0;border-radius:0;background:none;color:var(--ink);overflow:visible}
.hero::after{display:none}
.hero .k{font-size:12.5px;color:var(--ink-2)}
.hero .v{font-size:34px;font-weight:800;line-height:1.35;color:var(--ink);letter-spacing:-.3px}
.hero .v i{font-size:13.5px;font-weight:400;color:var(--ink-3);margin-right:6px}
.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px;padding:0;border:none}
.hero-stats div{background:rgba(255,255,255,.78);border-radius:999px;padding:8px 6px!important;border:1px solid rgba(245,140,70,.28)!important;text-align:center}
.hero-stats small{display:block;font-size:11px;color:var(--ink-3)}
.hero-stats b{font-size:15.5px;font-weight:800;color:var(--ink)}
.hero .mark{display:none}

/* ---------- فهرست‌ها: تخت، بی‌کارت، آیکون دایره‌ای ---------- */
.sec{padding:0 16px;margin-top:16px}
.sec-t{padding:0 4px;margin-bottom:2px}
.sec-t h2{font-size:13px;font-weight:700;color:var(--ink-3)}
.sec-t button,.link{color:var(--acc)}
.group{background:none;border-radius:0;overflow:visible}
.row{padding:11px 2px;min-height:74px;gap:14px;border-radius:16px}
.row + .row::before{display:none}
button.row:active,.row.tap:active{background:var(--surface)}
.r-ic,.ti,.em-ic,.num{display:grid!important;place-items:center;flex:0 0 auto;border-radius:50%}
.r-ic{width:52px;height:52px;background:var(--circle);color:var(--icon)}
.r-ic.ok{background:var(--ok-bg);color:var(--ok)}
.r-ic.acc{background:var(--acc-bg);color:var(--acc)}
.r-ic.warn{background:var(--warn-bg);color:var(--warn)}
.r-ic.bad{background:var(--bad-bg);color:var(--bad)}
.r-t{font-size:15.5px;font-weight:600;line-height:1.6}
.r-s{font-size:12.5px;color:var(--ink-3)}
.r-s b{color:var(--ink-2);font-weight:600}
.r-v{font-size:15.5px;font-weight:600;color:var(--ink);border-radius:6px;padding:0 2px}
.r-u{font-size:11.5px;color:var(--ink-3)}
.r-v.tint-ok{background:var(--ok-bg);color:var(--ok);padding:1px 8px}
.r-v.tint-bad{background:var(--bad-bg);color:var(--bad);padding:1px 8px}
.r-chev{display:none}
.steps .row .num{width:40px;height:40px;background:var(--acc-bg);color:var(--acc);font-weight:800}
.steps .row.done .num{background:var(--ok-bg);color:var(--ok)}
.dlist{padding:0 16px}
.row.dc{align-items:center}
.row.dc .r-s + .r-s{margin-top:-2px}

/* ---------- کارت گزینه‌ها و الگوها (صفحه خالی پر از گزینه) ---------- */
.start-h{padding:6px 4px 12px}
.start-h h2{font-size:19px;font-weight:800;color:var(--ink);line-height:1.6}
.start-h p{font-size:13.5px;color:var(--ink-2);line-height:2;margin-top:2px}
.ocards{display:grid;gap:10px}
.ocard{display:flex;align-items:center;gap:14px;width:100%;text-align:right;padding:14px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);transition:transform .15s var(--ease),background .15s}
.ocard:active{transform:scale(.985);background:var(--surface)}
.ocard.pri{background:var(--acc-bg);box-shadow:inset 0 0 0 1.5px var(--acc-line)}
.ocard.pri .r-ic{background:var(--acc);color:#fff}
.ocard .r-t{font-weight:700}

/* ---------- تب‌بار: تب فعال نارنجی ---------- */
.tabbar{background:#fff;border-top:1px solid var(--line);grid-template-columns:repeat(6,1fr)}
.tab{color:#7E8F9A;gap:3px;padding:0;font-size:10.5px;font-weight:500}
.tab .pill{width:40px;height:32px;border-radius:0;background:none!important;color:inherit;transition:transform .25s var(--ease)}
.tab .tl{height:14px;opacity:1;overflow:hidden;line-height:14px;white-space:nowrap}
.tab.on{color:var(--acc-soft);font-weight:800}
.tab.on .pill{transform:translateY(-1px);color:var(--acc-soft);background:none!important}
.tab.on .pill svg{fill:currentColor;fill-opacity:.2;stroke-width:2.1}

.fab{display:none!important}

/* ---------- دکمه‌ها ---------- */
.btn{background:linear-gradient(135deg,#FF9A4A,var(--acc));color:#fff;border-radius:999px;margin:0;font-weight:700}
.btn:active{background:var(--acc-2);opacity:1}
.btn.sm,.btn.xs{border-radius:999px}
.btn.tonal{background:var(--acc-bg);color:var(--acc-2)}
.btn.tonal:active{background:var(--acc-line)}
.btn.ghost{background:transparent;color:var(--ink-2)}
.btn.ghost:active{background:var(--surface)}
.btn.line{background:#fff;color:var(--acc-2);box-shadow:inset 0 0 0 1.5px var(--acc-line)}
.btn.line:active{background:var(--acc-bg)}
.btn.danger{background:var(--bad-bg);color:var(--bad)}
.btn.danger-solid{background:var(--bad);color:#fff}
.sh-f{align-items:center;border-top:1px solid var(--line-2)}
.sh-f .btn{margin:0}
.cta{background:var(--surface)}
.cta .r-ic{background:#fff;color:var(--acc)}
.cta.warn{background:var(--warn-bg)}
.cta.warn .r-ic{background:#fff;color:var(--warn)}

/* ---------- چیپ، تب‌های داخلی، انتخاب‌ها ---------- */
.chips{padding:6px 16px 4px}
.chip{background:var(--surface);border:1px solid transparent;color:var(--ink-2);font-weight:600}
.chip.soft{background:var(--surface)}
.chip.on,.chip.soft.on,.qchips .chip.on{background:var(--acc-bg);border-color:var(--acc-line);color:var(--acc-2);font-weight:700}
.chip.add{background:#fff;border:1px dashed var(--fill-2)}
.chips.bleed{margin:0 -20px;padding:2px 20px 6px}
.badge{font-weight:700}
.badge.ink{background:var(--acc-bg);color:var(--acc-2)}
.badge.ok{background:var(--ok-bg);color:var(--ok)}
.badge.qty{height:30px;font-size:13px;padding:0 12px}
.plist .q{background:var(--acc-bg);color:var(--acc-2)}
.qchips .chip{background:var(--surface)}
.seg-wrap{padding:0 16px;margin:2px 0 4px}
.seg{background:var(--surface);border-radius:999px;padding:4px}
.seg button{border-radius:999px}
.seg button{color:var(--ink-3);font-weight:700}
.seg button.on{background:#fff;color:var(--acc-2);box-shadow:0 1px 4px rgba(43,47,54,.1)}
.opt{background:var(--surface)}
.opt.on{box-shadow:inset 0 0 0 2px var(--acc-soft);background:var(--acc-bg)}
.opt .ti{background:#fff;color:var(--icon)}
.opt.on .ti{background:var(--acc);color:#fff}
.fmt button{background:var(--surface)}
.fmt button.on{box-shadow:inset 0 0 0 2px var(--acc-soft);background:var(--acc-bg)}
.fmt .r-ic{width:42px;height:42px;background:#fff;color:var(--acc)}
.sw.on{background:var(--acc-soft)}
.ck{border-radius:50%}
.ck.on{background:var(--acc-soft);border-color:var(--acc-soft)}
.search input{background:var(--surface)}
.search input:focus,.inp:focus{border-color:var(--acc-line)}
.sheet .search input{background:var(--surface)}
.inp{background:var(--surface);border-color:transparent;border-radius:16px}
.pick{background:var(--surface)!important;border-color:transparent;border-radius:16px}
.range::-webkit-slider-runnable-track{background:linear-gradient(to left,var(--acc-soft) var(--p,50%),var(--fill) var(--p,50%))}
.stepper{background:var(--surface);border-radius:999px}
.stepper button{border-radius:50%}
.stepper button{color:var(--acc)}
.stepper.has{background:var(--acc-bg)}
.stepper.has .sv{color:var(--acc-2)}
.toggles .row{min-height:60px}
.portion{background:var(--surface)}
.note{background:var(--surface)}
.kv{background:var(--surface)}
.kv .hl{background:var(--acc-bg);color:var(--acc-2)}
.kv .hl small,.kv .hl b i{color:var(--acc-2);opacity:.8}
.fcbar b{background:var(--ink-2)}
.empty .em-ic{background:var(--circle);color:var(--icon)}
.big{padding:2px 22px 0}
.pv{background:var(--surface)}

/* ---------- شیت‌ها، چرخ، کیبورد ---------- */
.scrim{background:rgba(40,24,14,.4)}
.sheet,.sheet.tint{background:#fff;border-radius:26px 26px 0 0}
.grab i{background:#D3D8DD}
.sheet .sticky-top,.sheet.tint .sticky-top{background:#fff}
.sheet .group .row{padding-right:4px;padding-left:4px}
.wheel-band{background:var(--acc-bg);box-shadow:none}
.wheel-i.on{color:var(--acc-2)}
.kp button{background:var(--surface)}
.kp button:active{background:var(--fill)}
.prun-prog i{background:var(--acc-soft)}
.prun-done .em-ic{background:var(--ok-bg);color:var(--ok);border-radius:50%}

/* ---------- پیام‌ها ---------- */
.toast{background:#fff;color:var(--ink);box-shadow:0 10px 30px rgba(31,45,70,.18),0 0 0 1px var(--line)}
.toast button{color:var(--acc)}
.busy div{background:#fff;color:var(--ink);box-shadow:0 10px 30px rgba(31,45,70,.18)}
.spin{border:2.5px solid var(--acc-line);border-top-color:var(--acc)}

/* ---------- دکمه ثابت بالای تب‌بار (صفحه خروجی) ---------- */
.dock{
  position:absolute;left:0;right:0;bottom:calc(var(--nav) + var(--safe-b));z-index:15;
  padding:26px 16px 12px;pointer-events:none;
  background:linear-gradient(to top,#fff 58%,rgba(255,255,255,0));
}
.dock > *{pointer-events:auto}
.dock .btn{box-shadow:0 8px 22px rgba(242,122,26,.32)}
html.has-dock #screen{padding-bottom:150px}
.ex-go{display:none}

/* ---------- حرکت‌های ورود (فقط هنگام جابه‌جایی بین صفحه‌ها) ---------- */
@keyframes rowIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes popIn{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
html.anim .qa-b{animation:popIn .4s var(--ease) both}
html.anim .qa-b:nth-child(2){animation-delay:.05s}
html.anim .qa-b:nth-child(3){animation-delay:.1s}
html.anim .qa-b:nth-child(4){animation-delay:.15s}
html.anim .group .row,html.anim .ocard,html.anim .tpl{animation:rowIn .42s var(--ease) both}
html.anim .group .row:nth-child(2),html.anim .ocard:nth-child(2),html.anim .tpl:nth-child(2){animation-delay:.04s}
html.anim .group .row:nth-child(3),html.anim .ocard:nth-child(3),html.anim .tpl:nth-child(3){animation-delay:.08s}
html.anim .group .row:nth-child(4),html.anim .tpl:nth-child(4){animation-delay:.12s}
html.anim .group .row:nth-child(5),html.anim .tpl:nth-child(5){animation-delay:.16s}
html.anim .group .row:nth-child(n+6){animation-delay:.2s}
@media (prefers-reduced-motion:reduce){html.anim *{animation:none!important}}

.sh-f .btn.fit{flex:0 0 auto;width:auto;padding:0 12px;font-size:14px;gap:2px;white-space:nowrap}
.sc-val{font-size:30px;font-weight:900;color:var(--ink);padding:0;line-height:1.3;display:flex;align-items:baseline;gap:6px}
.sc-val small{font-size:14px;font-weight:500;color:var(--ink-3)}
.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;margin:0 0 12px}
.onb{background:linear-gradient(180deg,#FFEEDF 0,#FFF8F2 220px,#fff 420px)}

/* ---------- تبدیل رسپی: عدد وسط با دکمه‌های دایره‌ای ---------- */
.sc-hero{padding:22px 16px 6px;text-align:center}
.sc-q{font-size:13px;font-weight:600;color:var(--ink-3);margin-bottom:14px}
.sc-ctl{direction:ltr;display:flex;align-items:center;justify-content:center;gap:20px}
.sc-rb{width:48px;height:48px;border-radius:50%;background:var(--surface);color:var(--ink);display:grid;place-items:center;flex:none}
.sc-rb:active{background:var(--fill)}
.sc-mid{min-width:110px;display:flex;flex-direction:column;align-items:center;line-height:1.1}
.sc-big{font-size:52px;font-weight:900;color:var(--ink);padding:0;line-height:1.1}
.sc-unit{font-size:14px;font-weight:500;color:var(--ink-3);margin-top:2px}
.sc-sub{margin-top:12px;font-size:12.5px;color:var(--ink-2)}
.sc-sub b{color:var(--ink);font-weight:800}
.sc-sub i{display:inline-block;width:1px;height:11px;background:var(--line);margin:0 8px;vertical-align:-1px}
.sc-hero .chips{justify-content:center;flex-wrap:wrap;overflow:visible}

/* ---------- صفحه شروع: بدون اسکرول ---------- */
.onb.compact{padding:calc(var(--safe-t,0px) + 20px) 20px 16px;justify-content:center;min-height:100%}
.onb.compact h1{font-size:25px;line-height:1.5;margin:20px 0 0;letter-spacing:-.3px}
.onb.compact .card{margin-top:18px;padding:16px 16px 2px}
.onb.compact .field{margin-bottom:14px}
.onb.compact .mt16{margin-top:14px}
.onb.compact .alt{flex-direction:row;gap:8px;margin-top:10px}
.onb.compact .alt .btn{flex:1;font-size:13px;min-height:44px;height:44px}
@media (max-height:700px){.onb.compact h1{font-size:22px;margin-top:12px}.onb.compact .card{margin-top:12px}.onb.compact .field{margin-bottom:10px}}
/* ---------- طرز تهیه مرحله‌به‌مرحله ---------- */
.stp-list{display:flex;flex-direction:column;gap:12px}
.stp{display:flex;gap:12px;align-items:flex-start}
.stp .num{width:32px;height:32px;background:var(--acc-bg);color:var(--acc-2);font-weight:800;font-size:14px;margin-top:2px}
.stp small{display:block;font-size:12px;font-weight:700;color:var(--ink-3);margin-bottom:2px}
.stp p{font-size:14.5px;line-height:1.9;color:var(--ink);white-space:pre-wrap;user-select:text}
.stp-edit{display:flex;flex-direction:column;gap:10px}
.stp-row{display:flex;gap:10px;align-items:flex-start}
.stp-row .num{width:32px;height:32px;margin-top:9px;background:var(--acc-bg);color:var(--acc-2);font-weight:800;font-size:14px}
.stp-row textarea.inp{flex:1;min-height:50px;padding:11px 14px;overflow:hidden}
.stp-x{width:36px;height:36px;margin-top:7px;border-radius:50%;display:grid;place-items:center;color:var(--ink-3);flex:none}
.stp-x:active{background:var(--fill)}

.pf-wrap{position:relative}
.pf-wrap .inp{padding-left:44px;font-weight:800;font-size:17px}
.pf-u{position:absolute;left:16px;top:50%;transform:translateY(-50%);font-weight:800;color:var(--ink-3);pointer-events:none}

/* ---------- سود مجموعه در صفحه شروع ---------- */
.pf2 > label{margin-bottom:10px}
.pf2-box{background:#fff;border-radius:20px;padding:16px 12px 14px;box-shadow:0 1px 0 rgba(0,0,0,.03),inset 0 0 0 1px var(--line)}
.pf2-ctl{direction:ltr;display:flex;align-items:center;justify-content:center;gap:12px}
.pf2-ctl .sc-rb{width:46px;height:46px;background:var(--acc-bg);color:var(--acc-2)}
.pf2-ctl .sc-rb:active{background:var(--acc-soft)}
.pf2-val{display:flex;align-items:baseline;justify-content:center;gap:4px;min-width:120px;direction:ltr}
.pf2-val input{width:92px;border:0;outline:0;background:transparent;text-align:center;font:inherit;font-size:42px;font-weight:900;color:var(--ink);padding:0;line-height:1.2;border-radius:10px}
.pf2-val input:focus{background:var(--acc-bg)}
.pf2-val b{font-size:22px;font-weight:800;color:var(--ink-3)}
.pf2-chips{display:flex;justify-content:center;gap:6px;margin-top:12px;flex-wrap:wrap}
.pf2-chips .chip{min-width:52px;justify-content:center}

/* ---------- چرخ سود در صفحه شروع ---------- */
.pf3{background:#fff;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.wheel.mini{height:132px;margin:0}
.wheel.mini .wheel-band{top:44px;left:10px;right:10px}
.wheel.mini .wheel-pad{height:44px}

.pf3 .wheel{margin:0}
.pf3 .wheel-band{left:10px;right:10px}
.onb.compact .card{padding-bottom:10px}
@media (max-height:760px){.onb.compact{padding-top:14px;padding-bottom:10px}.onb.compact h1{font-size:22px;margin-top:10px}.onb.compact .card{margin-top:10px;padding:12px 14px 2px}.onb.compact .field{margin-bottom:8px}.onb.compact .mt16{margin-top:10px}}

.lbl-row{display:flex!important;justify-content:space-between;align-items:center}
.lnk{font-size:12.5px;font-weight:700;color:var(--acc-2);padding:2px 4px}
.pf4{height:220px;display:flex;align-items:center;justify-content:center;gap:6px;direction:ltr}
.pf4 input{width:120px;border:0;outline:0;background:transparent;text-align:center;font:inherit;font-size:30px;font-weight:800;color:var(--ink);border-radius:12px;padding:6px 0}
.pf4 input:focus{background:var(--acc-bg)}
.pf4 b{font-size:20px;font-weight:800;color:var(--ink-3)}

/* ---------- صفحه شروع: مینیمال ---------- */
.onb.compact .card{background:none;padding:0;margin-top:22px}
.onb.compact .field{margin-bottom:16px}
.onb.compact .lbl-row small{font-size:11.5px}
.hw-box{background:var(--surface);border-radius:16px;height:76px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hw{position:relative;width:100%;direction:ltr}
.hw-sc{display:flex;align-items:center;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;height:76px;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 22%,#000 78%,transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 22%,#000 78%,transparent 100%)}
.hw-sc::-webkit-scrollbar{display:none}
.hw-pad{flex:0 0 40%;height:1px}
.hw-i{flex:0 0 20%;scroll-snap-align:center;height:60px;display:grid;place-items:center;font-size:15px;font-weight:500;color:var(--ink-3);transition:font-size .12s,color .12s}
.hw-i.n1{font-size:17px;color:var(--ink-2)}
.hw-i.on{font-size:28px;font-weight:800;color:var(--acc-2)}
.hw-tick{position:absolute;left:50%;bottom:8px;width:18px;height:3px;margin-left:-9px;border-radius:3px;background:var(--acc-soft);pointer-events:none}
.hw-man{direction:ltr;display:flex;align-items:baseline;justify-content:center;gap:4px}
.hw-man input{width:110px;border:0;outline:0;background:transparent;text-align:center;font:inherit;font-size:28px;font-weight:800;color:var(--acc-2);padding:0}
.hw-man b{font-size:16px;font-weight:700;color:var(--ink-3)}
.hw-cap{display:block;margin:8px auto 0;font-size:12px;color:var(--ink-3);font-weight:600}

/* ---------- دو پنجرهٔ متفاوت هنگام افزودن ماده به رسپی ---------- */
/* مرحله ۱: ثبت ماده در لیست مواد اولیه — سبز، با نوار کنار */
.sheet.newing .sh-h h3 small{color:var(--acc-2);font-weight:700}
/* مرحله ۲: مقدار مصرف در رسپی — همان سبز مرحلهٔ ۱ (نوار پیشرفت دو مرحله‌ای بالای هر دو پنجره) */
.sheet.qty .sh-h h3 small{color:var(--acc-2);font-weight:700}
.sheet.qty .qty-tag{display:flex;align-items:center;justify-content:center;gap:8px;margin:2px 16px 10px;padding:9px 14px;border-radius:14px;background:var(--acc-bg);color:var(--acc-2);font-size:12.5px;font-weight:700;line-height:1.6;animation:rowIn .4s ease both}
.sheet.qty .readout .rv{color:var(--acc-2)}
.sheet.qty .qchips .chip{background:#fff}
.sheet.qty .qchips .chip.on{background:var(--acc-bg);border-color:var(--acc-line);color:var(--acc-2)}
.sheet.qty .wheel-band{background:var(--acc-bg)}
.sheet.qty .wheel-i.on{color:var(--acc-2)}
/* نوار دو مرحله‌ای: ۱ ثبت ماده ← ۲ مقدار در رسپی */
.flow{display:flex;align-items:center;margin:0 20px 12px;padding:0}
.flow .fl-s{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--ink-3);white-space:nowrap}
.flow .fl-dot{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;background:#fff;color:var(--ink-3);box-shadow:inset 0 0 0 1.5px var(--acc-line)}
.flow .fl-s.on,.flow .fl-s.done{color:var(--acc-2)}
.flow .fl-s.on .fl-dot{background:var(--acc);color:#fff;box-shadow:0 0 0 4px rgba(242,122,26,.18);animation:flowPulse 1.8s ease-in-out infinite}
.flow .fl-s.done .fl-dot{background:var(--acc);color:#fff;box-shadow:none;animation:popIn .5s cubic-bezier(.2,1.6,.4,1) both}
.flow .fl-line{flex:1;height:3px;margin:0 10px;border-radius:3px;background:var(--acc-line);overflow:hidden;position:relative}
.flow .fl-line i{position:absolute;inset:0;background:var(--acc);transform-origin:right;transform:scaleX(0)}
.flow.s2 .fl-line i{animation:flowFill .7s .15s ease forwards}
@keyframes flowFill{to{transform:scaleX(1)}}
@keyframes flowPulse{50%{box-shadow:0 0 0 8px rgba(242,122,26,.06)}}
/* تبدیل رسپی: عدد بزرگِ قابل‌لمس */
.sc-num{display:flex;flex-direction:column;align-items:center;gap:2px;margin:0 auto 12px;padding:6px 26px 10px;border-radius:22px;background:transparent}
.sc-num:active{background:var(--acc-bg)}
.sc-num .n{font-size:52px;font-weight:900;line-height:1.25;color:var(--ink)}
.sc-num .n i{font-style:normal;font-size:16px;font-weight:400;color:var(--ink-3);margin-right:8px}
.sc-num .hint-t{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--acc-2);background:var(--acc-bg);border-radius:999px;padding:5px 12px}
.sc-hero .qchips{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}

/* آیکون فایل رسپی کاستر (لوگو + نشان) به‌جای دایرهٔ خاکستری */
.r-ic.file{background:transparent!important;border-radius:0!important;width:48px;height:48px}
.r-ic.file svg{display:block;width:46px;height:46px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.12))}

/* ---------- حذف با کشیدن رسپی به چپ ---------- */
.swp{position:relative;overflow:hidden;border-radius:16px;transition:max-height .3s ease,opacity .3s ease,margin .3s ease}
.swp.dragging .swp-bg,.swp.gone .swp-bg{visibility:visible}
.swp.out{max-height:0 !important;opacity:0;margin:0}
.swp-fg{position:relative;z-index:1;background:var(--bg);touch-action:pan-y;will-change:transform;animation:none !important}
.swp-fg:active{background:var(--surface)}
.swp-bg{visibility:hidden;position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-end;direction:ltr;padding:0 22px;color:#fff;overflow:hidden}
.swp-bg::before{content:"";position:absolute;inset:0;background:var(--bad);opacity:var(--r,0);transition:opacity .08s}
.swp-bg span{position:relative;display:flex;align-items:center;gap:8px;font-size:14px;opacity:var(--r,0);transform:scale(calc(.75 + var(--r,0) * .25));transform-origin:right center}
.swp-bg b{font-weight:800}
.swp-bg .t2,.swp-bg .t3{display:none}
.swp.armed .swp-bg .t1{display:none}.swp.armed .swp-bg .t2{display:inline}
.swp.gone .swp-bg .t2,.swp.gone .swp-bg .t1{display:none}.swp.gone .swp-bg .t3{display:inline}
.swp.armed .swp-bg span{animation:popIn .25s ease both}
html.anim .swp{animation:rowIn .42s var(--ease) both}
.swp.flash .swp-fg{animation:flashRow 1.8s ease both !important}
@keyframes flashRow{0%,55%{background:var(--acc-bg)}100%{background:var(--bg)}}

/* رسپی جدید: دسته کنار نام، به‌صورت باز و بسته */
.nm-row{display:flex;gap:8px;align-items:stretch}
.nm-row .inp{flex:1;min-width:0}
.cat-btn{flex:0 0 auto;max-width:42%;height:54px;padding:0 14px;border-radius:16px;background:var(--surface);color:var(--ink-2);display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700}
.cat-btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-btn.has{background:var(--acc-bg);color:var(--acc-2)}
.cat-btn .ic{transition:transform .25s ease;flex:0 0 auto}
.cat-btn.open .ic{transform:rotate(180deg)}
.cat-pan{display:grid;grid-template-rows:0fr;transition:grid-template-rows .26s ease}
.cat-pan>div{overflow:hidden;min-height:0}
.cat-pan.open{grid-template-rows:1fr}
.cat-pan .chips{margin-top:10px}

/* صفحهٔ ورود: فضای بازتر و نام آشپزخانهٔ پررنگ‌تر */
.onb.compact{padding-top:calc(var(--safe-t,0px) + 28px);padding-bottom:24px}
.onb.compact h1{margin:30px 0 0;line-height:1.6}
.onb.compact .card{margin-top:30px}
.onb.compact .field{margin-bottom:26px}
.onb.compact .field>label,.onb.compact .lbl-row{font-size:14.5px;font-weight:800;color:var(--ink);margin-bottom:12px}
.onb.compact .lbl-row small{font-weight:500}
.onb.compact .inp{height:64px;font-size:18px;font-weight:700;padding:0 20px;border-radius:20px;background:#fff;border:1.5px solid var(--acc-line);box-shadow:0 6px 18px rgba(242,122,26,.08)}
.onb.compact .inp:focus{border-color:var(--acc);box-shadow:0 0 0 4px rgba(242,122,26,.14);outline:none}
.onb.compact .inp::placeholder{font-weight:400;color:var(--ink-3)}
.onb.compact .mt16{margin-top:22px}