:root {
  --bg: #f6f6f8;
  --surface: rgba(255,255,255,.92);
  --surface-solid: #fff;
  --ink: #111114;
  --muted: #7d7d86;
  --hairline: rgba(17,17,20,.07);
  --line: rgba(17,17,20,.09);
  --accent: #e21d2c;
  --accent-dark: #b80f1c;
  --accent-soft: rgba(226,29,44,.09);
  --accent-rgb: 226,29,44;
  --blue: #e21d2c;
  --blue-deep: #b80f1c;
  --blue-soft: #fff0f2;
  --green: #21b26f;
  --orange: #ff5665;
  --red: #e21d2c;
  --purple: #7457f5;
  --shadow: 0 18px 45px rgba(31,35,48,.08), 0 2px 8px rgba(31,35,48,.04);
  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 17px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", Inter, Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; min-height: 100%; background: var(--bg); overscroll-behavior-y: none; }
body { min-width: 320px; overflow-x: hidden; }
button, input, textarea, select { font: inherit; }
button { color: inherit; outline: 0; }
button:focus-visible { outline: 2px solid rgba(var(--accent-rgb),.42); outline-offset: 2px; }
a { color: inherit; }

.ambient { position: fixed; z-index: 0; border-radius: 50%; filter: blur(10px); pointer-events: none; opacity: .65; }
.ambient-a { width: 280px; height: 280px; top: -155px; right: -100px; background: radial-gradient(circle, rgba(var(--accent-rgb),.2), transparent 68%); }
.ambient-b { width: 240px; height: 240px; bottom: 8%; left: -170px; background: radial-gradient(circle, rgba(116,87,245,.12), transparent 70%); }

.is-hidden { display: none !important; }
.app { position: relative; z-index: 1; min-height: 100dvh; max-width: 760px; margin: 0 auto; padding-bottom: calc(104px + var(--safe-bottom)); }

.splash { position: fixed; inset: 0; z-index: 50; display: grid; place-content: center; justify-items: center; background: #fff; transition: opacity .55s ease, transform .55s cubic-bezier(.2,.8,.2,1); }
.splash.is-leaving { opacity: 0; transform: scale(1.025); pointer-events: none; }
.brand-mark { width: 76px; height: 76px; display: grid; place-items: center; border-radius: 24px; color: white; font-size: 38px; font-weight: 760; letter-spacing: -.06em; background: linear-gradient(145deg, var(--accent), var(--accent-dark)); box-shadow: 0 24px 44px rgba(var(--accent-rgb),.25), inset 0 1px 1px rgba(255,255,255,.32); animation: brandIn .8s cubic-bezier(.16,1,.3,1) both; }
.splash-copy { margin-top: 18px; display: grid; justify-items: center; animation: fadeUp .8s .1s both; }
.splash-copy strong { font-size: 19px; letter-spacing: .24em; margin-left: .24em; }
.splash-copy span { margin-top: 5px; color: #9a9aa2; font-size: 12px; letter-spacing: .08em; }
.splash-loader { width: 44px; height: 3px; margin-top: 32px; border-radius: 4px; overflow: hidden; background: #eeeef1; }
.splash-loader i { display: block; height: 100%; width: 45%; border-radius: inherit; background: var(--blue); animation: load 1.2s ease-in-out infinite; }

.topbar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: calc(14px + var(--safe-top)) 18px 12px; background: linear-gradient(to bottom, rgba(246,246,248,.96) 68%, rgba(246,246,248,0)); backdrop-filter: blur(18px); }
.top-left { min-width: 0; display: flex; align-items: center; gap: 7px; }
.profile-button { display: flex; align-items: center; gap: 11px; border: 0; padding: 0; background: transparent; text-align: left; }
.avatar { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; color: #fff; background: linear-gradient(145deg, var(--accent), var(--accent-dark)); box-shadow: 0 7px 16px rgba(var(--accent-rgb),.2); font-size: 16px; font-weight: 760; }
.profile-copy { display: grid; gap: 1px; }
.profile-copy small { color: var(--muted); font-size: 11px; font-weight: 540; }
.profile-copy strong { max-width: 185px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; letter-spacing: -.015em; }
.top-actions { display: flex; align-items: center; gap: 7px; }
.balance-button { min-width: 168px; height: 62px; display: grid; align-content: center; justify-items: start; border: 0; border-radius: 20px; padding: 8px 15px; color: #fff; background: linear-gradient(145deg,var(--accent),var(--accent-dark)); box-shadow: 0 12px 28px rgba(var(--accent-rgb),.24); text-align: left; }
.balance-button small { opacity: .72; font-size: 8px; font-weight: 720; letter-spacing: .08em; text-transform: uppercase; }
.balance-button strong { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; line-height: 1.05; letter-spacing: -.03em; }
.balance-button span { margin-top: 2px; opacity: .68; font-size: 8px; font-weight: 650; }
.icon-button { position: relative; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.8); border-radius: 14px; background: rgba(255,255,255,.72); box-shadow: 0 6px 18px rgba(30,34,45,.05); font-size: 24px; line-height: 1; }
.icon-button:active { transform: scale(.92); }
.icon-button.has-dot i { position: absolute; top: 8px; right: 8px; width: 7px; height: 7px; border-radius: 50%; background: var(--red); border: 2px solid white; }
.notification-button { position: relative; width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgba(17,17,20,.06); border-radius: 13px; background: rgba(255,255,255,.88); box-shadow: 0 7px 20px rgba(31,35,48,.06); }
.notification-symbol { width: 20px; height: 20px; display: grid; place-items: center; border: 1.7px solid currentColor; border-radius: 50%; color: var(--accent); font-size: 12px; line-height: 1; font-weight: 760; }
.notification-button i { position: absolute; top: -5px; right: -5px; min-width: 17px; height: 17px; display: grid; place-items: center; border: 2px solid var(--bg); border-radius: 9px; padding: 0 3px; color: white; background: var(--accent); font-size: 8px; font-style: normal; font-weight: 800; }

.content { padding: 2px 18px 10px; }
.voice-limited .topbar,
.voice-limited .preview-banner { display: none !important; }
.voice-limited .content { padding-top: calc(22px + var(--safe-top)); }
.voice-limited .bottom-nav .nav-item:not([data-screen="tasks"]),
.voice-limited .bottom-nav .nav-create { pointer-events: none; opacity: .3; filter: saturate(.15); }
.voice-limited .bottom-nav .nav-item[data-screen="tasks"] { color: var(--ink); }
.voice-limited .bottom-nav .nav-item[data-screen="tasks"] .nav-icon { color: var(--accent); transform: translateY(-2px) scale(1.08); }
.page { animation: pageIn .42s cubic-bezier(.2,.8,.2,1) both; }
.eyebrow { margin: 12px 2px 7px; color: var(--muted); font-size: 11px; font-weight: 720; letter-spacing: .13em; text-transform: uppercase; }
.page-title { margin: 0 2px 18px; font-size: clamp(29px, 8vw, 40px); line-height: .98; letter-spacing: -.05em; font-weight: 760; }
.page-subtitle { margin: -9px 2px 20px; color: var(--muted); font-size: 14px; line-height: 1.45; }

.hero-card { position: relative; min-height: 204px; overflow: hidden; padding: 23px; border-radius: var(--radius-xl); color: white; background: linear-gradient(145deg,var(--accent),var(--accent-dark) 74%); box-shadow: 0 24px 55px rgba(var(--accent-rgb),.24); isolation: isolate; }
.hero-card::before { content: ""; position: absolute; z-index: -1; inset: -60% -30% auto auto; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(255,206,211,.58), rgba(255,89,105,.14) 45%, transparent 70%); }
.hero-card::after { content: ""; position: absolute; z-index: -1; width: 170px; height: 170px; left: -70px; bottom: -115px; border-radius: 50%; background: rgba(255,255,255,.08); }
.hero-top { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.hero-card .label { color: rgba(255,255,255,.57); font-size: 12px; font-weight: 620; }
.hero-value { margin-top: 7px; font-size: 48px; line-height: .95; font-weight: 760; letter-spacing: -.055em; }
.hero-value small { margin-left: 4px; font-size: 20px; letter-spacing: -.03em; }
.hero-badge { flex: 0 0 auto; padding: 7px 10px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: rgba(255,255,255,.82); background: rgba(255,255,255,.09); backdrop-filter: blur(10px); font-size: 11px; font-weight: 650; }
.hero-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 32px; }
.hero-stat { padding: 10px 11px; border-radius: 14px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.06); }
.hero-stat strong { display: block; font-size: 17px; letter-spacing: -.03em; }
.hero-stat span { display: block; margin-top: 2px; color: rgba(255,255,255,.53); font-size: 10px; }

.section-head { display: flex; align-items: end; justify-content: space-between; margin: 28px 2px 12px; }
.section-head h2 { margin: 0; font-size: 20px; letter-spacing: -.035em; }
.section-head button { border: 0; padding: 4px 0; color: var(--blue); background: transparent; font-size: 13px; font-weight: 610; }

.metrics { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.metric { min-height: 108px; padding: 17px; border: 1px solid rgba(255,255,255,.85); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow); }
.metric-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 10px; background: #f1f5ff; color: var(--blue); font-size: 15px; }
.metric.orange .metric-icon { color: var(--blue); background: var(--blue-soft); }
.metric.green .metric-icon { color: var(--green); background: #e9f9f1; }
.metric.purple .metric-icon { color: var(--purple); background: #f0edff; }
.metric strong { display: block; margin-top: 13px; font-size: 25px; line-height: 1; letter-spacing: -.045em; }
.metric span { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; }

.quick-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
.quick { border: 0; padding: 0; background: transparent; }
.quick-icon { width: 54px; height: 54px; display: grid; place-items: center; margin: 0 auto; border: 1px solid rgba(255,255,255,.9); border-radius: 19px; background: rgba(255,255,255,.9); box-shadow: 0 9px 22px rgba(30,35,47,.06); font-size: 22px; transition: transform .2s; }
.quick:active .quick-icon { transform: scale(.9); }
.quick-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 18px; }
.quick-choice { display: grid; grid-template-columns: 34px 1fr 22px; align-items: center; gap: 10px; min-height: 54px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: var(--surface); text-align: left; }
.quick-choice span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; color: var(--blue-deep); background: var(--blue-soft); font-size: 17px; }
.quick-choice strong { font-size: 12px; }
.quick-choice i { color: var(--blue); font-style: normal; font-weight: 800; text-align: right; }
.quick-choice.is-selected { border-color: rgba(var(--accent-rgb),.46); background: var(--accent-soft); box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb),.11); }
.quick small { display: block; margin-top: 7px; color: #51515a; font-size: 10px; white-space: nowrap; }

.status-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.status-card { min-width: 0; min-height: 66px; display: grid; grid-template-columns: 9px 1fr auto; align-items: center; gap: 10px; padding: 12px 13px; border: 1px solid var(--hairline); border-radius: 18px; color: var(--ink); background: rgba(255,255,255,.9); box-shadow: 0 8px 22px rgba(30,35,47,.045); text-align: left; }
.status-card:active { transform: scale(.98); }
.status-dot { width: 8px; height: 28px; border-radius: 99px; background: var(--blue); }
.status-card.violet .status-dot { background: var(--purple); }
.status-card.rose .status-dot { background: #f05b72; }
.status-card.green .status-dot { background: var(--green); }
.status-card.dark .status-dot { background: #4b4b53; }
.status-copy { min-width: 0; display: grid; gap: 2px; }
.status-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; letter-spacing: -.015em; }
.status-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 9px; }
.status-card b { min-width: 27px; font-size: 24px; line-height: 1; letter-spacing: -.05em; text-align: right; }

.task-list { display: grid; gap: 10px; }
.task-card { position: relative; display: grid; grid-template-columns: 5px 1fr auto; gap: 13px; align-items: center; width: 100%; min-height: 94px; padding: 15px 14px 15px 10px; overflow: hidden; border: 1px solid rgba(255,255,255,.9); border-radius: var(--radius-lg); background: var(--surface); box-shadow: 0 11px 27px rgba(30,35,47,.055); text-align: left; animation: cardIn .42s both; }
.task-card:active { transform: scale(.985); }
.task-accent { align-self: stretch; width: 5px; border-radius: 99px; background: var(--blue); }
.task-accent.wait { background: var(--purple); }
.task-accent.review { background: var(--orange); }
.task-accent.done { background: var(--green); }
.task-accent.overdue { background: var(--red); }
.task-main { min-width: 0; }
.task-meta { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; color: var(--muted); font-size: 10px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; }
.type-pill { padding: 3px 6px; border-radius: 7px; color: #5b5b63; background: #f0f0f3; }
.task-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; font-weight: 680; letter-spacing: -.02em; }
.task-sub { display: flex; align-items: center; gap: 8px; margin-top: 7px; color: var(--muted); font-size: 11px; }
.task-sub .danger { color: var(--red); font-weight: 650; }
.task-side { display: grid; justify-items: end; gap: 9px; }
.status-pill { padding: 5px 8px; border-radius: 999px; color: var(--blue-deep); background: #e8f3ff; font-size: 9px; font-weight: 720; }
.status-pill.wait { color: #6548d6; background: #eeeaff; }
.status-pill.review { color: #a80e1b; background: #ffedf0; }
.status-pill.done { color: #168651; background: #e6f8ef; }
.status-pill.overdue { color: #d73027; background: #ffebe9; }
.chevron { color: #c5c5ca; font-size: 22px; font-weight: 300; }
.limited-voice-heading { margin: 2px 2px 23px; }
.limited-voice-heading .eyebrow { margin-top: 0; color: var(--accent); }
.limited-voice-heading .page-title { margin-bottom: 8px; font-size: clamp(38px,11vw,54px); }
.limited-voice-heading p { margin: 0; color: var(--muted); font-size: 14px; }
.voice-task-card { min-height: 108px; padding-top: 17px; padding-bottom: 17px; }
.voice-task-card .task-title { font-size: 17px; }
.voice-open-label { padding: 7px 10px; border-radius: 11px; color: var(--accent-dark); background: var(--accent-soft); font-size: 11px; font-weight: 740; }
.voice-task-summary { margin: 13px 0 4px; padding: 18px; border: 1px solid var(--hairline); border-radius: var(--radius-lg); background: #fff; box-shadow: 0 8px 25px rgba(31,35,48,.05); }
.voice-task-summary small { display: block; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.voice-task-summary strong { display: block; margin-top: 5px; font-size: 18px; }

.filter-row { display: flex; gap: 8px; margin: 0 -18px 16px; padding: 0 18px 3px; overflow-x: auto; scrollbar-width: none; }
.filter-row::-webkit-scrollbar { display: none; }
.editor-filter { display: flex; gap: 8px; margin: 14px -18px 12px; padding: 2px 18px 5px; overflow-x: auto; scrollbar-width: none; }
.editor-filter::-webkit-scrollbar { display: none; }
.editor-filter button { flex: 0 0 auto; min-height: 45px; display: grid; align-content: center; padding: 7px 13px; border: 1px solid var(--hairline); border-radius: 16px; color: var(--ink); background: rgba(255,255,255,.86); text-align: left; box-shadow: 0 6px 18px rgba(30,35,47,.035); }
.editor-filter button span { font-size: 10px; font-weight: 720; }
.editor-filter button small { margin-top: 2px; color: var(--muted); font-size: 7px; }
.editor-filter button.is-active { border-color: rgba(var(--accent-rgb),.22); color: var(--accent); background: var(--accent-soft); }
.filter { flex: 0 0 auto; border: 1px solid var(--hairline); border-radius: 999px; padding: 9px 14px; color: #676770; background: rgba(255,255,255,.72); font-size: 12px; font-weight: 620; }
.filter.is-active { border-color: var(--blue); color: white; background: var(--blue); box-shadow: 0 8px 20px rgba(var(--accent-rgb),.17); }

.empty { display: grid; place-items: center; min-height: 280px; padding: 32px 20px; text-align: center; }
.empty > div { width: min(100%, 320px); display: grid; justify-items: center; }
.empty-icon { width: 76px; height: 76px; display: grid; place-items: center; border: 1px solid rgba(var(--accent-rgb),.08); border-radius: 25px; color: var(--accent); background: linear-gradient(145deg, #fff, var(--accent-soft)); box-shadow: 0 16px 38px rgba(31,35,48,.08), inset 0 1px 0 #fff; }
.empty-icon svg { width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.empty-icon-calm { color: var(--green); background: linear-gradient(145deg,#fff,#ecfaf3); border-color: rgba(33,178,111,.1); }
.empty-icon-data { color: var(--purple); background: linear-gradient(145deg,#fff,#f2efff); border-color: rgba(116,87,245,.1); }
.empty-icon-error { color: #65656d; background: linear-gradient(145deg,#fff,#f1f1f4); border-color: rgba(17,17,20,.07); }
.empty h3 { margin: 18px 0 6px; font-size: 19px; }
.empty p { max-width: 250px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }

.load-more { width: 100%; min-height: 58px; display: grid; place-items: center; gap: 2px; margin-top: 12px; padding: 10px 16px; border: 1px solid rgba(var(--accent-rgb),.12); border-radius: 18px; color: var(--accent); background: rgba(255,255,255,.88); box-shadow: 0 8px 24px rgba(31,35,48,.045); transition: transform .18s ease, opacity .18s ease; }
.load-more:active { transform: scale(.985); }
.load-more strong { font-size: 13px; font-weight: 720; }
.load-more small { color: var(--muted); font-size: 10px; }
.load-more.is-loading { opacity: .55; }

body.access-locked,
body.access-locked html { background: #fff; }
body.access-locked .ambient,
body.access-locked .topbar,
body.access-locked .preview-banner,
body.access-locked .bottom-nav { display: none !important; }
body.access-locked .app { max-width: none; min-height: 100dvh; padding: 0; background: #fff; }
body.access-locked .content { min-height: 100dvh; display: grid; place-items: center; padding: max(24px, var(--safe-top)) 24px max(24px, var(--safe-bottom)); background: #fff; }
.access-denied-screen { color: #111114; font-size: clamp(24px, 7vw, 34px); line-height: 1.1; font-weight: 740; letter-spacing: -.04em; text-align: center; }

.report-card, .panel { padding: 18px; border: 1px solid rgba(255,255,255,.88); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow); }
.month-switch { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.month-switch button { width: 36px; height: 36px; border: 0; border-radius: 12px; background: #f1f1f4; font-size: 18px; }
.month-switch strong { font-size: 16px; text-transform: capitalize; }
.progress-list { display: grid; gap: 15px; }
.progress-row-head { display: flex; justify-content: space-between; margin-bottom: 7px; font-size: 12px; }
.progress-row-head strong { text-transform: capitalize; }
.progress-row-head span { color: var(--muted); }
.bar { height: 8px; overflow: hidden; border-radius: 99px; background: #eeeef1; }
.bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), rgba(var(--accent-rgb),.55)); box-shadow: 0 0 10px rgba(var(--accent-rgb),.2); }
.personal-result .hero-stat { color: var(--accent-dark); background: var(--accent-soft); }
.personal-result .hero-stat span { color: rgba(var(--accent-rgb),.7); }

.report-person { cursor: pointer; }
.editor-report-cover { position: relative; min-height: 126px; display: flex; align-items: end; justify-content: space-between; gap: 16px; overflow: hidden; padding: 21px; border-radius: 28px; color: #fff; background: linear-gradient(145deg,#17171c,#33333b); box-shadow: 0 20px 46px rgba(17,17,20,.18); }
.editor-report-cover::after { content:""; position:absolute; width:190px; height:190px; right:-80px; top:-105px; border-radius:50%; background:rgba(var(--accent-rgb),.5); filter:blur(2px); }
.editor-report-person { position: relative; z-index: 1; display: flex; align-items: center; gap: 13px; min-width: 0; }
.editor-report-person > span { width: 54px; height: 54px; flex: 0 0 auto; display:grid; place-items:center; border:1px solid rgba(255,255,255,.18); border-radius:18px; background:rgba(255,255,255,.11); font-size:19px; font-weight:760; }
.editor-report-person small { color:rgba(255,255,255,.55); font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.editor-report-person h1 { overflow:hidden; margin:4px 0 0; text-overflow:ellipsis; white-space:nowrap; font-size:27px; line-height:1; letter-spacing:-.045em; }
.editor-report-period { position:relative; z-index:1; flex:0 0 auto; padding:7px 10px; border:1px solid rgba(255,255,255,.12); border-radius:999px; background:rgba(255,255,255,.09); font-size:10px; font-weight:650; }
.editor-report-month { margin:14px 0 10px; padding:0 2px; }
.editor-report-kpis { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.editor-report-kpis article { min-width:0; padding:15px; border:1px solid var(--hairline); border-radius:19px; background:#fff; box-shadow:0 8px 24px rgba(31,35,48,.045); }
.editor-report-kpis strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:21px; letter-spacing:-.045em; }
.editor-report-kpis span { display:block; margin-top:4px; color:var(--muted); font-size:10px; }
.report-money-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.report-money-grid article { min-width:0; min-height:100px; padding:15px; border:1px solid var(--hairline); border-radius:20px; background:#fff; box-shadow:0 8px 24px rgba(31,35,48,.04); }
.report-money-grid span,.report-money-grid small { display:block; color:var(--muted); font-size:9px; }
.report-money-grid strong { display:block; overflow:hidden; margin:9px 0 4px; text-overflow:ellipsis; white-space:nowrap; font-size:20px; letter-spacing:-.04em; }
.report-money-grid .positive strong { color:var(--green); }
.report-money-grid .negative strong { color:var(--red); }
.report-money-grid .total { color:#fff; border-color:transparent; background:linear-gradient(145deg,var(--accent),var(--accent-dark)); }
.report-money-grid .total span,.report-money-grid .total small { color:rgba(255,255,255,.66); }
.report-adjustments { display:grid; overflow:hidden; border:1px solid var(--hairline); border-radius:22px; background:#fff; box-shadow:var(--shadow); }
.report-adjustments article { min-height:64px; display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:11px; padding:10px 14px; border-bottom:1px solid var(--hairline); }
.report-adjustments article:last-child { border-bottom:0; }
.adjustment-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:12px; color:var(--accent); background:var(--accent-soft); font-size:16px; font-weight:780; }
.adjustment-icon.late,.adjustment-icon.deadline,.adjustment-icon.manual { color:var(--red); background:#fff0f1; }
.adjustment-icon.rework { color:var(--purple); background:#f1efff; }
.report-adjustments strong { display:block; font-size:12px; }
.report-adjustments small { display:block; margin-top:2px; color:var(--muted); font-size:9px; }
.report-adjustments b { font-size:13px; letter-spacing:-.02em; }
.report-types { margin-bottom:2px; }
.report-video .task-sub { flex-wrap:wrap; }
.report-tags { display:flex; flex-wrap:wrap; gap:4px; }
.report-tag { padding:3px 6px; border-radius:7px; font-size:8px; font-weight:700; }
.report-tag.positive { color:#138252; background:#e7f8ef; }
.report-tag.negative { color:#c92431; background:#ffebed; }
.report-tag.neutral { color:#6251c9; background:#efedff; }
.bar i.complete { background: linear-gradient(90deg, var(--green), #7bd9a9); }

.menu-list { display: grid; overflow: hidden; border: 1px solid rgba(255,255,255,.9); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow); }
.menu-row { display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 11px; min-height: 62px; padding: 8px 15px; border: 0; border-bottom: 1px solid var(--hairline); background: transparent; text-align: left; }
.menu-row:last-child { border-bottom: 0; }
.menu-row:active { background: #f5f5f7; }
.menu-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: white; background: var(--blue); }
.menu-icon.orange { background: var(--orange); }.menu-icon.green { background: var(--green); }.menu-icon.purple { background: var(--purple); }.menu-icon.dark { background: var(--blue); }
.menu-copy strong { display: block; font-size: 14px; }
.menu-copy small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; }
.menu-arrow { color: #b9b9c0; font-size: 20px; }

.profile-cover { position: relative; overflow: hidden; padding: 20px; border-radius: 28px; color: #fff; background: linear-gradient(145deg,var(--accent),var(--accent-dark)); box-shadow: 0 22px 48px rgba(var(--accent-rgb),.22); }
.profile-cover::after { content: ""; position: absolute; width: 190px; height: 190px; right: -85px; top: -105px; border-radius: 50%; background: rgba(255,255,255,.12); }
.profile-identity { position: relative; z-index: 1; display: flex; align-items: center; gap: 14px; }
.profile-avatar { width: 66px; height: 66px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 22px; color: white; background: rgba(255,255,255,.16); box-shadow: inset 0 1px 0 rgba(255,255,255,.2); font-size: 24px; font-weight: 760; }
.profile-role { display: inline-block; margin-bottom: 4px; color: rgba(255,255,255,.7); font-size: 9px; font-weight: 720; letter-spacing: .08em; text-transform: uppercase; }
.profile-identity h1 { margin: 0; font-size: 27px; line-height: 1; letter-spacing: -.045em; }
.profile-identity p { margin: 5px 0 0; color: rgba(255,255,255,.65); font-size: 10px; }
.profile-wallet { position: relative; z-index: 1; width: 100%; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2px 12px; margin-top: 20px; padding: 14px 15px; border: 1px solid rgba(255,255,255,.14); border-radius: 18px; color: #fff; background: rgba(255,255,255,.1); text-align: left; }
.profile-wallet small { grid-column: 1; color: rgba(255,255,255,.62); font-size: 9px; }
.profile-wallet strong { grid-column: 1; font-size: 23px; letter-spacing: -.04em; }
.profile-wallet span { grid-column: 2; grid-row: 1/3; align-self: center; font-size: 10px; font-weight: 700; }
.profile-month { margin: 22px 0 10px; padding: 0 2px; }
.profile-overview { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.profile-overview article { min-width: 0; padding: 14px 12px; border: 1px solid rgba(255,255,255,.9); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow); }
.profile-overview strong { display: block; overflow: hidden; text-overflow: ellipsis; font-size: 16px; letter-spacing: -.035em; }
.profile-overview span { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
.section-note { color: var(--muted); font-size: 11px; }
.type-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.type-grid article { position: relative; overflow: hidden; min-height: 76px; padding: 14px; border: 1px solid var(--hairline); border-radius: 18px; background: #fff; }
.type-grid article span { color: var(--muted); font-size: 10px; }
.type-grid article strong { display: block; margin-top: 7px; font-size: 24px; letter-spacing: -.04em; }
.type-grid article i { position: absolute; left: 0; bottom: 0; width: var(--fill); height: 3px; background: var(--blue); }

.over-goal { display: grid; gap: 3px; margin-bottom: 10px; padding: 18px; border: 1px solid rgba(33,178,111,.16); border-radius: 20px; background: linear-gradient(145deg,#eafaf2,#f8fffb); }
.over-goal span { color: #158657; font-size: 10px; font-weight: 720; letter-spacing: .07em; text-transform: uppercase; }
.over-goal strong { margin-top: 4px; color: #11764c; font-size: 27px; letter-spacing: -.045em; }
.over-goal small { color: #5f8f77; font-size: 9px; }
.goal-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.goal-card { padding: 14px; border: 1px solid var(--hairline); border-radius: 19px; background: #fff; box-shadow: 0 9px 24px rgba(31,35,48,.045); }
.goal-card.is-complete { border-color: rgba(33,178,111,.18); background: linear-gradient(150deg,#fff,#f1fbf6); }
.goal-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.goal-head span { color: var(--muted); font-size: 10px; font-weight: 680; }
.goal-head i { min-width: 22px; height: 22px; display: grid; place-items: center; border-radius: 8px; color: var(--accent); background: var(--accent-soft); font-size: 9px; font-style: normal; font-weight: 800; }
.goal-card.is-complete .goal-head i { color: white; background: var(--green); box-shadow: 0 5px 12px rgba(33,178,111,.2); }
.goal-card > strong { display: block; margin-top: 8px; font-size: 25px; letter-spacing: -.045em; }
.goal-card > strong small { color: #aaaab1; font-size: 12px; }
.goal-bar { height: 4px; margin-top: 10px; overflow: hidden; border-radius: 4px; background: #ededf0; }
.goal-bar i { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.goal-card.is-complete .goal-bar i { background: var(--green); }
.goal-card p { min-height: 22px; margin: 8px 0 0; color: var(--muted); font-size: 9px; line-height: 1.3; }
.goal-card.is-complete p { color: #20805a; }
.theme-panel { padding: 15px; border: 1px solid var(--hairline); border-radius: 20px; background: #fff; box-shadow: var(--shadow); }
.theme-panel label { display: flex; align-items: center; gap: 11px; }
.theme-panel label > span:nth-child(2) { min-width: 0; flex: 1; }
.theme-panel label strong, .theme-panel label small { display: block; }
.theme-panel label strong { font-size: 12px; }
.theme-panel label small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.theme-color-preview { width: 38px; height: 38px; flex: 0 0 auto; border: 4px solid white; border-radius: 13px; box-shadow: 0 0 0 1px var(--hairline),0 6px 14px rgba(31,35,48,.12); }
.theme-panel input[type="color"] { width: 44px; height: 38px; border: 0; padding: 0; background: transparent; cursor: pointer; }
.theme-presets { display: grid; grid-template-columns: repeat(5,1fr); gap: 8px; margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--hairline); }
.theme-presets button { height: 29px; border: 4px solid #fff; border-radius: 10px; background: var(--swatch); box-shadow: 0 0 0 1px var(--hairline); }

.wallet-card { position: relative; overflow: hidden; padding: 22px; border-radius: 30px; color: #fff; background: linear-gradient(145deg,var(--accent),var(--accent-dark)); box-shadow: 0 24px 54px rgba(var(--accent-rgb),.25); }
.wallet-card::after { content: ""; position: absolute; width: 240px; height: 240px; right: -120px; top: -150px; border-radius: 50%; background: rgba(255,255,255,.12); }
.wallet-card-top { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 12px; color: rgba(255,255,255,.7); font-size: 10px; text-transform: capitalize; }
.wallet-card-top b { padding: 5px 8px; border-radius: 99px; color: #fff; background: rgba(255,255,255,.12); font-size: 8px; }
.wallet-card > small { position: relative; z-index: 1; display: block; margin-top: 28px; color: rgba(255,255,255,.6); font-size: 10px; }
.wallet-amount { position: relative; z-index: 1; margin-top: 4px; font-size: clamp(42px,12vw,62px); line-height: .95; font-weight: 770; letter-spacing: -.065em; }
.wallet-withdraw { position: relative; z-index: 1; width: 100%; min-height: 55px; margin-top: 24px; border: 0; border-radius: 17px; color: var(--blue-deep); background: #fff; box-shadow: 0 10px 24px rgba(85,0,9,.16); font-size: 14px; font-weight: 740; }
.wallet-withdraw:active { transform: scale(.985); }
.wallet-settings-link { position: relative; z-index: 1; width: 100%; margin-top: 13px; border: 0; color: rgba(255,255,255,.76); background: transparent; font-size: 10px; font-weight: 680; }
.wallet-details { display: grid; overflow: hidden; border: 1px solid rgba(255,255,255,.9); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow); }
.wallet-details div { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 15px; border-bottom: 1px solid var(--hairline); }
.wallet-details div:last-child { border-bottom: 0; }
.wallet-details span { color: var(--muted); font-size: 11px; }
.wallet-details strong { font-size: 14px; }
.wallet-history { display: grid; gap: 8px; }
.wallet-history article { display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: 11px; min-height: 64px; padding: 10px 13px; border: 1px solid rgba(255,255,255,.9); border-radius: 18px; background: var(--surface); box-shadow: 0 8px 22px rgba(30,35,47,.045); }
.transaction-sign { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; font-weight: 800; }
.transaction-sign.plus { color: var(--green); background: #e9f9f1; }
.transaction-sign.minus { color: var(--blue); background: var(--blue-soft); }
.wallet-history article div { min-width: 0; }
.wallet-history article div strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.wallet-history article div small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
.wallet-history article > b { font-size: 12px; }
.wallet-statement { overflow: hidden; border: 1px solid var(--hairline); border-radius: 24px; background: rgba(255,255,255,.92); box-shadow: var(--shadow); }
.statement-date { padding: 14px 16px 7px; color: #9898a0; font-size: 9px; font-weight: 760; letter-spacing: .04em; text-transform: uppercase; }
.statement-row { display: grid; grid-template-columns: 11px minmax(0,1fr) auto; align-items: center; gap: 12px; min-height: 76px; padding: 13px 16px; border-bottom: 1px solid var(--hairline); }
.statement-row:last-child { border-bottom: 0; }
.statement-dot { width: 10px; height: 10px; border-radius: 50%; box-shadow: 0 0 0 5px rgba(0,0,0,.025); }
.statement-dot.credit { background: #38c98a; }.statement-dot.debit { background: #f04d67; }
.statement-row div { min-width: 0; }.statement-row div strong { display: block; overflow: hidden; color: var(--ink); font-size: 11px; line-height: 1.28; text-overflow: ellipsis; white-space: nowrap; }
.statement-row div small { display: block; margin-top: 5px; overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.statement-row > b { font-size: 12px; white-space: nowrap; }.statement-row > b.credit { color: #139261; }.statement-row > b.debit { color: #d7324f; }
.pending-payouts { display: grid; gap: 8px; }.pending-payouts article { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 15px 17px; border: 1px solid #ffe2b8; border-radius: 19px; background: #fff9ef; }.pending-payouts span { color: #a46d17; font-size: 9px; }.pending-payouts strong { grid-row: 1/3; grid-column: 2; align-self: center; font-size: 17px; }.pending-payouts small { color: var(--muted); font-size: 8px; }
.payment-settings, .withdraw-methods { display: grid; gap: 9px; }
.currency-panel { overflow: hidden; padding: 7px; border: 1px solid var(--hairline); border-radius: 24px; background: rgba(255,255,255,.94); box-shadow: var(--shadow); }
.currency-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; padding: 3px; border-radius: 18px; background: #f1f1f4; }
.currency-switch button { min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 15px; color: var(--muted); background: transparent; font-size: 11px; }
.currency-switch button span { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 10px; color: var(--ink); background: rgba(255,255,255,.78); font-size: 15px; font-weight: 780; }
.currency-switch button strong { font-size: 11px; }
.currency-switch button.is-active { color: #fff; background: linear-gradient(145deg,var(--accent),var(--accent-dark)); box-shadow: 0 9px 22px rgba(var(--accent-rgb),.2); }
.currency-switch button.is-active span { color: var(--accent-dark); background: #fff; }
.currency-rate { min-height: 65px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 10px 4px; }
.currency-rate > span strong, .currency-rate > span small { display: block; }
.currency-rate > span strong { font-size: 11px; }
.currency-rate > span small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.currency-panel > p { margin: 2px 10px 9px; color: var(--muted); font-size: 8px; line-height: 1.45; }
.payment-settings > button, .withdraw-methods > button { width: 100%; min-height: 72px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--hairline); border-radius: 21px; color: var(--ink); background: rgba(255,255,255,.94); box-shadow: 0 8px 24px rgba(30,35,47,.045); text-align: left; }
.payment-settings button span:nth-child(2), .withdraw-methods button span:nth-child(2) { min-width: 0; }.payment-settings button strong, .withdraw-methods button strong { display: block; font-size: 12px; }.payment-settings button small, .withdraw-methods button small { display: block; margin-top: 4px; overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.payment-settings button > i, .withdraw-methods button > i { color: var(--accent); font-size: 9px; font-style: normal; font-weight: 750; }
.payment-method-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; font-size: 18px; font-weight: 780; }.payment-method-icon.card { color: #1764d9; background: #edf4ff; }.payment-method-icon.crypto { color: #8b5b00; background: #fff5da; }.payment-method-icon.cash { color: #178a5f; background: #eaf9f2; }
.privacy-note, .rating-private-note { margin: 11px 3px 0; color: var(--muted); font-size: 9px; line-height: 1.45; }
.saved-requisite { padding: 22px; border: 1px solid rgba(var(--accent-rgb),.14); border-radius: 24px; background: linear-gradient(145deg,#fff,var(--accent-soft)); box-shadow: var(--shadow); }.saved-requisite small, .saved-requisite span { display: block; color: var(--muted); font-size: 9px; }.saved-requisite strong { display: block; margin: 14px 0 7px; font-size: 30px; letter-spacing: -.04em; }
.amount-presets { display: flex; flex-wrap: wrap; gap: 7px; }.amount-presets button { min-height: 34px; padding: 0 12px; border: 1px solid var(--hairline); border-radius: 99px; color: var(--ink); background: #fff; font-size: 9px; font-weight: 700; }
.payment-insights { display: grid; margin: 8px 15px 0; overflow: hidden; border: 1px solid var(--hairline); border-radius: 18px; background: #fafafd; }
.payment-insight { min-width: 0; min-height: 58px; display: grid; grid-template-columns: 38px minmax(0,1fr); align-items: center; gap: 11px; padding: 9px 12px; border-bottom: 1px solid var(--hairline); }
.payment-insight:last-child { border-bottom: 0; }
.payment-insight > i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 13px; color: var(--accent); background: var(--accent-soft); font-style: normal; }
.payment-insight.pickup > i { color: #7b59d0; background: #f1edfb; }
.payment-insight.work > i { color: #168361; background: #eaf8f2; }
.payment-insight svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.payment-insight.ai svg path:first-child, .payment-insight.ai svg path:last-child { fill: currentColor; stroke: none; }
.payment-insight div { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.payment-insight small { color: var(--muted); font-size: 11px; line-height: 1.25; }
.payment-insight strong { flex: 0 0 auto; font-size: 14px; letter-spacing: -.02em; }
.rating-payment-list { display: grid; gap: 8px; }.rating-payment-list button { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 15px; border: 1px solid var(--hairline); border-radius: 17px; color: var(--ink); background: #fff; }.rating-payment-list button span { color: #e2a21a; font-size: 13px; letter-spacing: 1px; }.rating-payment-list button strong { font-size: 14px; }.rating-payment-list button.is-active { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 2px rgba(var(--accent-rgb),.08); }

.finance-person { width: 100%; text-align: left; }
.notification-title { align-items: end; margin-top: 0; }
.notification-title .page-title { margin-bottom: 0; }
.notification-list { display: grid; gap: 9px; }
.notification-card { width: 100%; min-height: 86px; display: grid; grid-template-columns: 8px 1fr 14px; align-items: center; gap: 11px; border: 1px solid var(--hairline); border-radius: 20px; padding: 14px; background: rgba(255,255,255,.82); text-align: left; box-shadow: 0 8px 24px rgba(31,35,48,.04); }
.notification-card.is-unread { border-color: rgba(var(--accent-rgb),.16); background: linear-gradient(145deg,#fff,var(--accent-soft)); }
.notification-mark { width: 7px; height: 7px; border-radius: 50%; background: #d5d5da; }
.notification-card.is-unread .notification-mark { background: var(--accent); box-shadow: 0 0 0 5px rgba(var(--accent-rgb),.09); }
.notification-card small { display: block; color: var(--muted); font-size: 8px; }
.notification-card strong { display: block; margin-top: 4px; font-size: 13px; }
.notification-card p { margin: 4px 0 0; color: var(--muted); font-size: 10px; line-height: 1.35; }
.notification-card > i { color: #b8b8bf; font-size: 20px; font-style: normal; }

.bottom-nav { position: fixed; z-index: 20; left: 50%; bottom: calc(10px + var(--safe-bottom)); width: min(calc(100% - 24px), 720px); height: 74px; display: grid; grid-template-columns: 1fr 1fr 68px 1fr 1fr; align-items: center; padding: 7px 10px; border: 1px solid rgba(255,255,255,.9); border-radius: 25px; background: rgba(255,255,255,.9); box-shadow: 0 18px 48px rgba(21,24,34,.18), inset 0 1px 0 #fff; backdrop-filter: blur(24px) saturate(1.5); transform: translateX(-50%); }
.nav-item { height: 56px; display: grid; place-content: center; justify-items: center; gap: 3px; border: 0; color: #9b9ba3; background: transparent; }
.nav-icon { width: 23px; height: 23px; overflow: visible; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s cubic-bezier(.2,.9,.2,1), color .25s; }
.nav-more-icon circle { fill: currentColor; stroke: none; }
.nav-item small { font-size: 9px; font-weight: 650; }
.nav-item.is-active { color: #17171a; }
.nav-item.is-active .nav-icon { color: var(--accent); transform: translateY(-2px) scale(1.08); }
.nav-create { width: 58px; height: 58px; display: grid; place-items: center; align-self: end; justify-self: center; margin-bottom: 3px; border: 0; border-radius: 20px; color: #fff; background: linear-gradient(145deg, var(--accent), var(--accent-dark)); box-shadow: 0 13px 26px rgba(var(--accent-rgb),.28), inset 0 1px 1px rgba(255,255,255,.28); font-size: 31px; font-weight: 280; transition: transform .2s; }
.nav-create svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.nav-create:active { transform: scale(.9) rotate(4deg); }

.modal-root { position: fixed; z-index: 100; inset: 0; pointer-events: none; }
.modal-root.is-open { pointer-events: auto; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(12,12,15,.28); backdrop-filter: blur(5px); animation: fadeIn .22s both; }
.sheet { position: absolute; left: 0; right: 0; bottom: 0; max-width: 760px; max-height: min(91dvh, 920px); margin: 0 auto; overflow-y: auto; padding: 9px 18px calc(24px + var(--safe-bottom)); border-radius: 30px 30px 0 0; background: #f8f8fa; box-shadow: 0 -20px 70px rgba(0,0,0,.2); animation: sheetIn .42s cubic-bezier(.16,1,.3,1) both; }
.sheet-handle { width: 38px; height: 5px; margin: 0 auto 15px; border-radius: 99px; background: #d2d2d7; }
.sheet-header { display: flex; align-items: start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.sheet-header h2 { margin: 0; font-size: 29px; line-height: 1.06; letter-spacing: -.045em; }
.sheet-header p { margin: 6px 0 0; color: var(--muted); font-size: 14px; line-height: 1.35; }
.close-button { width: 34px; height: 34px; flex: 0 0 auto; border: 0; border-radius: 50%; color: #6c6c74; background: #e7e7eb; font-size: 18px; }
.detail-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 13px; }
.detail-meta span { padding: 7px 10px; border-radius: 10px; color: #5c5c65; background: #ececf0; font-size: 12px; font-weight: 650; }
.detail-block { padding: 17px; margin-top: 11px; border-radius: var(--radius-md); background: #fff; box-shadow: 0 6px 20px rgba(31,35,48,.05); }
.detail-block label { display: block; margin-bottom: 7px; color: var(--muted); font-size: 12px; font-weight: 680; letter-spacing: .07em; text-transform: uppercase; }
.detail-block p { margin: 0; font-size: 16px; line-height: 1.48; word-break: break-word; }
.detail-link { color: var(--blue); text-decoration: none; }
.finance-breakdown { overflow: hidden; margin: 12px 0 4px; border: 1px solid rgba(var(--accent-rgb),.12); border-radius: 24px; background: #fff; box-shadow: 0 12px 32px rgba(31,35,48,.07); }
.finance-head { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 15px 17px; color: #fff; background: linear-gradient(145deg,var(--accent),var(--accent-dark)); }
.finance-head small { display: block; color: rgba(255,255,255,.7); font-size: 11px; font-weight: 720; letter-spacing: .08em; text-transform: uppercase; }
.finance-head strong { display: block; margin-top: 4px; font-size: 20px; letter-spacing: -.02em; }
.finance-head > span { padding: 8px 10px; border-radius: 11px; background: rgba(255,255,255,.16); font-size: 13px; font-weight: 760; }
.finance-lines { padding: 4px 15px; }
.finance-row { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--hairline); }
.finance-row:last-child { border-bottom: 0; }
.finance-row > div { min-width: 0; padding: 10px 0; }
.finance-row strong { display: block; font-size: 14px; }
.finance-row small { display: block; margin-top: 4px; overflow-wrap: anywhere; color: var(--muted); font-size: 11px; line-height: 1.4; }
.finance-row > b { flex: 0 0 auto; font-size: 15px; }
.finance-row-action { flex: 0 0 auto; display: grid; justify-items: end; gap: 5px; }
.finance-row-action > b { font-size: 15px; }
.finance-row-action > b.positive { color: var(--green); }
.finance-row-action > b.negative { color: var(--red); }
.finance-row-action > b.neutral { color: var(--muted); }
.finance-remove { min-height: 29px; border: 0; border-radius: 9px; padding: 0 10px; color: #9d1d26; background: #fff0f1; font-size: 11px; font-weight: 720; }
.finance-row > b.positive { color: var(--green); }
.finance-row > b.negative { color: var(--red); }
.finance-row > b.neutral { color: var(--muted); }
.finance-row.cap { margin: 3px -7px; padding: 0 7px; border: 0; border-radius: 12px; background: #f3f3f6; }
.finance-row.compact { min-height: 48px; }
.finance-total { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 17px; border-top: 1px solid var(--hairline); background: #fafafd; }
.finance-total small { display: block; color: var(--muted); font-size: 11px; }
.finance-total strong { display: block; margin-top: 4px; font-size: 31px; letter-spacing: -.055em; }
.finance-total > span { padding: 7px 9px; border-radius: 10px; color: var(--accent-dark); background: var(--accent-soft); font-size: 11px; font-weight: 720; }
.shorts-fixed-payment { margin: 10px 0 16px; padding: 22px; border: 1px solid rgba(var(--accent-rgb),.12); border-radius: 24px; background: linear-gradient(145deg,#fff,var(--accent-soft)); box-shadow: var(--shadow); }
.shorts-fixed-payment small { color: var(--muted); font-size: 11px; font-weight: 720; letter-spacing: .08em; text-transform: uppercase; }
.shorts-fixed-payment strong { display: block; margin-top: 8px; font-size: 38px; letter-spacing: -.055em; }
.shorts-fixed-payment p { margin: 9px 0 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.sheet .action-grid .button { min-height: 54px; font-size: 15px; }
.finance-breakdown.is-empty .finance-head { color: var(--ink); background: #fff; }
.finance-breakdown.is-empty .finance-head small { color: var(--muted); }
.event-history p { display: grid; gap: 2px; padding: 8px 0; border-bottom: 1px solid var(--hairline); }
.event-history p:last-child { border-bottom: 0; }
.event-history p small { color: var(--muted); font-size: 9px; overflow-wrap: anywhere; }
.dynamic-title { margin-top: 12px; }
.dashboard-subtitle { margin: -10px 0 18px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.fortune-banner { width: 100%; min-height: 58px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 12px; margin-top: 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 17px; padding: 11px 13px; color: #fff; background: rgba(255,255,255,.13); text-align: left; }
.fortune-banner span { font-size: 9px; opacity: .72; }
.fortune-banner strong { grid-column: 1; font-size: 14px; }
.fortune-banner i { grid-column: 2; grid-row: 1/3; font-size: 10px; font-style: normal; font-weight: 720; }
.fortune-wrap { position: relative; width: min(78vw,330px); aspect-ratio: 1; margin: 6px auto 18px; }
.fortune-pointer { position: absolute; z-index: 3; top: -5px; left: 50%; width: 0; height: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; border-top: 27px solid var(--accent-dark); filter: drop-shadow(0 4px 4px rgba(0,0,0,.18)); transform: translateX(-50%); }
.fortune-wheel { position: absolute; inset: 8px; border: 8px solid #fff; border-radius: 50%; background: repeating-conic-gradient(from -9deg,var(--accent-soft) 0 18deg,#fff 18deg 36deg); box-shadow: 0 18px 44px rgba(31,35,48,.17),inset 0 0 0 1px rgba(var(--accent-rgb),.2); transition: transform 3.8s cubic-bezier(.12,.67,.08,1); }
.fortune-wheel::after { content:""; position:absolute; inset:13%; border-radius:50%; background:#fff; box-shadow:0 5px 24px rgba(31,35,48,.12); }
.fortune-wheel > span { --angle: calc(360deg / var(--count) * var(--i)); position: absolute; z-index: 1; left: 50%; top: 50%; width: 28px; margin-left: -14px; margin-top: -8px; color: #28282d; font-size: 8px; font-weight: 790; text-align: center; transform: rotate(var(--angle)) translateY(calc(min(39vw,145px) * -1)) rotate(calc(var(--angle) * -1)); }
.fortune-wheel > i { position:absolute;z-index:2;inset:36%;display:grid;place-items:center;border-radius:50%;color:#fff;background:linear-gradient(145deg,var(--accent),var(--accent-dark));font-size:34px;font-style:normal;font-weight:850;box-shadow:0 7px 18px rgba(var(--accent-rgb),.25); }
.fortune-result { display:grid;justify-items:center;gap:4px;margin:0 auto 13px;text-align:center; }
.fortune-result small { color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.08em; }
.fortune-result strong { font-size:25px;letter-spacing:-.04em; }
.fortune-result span { color:var(--muted);font-size:10px; }
.fortune-result.is-won strong { color:var(--green);font-size:34px;animation:fadeUp .35s both; }
.analysis-empty { display: grid; justify-items: center; padding: 30px 18px; border: 1px solid var(--hairline); border-radius: 22px; background: #fff; text-align: center; }
.analysis-empty > span { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 18px; color: #fff; background: var(--blue); font-size: 15px; font-weight: 780; }
.analysis-empty.is-error > span { background: #4b4b53; }
.analysis-empty h3 { margin: 16px 0 6px; font-size: 18px; }
.analysis-empty p { max-width: 330px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.analysis-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px; border-radius: 24px; color: #fff; background: linear-gradient(145deg,var(--accent),var(--accent-dark)); }
.analysis-hero small { display: block; color: rgba(255,255,255,.63); font-size: 10px; }
.analysis-hero strong { display: block; margin-top: 6px; font-size: 42px; line-height: .95; letter-spacing: -.06em; }
.analysis-hero strong i { font-size: 16px; font-style: normal; letter-spacing: -.02em; opacity: .62; }
.analysis-hero span { display: block; margin-top: 8px; color: rgba(255,255,255,.8); font-size: 11px; font-weight: 650; }
.analysis-ring { --score: 0%; width: 78px; height: 78px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(#fff var(--score),rgba(255,255,255,.17) 0); }
.analysis-ring::before { content: ""; grid-area: 1/1; width: 61px; height: 61px; border-radius: 50%; background: var(--accent-dark); }
.analysis-ring b { position: relative; grid-area: 1/1; font-size: 13px; }
.analysis-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 10px; }
.analysis-summary div { padding: 13px 10px; border: 1px solid var(--hairline); border-radius: 16px; background: #fff; }
.analysis-summary strong { display: block; font-size: 18px; letter-spacing: -.04em; }
.analysis-summary span { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; }
.analysis-section { margin-top: 20px; }
.analysis-section h3 { margin: 0 0 10px; font-size: 16px; letter-spacing: -.025em; }
.effect-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; }
.effect-grid article { padding: 12px; border: 1px solid var(--hairline); border-radius: 15px; background: #fff; }
.effect-grid span { display: block; color: var(--muted); font-size: 9px; }
.effect-grid strong { display: block; margin-top: 5px; font-size: 18px; }
.analysis-note { margin-top: 16px; padding: 15px; border-radius: 17px; color: #7d0a14; background: var(--blue-soft); }
.analysis-note small { font-size: 9px; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; }
.analysis-note p { margin: 6px 0 0; font-size: 12px; line-height: 1.45; }
.technical-list { overflow: hidden; border: 1px solid var(--hairline); border-radius: 17px; background: #fff; }
.technical-list div { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 13px; border-bottom: 1px solid var(--hairline); }
.technical-list div:last-child { border-bottom: 0; }
.technical-list span { color: var(--muted); font-size: 10px; }
.technical-list strong { font-size: 11px; }
.analysis-disclaimer { margin: 13px 4px 0; color: var(--muted); font-size: 9px; line-height: 1.45; }
.action-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; margin-top: 17px; }
.action-grid .wide { grid-column: 1/-1; }
.button { min-height: 49px; border: 0; border-radius: 15px; padding: 0 15px; color: #fff; background: var(--blue); font-size: 13px; font-weight: 680; box-shadow: 0 8px 18px rgba(var(--accent-rgb),.14); }
.button:active { transform: scale(.975); }
.button.blue { background: var(--blue); }.button.green { background: var(--green); }.button.red { background: var(--red); }.button.orange { background: var(--orange); }
.button.secondary { color: #333339; background: #e9e9ed; box-shadow: none; }
.button.ghost { color: var(--blue); background: var(--blue-soft); box-shadow: none; }

.form { display: grid; gap: 13px; }
.field { display: grid; gap: 7px; }
[hidden] { display: none !important; }
.field > span { margin-left: 2px; color: #6f6f78; font-size: 11px; font-weight: 650; }
.input { width: 100%; min-height: 50px; border: 1px solid rgba(20,20,23,.07); border-radius: 15px; padding: 0 14px; outline: none; color: var(--ink); background: #fff; box-shadow: inset 0 1px 2px rgba(0,0,0,.025); font-size: 14px; }
textarea.input { min-height: 92px; padding-top: 13px; resize: vertical; line-height: 1.4; }
.input:focus { border-color: rgba(var(--accent-rgb),.5); box-shadow: 0 0 0 4px rgba(var(--accent-rgb),.08); }
.segmented { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 3px; padding: 3px; border-radius: 13px; background: #e9e9ed; }
.segmented button { min-height: 38px; border: 0; border-radius: 10px; color: #71717a; background: transparent; font-size: 11px; font-weight: 650; }
.segmented button.is-active { color: #17171a; background: #fff; box-shadow: 0 2px 7px rgba(0,0,0,.08); }
.toggle { width: 48px; height: 29px; position: relative; border: 0; border-radius: 99px; background: #d9d9de; transition: background .2s; }
.toggle::after { content: ""; position: absolute; top: 3px; left: 3px; width: 23px; height: 23px; border-radius: 50%; background: white; box-shadow: 0 2px 5px rgba(0,0,0,.22); transition: transform .25s cubic-bezier(.2,.9,.2,1); }
.toggle.is-on { background: var(--green); }.toggle.is-on::after { transform: translateX(19px); }
.setting-row { display: flex; align-items: center; justify-content: space-between; min-height: 58px; padding: 6px 2px; border-bottom: 1px solid var(--hairline); }
.setting-row:last-child { border-bottom: 0; }
.setting-row strong { display: block; font-size: 13px; }.setting-row small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; }

.toast-root { position: fixed; z-index: 200; top: calc(14px + var(--safe-top)); left: 50%; display: grid; gap: 7px; width: min(calc(100% - 32px), 420px); transform: translateX(-50%); pointer-events: none; }
.toast { padding: 13px 15px; border: 1px solid rgba(255,255,255,.22); border-radius: 15px; color: white; background: rgba(var(--accent-rgb),.94); box-shadow: 0 13px 35px rgba(var(--accent-rgb),.22); backdrop-filter: blur(16px); font-size: 12px; font-weight: 580; animation: toastIn .34s cubic-bezier(.16,1,.3,1) both; }
.button:disabled, button:disabled { cursor: default; opacity: .48; }
.preview-banner { position: sticky; z-index: 9; top: calc(82px + var(--safe-top)); display: flex; align-items: center; justify-content: space-between; margin: 0 18px 10px; padding: 10px 12px; border-radius: 13px; color: var(--accent-dark); background: var(--blue-soft); border: 1px solid rgba(var(--accent-rgb),.14); font-size: 11px; font-weight: 650; }
.preview-banner button { border: 0; color: white; background: var(--blue); border-radius: 9px; padding: 7px 9px; font-size: 10px; font-weight: 650; }
.toast.error { background: rgba(183,38,31,.94); }

.skeleton { position: relative; overflow: hidden; border-radius: 12px; background: #e9e9ed; }
.skeleton::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(255,255,255,.62), transparent); animation: shimmer 1.4s infinite; }
.skeleton-page { padding-top: 16px; }.skeleton.line { height: 24px; }.skeleton.w40 { width: 40%; }.skeleton.w55 { width: 55%; margin-top: 26px; }.hero-skeleton { height: 204px; margin-top: 20px; border-radius: 28px; }.card-skeleton { height: 94px; margin-top: 11px; border-radius: 22px; }

@keyframes brandIn { from { opacity: 0; transform: scale(.7) rotate(-8deg); } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(12px); } }
@keyframes load { 0% { transform: translateX(-110%); } 50% { transform: translateX(120%); } 100% { transform: translateX(260%); } }
@keyframes pageIn { from { opacity: 0; transform: translateY(10px); } }
@keyframes cardIn { from { opacity: 0; transform: translateY(12px) scale(.985); } }
@keyframes fadeIn { from { opacity: 0; } }
@keyframes sheetIn { from { transform: translateY(102%); } }
@keyframes toastIn { from { opacity: 0; transform: translateY(-14px) scale(.97); } }
@keyframes shimmer { 100% { transform: translateX(100%); } }

@media (min-width: 700px) {
  .content { padding-left: 28px; padding-right: 28px; }
  .topbar { padding-left: 30px; padding-right: 30px; }
  .metrics { grid-template-columns: repeat(4,1fr); }
  .quick-grid { max-width: 440px; }
}
@media (max-width: 390px) {
  .profile-copy { display: none; }
  .quick-picker { grid-template-columns: 1fr; }
}
@media (max-width: 345px) {
  .balance-button { min-width: 148px; padding-left: 12px; padding-right: 12px; }
  .bottom-nav { grid-template-columns: 1fr 1fr 62px 1fr 1fr; padding-left: 6px; padding-right: 6px; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration: .001ms !important; transition-duration: .001ms !important; } }