:root{--bg:#f6efc3;--surface:#fff9da;--surface-2:#eae2b4;--text:#2035aa;--muted:#626340;--line:#ccc58f;--accent:#253aca;--accent-ink:#fff8cb;--good:#356146;--warning:#97620b;--danger:#b04736;--radius:0px;--font:Vazirmatn,system-ui,sans-serif;--ribbon-ink:#253aca;--ribbon-paper:#fff7c7;--ribbon-muted:#d9d3b9;color-scheme:light}
:root[data-theme=dark]{--bg:#1a2041;--surface:#252e52;--surface-2:#343d60;--text:#f2edc7;--muted:#bbc1cb;--line:#4b5576;--accent:#ede7a9;--accent-ink:#2234a7;--good:#a9d7b4;--warning:#f5c780;--danger:#ffb5a0;--ribbon-ink:#4557db;--ribbon-paper:#fff5c1;--ribbon-muted:#3b456d;color-scheme:dark}
body{font-size:14px}.app-shell{max-width:620px;overflow:hidden;min-height:100dvh;background:var(--bg)}.app-header{display:flex;align-items:center;justify-content:space-between;padding:calc(16px + max(env(safe-area-inset-top),var(--host-safe-top,0px))) 22px 14px;gap:16px}.ribbon-brand,.ribbon-header-tools{display:flex;align-items:center;gap:12px}.ribbon-brand{font-size:12px}.ribbon-mark{display:grid;place-items:center}.ribbon-icon,.ribbon-language{display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;min-width:44px;min-height:44px;padding:0;color:var(--text)}.ribbon-icon span{display:none}.ribbon-language{font-size:11px;border-inline-end:1px solid var(--line);min-width:38px}.ribbon-header-tools{gap:2px}.app-nav{position:static;inset:auto;max-width:none;margin:0 22px;padding:0;display:flex;gap:0;background:transparent;border:0;border-block:1px solid var(--text);justify-content:stretch}.app-nav button{min-height:47px;border-radius:0;flex-direction:row;gap:8px;justify-content:center;font-size:12px;white-space:nowrap;color:var(--muted);position:relative}.app-nav small{font-size:9px;opacity:.8}.app-nav [aria-current=page]{color:var(--text);background:transparent}.app-nav [aria-current=page]:after{content:"";position:absolute;bottom:-1px;inset-inline:14px;height:4px;background:var(--text)}.app-main{padding:0;min-height:0}.ribbon-page-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:24px 22px 28px}.ribbon-page-heading p{font-size:10px;letter-spacing:.7px;margin-bottom:8px;color:var(--muted)}.ribbon-page-heading h1{font-size:27px;letter-spacing:-1px;font-weight:550}.ribbon-page-heading .ribbon-icon{border:1px solid var(--text);border-radius:50%;flex-shrink:0}.ribbon-explorer{display:grid;grid-template-columns:40px minmax(0,1fr);direction:ltr;position:relative}.ribbon-edge{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:14px 0 0;border-block:1px solid var(--line);gap:14px}.ribbon-edge-label{font-size:9px;letter-spacing:3px;writing-mode:vertical-rl}.ribbon-index{display:flex;flex-direction:column;width:100%;max-height:222px;overflow:auto;scrollbar-width:none}.ribbon-index button{width:40px;min-height:42px;border:0;border-top:1px solid var(--line);background:transparent;color:var(--muted);font-size:10px}.ribbon-index [aria-pressed=true]{color:var(--bg);background:var(--text)}.ribbon-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc(100% - 26px);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-inline-end:26px;position:relative;overscroll-behavior-x:contain;scroll-behavior:auto}.ribbon-track::-webkit-scrollbar{display:none}.app-main .ribbon-strip{content-visibility:visible;contain-intrinsic-size:none}.ribbon-strip{scroll-snap-align:start;background:var(--ribbon-ink);color:var(--ribbon-paper);min-height:327px;padding:18px 19px 0;display:flex;flex-direction:column;position:relative;overflow:hidden;border-radius:0 0 32px 0}.ribbon-strip.is-muted{background:var(--ribbon-muted);color:var(--text)}.ribbon-strip-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.ribbon-status{font-size:11px;display:flex;gap:6px;align-items:center}.ribbon-status:before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}.ribbon-number{font-size:14px;font-weight:300;opacity:.85}.ribbon-strip-name{margin-top:23px;min-height:43px;display:flex;flex-direction:column;gap:2px;align-items:flex-start;overflow-wrap:anywhere}.ribbon-strip-name strong{font-size:15px;font-weight:500;max-width:100%}.ribbon-strip-name>span{font-size:10px;opacity:.8}.ribbon-readout{margin-top:13px}.ribbon-caption{font-size:11px;opacity:.9}.ribbon-readout>div{display:flex;align-items:baseline;gap:8px;justify-content:flex-start}.ribbon-readout strong{font-size:72px;line-height:1.18;font-weight:370;letter-spacing:-4px}.ribbon-readout>div>span{font-size:12px;max-width:70px}.ribbon-meter{height:16px;border-block:1px solid currentColor;margin:14px -19px 0;position:relative;direction:ltr;background:repeating-linear-gradient(90deg,transparent 0 19px,color-mix(in srgb,currentColor 35%,transparent) 19px 20px)}.ribbon-meter i{height:100%;background:currentColor;display:block;transform-origin:left}.ribbon-strip-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;min-height:48px}.ribbon-strip-footer>span{opacity:.8;max-width:60%;overflow-wrap:anywhere}.ribbon-detail{display:flex;gap:6px;align-items:center;justify-content:center;min-height:44px;border:0;background:transparent;color:inherit;padding:0}.ribbon-detail span{font-size:10px}.ribbon-selection{display:flex;align-items:center;justify-content:space-between;margin:14px 22px 0;gap:8px}.ribbon-pagination{display:flex;align-items:center;gap:8px}.ribbon-pagination>button{display:grid;place-items:center;min-width:40px;min-height:44px;border:1px solid var(--line);background:transparent;color:var(--text)}.ribbon-pagination>button:first-child svg{transform:rotate(180deg)}.ribbon-pagination>span{font-size:10px;min-width:45px;text-align:center}.ribbon-pagination i{font-style:normal;opacity:.45;margin:0 6px}.ribbon-pagination strong{font-size:12px}.ribbon-selection>p{font-size:10px;display:flex;gap:6px;color:var(--muted);align-items:center}.ribbon-selection>p svg{opacity:.5;transform:rotate(-25deg)}.ribbon-facts{margin:21px 22px 0;display:grid;grid-template-columns:1fr 1fr;border-block:1px solid var(--text);padding:15px 0}.ribbon-facts>div,.ribbon-facts>button{display:flex;align-items:flex-start;flex-direction:column;gap:5px;text-align:start}.ribbon-facts>button{border:0;border-inline-start:1px solid var(--line);padding:0;padding-inline-start:24px;background:transparent;color:var(--text);cursor:pointer}.ribbon-facts span{font-size:9px;letter-spacing:.7px;color:var(--muted)}.ribbon-facts strong{font-size:14px;font-weight:500;display:flex;align-items:center;gap:12px}.ribbon-toggle{width:27px;height:13px;border:1px solid var(--text);display:block;position:relative;border-radius:30px}.ribbon-toggle:after{content:"";position:absolute;inset-inline-start:3px;top:2px;width:7px;height:7px;border-radius:50%;background:var(--text)}.ribbon-toggle.on{background:var(--text)}.ribbon-toggle.on:after{inset-inline-start:15px;background:var(--bg)}.ribbon-actions{display:flex;margin:20px 22px 0;gap:8px}.ribbon-actions>button{min-height:53px;border:1px solid var(--text);background:transparent;color:var(--text);display:flex;align-items:center;justify-content:center;gap:9px;padding:0 12px}.ribbon-main-action{flex:1;background:var(--accent)!important;color:var(--accent-ink)!important;border-color:var(--accent)!important;font-weight:550;font-size:12px}.ribbon-qr{width:50px}.ribbon-qr span{display:none}.ribbon-bottomline{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 22px calc(18px + max(env(safe-area-inset-bottom),var(--host-safe-bottom,0px)));font-size:9px;color:var(--muted)}.ribbon-tools{padding:18px 22px;background:var(--surface);border-block:1px solid var(--line);margin-bottom:22px}.ribbon-tools>.row{font-size:12px;margin-bottom:10px}.ribbon-tools .list-controls{margin:0}.ribbon-empty{padding:40px 20px}.ribbon-secondary{padding:28px 22px 40px}.btn,.icon-btn,.field input,.field select,.field textarea,.search-box,.notice,.technical-value,.wallet-card,.panel,.category-card,.plan-card{border-radius:0}.icon-btn{min-width:44px;min-height:44px}.wallet-card{border-inline-start:12px solid var(--text);padding:22px}.wallet-card .balance{font-weight:400;font-size:42px}.wallet-tabs{gap:0}.wallet-tabs .btn{border-block:1px solid var(--line)}.wallet-tabs .btn.selected{background:var(--text);color:var(--bg)}.category-list{gap:0;border-top:1px solid var(--text)}.category-card{border:0;border-bottom:1px solid var(--line);background:transparent;padding:24px 0;grid-template-columns:38px minmax(0,1fr) 24px;gap:12px}.category-symbol{background:transparent;border-radius:0;width:38px}.category-card:nth-child(2n){background:var(--surface)}.transaction{border-bottom:1px solid var(--line)}.tx-icon{background:transparent;border-radius:0;border:1px solid var(--line)}.page-title h1{font-weight:500}.segmented{gap:0}.segmented button{border-radius:0}.segmented button[aria-pressed=true]{background:var(--text);color:var(--bg)}.toast{border-radius:0;bottom:28px;border-inline-start:6px solid var(--accent);box-shadow:5px 5px 0 #0002}
/* Ribbon's native edge drawer: a full-height spine and a scrollable sequence of bands. */
dialog.sheet{inset:0 0 0 auto;width:min(calc(100% - 26px),560px);max-width:none;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0;background:var(--bg);color:var(--text);box-shadow:-16px 0 80px #10193b44;overflow:hidden;padding:0}html[dir=rtl] dialog.sheet{inset:0 auto 0 0}.sheet[open]{display:block;animation:none}.sheet::backdrop{background:#17287857;backdrop-filter:blur(2px)}.ribbon-drawer{height:100%;display:grid;grid-template-columns:27px minmax(0,1fr);direction:ltr}.ribbon-spine{background:var(--text);color:var(--bg);display:flex;align-items:center;justify-content:space-between;flex-direction:column;padding:20px 0 18px;gap:20px;font-size:8px;overflow:hidden}.ribbon-spine>b{writing-mode:vertical-rl;font-size:9px;letter-spacing:2px;font-weight:450}.ribbon-spine>i{width:1px;background:currentColor;flex:1;opacity:.4}.ribbon-drawer-page{display:flex;flex-direction:column;min-width:0;min-height:0;direction:ltr}html[dir=rtl] .ribbon-drawer-page{direction:rtl}.sheet-header{display:block;background:var(--ribbon-ink);color:var(--ribbon-paper);padding:calc(10px + env(safe-area-inset-top)) 18px 22px;border:0;min-height:130px}.ribbon-dialog-utilities{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px;min-height:44px}.ribbon-dialog-utilities .icon-btn{color:inherit;background:transparent;border:1px solid color-mix(in srgb,currentColor 35%,transparent)}.ribbon-dialog-utilities .ribbon-dialog-mark{opacity:.8}.sheet-header h2{font-weight:450;font-size:23px;line-height:1.6;overflow-wrap:anywhere}.sheet-body{padding:0;flex:1;overflow:auto;overscroll-behavior:contain;min-height:0;scroll-padding:18px}.sheet-error{margin:0;border-radius:0;padding:18px}.ribbon-band{padding:19px 18px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.ribbon-band:nth-child(2n){background:var(--surface)}.ribbon-band>*{margin-block:0!important}.ribbon-band .stack{gap:15px}.ribbon-dialog-cover{padding:24px 18px 0;background:var(--surface-2);border-bottom:1px solid var(--line)}.ribbon-dialog-cover .detail-title{font-size:17px;font-weight:500;overflow-wrap:anywhere;text-align:start;direction:ltr;margin-bottom:9px}.detail-identity{font-size:10px;margin-bottom:0}.ribbon-dialog-cover .row{gap:7px;flex-wrap:wrap}.ribbon-dialog-cover .detail-usage{background:transparent;border-radius:0;padding:20px 0;margin:10px 0 0}.detail-usage .big{font-weight:350;font-size:36px;margin:7px 0}.detail-usage .progress{height:13px;border:1px solid var(--text);border-radius:0;background:transparent}.detail-usage .progress>span{border-radius:0;background:var(--text)}.detail-usage .small{font-size:10px}.ribbon-fact-fold>summary{display:flex;align-items:center;justify-content:space-between;font-size:12px;cursor:pointer;min-height:44px;list-style:none}.ribbon-fact-fold>summary::-webkit-details-marker{display:none}.ribbon-fact-fold[open]>summary{margin-bottom:14px}.ribbon-fact-fold[open]>summary svg{transform:rotate(45deg)}.ribbon-fact-fold .fact-list{margin-top:0!important}.ribbon-band .action-grid{gap:0;border-top:1px solid var(--line);border-inline-start:1px solid var(--line)}.ribbon-band .action-grid .btn{border:0;border-bottom:1px solid var(--line);border-inline-end:1px solid var(--line);padding:14px 7px;flex-direction:column;gap:7px;min-height:71px;background:transparent;font-size:10px}.ribbon-band .action-grid .btn.primary{background:var(--text);color:var(--bg)}.ribbon-band .action-row{border:0;padding:0;min-height:52px}.ribbon-band .action-row strong{font-size:12px}.ribbon-band .action-row p{font-size:10px}.ribbon-band .notice{padding:13px;font-size:12px;border-inline-start:3px solid currentColor}.sheet-actions{padding:16px 18px calc(18px + env(safe-area-inset-bottom));background:var(--text);border:0;gap:8px}.sheet-actions .btn{border-color:color-mix(in srgb,var(--bg) 40%,transparent);color:var(--bg);background:transparent;min-height:50px;font-size:12px}.sheet-actions .btn.primary{background:var(--bg);color:var(--text)}.sheet-actions .btn.danger{background:var(--danger);color:#fff}.sheet-actions:empty{display:none}.ribbon-qr-band{padding:28px 25px;background:var(--ribbon-ink)!important}.qr-frame{width:100%;max-width:260px;margin:0 auto!important;padding:12px;border:0;border-radius:0;box-shadow:7px 7px 0 #0002}.ribbon-band .plan-list{gap:0;margin-inline:-18px!important}.ribbon-band .plan-card{display:grid;grid-template-columns:minmax(0,1fr) 74px;gap:10px;padding:21px 18px;border:0;border-bottom:1px solid var(--line);background:transparent}.ribbon-band .plan-card:nth-child(2n){background:var(--surface-2)}.ribbon-band .plan-card>.row{grid-column:1/-1;align-items:flex-start;flex-wrap:wrap}.ribbon-band .plan-card h3{font-size:14px}.ribbon-band .plan-card>.price{grid-row:2;grid-column:1;font-size:22px;font-weight:450}.ribbon-band .plan-card .plan-meta{grid-row:3;grid-column:1;gap:8px;flex-wrap:wrap;font-size:10px}.ribbon-band .plan-card>.btn{grid-row:2/4;grid-column:2;padding:9px 6px;font-size:10px;font-weight:500;align-self:stretch}.ribbon-band .plan-card .plan-trial{grid-column:1/-1}.ribbon-band .settings-section{padding:0;border:0;margin:0}.ribbon-band .settings-section h3{font-size:14px;font-weight:500;margin-bottom:15px}.ribbon-band .account-options,.ribbon-band .concept-options{grid-template-columns:1fr;gap:0}.ribbon-band .account-options .btn,.ribbon-band .concept-options .btn{border:0;border-bottom:1px solid var(--line);text-align:start;justify-content:flex-start;min-height:49px;padding:10px 0}.ribbon-band .account-options .btn.primary{background:transparent;color:var(--text);font-weight:800;border-inline-start:3px solid var(--text);padding-inline-start:10px}.ribbon-band .settings-section>.row{flex-wrap:wrap}.ribbon-band .settings-section>.row>.btn{flex:1;min-width:76px}.summary-amount{font-size:35px;font-weight:400;padding:15px 0;margin:0;border-block:1px solid var(--text)}.renew-summary{border-radius:0;background:transparent;padding:0}.sheet .fact-list>div{display:grid;grid-template-columns:1fr 1.4fr;gap:12px;font-size:11px}.sheet .fact-list dt{white-space:normal}.sheet .technical-value{background:var(--surface-2);font-size:10px;padding:12px}.sheet .field>span,.sheet .field>label{font-size:12px}.sheet .btn.full{width:100%}.sheet .quantity-control{grid-template-columns:40px minmax(0,1fr) 40px;gap:6px}.sheet .qty-btn{border-radius:0}.sheet .app-targets .btn{font-size:12px;padding:13px}.sheet .badge{border-radius:0;font-size:10px}.sheet .settings-section .action-row{border-top:1px solid var(--line);padding-block:12px;gap:8px}.sheet .settings-section .action-row strong{font-size:11px}.sheet .settings-section .action-row>span{min-width:0}.sheet .sheet-body>p,.sheet .sheet-body>code{margin:18px}
@media(min-width:700px){.app-shell{border-inline:1px solid var(--line)}dialog.sheet{width:560px}.ribbon-drawer{grid-template-columns:38px minmax(0,1fr)}.ribbon-drawer-page:has(.sheet-actions:not(:empty)){display:grid;grid-template-columns:minmax(0,1fr) 122px;grid-template-rows:auto minmax(0,1fr)}.ribbon-drawer-page:has(.sheet-actions:not(:empty)) .sheet-header{grid-column:1/-1}.ribbon-drawer-page:has(.sheet-actions:not(:empty)) .sheet-body{grid-column:1;grid-row:2}.ribbon-drawer-page:has(.sheet-actions:not(:empty)) .sheet-actions{grid-column:2;grid-row:2;justify-content:flex-end;padding:16px 10px}.ribbon-readout strong{font-size:90px}.ribbon-strip{min-height:350px}}
@media(max-width:380px){.app-header{padding-inline:18px}.app-nav{margin-inline:18px}.ribbon-page-heading{padding-inline:18px}.ribbon-page-heading h1{font-size:25px}.ribbon-readout strong{font-size:64px}.ribbon-strip{padding-inline:16px;min-height:318px}.ribbon-meter{margin-inline:-16px}.ribbon-strip-name strong{font-size:13px}.ribbon-selection{margin-inline:18px}.ribbon-selection>p{font-size:9px;max-width:105px}.ribbon-facts,.ribbon-actions{margin-inline:18px}.ribbon-actions{gap:6px}.ribbon-main-action{font-size:11px}.ribbon-qr{width:45px}.ribbon-bottomline{padding-inline:18px;font-size:8px}.ribbon-band,.sheet-header{padding-inline:15px}.ribbon-dialog-cover{padding-inline:15px}.ribbon-band .plan-list{margin-inline:-15px!important}.ribbon-band .plan-card{padding-inline:15px}.sheet-header h2{font-size:21px}.ribbon-spine{font-size:7px}.sheet-actions{padding-inline:15px}.ribbon-drawer{grid-template-columns:24px minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.ribbon-track{scroll-behavior:auto}dialog.sheet,.ribbon-band{animation:none!important}}
