:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial,sans-serif;color:#1c2c45;background:#f6f8fb;font-size:15px}*{box-sizing:border-box}body{margin:0;min-width:300px;line-height:1.6}button,input,textarea,select{font:inherit}button{cursor:pointer;min-height:42px}input,select,textarea{width:100%;min-height:43px;padding:10px 13px;border:1px solid #dbe3ee;background:#fff;border-radius:12px;color:#1c2c45;outline-offset:2px}textarea{resize:vertical;line-height:1.9}label{display:block;margin:11px 0 6px;font-size:.87rem;font-weight:700}input:focus,select:focus,textarea:focus{border-color:#2d6bcb;outline:2px solid #d9e9ff}h1,h2,h3,p{margin-top:0}h1{font-size:1.85rem;line-height:1.2;margin-bottom:7px}h2{font-size:1.23rem;margin-bottom:10px}h3{font-size:1rem;margin-bottom:8px}.muted{color:#738197}.small{font-size:.8rem}.compact{margin-bottom:0}.eyebrow{letter-spacing:.4px;font-size:.75rem;color:#8290a4;font-weight:800;margin-bottom:8px}.container{width:min(1130px,calc(100% - 36px));margin:auto}.primary,.secondary,.danger-btn{border-radius:12px;border:1px solid transparent;padding:10px 17px;font-weight:750;transition:background .15s}.primary{background:#245ac6;color:white}.primary:hover{background:#194aa9}.secondary{background:white;color:#254e83;border-color:#d6e2f1}.secondary:hover{background:#f1f6ff}.danger-btn{background:#fff1f0;color:#bc302e}.full{width:100%;margin-top:16px}.inline-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}.between{display:flex;align-items:center;justify-content:space-between;gap:10px}.auth-wrap{min-height:100dvh;background:radial-gradient(circle at 25% 15%,#263f67,transparent 45%),linear-gradient(140deg,#0c1a30,#0e294e);display:flex;align-items:center;justify-content:center;padding:30px 15px}.auth-card{width:min(470px,100%);padding:35px;background:#fff;border-radius:22px;box-shadow:0 18px 55px #05102545}.brand-mark{display:flex;align-items:center;justify-content:center;background:#153a75;color:#fff;border-radius:15px;font-size:33px;width:58px;height:58px;margin-bottom:20px}.brand-dot{color:#2b70db}.auth-card h1{font-size:2.2rem}.auth-card h2{margin-top:24px}.fineprint{font-size:.75rem;color:#8794a8;margin:22px 0 0}.status{color:#a43431;min-height:18px;margin-top:14px;font-size:.87rem}.topbar{background:#101e35;color:#fff;padding:14px 0}.topbar-content{display:flex;align-items:center;justify-content:space-between}.brand-small{display:flex;gap:11px;align-items:center;font-size:1.14rem}.brand-small small{display:block;color:#9baac0;font-size:.68rem;font-weight:400;line-height:1}.small-logo{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#274c86;color:#fff;font-size:24px}.top-actions{display:flex;gap:11px;align-items:center}.local-pill{font-size:.79rem;border:1px solid #43536c;background:#172c4a;border-radius:40px;padding:7px 12px;color:#c4d3e6}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#5bddaa;margin-left:4px}.icon-btn{border:0;background:#20324f;color:#fff;border-radius:10px;font-size:1.05rem;width:40px}.hello-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:26px 0 20px}.period-switch{display:flex;gap:5px;align-items:center;justify-content:center;border:1px solid #e0e5ef;background:white;border-radius:12px;white-space:nowrap;min-width:166px}.period-switch button{background:transparent;border:0;font-size:26px;color:#586a84;padding:0 12px}.period-switch span{font-weight:750;font-size:.89rem}.tabs{display:flex;gap:7px;overflow-x:auto;white-space:nowrap;padding-bottom:11px;margin-bottom:14px;scrollbar-width:thin}.tab{background:transparent;border:0;border-radius:12px;padding:10px 15px;color:#677891;font-weight:700}.tab.active{color:#19488f;background:#e3ecfa}.page{padding-bottom:20px}.hero-balance{position:relative;overflow:hidden;background:linear-gradient(115deg,#11294c,#18457b);border-radius:20px;color:#fff;padding:24px 30px 0;min-height:211px}.hero-label{color:#b7d2f8;font-size:.86rem}.hero-amount{display:block;font-size:clamp(2.15rem,6.8vw,3.55rem);letter-spacing:-1px;line-height:1.45}.hero-text p{color:#b4c8e3;font-size:.78rem;margin:3px 0 22px}.hero-icon{position:absolute;font-size:11rem;line-height:1;opacity:.08;left:40px;top:0}.hero-footer{border-top:1px solid #ffffff25;display:flex;gap:20px;justify-content:space-between;padding:13px 0;flex-wrap:wrap;font-size:.82rem;color:#cbd9eb}.hero-footer strong{color:#fff;margin-right:5px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:16px 0}.metric{background:#fff;border:1px solid #e9edf3;border-radius:17px;padding:18px;min-width:0}.metric-label{display:flex;gap:8px;align-items:center;color:#6b7b92;font-weight:700;font-size:.82rem}.metric-symbol{display:inline-grid;place-items:center;border-radius:8px;width:30px;height:30px;font-size:1.25rem}.incoming{color:#078b62;background:#e7f9f2}.outgoing{color:#cc5a54;background:#ffedeb}.saved{color:#8263ca;background:#f0ecff}.budget{color:#bd8b26;background:#fff4d9}.metric strong{display:block;margin:10px 0 1px;font-size:1.36rem;white-space:normal;overflow-wrap:anywhere}.metric small{color:#91a0af;font-size:.72rem}.quick-actions{display:flex;gap:10px;margin:5px 0 18px;flex-wrap:wrap}.split-panels{display:grid;grid-template-columns:1fr 1fr;gap:17px}.panel{background:white;border:1px solid #e9edf3;border-radius:18px;padding:23px;margin-bottom:17px;min-width:0}.wide-panel{max-width:940px;margin:0 auto 17px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.section-head h2{margin:0 0 14px}.badge{display:inline-block;border:1px solid #dbe9f5;border-radius:100px;padding:5px 10px;background:#f1f7fd;color:#3774ae;font-size:.79rem}.text-btn{border:0;background:transparent;color:#245ac6;font-weight:800}.bar-row{display:grid;grid-template-columns:100px 1fr 94px;align-items:center;gap:10px;font-size:.82rem;margin:15px 0}.bar-track,.progress{height:9px;border-radius:8px;background:#ebeff5;overflow:hidden}.bar-track>span,.progress>span{display:block;height:100%;width:0;background:#7097d4;border-radius:8px}.bar-row strong{font-size:.83rem;text-align:left}.tx-item{display:flex;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid #edf0f5}.tx-item:last-child{border-bottom:0}.tx-symbol{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#eaf0f9;color:#4f73aa;flex-shrink:0;font-size:19px}.tx-item[data-type="income"] .tx-symbol{background:#e5f7ef;color:#159069}.tx-item[data-type="expense"] .tx-symbol{background:#fcecea;color:#c25243}.tx-item[data-type="save"] .tx-symbol{background:#eee9fa;color:#7856bb}.tx-copy{min-width:0;flex:1}.tx-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.89rem}.tx-copy small{color:#8a98a9;font-size:.77rem}.tx-money{font-size:.86rem;font-weight:800;white-space:nowrap}.tx-money.plus{color:#12855c}.tx-money.minus{color:#b74d45}.tx-acts{display:flex;gap:2px}.tx-acts button{min-height:34px;width:34px;border:0;background:transparent;color:#68778b;font-size:1rem}.empty{border:1px dashed #d9e2f0;background:#f9fbfe;border-radius:13px;text-align:center;padding:28px 12px;color:#8492a7}.tip{background:#fff8e9;border:1px solid #f6e7bc;color:#85672d;border-radius:12px;padding:12px;font-size:.82rem;margin:14px 0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 15px}.tx-form{background:#f7faff;border:1px solid #dfebff;border-radius:15px;padding:15px;margin-bottom:20px}.filter-bar{display:flex;gap:10px;margin:12px 0 5px}.filter-bar input{flex:1}.filter-bar select{width:180px}.preview-item{border:1px solid #e0e8f3;border-radius:13px;padding:13px;margin-bottom:11px}.preview-item.duplicate{border-color:#f1d8a6;background:#fffcf5}.preview-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.preview-top label{margin:0;display:flex;align-items:center;gap:7px;cursor:pointer}.preview-top input[type=checkbox]{width:19px;min-height:auto;height:19px}.preview-item .form-grid{grid-template-columns:1fr 1fr 1fr}.preview-raw{color:#8090a1;font-size:.78rem;word-break:break-word;border-top:1px dashed #e1e9f1;margin-top:10px;padding-top:8px}.warning{color:#ad7524;font-weight:700;font-size:.79rem}.budget-visual{margin-top:20px}.budget-visual .progress{margin:9px 0}.hint-line{margin-top:28px;font-size:.85rem}.goal-item{padding:13px 0;border-bottom:1px solid #eceff4}.goal-item strong{display:block}.goal-item small{color:#7e8da3}.goal-item .progress{margin:10px 0}.goal-head{display:flex;justify-content:space-between;gap:9px;align-items:center}.goal-head button{border:0;background:transparent;color:#b84b4b;font-size:.81rem}.assistant-panel{max-width:780px;margin-inline:auto}.chat-history{display:flex;flex-direction:column;gap:12px;min-height:175px;max-height:430px;overflow:auto;background:#f8fafd;border:1px solid #edf0f5;border-radius:14px;padding:20px;margin:15px 0}.bubble{max-width:88%;padding:11px 14px;border-radius:16px;white-space:pre-wrap;font-size:.91rem;line-height:1.8}.bubble.bot{background:white;align-self:flex-start;border:1px solid #e4eaf3}.bubble.user{background:#245ac6;color:white;align-self:flex-end}.suggestions{display:flex;gap:6px;flex-wrap:wrap}.chip{background:#ebf2ff;color:#2d5d9e;border:0;border-radius:100px;padding:7px 12px;font-size:.82rem}.chat-compose{display:flex;gap:7px;margin-top:14px}.chat-compose input{flex:1}.settings-panel{max-width:770px;margin-inline:auto}.settings-panel form .primary{margin-top:10px}.setting-divider{border-top:1px solid #edf0f4;margin:25px 0}.footer{font-size:.76rem;text-align:center;color:#92a0ae;padding:5px 0 30px}.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:#19375c;color:#fff;padding:12px 20px;border-radius:12px;box-shadow:0 5px 20px #172a4360;z-index:9;max-width:92%;text-align:center}.sr-only{position:absolute;overflow:hidden;width:1px;height:1px;clip:rect(0,0,0,0);white-space:nowrap}@media(max-width:850px){.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.split-panels{grid-template-columns:1fr}}@media(max-width:540px){.container{width:calc(100% - 24px)}.topbar{padding:10px 0}.local-pill{font-size:.71rem;padding:6px 9px}.hello-row{padding:21px 0 14px;align-items:flex-start;flex-wrap:wrap}.hello-row h1{font-size:1.52rem}.period-switch{min-width:auto}.hero-balance{padding:20px 19px 0}.hero-footer{font-size:.77rem;gap:6px}.metric-grid{gap:9px}.metric{padding:12px}.metric strong{font-size:1.1rem}.metric small{font-size:.67rem}.panel{padding:16px}.bar-row{grid-template-columns:78px 1fr 76px;gap:7px}.preview-item .form-grid{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}.filter-bar{flex-wrap:wrap}.filter-bar input{min-width:100%}.filter-bar select{width:100%}.chat-compose{flex-wrap:wrap}.chat-compose input{min-width:100%}.auth-card{padding:24px}.tx-item{gap:7px}.tx-symbol{width:35px;height:35px}.tx-money{font-size:.78rem}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

[hidden]{display:none!important}

/* الهوية الرسمية لمصروفي — الشعار الأصلي والأخضر */
:root{background:#f5faf7;color:#19362a}
input:focus,select:focus,textarea:focus{border-color:#04823b;outline:2px solid #d1ecdb}
.primary{background:#04823b}
.primary:hover{background:#066b34}
.secondary{color:#066b34;border-color:#d5e9dc}
.secondary:hover{background:#eff8f2}
.auth-wrap{background:radial-gradient(circle at 23% 13%,#0c9c4a,transparent 45%),linear-gradient(145deg,#024a28,#037b3a)}
.brand-mark{background:transparent;width:82px;height:82px;border-radius:18px;overflow:hidden;margin-bottom:17px}
.brand-mark img{display:block;width:100%;height:100%;object-fit:cover}
.brand-dot{color:#04823b}
.topbar{background:#054c2c}
.small-logo{background:transparent;border-radius:10px;overflow:hidden}
.small-logo img{display:block;width:100%;height:100%;object-fit:cover}
.tab.active{color:#076b37;background:#e0f1e6}
.hero-balance{background:linear-gradient(115deg,#054c2c,#078444)}
.badge{border-color:#d3e9da;background:#edf9f0;color:#086a36}
.text-btn{color:#078444}
.bar-track>span,.progress>span{background:#0a9960}
.chip{background:#e1f3e8;color:#086b3a}
.bubble.user{background:#087d41}
.toast{background:#074b2b}

/* ===== مصروفي 1.2 — هوية مصرفية هادئة بمظهرين ===== */
:root {
  font-family: -apple-system, BlinkMacSystemFont, "SF Arabic", "Geeza Pro", "Segoe UI", Tahoma, sans-serif;
  --ui-bg: #f5f8f5;
  --ui-card: #ffffff;
  --ui-elevated: #f8fbf8;
  --ui-text: #173327;
  --ui-muted: #61786c;
  --ui-soft: #83948b;
  --ui-border: #dfeae1;
  --ui-line: #e8efe9;
  --ui-brand: #08783b;
  --ui-brand-hover: #075f31;
  --ui-active: #e5f3e9;
  --ui-green-text: #056a35;
  --ui-field: #ffffff;
  --ui-field-border: #d8e5da;
  --ui-focus: #a9dbbc;
  --ui-tip-bg: #fff9e9;
  --ui-tip-border: #efdfb2;
  --ui-tip-color: #785c21;
  --ui-hero: linear-gradient(118deg, #064a29 0%, #087c40 100%);
  color: var(--ui-text);
  background: var(--ui-bg);
  font-size: 15px;
  -webkit-text-size-adjust: 100%;
}
:root[data-theme="dark"] {
  --ui-bg: #0c1611;
  --ui-card: #17251d;
  --ui-elevated: #1b2c22;
  --ui-text: #eaf5ed;
  --ui-muted: #b0c2b6;
  --ui-soft: #9fb4a6;
  --ui-border: #314638;
  --ui-line: #2b3d32;
  --ui-brand: #087b43;
  --ui-brand-hover: #0b6b3d;
  --ui-active: #1f4932;
  --ui-green-text: #8ddbad;
  --ui-field: #102018;
  --ui-field-border: #385342;
  --ui-focus: #55bc86;
  --ui-tip-bg: #342c1c;
  --ui-tip-border: #65522e;
  --ui-tip-color: #f2d38e;
  --ui-hero: linear-gradient(118deg, #07311e 0%, #075331 100%);
}
body { background: var(--ui-bg); color: var(--ui-text); }
button, input, textarea, select { -webkit-tap-highlight-color: transparent; }
button, select { touch-action: manipulation; }
input, select, textarea {
  background: var(--ui-field);
  border-color: var(--ui-field-border);
  color: var(--ui-text);
  border-radius: 12px;
  font-size: 16px;
}
input::placeholder, textarea::placeholder { color: var(--ui-soft); opacity: 1; }
input:focus, select:focus, textarea:focus { border-color: var(--ui-brand); outline: 2px solid var(--ui-focus); outline-offset: 1px; }
:focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 3px; }
.muted, .eyebrow, .metric-label, .tx-copy small, .goal-item small, .hero-balance ~ .muted { color: var(--ui-muted); }
.metric small, .fineprint, .footer { color: var(--ui-soft); }
.primary, .secondary, .danger-btn { border-radius: 13px; font-weight: 700; }
.primary { background: var(--ui-brand); color: #fff; }
.primary:hover { background: var(--ui-brand-hover); }
.secondary { background: var(--ui-card); color: var(--ui-green-text); border-color: var(--ui-border); }
.secondary:hover { background: var(--ui-elevated); }
.tab { color: var(--ui-muted); border-radius: 11px; }
.tab.active { background: var(--ui-active); color: var(--ui-green-text); }
.hero-balance { background: var(--ui-hero); border: 1px solid #ffffff1c; border-radius: 21px; }
.hero-label, .hero-text p, .hero-footer { color: #cce8d7; }
.hero-footer strong { color: #fff; }
.hero-icon { opacity: .08; }
.metric, .panel, .auth-card { background: var(--ui-card); color: var(--ui-text); border-color: var(--ui-border); }
.metric, .panel { box-shadow: 0 2px 12px #082a1110; }
.panel { border-radius: 20px; }
.metric { border-radius: 17px; }
.period-switch { background: var(--ui-card); border-color: var(--ui-border); }
.period-switch button { color: var(--ui-text); }
.badge, .chip { background: var(--ui-active); border-color: var(--ui-border); color: var(--ui-green-text); }
.text-btn { color: var(--ui-green-text); }
.bar-track, .progress { background: var(--ui-line); }
.bar-track>span, .progress>span { background: #299b60; }
.tx-item, .goal-item, .setting-divider { border-color: var(--ui-line); }
.tx-symbol { background: var(--ui-active); color: var(--ui-green-text); }
.tx-acts button { color: var(--ui-muted); }
.empty, .tx-form, .chat-history { background: var(--ui-elevated); border-color: var(--ui-border); color: var(--ui-muted); }
.preview-item { background: var(--ui-card); border-color: var(--ui-border); }
.preview-raw { color: var(--ui-muted); border-color: var(--ui-border); }
.bubble.bot { background: var(--ui-card); border-color: var(--ui-border); color: var(--ui-text); }
.bubble.user { background: var(--ui-brand); color: #fff; }
.tip { background: var(--ui-tip-bg); border-color: var(--ui-tip-border); color: var(--ui-tip-color); }
.topbar { background: #064e2c; }
.topbar-content { gap: 12px; }
.brand-small { min-width: 0; }
.top-actions { gap: 7px; }
.icon-btn { background: #ffffff16; color: #fff; border: 1px solid #ffffff27; border-radius: 12px; min-width: 43px; min-height: 43px; }
.icon-btn:hover { background: #ffffff25; }
.theme-btn { font-size: 1.35rem; font-family: -apple-system, BlinkMacSystemFont, sans-serif; }
.local-pill { background: #ffffff10; border-color: #ffffff2a; color: #e0f5e8; }
.auth-wrap { background: radial-gradient(circle at 25% 15%, #16965349, transparent 44%),linear-gradient(145deg, #06371f, #07502c); }
.auth-card { position: relative; border: 1px solid var(--ui-border); box-shadow: 0 18px 60px #001b0e30; }
.appearance-login-btn {
  position: absolute; top: 21px; left: 21px;
  min-width: 43px; min-height: 43px;
  border: 1px solid var(--ui-border); border-radius: 12px;
  background: var(--ui-elevated); color: var(--ui-text);
  font-size: 1.35rem;
}
.appearance-setting { margin: 13px 0 22px; }
.appearance-setting label { font-size: 1rem; }
.appearance-setting p { margin-bottom: 10px; }
.appearance-setting select { max-width: 360px; }
:root[data-theme="dark"] .auth-wrap { background: radial-gradient(circle at 24% 16%, #0b613b65, transparent 48%), linear-gradient(145deg, #081b11, #0c3522); }
:root[data-theme="dark"] .topbar { background: #0b2518; border-bottom: 1px solid #ffffff1a; }
:root[data-theme="dark"] .metric, :root[data-theme="dark"] .panel { box-shadow: 0 2px 12px #00000018; }
:root[data-theme="dark"] .tab.active { color: #b0ebc6; }
:root[data-theme="dark"] .tx-item[data-type="expense"] .tx-symbol { background: #442824; color: #ffb0a4; }
:root[data-theme="dark"] .tx-item[data-type="income"] .tx-symbol { background: #194835; color: #9ce2b7; }
:root[data-theme="dark"] .tx-item[data-type="save"] .tx-symbol { background: #352c4b; color: #d6bafd; }
:root[data-theme="dark"] .incoming { background: #1b4432; color: #a1e8bd; }
:root[data-theme="dark"] .outgoing { background: #462923; color: #f5afa1; }
:root[data-theme="dark"] .saved { background: #372c51; color: #d5b6ff; }
:root[data-theme="dark"] .budget { background: #463a20; color: #f1d491; }
:root[data-theme="dark"] .tx-money.plus { color: #90e3ae; }
:root[data-theme="dark"] .tx-money.minus { color: #ffada5; }
:root[data-theme="dark"] .preview-item.duplicate { background: #352c1c; border-color: #6a5937; }
:root[data-theme="dark"] .warning { color: #eaca86; }
:root[data-theme="dark"] .status { color: #f1a5a0; }
:root[data-theme="dark"] .danger-btn { background: #422522; color: #ffc5bf; }
:root[data-theme="dark"] .toast { background: #235639; }
:root[data-theme="dark"] .bubble.user { background: #086b3b; }
@media (hover:hover) and (pointer:fine) {
  .primary:hover, .secondary:hover, .icon-btn:hover, .appearance-login-btn:hover { transform: translateY(-1px); }
}
@media (prefers-reduced-motion:no-preference) {
  .metric, .panel, .tab, .primary, .secondary, .icon-btn, .appearance-login-btn, .auth-card, .hero-balance, input, textarea, select { transition: background-color .20s ease, border-color .20s ease, color .20s ease, transform .18s ease; }
  .page:not([hidden]) { animation: page-in .22s ease both; }
  @keyframes page-in { from { opacity: .6; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
}
@media (max-width:390px) {
  .local-pill { display: none; }
  .brand-small { gap: 7px; }
  .small-logo { width: 34px; height: 34px; }
  .top-actions { gap: 5px; }
}
