/* Vazirmatn, self-hosted so the app and the saved image work offline */
@font-face{font-family:'Vazirmatn';font-style:normal;font-display:swap;font-weight:400;src:url(../asset/fonts/vazirmatn-arabic-400-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'Vazirmatn';font-style:normal;font-display:swap;font-weight:400;src:url(../asset/fonts/vazirmatn-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Vazirmatn';font-style:normal;font-display:swap;font-weight:500;src:url(../asset/fonts/vazirmatn-arabic-500-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'Vazirmatn';font-style:normal;font-display:swap;font-weight:500;src:url(../asset/fonts/vazirmatn-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Vazirmatn';font-style:normal;font-display:swap;font-weight:600;src:url(../asset/fonts/vazirmatn-arabic-600-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'Vazirmatn';font-style:normal;font-display:swap;font-weight:600;src:url(../asset/fonts/vazirmatn-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Vazirmatn';font-style:normal;font-display:swap;font-weight:800;src:url(../asset/fonts/vazirmatn-arabic-800-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'Vazirmatn';font-style:normal;font-display:swap;font-weight:800;src:url(../asset/fonts/vazirmatn-latin-800-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
*{box-sizing:border-box;margin:0}
html,body{font-family:'Vazirmatn',system-ui,sans-serif;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;line-height:1.6}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;touch-action:manipulation}
ul{list-style:none;padding:0}
.app{font-family:'Vazirmatn',system-ui,sans-serif;line-height:1.6;--bg:#F7F6F1;--surface:#FFFFFF;--sunken:#EFEEE7;--band:#E6E5DC;--line:#DDDCD1;--ink:#16231B;--ink2:#5A6B61;--brand:#1F7A4D;--hero:#123D2A;--accent:#E8A33D;--on:#FFFFFF;--on-accent:#2A1A00;--danger:#C74848;
  background:var(--bg);color:var(--ink);min-height:100vh;min-height:100dvh}
.app[data-theme=dark]{--bg:#0C1410;--surface:#15211A;--sunken:#101A14;--band:#1B2A21;--line:#25382C;--ink:#EAF3EC;--ink2:#8FA39A;--brand:#4CC38A;--hero:#0F3A26;--accent:#F2B656;--on:#05210F;--on-accent:#2A1A00;--danger:#F08A8A}
.app[data-palette=blue]{--bg:#F5F6F7;--surface:#FFFFFF;--sunken:#EDEFF1;--band:#E1E5E8;--line:#D9DEE2;--ink:#080D12;--ink2:#5B636C;--brand:#33C3EC;--hero:#111A22;--accent:#33C3EC;--on:#04222C;--on-accent:#04222C;--danger:#C74848}
.app[data-palette=blue][data-theme=dark]{--bg:#080D12;--surface:#111A22;--sunken:#0C1319;--band:#18242F;--line:#24323E;--ink:#F5F6F7;--ink2:#9A9FA6;--brand:#33C3EC;--hero:#04222C;--accent:#33C3EC;--on:#04222C;--on-accent:#04222C;--danger:#F08A8A}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wrap{max-width:1160px;margin:0 auto;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.top h1{font-size:1.15rem;font-weight:800}
.nav{display:flex;align-items:center;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:3px}
.nav{position:relative}
.pill{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-weight:600}
.pill i{font-style:normal;font-size:.65rem;color:var(--ink2);transition:transform .15s}
.pill:hover,.pill[aria-expanded=true]{background:var(--band)}
.pill[aria-expanded=true] i{transform:rotate(180deg)}
.pop{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);width:min(300px,92vw);background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:8px;z-index:30;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;box-shadow:0 12px 32px -8px rgba(10,17,36,.3)}
.pop button{padding:10px 0;border-radius:12px;font-weight:500}
.pop button:hover{background:var(--band)}
.pop button.now{box-shadow:inset 0 0 0 1.5px var(--accent)}
.pop button[aria-selected=true]{background:var(--brand);color:var(--on);font-weight:600}
.nav select{appearance:none;background:none;border:0;font-weight:600;padding:6px 8px;border-radius:999px;color:var(--ink)}
.nav select option{color:#14213D}
.iconbtn{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;color:var(--ink2);font-size:1.1rem}
.iconbtn:hover{background:var(--band)}
.tools{display:flex;gap:6px;position:relative}
.btn{padding:10px 16px;border-radius:12px;font-weight:600;font-size:.9rem;border:1px solid var(--line);background:var(--surface)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:var(--on)}
.app[data-theme=dark] .btn.danger{color:#0C1410}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.menu{position:absolute;top:calc(100% + 4px);inset-inline-end:0;min-width:180px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px;z-index:30;box-shadow:0 12px 32px -8px rgba(10,17,36,.3)}
.menu button{display:block;width:100%;text-align:start;padding:10px 12px;border-radius:9px;font-size:.9rem}
.menu button:hover{background:var(--band)}
.menu .del{color:var(--danger)}
.menu .opt{display:flex;align-items:center;gap:10px}
.menu .sw{display:inline-flex}
.menu .sw i{width:16px;height:16px;border-radius:50%;border:1px solid var(--line);display:inline-block}
.menu .sw i + i{margin-inline-start:-5px}
.menu .opt b{margin-inline-start:auto;color:var(--brand)}
.scrim{position:fixed;inset:0;z-index:20}
.hero{background:var(--hero);color:#fff;border-radius:24px;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.hero-wd{opacity:.75;font-size:.95rem}
.hero-day{font-size:clamp(2rem,7vw,3.25rem);font-weight:800;line-height:1.15}
.hero-sub{margin-top:6px;opacity:.9;max-width:28ch}
.hero .btn{margin-top:12px;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);color:#fff;padding:8px 14px}
.layout{display:grid;gap:12px;grid-template-columns:1fr}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:18px}
.panel-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.panel-h h3{font-size:1rem;font-weight:600}
.hd{display:flex;align-items:center;gap:8px}
.hd svg{flex:none;color:var(--brand)}
.hd img{flex:none;display:block}
.big-num{font-size:1.5rem;font-weight:800}
.big-num small{font-size:.8rem;font-weight:400;color:var(--ink2);margin-inline-start:4px}
.section-h{display:flex;align-items:center;justify-content:space-between;padding:6px 4px 0}
.section-h h2{font-size:1.1rem;font-weight:800}
.weeks{display:flex;flex-wrap:wrap;gap:16px 24px;justify-content:space-around}
.weeks div{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.8rem;color:var(--ink2)}
textarea{width:100%;background:var(--sunken);border:1px solid var(--line);border-radius:12px;padding:12px;resize:vertical;min-height:140px}
textarea::-webkit-scrollbar{width:12px}
textarea::-webkit-scrollbar-track{background:transparent;margin:10px 0}
textarea::-webkit-scrollbar-thumb{background:var(--ink2);border-radius:999px;border:4px solid var(--sunken);min-height:36px;transition:background .15s}
textarea::-webkit-scrollbar-thumb:hover,textarea::-webkit-scrollbar-thumb:active{background:var(--brand)}
textarea::-webkit-scrollbar-corner,textarea::-webkit-resizer{background:transparent}
@supports not selector(::-webkit-scrollbar){textarea{scrollbar-width:thin;scrollbar-color:var(--ink2) transparent}}
:root{--sb-bg:#F7F6F1;--sb-thumb:#5A6B61;--sb-hover:#1F7A4D}
:root[data-theme=dark]{--sb-bg:#0C1410;--sb-thumb:#8FA39A;--sb-hover:#4CC38A}
:root[data-palette=blue]{--sb-bg:#F5F6F7;--sb-thumb:#5B636C;--sb-hover:#33C3EC}
:root[data-palette=blue][data-theme=dark]{--sb-bg:#080D12;--sb-thumb:#9A9FA6;--sb-hover:#33C3EC}
html{background:var(--sb-bg)}
html::-webkit-scrollbar{width:12px;height:12px}
html::-webkit-scrollbar-track{background:transparent}
html::-webkit-scrollbar-thumb{background:var(--sb-thumb);border-radius:999px;border:4px solid var(--sb-bg);min-height:40px;transition:background .15s}
html::-webkit-scrollbar-thumb:hover,html::-webkit-scrollbar-thumb:active{background:var(--sb-hover)}
@supports not selector(::-webkit-scrollbar){html{scrollbar-width:thin;scrollbar-color:var(--sb-thumb) var(--sb-bg)}}
.cell{width:100%;aspect-ratio:1;min-width:28px;border-radius:10px;border:1px solid var(--line);background:var(--sunken);color:var(--ink2);font-size:.8rem;font-weight:600;display:grid;place-items:center;transition:transform .12s}
.cell.wk1{background:var(--band)}
.cell:active{transform:scale(.88)}
.cell.on{background:var(--c);border-color:var(--c);color:var(--ci);animation:pop .18s}
.cell.today{outline:2px solid var(--accent);outline-offset:1px}
@keyframes pop{50%{transform:scale(1.12)}}
.toast{position:fixed;bottom:max(20px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:999px;z-index:60;font-size:.9rem;max-width:90vw;text-align:center}
.notes-txt{white-space:pre-wrap;background:var(--sunken);border:1px solid var(--line);border-radius:12px;padding:12px;line-height:1.9}
.hlist{display:grid;gap:10px}
.hcard{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:14px}
.hrow{display:flex;align-items:center;gap:12px;margin-bottom:12px;position:relative}
.hicon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:1.2rem;flex:none}
.hmeta{flex:1;min-width:0}
.hname{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hcount{font-size:.8rem;color:var(--ink2)}
.strip,.mgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.sc{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.7rem;color:var(--ink2)}
.sc .cell{min-width:0}
.more{margin-top:10px;width:100%;padding:8px;border-radius:10px;color:var(--ink2);font-size:.85rem;background:var(--sunken)}
.more + .mgrid{margin-top:10px}
.tablewrap{padding:8px 14px 14px}
table.grid{border-collapse:separate;border-spacing:2px;width:100%;table-layout:fixed}
.grid th{font-weight:400;padding-bottom:4px}
.grid .wd{display:block;font-size:.6rem;color:var(--ink2)}
.grid .dn{display:block;font-size:.66rem;border-radius:7px;padding:1px 0}
.grid .dn.wk1{background:var(--band)}
.grid th.is-today .dn{background:var(--accent);color:var(--on-accent);font-weight:800}
.grid .cell{width:100%;aspect-ratio:1;min-width:0;border-radius:6px;font-size:.75rem}
.grid td{padding:0}
.stick{width:210px;padding-inline-end:10px}
.stick .hrow{margin:0}
.tablewrap{background:var(--surface);border:1px solid var(--line);border-radius:20px;margin-top:8px}
.empty{text-align:center;padding:32px 16px;display:grid;gap:14px;justify-items:center;color:var(--ink2)}
.overlay{position:fixed;inset:0;z-index:50;background:rgba(10,17,36,.5);display:flex;align-items:flex-end;justify-content:center}
.sheet{width:100%;max-width:420px;max-height:92dvh;overflow-y:auto;overscroll-behavior:contain;background:var(--surface);border-radius:24px 24px 0 0;padding:20px 20px max(20px,env(safe-area-inset-bottom));display:grid;gap:14px}
.sheet h2{font-size:1.1rem;font-weight:800}
.sheet label{font-size:.85rem;color:var(--ink2);display:block;margin-bottom:6px}
.sheet input{width:100%;background:var(--sunken);border:1px solid var(--line);border-radius:12px;padding:12px}
.picks{display:flex;flex-wrap:wrap;gap:8px}
.pick{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);font-size:1.2rem;background:var(--sunken)}
.pick[aria-pressed=true]{border:2px solid var(--ink)}
.swatch{width:36px;height:36px;border-radius:50%;border:3px solid var(--surface);box-shadow:0 0 0 1px var(--line)}
.swatch[aria-pressed=true]{box-shadow:0 0 0 2px var(--ink)}
.actions{display:flex;gap:8px}.actions .btn{flex:1}
@media(pointer:coarse){.iconbtn{width:44px;height:44px}.pill{padding:9px 12px}}
@media(min-width:600px){.hlist{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));align-items:start}}
@media(max-width:640px){
  .top{flex-wrap:wrap;row-gap:10px}
  .top h1{flex:1;min-width:0}
  .nav{order:3;width:100%;justify-content:space-between}
  .nav .pill{flex:1;justify-content:center}
  .pop{width:min(320px,100%)}
  .app[data-snap] .nav{order:0;width:auto}
  .app[data-snap] .nav .pill{flex:none}
}
@media(max-width:480px){
  .hero{padding:18px;border-radius:20px}
  .hero-sub{max-width:none}
  .panel{padding:16px}
  .hcard{padding:12px}
  .strip,.mgrid{gap:5px}
}
@media(min-width:900px){
  .wrap{padding:32px}
  .layout.two{grid-template-columns:1fr 1.4fr}
  .layout.three{grid-template-columns:1.4fr 1fr}
  .overlay{align-items:center}.sheet{border-radius:24px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media print{.no-print{display:none!important}}
