/* Usuario > Resumen at every width. Native metrics stay mounted (hidden) as the data source. */
@layer wuim-user-summary-mobile {
 #userSummaryView.uss-mobile,.uss-dialog {--uss-bg:#ffffff!important;--uss-panel:#ffffff!important;--uss-soft:#f7f7f5!important;--uss-hover:#f4f4f2!important;--uss-text:#37352f!important;--uss-muted:#787774!important;--uss-line:#ededeb!important;--uss-accent:#5b52f5!important;--uss-tint:#eef0ff!important;--uss-tint-text:#4038c7!important;--uss-good:#0e7a4f!important;--uss-good-bg:#e7f6ee!important;--uss-bad:#b42318!important;--uss-warn:#7a4f00!important;--uss-warn-bg:#fff4dc!important;}
 html[data-theme="dark"] :is(#userSummaryView.uss-mobile,.uss-dialog) {--uss-bg:#0f1726!important;--uss-panel:#151f30!important;--uss-soft:#1a2538!important;--uss-hover:#202c41!important;--uss-text:#edf2fa!important;--uss-muted:#a0aec2!important;--uss-line:#2c394c!important;--uss-accent:#998dff!important;--uss-tint:#29244b!important;--uss-tint-text:#c3bfff!important;--uss-good:#4fd197!important;--uss-good-bg:#12352a!important;--uss-bad:#ff8f85!important;--uss-warn:#f5c86a!important;--uss-warn-bg:#3a2c0c!important;}
 #userSummaryView.uss-mobile {width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;}
 #userSummaryView.uss-mobile > :not(.uss-shell) {display:none!important;}
 .uss-shell,.uss-dialog {font:400 14px/1.45 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;color:var(--uss-text)!important;}
 .uss-shell {display:flex!important;flex-direction:column!important;gap:24px!important;min-width:0!important;width:100%!important;padding:4px 0 env(safe-area-inset-bottom,0px)!important;}
 :is(.uss-shell,.uss-dialog) * {box-sizing:border-box!important;}
 :is(.uss-shell,.uss-dialog) :is(h1,h2,p) {margin:0!important;color:var(--uss-text)!important;}
 :is(.uss-shell,.uss-dialog) h2 {font-size:16px!important;line-height:1.4!important;font-weight:650!important;letter-spacing:-.01em!important;}
 :is(.uss-shell,.uss-dialog) button {font-family:inherit!important;font-size:inherit!important;font-weight:500!important;line-height:1.4!important;letter-spacing:normal!important;text-transform:none!important;transform:none!important;box-shadow:none!important;cursor:pointer!important;touch-action:manipulation!important;min-width:0!important;margin:0!important;color:var(--uss-text)!important;background-image:none!important;}
 :is(.uss-shell,.uss-dialog) :is(button,summary):focus-visible {outline:2px solid var(--uss-accent)!important;outline-offset:3px!important;}
 :is(.uss-shell,.uss-dialog) svg {width:18px!important;height:18px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.6!important;stroke-linecap:round!important;stroke-linejoin:round!important;flex:none!important;}
 :is(.uss-shell,.uss-dialog) strong {font-weight:650!important;font-variant-numeric:tabular-nums!important;overflow-wrap:anywhere!important;}
 .uss-shell small {font-size:12px!important;color:var(--uss-muted)!important;font-weight:400!important;}
 .uss-shell .uss-positive {color:var(--uss-good)!important;}
 .uss-shell .uss-negative {color:var(--uss-bad)!important;}
 .uss-shell .uss-loading {color:var(--uss-muted)!important;padding:24px 0!important;}

 /* Saludo */
 .uss-shell .uss-hello {display:grid!important;gap:2px!important;}
 .uss-shell .uss-hello-date {font-size:13px!important;color:var(--uss-muted)!important;}
 .uss-shell .uss-hello-title {font-size:26px!important;line-height:1.2!important;font-weight:700!important;letter-spacing:-.025em!important;}

 /* Tarjeta principal */
 .uss-shell .uss-hero {padding:20px 22px 18px!important;border:1px solid var(--uss-line)!important;border-radius:16px!important;background:var(--uss-panel)!important;min-width:0!important;}
 .uss-shell .uss-hero-head {display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;}
 .uss-shell .uss-label {font-size:14px!important;font-weight:500!important;color:var(--uss-muted)!important;}
 .uss-shell .uss-periods {display:inline-flex!important;flex:none!important;gap:2px!important;padding:3px!important;border-radius:999px!important;background:var(--uss-hover)!important;}
 .uss-shell .uss-periods button {display:grid!important;place-items:center!important;min-height:30px!important;padding:0 12px!important;border:0!important;border-radius:999px!important;background:transparent!important;color:var(--uss-muted)!important;font-size:12.5px!important;}
 .uss-shell .uss-periods button[aria-pressed="true"] {background:var(--uss-panel)!important;color:var(--uss-text)!important;font-weight:600!important;box-shadow:0 1px 2px rgba(0,0,0,.12)!important;}
 .uss-shell .uss-hero-figures {display:flex!important;flex-wrap:wrap!important;align-items:flex-end!important;gap:6px 16px!important;margin-top:4px!important;}
 .uss-shell .uss-result {display:grid!important;gap:2px!important;padding:2px 4px!important;margin:0 -4px!important;border:0!important;border-radius:8px!important;background:transparent!important;text-align:left!important;}
 .uss-shell .uss-result:hover {background:var(--uss-soft)!important;}
 .uss-shell .uss-result-value {display:block!important;font-size:40px!important;line-height:1.1!important;font-weight:700!important;letter-spacing:-.03em!important;}
 .uss-shell .uss-trend-value {display:inline-flex!important;align-items:baseline!important;gap:6px!important;margin-bottom:6px!important;padding:4px 10px!important;border-radius:999px!important;background:var(--uss-soft)!important;}
 .uss-shell .uss-trend-value strong {font-size:13px!important;}
 .uss-shell .uss-plot {position:relative!important;margin-top:18px!important;}
 .uss-shell .uss-chart-button {display:block!important;width:100%!important;height:180px!important;padding:0!important;border:0!important;border-radius:6px!important;background:transparent!important;cursor:crosshair!important;}
 .uss-shell svg.uss-chart {display:block!important;width:100%!important;height:100%!important;overflow:visible!important;}
 .uss-shell .uss-stop-top {stop-color:var(--uss-accent)!important;stop-opacity:.16!important;}
 .uss-shell .uss-stop-bottom {stop-color:var(--uss-accent)!important;stop-opacity:0!important;}
 .uss-shell .uss-area {fill:url(#uss-fill)!important;stroke:none!important;}
 .uss-shell .uss-trend {stroke:var(--uss-accent)!important;stroke-width:2.25!important;fill:none!important;}
 .uss-shell .uss-zero {stroke:var(--uss-line)!important;stroke-width:1!important;stroke-dasharray:3 4!important;}
 .uss-shell .uss-guide {stroke:var(--uss-line)!important;stroke-width:1!important;stroke-dasharray:3 3!important;}
 .uss-shell .uss-marker {position:absolute!important;width:10px!important;height:10px!important;margin:-5px 0 0 -5px!important;border:2px solid var(--uss-accent)!important;border-radius:999px!important;background:var(--uss-panel)!important;pointer-events:none!important;}
 .uss-shell .uss-chart-dates {display:flex!important;justify-content:space-between!important;gap:8px!important;margin-top:8px!important;color:var(--uss-muted)!important;font-size:11.5px!important;}
 .uss-shell .uss-chart-detail {display:flex!important;flex-wrap:wrap!important;gap:4px 14px!important;min-height:20px!important;margin-top:6px!important;font-size:12px!important;color:var(--uss-muted)!important;}
 .uss-shell .uss-chart-detail strong {font-weight:600!important;}
 .uss-shell .uss-chart-empty {min-height:150px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:10px!important;max-width:300px!important;margin:12px auto 0!important;text-align:center!important;color:var(--uss-muted)!important;font-size:12.5px!important;line-height:1.6!important;}
 .uss-shell .uss-chart-empty svg {width:24px!important;height:24px!important;opacity:.7!important;}
 .uss-shell .uss-breakdown {display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:20px!important;margin-top:16px!important;padding-top:16px!important;border-top:1px solid var(--uss-line)!important;}
 .uss-shell .uss-breakdown > div {display:grid!important;gap:4px!important;min-width:0!important;}
 .uss-shell .uss-breakdown small {font-size:12.5px!important;}
 .uss-shell .uss-breakdown strong {font-size:16px!important;font-weight:600!important;}
 .uss-shell .uss-bar {display:block!important;height:5px!important;border-radius:999px!important;background:var(--uss-hover)!important;overflow:hidden!important;}
 .uss-shell .uss-bar > span {display:block!important;height:100%!important;background:var(--uss-accent)!important;opacity:.7!important;}
 .uss-shell .uss-bar > span.uss-bar-negative {background:var(--uss-bad)!important;}

 /* Pendiente de ti */
 .uss-shell .uss-top {display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:20px!important;align-items:start!important;}
 .uss-shell .uss-top.has-todo {grid-template-columns:minmax(0,1.75fr) minmax(280px,1fr)!important;}
 .uss-shell .uss-todo {display:grid!important;gap:10px!important;min-width:0!important;}
 .uss-shell .uss-todo-head {display:flex!important;align-items:baseline!important;justify-content:space-between!important;gap:12px!important;}
 .uss-shell .uss-todo-head small {font-size:13px!important;}
 .uss-shell .uss-todo-list {display:grid!important;border:1px solid var(--uss-line)!important;border-radius:16px!important;background:var(--uss-panel)!important;overflow:hidden!important;}
 .uss-shell .uss-todo-row {display:flex!important;align-items:center!important;gap:12px!important;width:100%!important;min-height:64px!important;padding:12px 14px!important;border:0!important;border-bottom:1px solid var(--uss-line)!important;border-radius:0!important;background:transparent!important;text-align:left!important;}
 .uss-shell .uss-todo-row:last-child {border-bottom:0!important;}
 .uss-shell .uss-todo-row:hover {background:var(--uss-soft)!important;}
 .uss-shell .uss-todo-row > svg {width:16px!important;height:16px!important;color:var(--uss-muted)!important;}
 .uss-shell .uss-todo-text {display:grid!important;flex:1!important;min-width:0!important;gap:1px!important;}
 .uss-shell .uss-todo-text strong {font-size:14px!important;font-weight:600!important;overflow-wrap:normal!important;}
 .uss-shell .uss-todo-text small {font-size:12.5px!important;}
 .uss-shell .uss-count {min-width:22px!important;height:22px!important;padding:0 7px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:999px!important;background:var(--uss-tint)!important;color:var(--uss-tint-text)!important;font-size:11.5px!important;font-weight:650!important;font-variant-numeric:tabular-nums!important;}

 /* Métricas clave */
 .uss-shell .uss-tiles {display:grid!important;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))!important;gap:12px!important;}
 .uss-shell .uss-tile {display:flex!important;flex-direction:column!important;gap:3px!important;min-width:0!important;padding:16px!important;border:1px solid var(--uss-line)!important;border-radius:14px!important;background:var(--uss-panel)!important;text-align:left!important;}
 .uss-shell button.uss-tile:hover {background:var(--uss-soft)!important;}
 .uss-shell .uss-tile-top {display:flex!important;align-items:center!important;justify-content:space-between!important;color:var(--uss-muted)!important;}
 .uss-shell .uss-tile-top > svg {width:15px!important;height:15px!important;}
 .uss-shell .uss-ic {width:32px!important;height:32px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:10px!important;background:var(--uss-hover)!important;color:var(--uss-muted)!important;}
 .uss-shell .uss-ic svg {width:16px!important;height:16px!important;}
 .uss-shell .uss-tile > strong {margin-top:12px!important;font-size:24px!important;line-height:1.15!important;font-weight:700!important;letter-spacing:-.02em!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;overflow-wrap:normal!important;}
 .uss-shell .uss-tile-label {font-size:13px!important;font-weight:500!important;color:var(--uss-text)!important;}

 /* Movimientos de dinero */
 .uss-shell .uss-flow {display:grid!important;gap:10px!important;}
 .uss-shell .uss-cash {display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%!important;padding:0!important;border:1px solid var(--uss-line)!important;border-radius:14px!important;background:var(--uss-panel)!important;overflow:hidden!important;text-align:left!important;}
 .uss-shell .uss-cash:hover {background:var(--uss-soft)!important;}
 .uss-shell .uss-flow-item {display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important;padding:14px!important;border-right:1px solid var(--uss-line)!important;}
 .uss-shell .uss-flow-item:last-child {border-right:0!important;}
 .uss-shell .uss-flow-ic {width:32px!important;height:32px!important;flex:none!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:999px!important;}
 .uss-shell .uss-flow-ic svg {width:16px!important;height:16px!important;}
 .uss-shell .uss-flow-ic.in {background:var(--uss-good-bg)!important;color:var(--uss-good)!important;}
 .uss-shell .uss-flow-ic.out {background:var(--uss-hover)!important;color:var(--uss-muted)!important;}
 .uss-shell .uss-flow-ic.pend {background:var(--uss-warn-bg)!important;color:var(--uss-warn)!important;}
 .uss-shell .uss-flow-text {display:grid!important;min-width:0!important;}
 .uss-shell .uss-flow-text strong {font-size:15px!important;font-weight:600!important;white-space:nowrap!important;overflow-wrap:normal!important;}

 /* Detalle */
 :is(.uss-shell,.uss-dialog) .uss-row {display:flex!important;justify-content:space-between!important;align-items:center!important;gap:16px!important;min-height:44px!important;padding:10px 0!important;border-top:1px solid var(--uss-line)!important;font-size:13px!important;}
 :is(.uss-shell,.uss-dialog) .uss-row span {color:var(--uss-muted)!important;}
 :is(.uss-shell,.uss-dialog) .uss-row strong {text-align:right!important;}
 body.uss-dialog-open {overflow:hidden!important;}
 .uss-dialog {position:fixed!important;inset:0!important;z-index:1400!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:24px!important;background:rgba(15,15,15,.4)!important;}
 .uss-sheet {width:100%!important;max-width:480px!important;max-height:100%!important;overflow:auto!important;overscroll-behavior:contain!important;padding:16px 20px 20px!important;border:1px solid var(--uss-line)!important;border-radius:12px!important;background:var(--uss-panel)!important;box-shadow:0 8px 24px #0002!important;}
 .uss-sheet-head {display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-bottom:8px!important;}
 .uss-dialog .uss-close {display:grid!important;place-items:center!important;width:32px!important;height:32px!important;padding:0!important;border:0!important;border-radius:6px!important;background:transparent!important;color:var(--uss-muted)!important;}
 .uss-dialog .uss-close:hover {background:var(--uss-hover)!important;}
 .uss-dialog .uss-sheet-content p {font-size:13px!important;color:var(--uss-muted)!important;line-height:1.6!important;margin-bottom:12px!important;}

 /* Móvil */
 @media(max-width:700px), (max-width:1100px) and (pointer:coarse) {
  main:has(> #userSummaryView.uss-mobile:not(.is-hidden)) {padding-right:max(16px,env(safe-area-inset-right,0px))!important;padding-bottom:20px!important;padding-left:max(16px,env(safe-area-inset-left,0px))!important;background:#ffffff!important;}
  html[data-theme="dark"] main:has(> #userSummaryView.uss-mobile:not(.is-hidden)) {background:#0f1726!important;}
  .uss-shell {gap:16px!important;}
  .uss-shell .uss-hello {display:none!important;}
  .uss-shell .uss-hero {padding:16px!important;}
  .uss-shell .uss-top,.uss-shell .uss-top.has-todo {grid-template-columns:minmax(0,1fr)!important;gap:16px!important;}
  .uss-shell .uss-todo-row {min-height:60px!important;}
  .uss-shell .uss-periods button {min-height:44px!important;min-width:44px!important;padding:0 10px!important;font-size:12px!important;}
  .uss-shell .uss-result {min-height:44px!important;}
  .uss-shell .uss-result-value {font-size:32px!important;}
  .uss-shell .uss-chart-button {height:120px!important;}
  .uss-shell .uss-breakdown {gap:10px!important;}
  .uss-shell .uss-breakdown strong {font-size:14px!important;}
  .uss-shell .uss-tiles {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}
  .uss-shell .uss-tile {padding:14px!important;}
  .uss-shell .uss-tile > strong {margin-top:10px!important;font-size:20px!important;}
  .uss-shell .uss-cash {grid-template-columns:1fr!important;}
  .uss-shell .uss-flow-item {border-right:0!important;border-bottom:1px solid var(--uss-line)!important;padding:12px 14px!important;}
  .uss-shell .uss-flow-item:last-child {border-bottom:0!important;}
  .uss-shell .uss-flow-text {display:flex!important;flex:1!important;justify-content:space-between!important;align-items:center!important;gap:12px!important;}
  .uss-dialog {align-items:flex-end!important;padding:max(12px,env(safe-area-inset-top,0px)) 0 0!important;}
  .uss-sheet {max-width:520px!important;padding:12px max(18px,env(safe-area-inset-right,0px)) max(24px,env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px))!important;border-radius:20px 20px 0 0!important;box-shadow:none!important;}
  .uss-dialog .uss-close {width:44px!important;height:44px!important;min-width:44px!important;border-radius:50%!important;background:var(--uss-soft)!important;}
 }
}
