@keyframes posgoLogoGlowPulse {  0% { box-shadow: 0 0 0 rgba(34, 197, 94, 0.00), 0 0 0 rgba(255,255,255,0.00); transform: scale(1); }  50% { box-shadow: 0 0 14px rgba(34, 197, 94, 0.30), 0 0 22px rgba(255,255,255,0.20); transform: scale(1.02); }  100% { box-shadow: 0 0 0 rgba(34, 197, 94, 0.00), 0 0 0 rgba(255,255,255,0.00); transform: scale(1); }}@keyframes posgoLogoShineSweep {  0% { transform: translateX(-180%) skewX(-20deg); opacity: 0; }  20% { opacity: 0.0; }  45% { opacity: 0.85; }  70% { opacity: 0.0; }  100% { transform: translateX(220%) skewX(-20deg); opacity: 0; }}@keyframes posgoCardShineSweep {  0% { transform: translateX(-190%) skewX(-22deg); opacity: 0; }  30% { opacity: 0.0; }  55% { opacity: 0.75; }  100% { transform: translateX(230%) skewX(-22deg); opacity: 0; }}@keyframes smgModuleFloatIn {  0% { opacity: 0; transform: translateY(14px) scale(0.985); }  100% { opacity: 1; transform: translateY(0) scale(1); }}@keyframes smgInnerSweep {  0% { transform: translateX(-190%) skewX(-20deg); opacity: 0; }  40% { opacity: 0; }  58% { opacity: 0.58; }  72% { opacity: 0; }  100% { transform: translateX(230%) skewX(-20deg); opacity: 0; }}@keyframes smgBrandShimmer {  0% { background-position: 0% 50%; }  50% { background-position: 100% 50%; }  100% { background-position: 0% 50%; }}@keyframes smgBrandGlowPulse {  0%, 100% { filter: drop-shadow(0 1px 0 rgba(255,255,255,0.88)) drop-shadow(0 4px 10px rgba(10,132,74,0.38)) drop-shadow(0 0 18px rgba(116,255,185,0.40)) drop-shadow(0 0 30px rgba(52,255,148,0.24)); }  50% { filter: drop-shadow(0 1px 0 rgba(255,255,255,0.96)) drop-shadow(0 8px 16px rgba(10,132,74,0.52)) drop-shadow(0 0 28px rgba(126,255,196,0.56)) drop-shadow(0 0 42px rgba(60,255,154,0.36)); }}@keyframes posgoModuleRelease3d {  0% { transform: perspective(900px) rotateX(8deg) rotateY(-9deg) scale(0.985); }  100% { transform: perspective(900px) rotateX(0deg) rotateY(0deg) scale(1); }}.posgo-loading-logo-glow {  position: relative;  overflow: hidden;  isolation: isolate;  animation: posgoLogoGlowPulse 1.45s ease-in-out infinite;}.posgo-loading-logo-glow::after {  content: '';  position: absolute;  top: -30%;  left: -45%;  width: 55%;  height: 160%;  background: linear-gradient(90deg, rgba(255,255,255,0.0), rgba(255,255,255,0.65), rgba(255,255,255,0.0));  mix-blend-mode: screen;  pointer-events: none;  animation: posgoLogoShineSweep 2.2s ease-in-out infinite;}.posgo-module-card {  position: relative;  overflow: hidden;  isolation: isolate;  transform-style: preserve-3d;  transform: perspective(900px) rotateX(0deg) rotateY(0deg) scale(1);  transition: transform 0.30s cubic-bezier(0.22, 0.9, 0.25, 1), box-shadow 0.30s ease, border-color 0.25s ease;  will-change: transform;}.posgo-module-card.posgo-module-press3d {  transform: perspective(900px) rotateX(5deg) rotateY(-6deg) scale(0.992);  box-shadow: 0 10px 24px rgba(0,0,0,0.30), 0 2px 8px rgba(34,197,94,0.18);}.posgo-module-card.posgo-module-release3d {  animation: posgoModuleRelease3d 340ms cubic-bezier(0.2, 0.75, 0.2, 1) 1;}.posgo-module-card .q-icon {  transition: transform 0.25s ease, filter 0.25s ease;  transform-style: preserve-3d;  backface-visibility: hidden;  transform-origin: 50% 50%;}.posgo-module-card:hover .q-icon {  transform: translateY(-1px) scale(1.05);  filter: brightness(1.06);}.posgo-module-card::after {  content: '';  position: absolute;  top: -40%;  left: -50%;  width: 50%;  height: 180%;  background: linear-gradient(90deg, rgba(255,255,255,0.0), rgba(255,255,255,0.62), rgba(255,255,255,0.0));  mix-blend-mode: screen;  pointer-events: none;  opacity: 0;}.posgo-module-card:hover::after {  animation: posgoCardShineSweep 0.8s ease-out 1;}.smg-module-grid {  gap: 22px;  align-items: stretch;  justify-content: center;  width: 100%;  margin: 0 auto;}.smg-module-item {  width: 146px;  display: flex;  flex-direction: column;  align-items: center;  gap: 8px;  text-align: center;  opacity: 0;  animation: smgModuleFloatIn 480ms ease-out forwards;}.smg-module-grid > .smg-module-item:nth-child(1) { animation-delay: 40ms; }.smg-module-grid > .smg-module-item:nth-child(2) { animation-delay: 90ms; }.smg-module-grid > .smg-module-item:nth-child(3) { animation-delay: 140ms; }.smg-module-grid > .smg-module-item:nth-child(4) { animation-delay: 190ms; }.smg-module-grid > .smg-module-item:nth-child(5) { animation-delay: 240ms; }.smg-module-grid > .smg-module-item:nth-child(6) { animation-delay: 290ms; }.smg-module-grid > .smg-module-item:nth-child(7) { animation-delay: 340ms; }.smg-module-grid > .smg-module-item:nth-child(8) { animation-delay: 390ms; }.smg-module-grid > .smg-module-item:nth-child(9) { animation-delay: 440ms; }.smg-module-grid > .smg-module-item:nth-child(10) { animation-delay: 490ms; }.smg-module-grid > .smg-module-item:nth-child(11) { animation-delay: 540ms; }.smg-module-grid > .smg-module-item:nth-child(12) { animation-delay: 590ms; }.smg-module-card {  --smg-color-base: var(--smg-module-color);  --smg-color-soft: color-mix(in srgb, var(--smg-color-base) 52%, #d9fbff 48%);  --smg-color-deep: color-mix(in srgb, var(--smg-color-base) 62%, #11405b 38%);  --smg-color-glow: color-mix(in srgb, var(--smg-color-base) 64%, #ffffff 36%);  width: 128px;  height: 128px;  min-height: 128px;  border-radius: 999px;  border: 1px solid color-mix(in srgb, var(--smg-color-soft) 56%, #ffffff 44%);  background: radial-gradient(120% 120% at 30% 18%, rgba(255,255,255,0.56), rgba(255,255,255,0.14) 28%, rgba(255,255,255,0) 42%), linear-gradient(180deg, color-mix(in srgb, var(--smg-color-soft) 84%, #ffffff 16%), color-mix(in srgb, var(--smg-color-base) 74%, #b8fff4 26%) 58%, var(--smg-color-deep));  box-shadow: 0 18px 34px rgba(0,20,40,0.30), 0 0 0 1px rgba(255,255,255,0.10), inset 0 1px 0 rgba(255,255,255,0.40), 0 0 28px color-mix(in srgb, var(--smg-color-glow) 30%, transparent);  padding: 10px;  display: flex;  flex-direction: column;  align-items: center;  justify-content: center;  text-align: center;  overflow: hidden;  transform-style: preserve-3d;  backdrop-filter: blur(5px);}.smg-module-card::before {  content: '';  position: absolute;  inset: 0;  border-radius: inherit;  background: radial-gradient(90% 72% at 24% 12%, rgba(255,255,255,0.54), rgba(255,255,255,0.18) 34%, rgba(255,255,255,0.0) 60%);  pointer-events: none;}.smg-module-card::after {  content: '';  position: absolute;  left: 20px;  right: 20px;  bottom: 14px;  height: 24px;  border-radius: 999px;  background: radial-gradient(60% 130% at 50% 8%, rgba(255,255,255,0.34), rgba(255,255,255,0.0));  opacity: 0.92;  pointer-events: none;}.smg-module-card:hover {  border-color: rgba(255,255,255,0.76);  box-shadow: 0 24px 42px rgba(0,18,36,0.36), 0 0 32px color-mix(in srgb, var(--smg-color-glow) 40%, transparent), inset 0 1px 0 rgba(255,255,255,0.38);}@keyframes smgModuleFloat {  0% { transform: translateY(0) scale(1); }  50% { transform: translateY(-7px) scale(1.015); }  100% { transform: translateY(0) scale(1); }}@keyframes smgModuleBlob {  0%, 100% { border-radius: 42% 58% 65% 35% / 45% 40% 60% 55%; }  33% { border-radius: 60% 40% 38% 62% / 55% 65% 35% 45%; }  66% { border-radius: 35% 65% 55% 45% / 65% 40% 60% 35%; }}.smg-module-card {  animation: smgModuleFloat 5.6s ease-in-out infinite, smgModuleBlob 9s ease-in-out infinite;}.smg-module-grid > .smg-module-item:nth-child(4n+2) .smg-module-card {  animation-duration: 6.4s, 9.6s;  animation-delay: 0.6s, 1.2s;}.smg-module-grid > .smg-module-item:nth-child(4n+3) .smg-module-card {  animation-duration: 5.1s, 8.4s;  animation-delay: 1.1s, 2.4s;}.smg-module-grid > .smg-module-item:nth-child(4n+4) .smg-module-card {  animation-duration: 6.9s, 10.2s;  animation-delay: 0.3s, 3.6s;}.smg-module-card:hover {  animation-play-state: paused;}.smg-module-inner {  width: 100%;  min-height: 100%;  border-radius: 999px;  display: flex;  align-items: center;  justify-content: center;  background: radial-gradient(80% 80% at 30% 24%, rgba(255,255,255,0.42), rgba(255,255,255,0.10) 28%, rgba(255,255,255,0) 48%), linear-gradient(180deg, rgba(229,250,255,0.30), rgba(15,58,84,0.08) 44%, rgba(7,28,44,0.18));  border: 1px solid rgba(197,240,255,0.44);  box-shadow: inset 0 1px 0 rgba(255,255,255,0.30), inset 0 -12px 22px rgba(2,24,40,0.14);  margin-bottom: 0;  position: relative;  overflow: hidden;}.smg-module-inner::after {  content: '';  position: absolute;  top: -30%;  left: -45%;  width: 52%;  height: 160%;  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.62), rgba(255,255,255,0));  mix-blend-mode: screen;  pointer-events: none;  animation: smgInnerSweep 10.8s ease-in-out infinite;}.smg-module-card:hover .smg-module-inner::after {  animation-duration: 2.4s;}.smg-module-icon-wrap {  width: 72px;  height: 72px;  border-radius: 999px;  display: inline-flex;  align-items: center;  justify-content: center;  background: radial-gradient(90% 90% at 28% 18%, rgba(255,255,255,0.62), rgba(255,255,255,0.18) 30%, rgba(255,255,255,0.0) 46%), linear-gradient(180deg, color-mix(in srgb, var(--smg-color-soft) 78%, #ffffff 22%), color-mix(in srgb, var(--smg-color-base) 84%, #ffffff 16%) 58%, var(--smg-color-deep));  border: 1px solid rgba(230,251,255,0.78);  box-shadow: inset 0 1px 0 rgba(255,255,255,0.54), 0 12px 20px rgba(0,26,45,0.24), 0 0 20px color-mix(in srgb, var(--smg-color-glow) 36%, transparent);  backdrop-filter: blur(5px);}.smg-module-icon-wrap .q-icon {  font-size: 2.25rem;  color: rgba(255,255,255,0.98);  filter: drop-shadow(0 2px 4px rgba(0,34,58,0.30));}.smg-module-icon3d {  width: 58px;  height: 58px;  object-fit: contain;  filter: drop-shadow(0 4px 8px rgba(0, 26, 45, 0.28));  transform: translateZ(6px);}.smg-icon-chip {  width: 38px;  height: 38px;  border-radius: 12px;  display: inline-flex;  align-items: center;  justify-content: center;  background: linear-gradient(180deg, rgba(255,255,255,0.46), rgba(114,214,255,0.22) 42%, rgba(19,83,104,0.28));  border: 1px solid rgba(230,251,255,0.56);  box-shadow: inset 0 1px 0 rgba(255,255,255,0.36), 0 8px 16px rgba(0,25,40,0.20);  backdrop-filter: blur(4px);}.smg-icon-chip .q-icon {  font-size: 20px;  color: rgba(255,255,255,0.98);  filter: drop-shadow(0 1px 2px rgba(0,22,40,0.24));}.smg-module-label {  color: rgba(240,252,255,0.98);  font-size: 0.82rem;  line-height: 1.15rem;  font-weight: 700;  text-align: center;  text-wrap: balance;  text-shadow: 0 1px 3px rgba(0,24,40,0.46);  min-height: 2rem;  margin-top: 0;}.posgo-grid-header-box, .posgo-grid-cell-box {  padding: 6px 8px;  min-height: 44px;  display: flex;  align-items: center;  justify-content: center;  text-align: center;}.posgo-grid-input .q-field__control {  min-height: 44px !important;}.posgo-grid-input .q-field__control:before,.posgo-grid-input .q-field__control:after {  display: none !important;}.posgo-grid-input input, .posgo-grid-input .q-field__native, .posgo-grid-input .q-field__input {  text-align: center !important;}.posgo-grid-truncate {  white-space: nowrap;  overflow: hidden;  text-overflow: ellipsis;}.posgo-tabs-box .q-tabs__content {  gap: 14px;  align-items: center;  justify-content: center;}.posgo-tabs-box .q-tab {  position: relative;  overflow: hidden;  isolation: isolate;  min-height: 56px;  min-width: 190px;  border: 1px solid rgba(180, 233, 255, 0.66);  border-radius: 999px;  background: linear-gradient(180deg, rgba(215,247,255,0.36) 0%, rgba(138,221,249,0.20) 48%, rgba(91,193,236,0.22) 100%);  padding: 0 22px;  backdrop-filter: blur(8px) saturate(1.1);  box-shadow: inset 0 1px 0 rgba(255,255,255,0.72), inset 0 -10px 18px rgba(13,120,174,0.22), 0 10px 26px rgba(9,95,139,0.20);  transition: transform .16s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;  text-transform: uppercase;  letter-spacing: 0.03em;  color: rgba(17,91,124,0.90);}.posgo-tabs-box .q-tab::before {  content: '';  position: absolute;  left: 8%;  right: 8%;  top: 8%;  height: 46%;  border-radius: 999px;  background: linear-gradient(180deg, rgba(255,255,255,0.82), rgba(255,255,255,0.12));  pointer-events: none;  z-index: 0;}.posgo-tabs-box .q-tab::after {  content: '';  position: absolute;  inset: 2px;  border-radius: 999px;  border: 1px solid rgba(129,215,255,0.48);  pointer-events: none;  z-index: 0;}.posgo-tabs-box .q-tab:hover {  transform: translateY(-1px);  border-color: rgba(224,247,255,0.92);  box-shadow: inset 0 1px 0 rgba(255,255,255,0.82), inset 0 -11px 20px rgba(9,120,179,0.24), 0 14px 28px rgba(10,114,163,0.24);}.posgo-tabs-box .q-tab--active {  border-color: rgba(188,241,255,0.98);  background: linear-gradient(180deg, rgba(205,244,255,0.54) 0%, rgba(71,186,236,0.38) 55%, rgba(23,113,208,0.42) 100%);  color: rgba(10,77,132,0.98);  box-shadow: inset 0 1px 0 rgba(255,255,255,0.94), inset 0 -14px 22px rgba(12,86,202,0.30), 0 0 0 1px rgba(148,226,255,0.48), 0 16px 34px rgba(14,99,167,0.34), 0 0 24px rgba(97,211,255,0.42);}.posgo-tabs-box .q-tab__label {  position: relative;  z-index: 1;  font-weight: 800;  font-size: 0.95rem;  text-shadow: 0 1px 0 rgba(255,255,255,0.68);}.posgo-tabs-box .q-tab__indicator {  display: none;}@keyframes smgMacDialogIn {  0% { opacity: 0; transform: translateY(16px) scale(0.93); }  70% { opacity: 1; transform: translateY(-2px) scale(1.015); }  100% { opacity: 1; transform: translateY(0) scale(1); }}.smg-w7-popup .q-dialog__backdrop {  background: radial-gradient(circle at 50% 20%, rgba(178,235,255,0.20), rgba(7,14,24,0.78));  backdrop-filter: blur(2px);}.smg-w7-popup .q-card {  position: relative;  overflow: hidden;  border-radius: 14px;  border: 1px solid rgba(214,243,255,0.80);  background-image: linear-gradient(170deg, rgba(238,248,255,0.985), rgba(219,238,252,0.985) 60%, rgba(203,228,247,0.985) 100%);  box-shadow: 0 20px 42px rgba(5,27,62,0.45), inset 0 1px 0 rgba(255,255,255,0.80);  backdrop-filter: blur(8px) saturate(1.12);  animation: smgMacDialogIn .24s cubic-bezier(0.18, 0.86, 0.22, 1) 1;  max-height: calc(100vh - 56px);  overflow-y: auto;  overflow-x: hidden;  font-size: 0.98rem;  color: #0d2a45;}.smg-w7-popup .q-card .text-gray-200,.smg-w7-popup .q-card .text-gray-300,.smg-w7-popup .q-card .text-gray-400,.smg-w7-popup .q-card .text-slate-200,.smg-w7-popup .q-card .text-slate-300,.smg-w7-popup .q-card .text-slate-400 {  color: #475569 !important;}.smg-w7-popup .bg-gray-900 .text-gray-300,.smg-w7-popup .bg-gray-900 .text-gray-400 {  color: #9ca3af !important;}.smg-w7-popup .bg-gray-900 .text-white {  color: #ffffff !important;}.smg-w7-popup .bg-black\/60 .text-white {  color: #ffffff !important;}.smg-w7-popup .text-lg, .smg-w7-popup .text-xl, .smg-w7-popup .font-semibold {  font-family: 'Trebuchet MS', 'Segoe UI', sans-serif;  color: #0a2540 !important;  font-weight: 800 !important;  letter-spacing: 0.01em;  text-shadow: 0 1px 0 rgba(255,255,255,0.55);}.smg-w7-popup .q-field__control {  border-radius: 8px !important;  border: 1px solid rgba(111,146,140,0.82) !important;  background: linear-gradient(180deg, rgba(255,255,255,0.86), rgba(214,236,252,0.68)) !important;  box-shadow: inset 0 1px 0 rgba(255,255,255,0.85), 0 2px 6px rgba(20,60,90,0.16);  min-height: 42px !important;  padding-left: 4px !important;}.smg-w7-popup .q-field__control:before, .smg-w7-popup .q-field__control:after {  border: none !important;  box-shadow: none !important;}.smg-w7-popup .q-field__control-container {  padding-left: 10px !important;}.smg-w7-popup .q-field__native, .smg-w7-popup .q-field__input, .smg-w7-popup input, .smg-w7-popup textarea {  color: #0d2a45 !important;  font-weight: 600 !important;  padding-left: 2px !important;}.smg-w7-popup .q-field__label {  color: #2c6690 !important;  padding-left: 2px !important;  font-weight: 600 !important;}.smg-w7-popup .q-checkbox__inner { color: rgba(37,142,214,0.92) !important; }.smg-w7-popup .q-checkbox__label { color: #0d2a45 !important; }.smg-w7-popup .q-separator {  border-color: rgba(169,221,244,0.64) !important;  box-shadow: 0 1px 0 rgba(255,255,255,0.52), 0 0 8px rgba(169,221,244,0.16);}.q-menu.q-dark, .q-menu {  background: linear-gradient(180deg, rgba(240,250,255,0.98), rgba(210,235,252,0.96)) !important;  color: #0d2a45 !important;  border: 1px solid rgba(255,255,255,0.85) !important;  box-shadow: 0 16px 34px rgba(10,50,80,0.30), inset 0 1px 0 rgba(255,255,255,0.85) !important;}.q-menu .q-item {  color: #0d2a45 !important;}.q-menu .q-item.q-manual-focusable--focused > .q-focus-helper,.q-menu .q-item--active,.q-menu .q-item:hover {  background: rgba(61,220,132,0.20) !important;  color: #0a5f2f !important;}.smg-w7-popup .q-card::-webkit-scrollbar {  width: 11px;}.smg-w7-popup .q-card::-webkit-scrollbar-track {  background: rgba(20,70,100,0.14);  border-radius: 999px;}.smg-w7-popup .q-card::-webkit-scrollbar-thumb {  background: linear-gradient(180deg, #bfe6fb, #4fa8d8);  border-radius: 999px;  box-shadow: 0 0 8px rgba(120,210,255,0.65), inset 0 1px 0 rgba(255,255,255,0.65);}.smg-w7-popup .q-card::-webkit-scrollbar-thumb:hover {  background: linear-gradient(180deg, #d6f1ff, #6fbdee);}@layer theme {.posgo-icon-btn {  width: 40px !important;  height: 40px !important;  min-width: 40px !important;  min-height: 40px !important;  border-radius: 999px !important;  padding: 0 !important;  border: 1px solid rgba(255,255,255,0.88) !important;  box-shadow: inset 0 1px 0 rgba(255,255,255,0.86), 0 6px 12px rgba(0,0,0,0.28) !important;}.posgo-icon-btn .q-icon { font-size: 1.25rem !important; color: #ffffff !important; }.posgo-icon-btn:hover { transform: translateY(-1px) scale(1.05); }.posgo-icon-btn-danger {  background: radial-gradient(circle at 32% 26%, rgba(255,255,255,0.96), rgba(255,185,185,0.75) 28%, rgba(225,67,67,0.94) 66%, rgba(141,24,24,0.98) 100%) !important;}.posgo-icon-btn-success {  background: radial-gradient(circle at 32% 26%, rgba(255,255,255,0.96), rgba(190,245,190,0.80) 28%, rgba(50,180,90,0.96) 66%, rgba(15,110,45,0.98) 100%) !important;}.posgo-icon-btn-neutral {  background: radial-gradient(circle at 32% 26%, rgba(255,255,255,0.96), rgba(210,230,245,0.80) 28%, rgba(120,160,190,0.90) 66%, rgba(50,80,105,0.96) 100%) !important;}.posgo-icon-btn-info {  background: radial-gradient(circle at 32% 26%, rgba(255,255,255,0.98), rgba(175,220,255,0.85) 26%, rgba(45,140,235,0.96) 62%, rgba(10,70,150,0.98) 100%) !important;  box-shadow: inset 0 1px 0 rgba(255,255,255,0.86), 0 0 0 rgba(70,160,255,0), 0 6px 14px rgba(10,70,150,0.35) !important;  animation: posgoBackGlowPulse 2.6s ease-in-out infinite;}.posgo-icon-btn-info .q-icon { font-size: 1.5rem !important; font-weight: 900 !important; }@keyframes posgoBackGlowPulse {  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,0.86), 0 0 0 rgba(70,160,255,0.0), 0 6px 14px rgba(10,70,150,0.35); }  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,0.86), 0 0 14px rgba(90,175,255,0.65), 0 6px 18px rgba(10,70,150,0.45); }}}/* === POSGO DESIGN SYSTEM v2 === */:root {  --p-surface-1: rgba(10, 28, 39, 0.72);  --p-surface-2: rgba(13, 43, 58, 0.56);  --p-border: rgba(153, 214, 235, 0.16);  --p-border-md: rgba(174, 225, 242, 0.28);  --p-text-1: #eaf8ff;  --p-text-2: #9dc9db;  --p-text-3: #6f98a8;  --p-accent: #42b7d8;  --p-danger: #f87171;  --p-warning: #fbbf24;}@keyframes smgSeaDrift {  0% { transform: translateX(0); }  50% { transform: translateX(-18px); }  100% { transform: translateX(0); }}@keyframes smgBubbleLift {  0% { transform: translateY(160px) translateX(-8px) scale(0.96); opacity: 0.16; }  35% { opacity: 0.42; }  70% { opacity: 0.28; }  100% { transform: translateY(-260px) translateX(34px) scale(1.05); opacity: 0.12; }}@keyframes smgFishDrift {  0% { transform: translateX(0); opacity: 0.16; }  50% { transform: translateX(22px); opacity: 0.26; }  100% { transform: translateX(0); opacity: 0.16; }}@keyframes smgFishDriftAlt {  0% { transform: translateX(0) translateY(0); opacity: 0.11; }  50% { transform: translateX(-18px) translateY(-4px); opacity: 0.2; }  100% { transform: translateX(0) translateY(0); opacity: 0.11; }}@keyframes smgBubbleLayerA {  0% { transform: translate3d(0, 0, 0) scale(0.98); }  50% { transform: translate3d(-4%, -14%, 0) scale(1.03); }  100% { transform: translate3d(3%, -30%, 0) scale(1.06); }}@keyframes smgBubbleLayerB {  0% { transform: translate3d(0, 0, 0) scale(1); }  50% { transform: translate3d(5%, -16%, 0) scale(0.97); }  100% { transform: translate3d(-3%, -32%, 0) scale(1.02); }}@keyframes smgBubbleCollision {  0% { transform: translate3d(-8%, 12%, 0) scale(0.94); opacity: 0.22; }  46% { transform: translate3d(0, -4%, 0) scale(1.02); opacity: 0.34; }  52% { transform: translate3d(1%, -7%, 0) scale(1.12); opacity: 0.46; }  58% { transform: translate3d(-2%, -10%, 0) scale(1.01); opacity: 0.32; }  100% { transform: translate3d(8%, -28%, 0) scale(0.98); opacity: 0.20; }}@keyframes smgDepthShift {  0% { transform: translateY(0) scale(1); opacity: 0.56; }  50% { transform: translateY(-10px) scale(1.02); opacity: 0.70; }  100% { transform: translateY(0) scale(1); opacity: 0.56; }}@keyframes smgCausticSweep {  0% { background-position: 0% 0%, center, center, center, center bottom, center bottom; }  100% { background-position: 100% 0%, center, center, center, center bottom, center bottom; }}@keyframes smgAquaPulse {  0% { opacity: 0.90; transform: scale(1); }  50% { opacity: 1; transform: scale(1.01); }  100% { opacity: 0.90; transform: scale(1); }}.smg-ocean-bubbles {  position: fixed;  inset: -18% -12% -12% -12%;  pointer-events: none;  z-index: 0;  overflow: hidden;  -webkit-mask-image: radial-gradient(140% 120% at 50% 55%, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.88) 22%, rgba(0,0,0,0.96) 70%, rgba(0,0,0,0.0) 100%);  mask-image: radial-gradient(140% 120% at 50% 55%, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.88) 22%, rgba(0,0,0,0.96) 70%, rgba(0,0,0,0.0) 100%);}.smg-bubble-layer {  position: absolute;  inset: 0;  mix-blend-mode: screen;  pointer-events: none;}.smg-bubble-layer-a {  opacity: 0.55;  filter: drop-shadow(0 5px 8px rgba(8,60,42,0.20));  background: radial-gradient(circle at 8% 88%, rgba(255,255,255,0.92) 0, rgba(255,255,255,0.40) 12px, rgba(226,251,255,0.30) 26px, rgba(226,251,255,0.42) 32px, rgba(20,110,85,0.20) 38px, rgba(255,255,255,0) 40px),              radial-gradient(circle at 24% 74%, rgba(255,255,255,0.90) 0, rgba(255,255,255,0.36) 14px, rgba(226,251,255,0.28) 31px, rgba(226,251,255,0.38) 38px, rgba(20,110,85,0.19) 44px, rgba(255,255,255,0) 48px),              radial-gradient(circle at 45% 92%, rgba(255,255,255,0.92) 0, rgba(255,255,255,0.38) 11px, rgba(226,251,255,0.28) 24px, rgba(226,251,255,0.36) 30px, rgba(20,110,85,0.19) 36px, rgba(255,255,255,0) 38px),              radial-gradient(circle at 64% 72%, rgba(255,255,255,0.88) 0, rgba(255,255,255,0.34) 15px, rgba(226,251,255,0.26) 34px, rgba(226,251,255,0.35) 42px, rgba(20,110,85,0.18) 48px, rgba(255,255,255,0) 52px),              radial-gradient(circle at 86% 86%, rgba(255,255,255,0.90) 0, rgba(255,255,255,0.36) 14px, rgba(226,251,255,0.28) 30px, rgba(226,251,255,0.40) 37px, rgba(20,110,85,0.19) 43px, rgba(255,255,255,0) 46px);  animation: smgBubbleLayerA 30s ease-in-out infinite alternate;}.smg-bubble-layer-b {  opacity: 0.48;  filter: drop-shadow(0 5px 8px rgba(8,60,42,0.18));  background: radial-gradient(circle at 14% 70%, rgba(255,255,255,0.90) 0, rgba(255,255,255,0.34) 11px, rgba(230,249,255,0.26) 24px, rgba(230,249,255,0.36) 31px, rgba(20,110,85,0.18) 37px, rgba(255,255,255,0) 40px),              radial-gradient(circle at 34% 94%, rgba(255,255,255,0.92) 0, rgba(255,255,255,0.38) 17px, rgba(230,249,255,0.30) 37px, rgba(230,249,255,0.42) 45px, rgba(20,110,85,0.20) 51px, rgba(255,255,255,0) 56px),              radial-gradient(circle at 56% 82%, rgba(255,255,255,0.88) 0, rgba(255,255,255,0.33) 12px, rgba(230,249,255,0.24) 26px, rgba(230,249,255,0.34) 34px, rgba(20,110,85,0.17) 40px, rgba(255,255,255,0) 43px),              radial-gradient(circle at 76% 66%, rgba(255,255,255,0.90) 0, rgba(255,255,255,0.35) 13px, rgba(230,249,255,0.26) 28px, rgba(230,249,255,0.37) 36px, rgba(20,110,85,0.18) 42px, rgba(255,255,255,0) 46px),              radial-gradient(circle at 92% 90%, rgba(255,255,255,0.88) 0, rgba(255,255,255,0.33) 11px, rgba(230,249,255,0.24) 25px, rgba(230,249,255,0.34) 32px, rgba(20,110,85,0.17) 38px, rgba(255,255,255,0) 42px);  animation: smgBubbleLayerB 34s ease-in-out infinite alternate;}.smg-bubble-layer-c {  opacity: 0.46;  filter: drop-shadow(0 6px 10px rgba(8,60,42,0.20));  background: radial-gradient(circle at 24% 84%, rgba(255,255,255,0.90) 0, rgba(255,255,255,0.36) 22px, rgba(236,253,255,0.28) 48px, rgba(236,253,255,0.40) 58px, rgba(20,110,85,0.19) 64px, rgba(255,255,255,0) 72px),              radial-gradient(circle at 72% 26%, rgba(255,255,255,0.90) 0, rgba(255,255,255,0.35) 19px, rgba(236,253,255,0.27) 42px, rgba(236,253,255,0.37) 51px, rgba(20,110,85,0.18) 57px, rgba(255,255,255,0) 64px),              radial-gradient(circle at 62% 88%, rgba(255,255,255,0.88) 0, rgba(255,255,255,0.33) 18px, rgba(236,253,255,0.25) 40px, rgba(236,253,255,0.34) 49px, rgba(20,110,85,0.17) 55px, rgba(255,255,255,0) 62px);  animation: smgBubbleCollision 16s ease-in-out infinite alternate;}.smg-bubble-layer-d {  opacity: 0.40;  filter: drop-shadow(0 6px 10px rgba(8,60,42,0.18));  background: radial-gradient(circle at 12% 94%, rgba(255,255,255,0.88) 0, rgba(255,255,255,0.33) 26px, rgba(238,253,255,0.26) 58px, rgba(238,253,255,0.36) 70px, rgba(20,110,85,0.17) 76px, rgba(255,255,255,0) 88px),              radial-gradient(circle at 52% 98%, rgba(255,255,255,0.86) 0, rgba(255,255,255,0.30) 30px, rgba(238,253,255,0.22) 66px, rgba(238,253,255,0.32) 80px, rgba(20,110,85,0.16) 86px, rgba(255,255,255,0) 98px),              radial-gradient(circle at 86% 90%, rgba(255,255,255,0.88) 0, rgba(255,255,255,0.32) 24px, rgba(238,253,255,0.24) 54px, rgba(238,253,255,0.34) 66px, rgba(20,110,85,0.17) 72px, rgba(255,255,255,0) 84px);  animation: smgBubbleLayerA 42s ease-in-out infinite alternate;}body {  background-image: linear-gradient(180deg, rgba(184,246,255,0.55) 0%, rgba(140,236,251,0.45) 24%, rgba(105,222,245,0.40) 44%, rgba(82,208,226,0.42) 60%, rgba(103,215,196,0.45) 72%, rgba(99,209,109,0.50) 86%, rgba(58,165,79,0.55) 100%), url("/assets/fondo_mar_aero.jpg") !important;  background-size: auto, cover !important;  background-position: center, center 55% !important;  background-repeat: no-repeat, no-repeat !important;  background-attachment: fixed, fixed !important;}body::before {  content: '';  position: fixed;  inset: 0;  pointer-events: none;  background: radial-gradient(120% 88% at 50% -26%, rgba(227,255,255,0.56), rgba(227,255,255,0) 58%),              radial-gradient(85% 46% at 50% 18%, rgba(180,246,255,0.30), rgba(180,246,255,0) 70%),              linear-gradient(180deg, rgba(224,254,255,0.20), rgba(224,254,255,0) 40%),              linear-gradient(180deg, rgba(114,214,178,0.04) 30%, rgba(86,218,230,0.26) 50%, rgba(69,201,158,0.18) 68%, rgba(48,162,92,0.30) 100%);  background-size: cover, cover, cover;  background-repeat: no-repeat, no-repeat, no-repeat;  background-position: center top, center top, center top;  z-index: 0;}body::after {  content: '';  position: fixed;  inset: -10% -8% -8% -8%;  pointer-events: none;  background: radial-gradient(190% 86% at 24% 102%, rgba(255,255,255,0.16), rgba(255,255,255,0) 62%),              radial-gradient(170% 78% at 82% 104%, rgba(230,255,247,0.14), rgba(255,255,255,0) 62%),              radial-gradient(140% 90% at 50% 110%, rgba(39,161,196,0.28), rgba(39,161,196,0.0) 58%),              linear-gradient(180deg, rgba(122,236,255,0.20) 0%, rgba(92,222,237,0.30) 38%, rgba(88,212,160,0.18) 68%, rgba(45,145,82,0.34) 100%),              url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='260' viewBox='0 0 1400 260'%3E%3Cpath d='M0 214 C 120 174, 220 250, 340 214 C 460 178, 560 252, 680 214 C 800 178, 900 252, 1020 214 C 1140 178, 1240 252, 1360 214 C 1380 208, 1390 210, 1400 214 L 1400 260 L 0 260 Z' fill='rgba(27,114,107,0.56)'/%3E%3Cpath d='M0 236 C 90 210, 180 252, 280 236 C 380 220, 470 254, 570 236 C 670 220, 760 254, 860 236 C 960 220, 1050 254, 1150 236 C 1240 222, 1320 246, 1400 236 L 1400 260 L 0 260 Z' fill='rgba(18,87,90,0.58)'/%3E%3C/svg%3E"),              url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='220' viewBox='0 0 1400 220'%3E%3Cpath d='M0 188 C 56 162, 98 196, 152 176 C 204 158, 252 198, 304 176 C 358 154, 410 198, 464 176 C 516 156, 564 198, 616 176 C 670 154, 722 198, 776 176 C 828 156, 876 198, 930 176 C 982 156, 1032 198, 1086 176 C 1138 156, 1186 198, 1240 176 C 1292 158, 1340 194, 1400 176 L 1400 220 L 0 220 Z' fill='rgba(20,95,92,0.52)'/%3E%3C/svg%3E");  background-size: cover, cover, cover, cover, 1400px 260px, 1400px 220px;  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat-x, repeat-x;  background-position: center, center, center, center, center bottom, center bottom;  animation: smgDepthShift 14s ease-in-out infinite, smgCausticSweep 24s linear infinite, smgAquaPulse 8s ease-in-out infinite;  z-index: 0;}@media (prefers-reduced-motion: reduce) {  .smg-module-item, .smg-module-card, .smg-module-inner::after, .posgo-module-card, body::before, body::after {    animation: none !important;    transition: none !important;  }}#c, .q-layout, .q-page-container, .q-page { position: relative; z-index: 1; }.posgo-brand-title {  display:inline-block;  position:relative;  font-family:'Trebuchet MS', 'Segoe UI', sans-serif;  font-size:clamp(2.4rem, 5vw, 4.4rem);  font-weight:900;  font-style:italic;  letter-spacing:-0.045em;  line-height:1;  transform: skewX(-10deg);  transform-origin:center;  color:transparent;  background:linear-gradient(180deg, #ffffff 0%, #e6ffef 14%, #9dffbb 34%, #3bff86 56%, #12e05c 80%, #0a923a 100%);  background-size:200% 200%;  -webkit-background-clip:text;  background-clip:text;  -webkit-text-fill-color:transparent;  -webkit-text-stroke:1.3px rgba(9,120,60,0.95);  text-shadow:0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(8,90,43,0.35), 0 0 10px rgba(160,255,190,0.75), 0 0 22px rgba(70,255,150,0.70), 0 0 42px rgba(30,240,110,0.55), 0 0 72px rgba(20,214,88,0.42);  animation: smgBrandShimmer 5.5s linear infinite, smgBrandGlowPulse 2.6s ease-in-out infinite;}.posgo-brand-title::after {  content:'';  position:absolute;  inset:12% -3% 58% -3%;  border-radius:999px;  background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(160,255,203,0.72), rgba(255,255,255,0.0));  opacity:0.72;  filter:blur(4px);  pointer-events:none;}.posgo-brand-title::before {  content:'';  position:absolute;  inset:0;  border-radius:999px;  background:radial-gradient(120% 100% at 30% 20%, rgba(255,255,255,0.38), rgba(109,255,173,0.20), rgba(255,255,255,0) 54%);  mix-blend-mode:screen;  pointer-events:none;}.posgo-h1 { font-size:1.4rem; font-weight:800; letter-spacing:-0.02em; line-height:1.3; color:transparent; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; background-image:linear-gradient(180deg, #ffffff 0%, #bfffd6 40%, #2df179 75%, #0f9c41 100%); -webkit-text-stroke:0.5px rgba(10,110,55,0.70); animation: posgoH1GreenPulse 3.2s ease-in-out infinite; }@keyframes posgoTitleGlowPulse {  0%, 100% { text-shadow: 0 1px 0 rgba(255,255,255,0.7), 0 0 10px rgba(72,190,255,0.30), 0 0 20px rgba(72,190,255,0.14); }  50% { text-shadow: 0 1px 0 rgba(255,255,255,0.85), 0 0 16px rgba(72,190,255,0.58), 0 0 30px rgba(72,190,255,0.32), 0 0 46px rgba(120,220,255,0.20); }}.posgo-h2 { font-size:1rem; font-weight:600; color:#2f6780; }.posgo-h3 { font-size:0.75rem; font-weight:700; color:#4d7e94; text-transform:uppercase; letter-spacing:0.06em; }.posgo-meta { font-size:0.75rem; color:#5d8ea3; line-height:1.4; }.posgo-muted { font-size:0.75rem; color:#6d98ab; }.posgo-nav { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid var(--p-border-md); margin-bottom:20px; width:100%; }.posgo-nav-left { display:flex; align-items:center; gap:10px; min-width:0; }.posgo-nav-inline-title { display:flex; align-items:baseline; gap:8px; min-width:0; }.posgo-nav-inline-title .posgo-h1 { margin:0; font-size:2rem; line-height:1; }.posgo-nav-inline-title .posgo-meta { margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.posgo-page-header { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding-bottom:14px; border-bottom:1px solid var(--p-border-md); margin-bottom:20px; width:100%; flex-wrap:wrap; }.posgo-card { position:relative; overflow:hidden; background:linear-gradient(170deg, rgba(255,255,255,0.48), rgba(238,251,255,0.30)); border:1px solid rgba(255,255,255,0.68); border-radius:14px; padding:16px; box-shadow: 0 10px 24px rgba(18,89,112,0.16), inset 0 1px 0 rgba(255,255,255,0.70); backdrop-filter: blur(7px); }.posgo-card::before { content:''; position:absolute; left:10px; right:10px; top:1px; height:36%; border-radius:12px; background:linear-gradient(180deg, rgba(255,255,255,0.58), rgba(255,255,255,0.08)); pointer-events:none; }.posgo-section { background:linear-gradient(170deg, rgba(255,255,255,0.36), rgba(233,249,255,0.24)); border:1px solid rgba(255,255,255,0.58); border-radius:14px; padding:14px 16px; width:100%; box-shadow: 0 10px 24px rgba(16,82,104,0.14), inset 0 1px 0 rgba(255,255,255,0.62); backdrop-filter: blur(6px); }.posgo-list-row { display:flex; align-items:center; gap:12px; padding:10px 14px; border-bottom:1px solid rgba(179,236,247,0.12); transition:background 0.1s ease; }.posgo-list-row:last-child { border-bottom:none; }.posgo-list-row:hover { background:rgba(128,220,235,0.08); border-radius:8px; }.posgo-stat-card { background:linear-gradient(165deg, rgba(15,61,81,0.74), rgba(9,35,49,0.66)); border:1px solid rgba(179,236,247,0.14); border-radius:12px; padding:16px 20px; min-width:160px; box-shadow: 0 12px 26px rgba(2,11,18,0.22); }.posgo-stat-value { font-size:2rem; font-weight:700; color:var(--p-text-1); line-height:1.1; }.posgo-stat-label { font-size:0.75rem; color:var(--p-text-2); margin-top:4px; }.posgo-badge { display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font-size:0.7rem; font-weight:600; letter-spacing:0.03em; white-space:nowrap; border:1px solid transparent; }.posgo-badge-ok { color:#5fe0c3; background:rgba(58,193,157,0.14); border-color:rgba(96,229,192,0.30); }.posgo-badge-warn { color:#f59e0b; background:rgba(245,158,11,0.1); border-color:rgba(245,158,11,0.25); }.posgo-badge-danger { color:#ef4444; background:rgba(239,68,68,0.1); border-color:rgba(239,68,68,0.25); }.posgo-badge-neutral { color:#86b6c8; background:rgba(100,154,179,0.14); border-color:rgba(131,191,214,0.24); }.posgo-badge-info { color:#60a5fa; background:rgba(96,165,250,0.1); border-color:rgba(96,165,250,0.25); }.posgo-divider { width:100%; border:none; border-top:1px solid var(--p-border); margin:14px 0; }.posgo-toolbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; width:100%; }.posgo-filter-strip { position:relative; overflow:hidden; display:flex; align-items:center; gap:10px; flex-wrap:wrap; width:100%; padding:10px 12px; border:1px solid rgba(255,255,255,0.62); border-radius:16px; background:linear-gradient(180deg, rgba(255,255,255,0.38), rgba(236,249,255,0.24)); box-shadow: 0 8px 20px rgba(21,96,121,0.14), inset 0 1px 0 rgba(255,255,255,0.74); backdrop-filter: blur(7px); }.posgo-filter-strip::before { content:''; position:absolute; left:8px; right:8px; top:1px; height:48%; border-radius:13px; background:linear-gradient(180deg, rgba(255,255,255,0.62), rgba(255,255,255,0.10)); pointer-events:none; }.posgo-table-shell { position:relative; overflow:hidden; width:100%; border:1px solid rgba(255,255,255,0.66); border-radius:18px; background:linear-gradient(180deg, rgba(255,255,255,0.40), rgba(232,248,255,0.24)); box-shadow: 0 14px 30px rgba(21,94,117,0.16), inset 0 1px 0 rgba(255,255,255,0.76); backdrop-filter: blur(7px); }.posgo-table-shell::before { content:''; position:absolute; left:10px; right:10px; top:1px; height:26%; border-radius:14px; background:linear-gradient(180deg, rgba(255,255,255,0.56), rgba(255,255,255,0.08)); pointer-events:none; }.posgo-table-titlebar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-bottom:1px solid rgba(255,255,255,0.62); background:linear-gradient(180deg, rgba(255,255,255,0.40), rgba(233,249,255,0.20)); }.posgo-table-titlebar .posgo-h3 { margin:0; }.posgo-btn-primary, .posgo-btn-secondary, .posgo-btn-subtle, .posgo-btn-danger { border-radius:12px !important; min-height:42px !important; padding:0 14px !important; font-weight:700 !important; letter-spacing:0.01em; text-transform:none !important; box-shadow:none !important; }.posgo-btn-primary { background:linear-gradient(180deg, #54e28f, #22b66a) !important; color:#08311f !important; border:1px solid rgba(190,255,217,0.46) !important; box-shadow:0 10px 20px rgba(9,77,46,0.24), inset 0 1px 0 rgba(255,255,255,0.22) !important; }.posgo-btn-primary:hover { filter:brightness(1.04); transform:translateY(-1px); }.posgo-btn-secondary { background:linear-gradient(180deg, rgba(237,254,255,0.98), rgba(198,245,249,0.92)) !important; color:#0a4f56 !important; border:1px solid rgba(197,244,250,0.56) !important; box-shadow:0 10px 18px rgba(11,76,84,0.14), inset 0 1px 0 rgba(255,255,255,0.40) !important; }.posgo-btn-secondary:hover { filter:brightness(1.03); transform:translateY(-1px); }.posgo-btn-subtle { background:rgba(255,255,255,0.32) !important; color:#225b70 !important; border:1px solid rgba(255,255,255,0.58) !important; box-shadow: 0 8px 16px rgba(17,84,106,0.14), inset 0 1px 0 rgba(255,255,255,0.60) !important; }.posgo-btn-subtle:hover { background:rgba(128,220,235,0.10) !important; }.posgo-btn-danger { background:linear-gradient(180deg, rgba(255,123,123,0.96), rgba(235,75,75,0.92)) !important; color:#320808 !important; border:1px solid rgba(255,205,205,0.34) !important; box-shadow:0 10px 18px rgba(84,11,11,0.18), inset 0 1px 0 rgba(255,255,255,0.16) !important; }.posgo-btn-danger:hover { filter:brightness(1.03); transform:translateY(-1px); }.posgo-btn-primary .q-focus-helper, .posgo-btn-secondary .q-focus-helper, .posgo-btn-subtle .q-focus-helper, .posgo-btn-danger .q-focus-helper { opacity:0 !important; }/* separadores verticales de columnas */.posgo-table thead tr th:not(:last-child), .posgo-table tbody tr td:not(:last-child) { border-right:1px solid rgba(255,255,255,0.58)!important; }/* grilla de pedidos con tokens del sistema */.posgo-grid-header-box { background:linear-gradient(180deg, rgba(255,255,255,0.54), rgba(230,248,255,0.30))!important; border:1px solid rgba(255,255,255,0.66)!important; border-radius:12px!important; color:#2c6279; text-transform:uppercase; font-size:0.68rem; letter-spacing:0.05em; font-weight:700; box-shadow: inset 0 1px 0 rgba(255,255,255,0.76); }.posgo-grid-cell-box { background:linear-gradient(180deg, rgba(255,255,255,0.42), rgba(230,247,255,0.24))!important; border:1px solid rgba(255,255,255,0.62)!important; border-radius:11px!important; color:#2e657c; box-shadow: inset 0 1px 0 rgba(255,255,255,0.66); }.posgo-grid-input .q-field__control, .posgo-filter-strip .q-field__control, .posgo-filter-strip .q-select .q-field__control, .posgo-filter-strip .q-input .q-field__control { border-color:rgba(255,255,255,0.62)!important; border-radius:11px!important; background:linear-gradient(180deg, rgba(255,255,255,0.46), rgba(239,252,255,0.28))!important; color:#275f76!important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.75)!important; }.posgo-grid-input .q-field__native, .posgo-grid-input .q-field__input, .posgo-filter-strip .q-field__native, .posgo-filter-strip .q-field__input { color:#2a6178!important; font-weight:600; }.posgo-filter-strip .q-field__label { color:#5b8ba0!important; }/* --- tablas Quasar con tema POSGO --- */.posgo-table { background:linear-gradient(180deg, rgba(255,255,255,0.52), rgba(233,249,255,0.30))!important; border:1px solid rgba(255,255,255,0.70); border-radius:14px; box-shadow: 0 12px 26px rgba(21,94,117,0.14), inset 0 1px 0 rgba(255,255,255,0.82); }.posgo-table .q-table__container, .posgo-table .q-table__middle, .posgo-table .q-table, .posgo-table .q-table__card, .posgo-table .q-virtual-scroll__content { background:transparent!important; }.posgo-table table { border-collapse:separate !important; border-spacing:0 6px !important; }.posgo-table thead tr th { background:linear-gradient(180deg, rgba(173,235,191,0.62), rgba(221,249,231,0.36))!important; color:#2d6b45!important; text-transform:uppercase; font-size:0.74rem!important; font-weight:800!important; letter-spacing:0.06em; border-bottom:1px solid rgba(146,214,168,0.92)!important; text-shadow:0 1px 0 rgba(255,255,255,0.62); box-shadow:inset 0 -1px 0 rgba(124,194,148,0.44); }.posgo-table tbody td { border-top:1px solid rgba(255,255,255,0.62)!important; border-bottom:1px solid rgba(255,255,255,0.62)!important; color:#123a5c!important; font-size:0.82rem; background:linear-gradient(180deg, rgba(255,255,255,0.40), rgba(233,247,255,0.24))!important; }.posgo-table tbody tr td:first-child { border-left:1px solid rgba(255,255,255,0.60)!important; border-top-left-radius:11px; border-bottom-left-radius:11px; }.posgo-table tbody tr td:last-child { border-right:1px solid rgba(255,255,255,0.60)!important; border-top-right-radius:11px; border-bottom-right-radius:11px; }.posgo-table tbody tr:nth-child(even) td { background:rgba(243,252,255,0.32)!important; }.posgo-table tbody tr:hover td { background:rgba(255,255,255,0.52)!important; }.posgo-table .q-table__bottom { border-top:1px solid rgba(255,255,255,0.60); color:#346a82; font-size:0.72rem; }.posgo-table .q-table__top { padding:6px 12px; }.posgo-expansion-box.q-expansion-item {  border: 1px solid rgba(255,255,255,0.62) !important;  border-radius: 12px !important;  overflow: hidden;  margin-bottom: 8px;}.posgo-expansion-box.q-expansion-item .q-item {  background: linear-gradient(180deg, rgba(255,255,255,0.54), rgba(230,248,255,0.30)) !important;  color: #2c6279 !important;  font-weight: 700;}.posgo-expansion-box.q-expansion-item .q-item .q-icon {  color: #2c6279 !important;}.posgo-expansion-box .q-expansion-item__content {  background: linear-gradient(180deg, rgba(255,255,255,0.30), rgba(230,248,255,0.16));  padding: 10px;}.q-tabs, .q-tabs__content, .q-tab-panels, .q-panel, .q-tab-panel { background:transparent!important; }.q-tab-panels { border-radius:16px; }.q-tab { color:#3f738a!important; font-weight:700; border:1px solid rgba(255,255,255,0.52); border-radius:12px; background:linear-gradient(180deg, rgba(255,255,255,0.34), rgba(236,249,255,0.22)); margin:0 6px; min-height:40px; padding:0 14px; box-shadow: 0 6px 14px rgba(27,100,123,0.10), inset 0 1px 0 rgba(255,255,255,0.74); }.q-tab--active { color:#1d5f7b!important; border-color:rgba(255,255,255,0.72)!important; background:linear-gradient(180deg, rgba(255,255,255,0.56), rgba(235,250,255,0.30))!important; box-shadow: 0 8px 16px rgba(25,96,119,0.14), inset 0 1px 0 rgba(255,255,255,0.82); }.q-tab__indicator { height:0 !important; }.text-gray-500 { color:#5a879a !important; }@keyframes posgoH1GreenPulse { 0%,100% { text-shadow: 0 0 8px rgba(70,255,150,0.45), 0 0 20px rgba(30,240,110,0.28); } 50% { text-shadow: 0 0 14px rgba(120,255,175,0.85), 0 0 30px rgba(45,241,121,0.5); } }.posgo-brand-hero { position: relative; }.posgo-brand-hero::before { content:''; position:absolute; left:50%; top:40%; transform:translate(-50%,-50%); width:min(720px,94%); height:170%; border-radius:50%; background:radial-gradient(ellipse 55% 58% at 50% 45%, rgba(3,38,46,0.30), rgba(3,38,46,0.12) 55%, rgba(3,38,46,0) 74%); filter:blur(8px); pointer-events:none; z-index:0; }.posgo-brand-hero > * { position: relative; z-index: 1; }
/* Paneles de tabs que contienen un dropdown absolute (buscador con autocompletado).
   Quasar pone overflow:hidden en .q-tab-panels y overflow:auto en .q-panel: recortan
   el dropdown contra la altura del panel -- mismo gotcha que .posgo-filter-strip.
   Aplicar la clase al ui.tab_panels cuando alguna seccion tenga sugerencias flotantes. */
.posgo-tabs-panels.q-tab-panels,
.posgo-tabs-panels .q-panel,
.posgo-tabs-panels .q-tab-panel { overflow: visible !important; }
/* ---------------------------------------------------------------------------
   MODO LIVIANO (body.posgo-liviano) -- para PCs con grafica integrada.
   Saca SOLO el movimiento (flotar, onduleo, brillos pulsantes). El diseno no
   se toca: vidrio, degradados, sombras y colores quedan iguales.

   Por que alcanza con eso: un backdrop-filter QUIETO es casi gratis -- el
   compositor calcula el desenfoque una vez y cachea la textura. Se vuelve caro
   cuando algo se mueve DETRAS, porque hay que rehacerlo en cada cuadro. El
   fondo del oceano (smgDepthShift/smgCausticSweep/smgAquaPulse en body::after)
   estaba obligando a los 16 elementos de vidrio a re-desenfocar a 60fps. Al
   frenar el movimiento, el vidrio se paga una sola vez.
   Medido en el i3-1005G1 de Benja: 33 animaciones infinitas corriendo con el
   menu QUIETO. --------------------------------------------------------- */
/* 'animation: none' apaga las animaciones DE VERDAD: el elemento se queda en su
   estado base y no se mueve nunca mas. (Intento previo: iteration-count:1 +
   duration:0.01s -- las frenaba pero las hacia SALTAR de 0% a 100% en 10ms, o
   sea un POP visible en cada carga de pagina. Reportado por Benja.)
   El body va listado aparte porque 'body.posgo-liviano *' matchea los
   DESCENDIENTES, no el body -- y el onduleo del fondo (smgDepthShift /
   smgCausticSweep / smgAquaPulse) vive en body::after, a pantalla completa. */
body.posgo-liviano,
body.posgo-liviano::before,
body.posgo-liviano::after,
body.posgo-liviano *,
body.posgo-liviano *::before,
body.posgo-liviano *::after {
  animation: none !important;
}
/* UNICA excepcion, y es obligatoria: .smg-module-item nace en 'opacity: 0' y era
   smgModuleFloatIn (480ms, forwards) la que la traia a 1 -- sin esta linea el
   MENU QUEDA VACIO. Es la unica regla del theme con opacity:0 + animation
   (verificado sobre el CSS entero); el resto no depende de su animacion para
   ser visible. */
body.posgo-liviano .smg-module-item { opacity: 1 !important; }
/* backdrop-filter, sombras, degradados y colores NO se tocan a proposito: el
   diseno queda identico, solo deja de moverse. Las transiciones tampoco se
   tocan -- son de hover (puntuales, las dispara el usuario), no un costo
   permanente como los bucles. */.smg-agente-item .smg-module-card{transition:box-shadow .18s ease}.smg-agente-ok .smg-module-card{box-shadow:0 0 0 2px rgba(90,220,140,.85),0 6px 18px rgba(8,40,70,.28)}.smg-agente-error .smg-module-card{box-shadow:0 0 0 2px rgba(226,80,64,.95),0 6px 18px rgba(8,40,70,.28)}.smg-agente-off .smg-module-card{filter:grayscale(1) opacity(.5);box-shadow:0 4px 12px rgba(8,40,70,.18)}.smg-agente-off .smg-module-label{opacity:.6}@media (max-width:900px){.smg-paneles{flex-direction:column;align-items:stretch}.smg-panel-agente,.smg-panel-modulos{width:100%}}/*agente-paneles*/.smg-paneles{display:flex;gap:16px;align-items:flex-start;width:100%}.smg-panel{background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,.16));border:1px solid rgba(255,255,255,.72);border-radius:16px;padding:14px 12px 16px;box-shadow:0 8px 26px rgba(10,50,80,.22),inset 0 1px 0 rgba(255,255,255,.85);backdrop-filter:blur(6px)}.smg-panel-modulos{flex:2 1 420px}.smg-panel-agente{flex:1 1 240px}.smg-panel-titulo{font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:#0d3f60;font-weight:700;opacity:.85;margin-bottom:8px;text-align:center}body.posgo-liviano .smg-panel{backdrop-filter:none}
/* ===========================================================================
   MOVIL (<=640px) -- pantalla de celu. TODO vive DENTRO del @media: en el PC
   (ancho >640px) nada de esto aplica, asi que la vista de escritorio queda
   INTACTA. (El intento anterior de un bloque movil se revirtio por reglas que
   se colaban al PC; aca la unica forma de que eso pase seria escribir fuera del
   media query.) La app en el celu es sobre todo para CONSULTAR y REACCIONAR
   -- que se lea y se toque comodo; los flujos de carga pesada siguen mejor en PC.
   =========================================================================== */
@media (max-width:640px){
  /* -------------------------------------------------------------------------
     RENDIMIENTO EN CELU (arregla el "popping" + crash al tocar un input).
     Sintoma (Benja, 2026-07-19): apenas toca un campo para escribir, la
     interfaz hace popping y se crashea. Causa: NO es un bug de JS (Playwright
     headless no tira error) -- es la GPU del telefono. Al abrir el teclado, el
     viewport cambia de alto y OBLIGA a repintar en un solo cuadro las capas
     caras: decenas de paneles con `backdrop-filter` (blur en vivo) + el fondo
     `background-attachment:fixed` + las capas fijas decorativas del oceano. En
     la GPU debil de un celu eso satura y tira la pestana.

     El KILLER real es el backdrop-filter (blur recalculado en cada cuadro): eso
     apagamos. El diseno de vidrio se mantiene -- cada panel ya tiene su fondo
     semiopaco, solo pierde el blur EN VIVO (se ve casi igual, deja de matar la GPU).

     OJO -- lo que NO se hace y por que: la 1a version puso `*{animation:none}`
     (matar todo el movimiento, como el modo liviano). ERROR: hay contenido que
     nace en `opacity:0` y una animacion de fade-in lo revela (ej. la columna del
     login, `.nicegui-column`); al matar su animacion queda CONGELADO invisible y
     el login mostraba SOLO EL FONDO (reportado por Benja). Por eso NO tocamos las
     animaciones: sin backdrop-filter detras, el movimiento restante ya es barato
     (ver el comentario de body.posgo-liviano: el blur quieto es casi gratis; lo
     caro es mover algo DETRAS del blur -- y aca ya no hay blur).
     Ver [[gotcha_nicegui_quasar]] ("backdrop-filter").
     ------------------------------------------------------------------------- */
  *,*::before,*::after{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  body{background-attachment:scroll!important}            /* fixed repinta en cada scroll/resize: carisimo en movil */
  .smg-ocean-bubbles{display:none!important}              /* capa fija decorativa y desenfocada: puro costo GPU */
  body::before,body::after{display:none!important}        /* overlays fijos del fondo: fuera en celu */

  /* OPACIDAD: como apagamos el backdrop-filter (blur en vivo), el vidrio queda
     translucido y el fondo del mar se transparenta detras -> se lee mal (Benja:
     "esta transparente"). En el celu subimos la opacidad de las superficies para
     que se lean solido. IMPORTANTE: estas superficies son CLARAS, asi que el
     texto va OSCURO (color heredado #123a5c); si una etiqueta quedo en blanco por
     el dark_mode (ej. nombres del carrito/visor), sobre el fondo opaco-claro no se
     veria -> este color heredado la arregla (los colores explicitos -verde del
     precio, etc.- ganan igual). NO se toca .smg-panel (el home ya se ve bien y sus
     labels blancos van sobre las esferas). */
  .posgo-card,.posgo-section,.posgo-filter-strip,.posgo-table-shell,
  .smg-visor-item,.smg-tabla-cards tbody tr{
    background:linear-gradient(180deg,rgba(255,255,255,.93),rgba(234,247,255,.9))!important;
    color:#123a5c;
  }
  .posgo-grid-input .q-field__control,.q-field__control,
  .posgo-filter-strip .q-field__control{
    background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(239,252,255,.92))!important;
  }
  .posgo-stat-card{background:linear-gradient(165deg,rgba(15,61,81,.95),rgba(9,35,49,.92))!important;}
  /* TEXTO de inputs OSCURO en el celu: las superficies ya son claras/opacas, y un
     campo SIN .posgo-grid-input (ej. campo_fecha en Caducidad/Gastos/Ventas) queda
     con texto BLANCO por el dark_mode -> ilegible. Esto lo arregla en toda la app. */
  .q-field__native,.q-field__input,.q-field__control input,.q-field__control textarea{color:#123a5c!important}
  .q-field__label{color:#2c6690!important}
  /* Filas de lista con varias columnas (Caducidad "revisar hoy"/"ya cargados",
     etc.): que ENVUELVAN en el celu en vez de espachurrarse. */
  .posgo-list-row{flex-wrap:wrap}

  /* Grilla de lotes de Caducidad (_grilla_lotes): 8 columnas. En el celu cada
     linea se apila como tarjeta -- header oculto, campos a full width con su label
     (que en el PC va oculto, ver la regla min-width abajo). */
  .smg-lote-head{display:none!important}
  .smg-lote-row{flex-direction:column!important;align-items:stretch!important;
    border:1px solid rgba(255,255,255,.6);border-radius:12px;
    background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(234,247,255,.85))!important;
    color:#123a5c;padding:8px 10px;margin-bottom:8px;gap:6px!important}
  .smg-lote-row>*{width:100%!important;max-width:100%!important}

  /* Nada debe generar scroll horizontal. */
  html,body{overflow-x:hidden;max-width:100%}
  /* Margenes de la pagina + respeto por el notch/gesto (safe-area). q-page trae
     16px por defecto; lo bajamos y sumamos los insets del dispositivo. */
  .q-page{padding-left:max(10px,env(safe-area-inset-left))!important;
          padding-right:max(10px,env(safe-area-inset-right))!important}
  .q-page-container{padding-bottom:env(safe-area-inset-bottom)}
  .max-w-7xl,.max-w-6xl,.max-w-5xl,.max-w-4xl,.max-w-3xl{max-width:100%!important}
  /* Inputs a >=16px: abajo de eso, iOS hace zoom automatico al enfocar (molesto
     salto de la vista). Solo en celu, no toca el denso de la grilla del PC. */
  .q-field__native,.q-field__input,.q-field__control input,textarea{font-size:16px!important}

  /* Titulo de marca: el clamp del PC arranca en 2.4rem y "SuperMagaly Gestion"
     en italica se sale; lo bajamos para el celu. */
  .posgo-brand-title{font-size:clamp(1.4rem,7vw,2.3rem)!important}
  .posgo-h1{font-size:1.15rem!important}
  .posgo-nav-inline-title .posgo-h1{font-size:1.4rem!important}

  /* Esferas de modulos/agente: DOS por fila. flex 50% (no un width fijo): el
     panel apilado mide ~280px y dos items de 150px no entraban -> caia a 1 por
     fila. Con 50% siempre son 2 columnas simetricas y la esfera (104px) se
     centra dentro de cada media-columna. */
  .smg-module-grid{gap:14px 8px;width:100%}
  .smg-module-item{flex:0 0 calc(50% - 6px);width:auto;max-width:none}
  .smg-module-card{width:104px;height:104px;min-height:104px}
  .smg-module-icon-wrap{width:58px;height:58px}
  .smg-module-icon-wrap .q-icon{font-size:1.8rem}
  .smg-module-icon3d{width:46px;height:46px}
  .smg-module-label{font-size:.76rem}
  .smg-paneles{gap:12px}

  /* Pestanas pill: el min-width 190px del PC no entra en un celu. En vez de
     apretarlas hasta truncar el texto (SESIO/DETAL/POR C...), las dejamos con
     su ancho natural y que la fila SCROLLEE a lo ancho -- el texto queda entero
     y se navega deslizando. flex:0 0 auto evita que Quasar las encoja. */
  .posgo-tabs-box .q-tabs__content{overflow-x:auto;overflow-y:hidden;justify-content:flex-start;
                                   scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .posgo-tabs-box .q-tabs__content::-webkit-scrollbar{display:none}
  .posgo-tabs-box .q-tab{flex:0 0 auto;min-width:auto;padding:0 16px;font-size:.82rem;min-height:46px}
  .posgo-tabs-box .q-tab__label{font-size:.82rem}
  /* Tambien las tabs simples (.q-tab base) que se usan sin la caja pill. */
  .q-tabs .q-tabs__content{overflow-x:auto}

  /* Tablas: que scrolleen a lo ancho DENTRO de su marco, no que empujen la
     pagina; y un poco mas compactas para que entre mas en la pantalla. (Esto
     aplica a las tablas que NO se convierten en tarjetas: las editables.) */
  .posgo-table-shell,.posgo-table{overflow-x:auto}
  .posgo-table thead tr th{font-size:.68rem!important;padding:6px 8px}
  .posgo-table tbody td{font-size:.76rem;padding:6px 8px}
  .posgo-table .q-table__top,.posgo-table .q-table__bottom{padding:6px 8px}

  /* Tablas de SOLO LECTURA -> tarjetas apiladas. El JS (theme.js) le pone la
     clase .smg-tabla-cards y a cada celda su data-label (nombre de la columna);
     aca cada fila pasa a ser una tarjeta con "ETIQUETA .......... valor". Asi una
     tabla de 4-5 columnas entra comoda en el celu sin scroll lateral. */
  .smg-tabla-cards{overflow-x:visible!important}
  .smg-tabla-cards thead{display:none}
  .smg-tabla-cards table{border-spacing:0 8px!important}
  .smg-tabla-cards tbody tr{
    display:block;border:1px solid rgba(255,255,255,.62)!important;border-radius:12px;
    background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(233,247,255,.3))!important;
    padding:2px 10px;margin-bottom:8px;box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
  }
  /* Cada celda en BLOQUE: etiqueta chica arriba, valor abajo. Se eligio bloque y
     no flex lado-a-lado porque el ::before + el nodo de texto del td de Quasar se
     solapaban (el flex no los ponia en fila de forma confiable). Bloque = 0 riesgo. */
  .smg-tabla-cards tbody tr td{
    display:block!important;width:auto!important;text-align:left!important;
    border:none!important;border-radius:0!important;
    border-bottom:1px solid rgba(179,236,247,.30)!important;
    padding:7px 2px!important;background:transparent!important;white-space:normal!important;
    font-size:.9rem;font-weight:600;color:#123a5c!important;line-height:1.25;
  }
  .smg-tabla-cards tbody tr td:last-child{border-bottom:none!important}
  .smg-tabla-cards tbody tr td::before{
    content:attr(data-label);display:block;margin-bottom:1px;
    font-weight:700;color:#2c6279;text-transform:uppercase;font-size:.6rem;letter-spacing:.04em;
  }
  /* valor vacio: guion en vez de nada */
  .smg-tabla-cards tbody tr td:not(:has(*)):empty::after{content:'—';color:#9fbecb;font-weight:500}

  /* Dialogos casi a pantalla completa: el chico del PC deja mucho aire muerto. */
  .smg-w7-popup .q-card{width:96vw!important;max-width:96vw!important;
                        max-height:calc(100vh - 24px)!important}
  .smg-w7-popup .q-dialog__inner{padding:8px!important}

  /* Header de pagina y toolbars: apilar comodo (ya son flex-wrap). */
  .posgo-page-header{gap:8px}
  .posgo-section,.posgo-card{padding:12px}
  /* Filas de resultado / listas: mas alto de toque. */
  .posgo-list-row{padding:12px 12px}

  /* Visor de productos: en el celu es maestro-detalle de UNA columna. Se ve la
     lista; al tocar un producto se abre el detalle (JS agrega la clase
     .smg-visor-detalle-abierto) y se oculta la lista, con un boton "volver". */
  .smg-visor-lista{flex:1 1 100%;max-height:none;overflow-y:visible}
  .smg-visor-detalle{flex:1 1 100%}
  .smg-visor-volver{display:inline-flex!important}
  .smg-visor-layout:not(.smg-visor-detalle-abierto) .smg-visor-detalle{display:none}
  .smg-visor-detalle-abierto .smg-visor-lista{display:none}

  /* Hacer pedido: en el celu se oculta el split de dos paneles y se muestra el
     carrito de una columna. La clase 'hidden' (Tailwind) sigue mandando para el
     toggle menu<->editor, por eso el :not(.hidden). */
  .smg-solo-desktop{display:none!important}
  .smg-solo-movil:not(.hidden){display:block!important}
}

/* === Visor de productos (maestro-detalle) — base/desktop. Scopeado a
   .smg-visor-*, no afecta nada mas; en PC lista y detalle van lado a lado. === */
.smg-visor-layout{width:100%}
.smg-visor-lista{flex:1 1 320px;min-width:0;max-height:72vh;overflow-y:auto;padding-right:4px}
.smg-visor-detalle{flex:1.5 1 380px;min-width:0}
.smg-visor-foto{width:100%;max-width:340px;max-height:340px;object-fit:contain;border-radius:14px;background:rgba(255,255,255,.55);padding:6px}
.smg-visor-item{padding:8px 10px;border-radius:10px;border:1px solid transparent;transition:background .1s ease}
.smg-visor-item:hover{background:rgba(128,220,235,.14);border-color:rgba(255,255,255,.5)}
.smg-visor-dato{padding:7px 2px;border-bottom:1px solid rgba(179,236,247,.18)}
.smg-visor-dato:last-child{border-bottom:none}
.smg-visor-volver{display:none}

/* Alternar vista desktop/movil (usado en Hacer pedido: split en PC, carrito en
   celu). En PC solo se ve .smg-solo-desktop; el .smg-solo-movil se oculta. */
.smg-solo-movil{display:none!important}

/* Caducidad grilla de lotes: en el PC el header (fila de titulos) da las etiquetas,
   asi que los labels de los campos van OCULTOS (compacto, como siempre). En el celu
   (max-width:640) esta regla no aplica -> los labels SI se ven y guian el apilado. */
@media (min-width:641px){ .smg-lote-row .q-field__label{display:none} }

/* ============ spec 005: chrome global ============ */
/* Titulo de modulo centrado, grande y brillante (Frutiger, ADN de la marca) */
.posgo-page-hero { width:100%; display:flex; flex-direction:column; align-items:center; gap:10px; margin:2px 0 18px; }
.posgo-h1-hero { font-size:clamp(1.9rem,4vw,2.9rem); font-weight:800; letter-spacing:-0.03em; line-height:1.08; text-align:center; color:transparent; background-image:linear-gradient(180deg,#ffffff 8%,#d9fbe7 42%,#2fbf6b 76%,#0f7d39 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; -webkit-text-stroke:0.8px rgba(10,110,55,0.62); filter:drop-shadow(0 2px 1px rgba(255,255,255,0.75)) drop-shadow(0 5px 14px rgba(15,125,57,0.32)); }
.posgo-hero-shine { display:block; height:3px; width:150px; margin:0 auto; border-radius:3px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.95),transparent); }
/* Chip de usuario (Home): unico lugar del logout. SIN backdrop-filter a proposito
   (gotcha: backdrop-filter crea containing block y rompe el menu position:fixed) */
.posgo-userchip { display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,0.55); border:1px solid rgba(255,255,255,0.8); border-radius:999px; padding:5px 13px 5px 6px; cursor:pointer; box-shadow:0 5px 16px rgba(18,90,120,0.16); }
.posgo-userchip-ava { width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:0.8rem; background:radial-gradient(circle at 30% 25%, #43d97e, #0f7d39); }
.posgo-userchip-nm { font-size:0.82rem; font-weight:700; color:#0a2540; }
/* Dias de la semana como burbujas (Promociones, spec 005 FR-006) */
.posgo-daychip { width:36px; height:36px; min-width:36px; border-radius:50% !important; font-weight:800; background:rgba(255,255,255,0.55) !important; border:1px solid rgba(255,255,255,0.8) !important; color:#3d6070 !important; }
.posgo-daychip-on { background:linear-gradient(180deg,#18b355,#0f7d39) !important; color:#fff !important; border-color:rgba(255,255,255,0.9) !important; box-shadow:0 3px 8px rgba(18,160,74,0.35) !important; }
/* ============ componentes glass compartidos (spec 004/005; antes inyectados solo en Inventario) ============ */
.smg-kcard{ background:rgba(255,255,255,0.52)!important; color:#0a2540!important; backdrop-filter:blur(14px) saturate(1.15); -webkit-backdrop-filter:blur(14px) saturate(1.15); border:1px solid rgba(255,255,255,0.65)!important; border-radius:14px!important; box-shadow:0 5px 16px rgba(18,90,120,0.14)!important; padding:12px!important; }
.smg-kgroup-title{color:#0a2540; font-weight:800; font-size:.85rem; letter-spacing:.2px; background:rgba(255,255,255,0.45); border:1px solid rgba(255,255,255,0.6); border-radius:999px; padding:4px 14px; display:inline-block; backdrop-filter:blur(8px);}
.smg-kbar{background:rgba(255,255,255,0.34); border:1px solid rgba(255,255,255,0.55); border-radius:14px; padding:10px 12px; backdrop-filter:blur(10px) saturate(1.1); -webkit-backdrop-filter:blur(10px) saturate(1.1); box-shadow:0 4px 14px rgba(18,90,120,0.12);}
.smg-kfield > .q-field__inner > .q-field__control, .smg-kfield .q-field__control{background:#fff!important; border-radius:11px!important; box-shadow:inset 0 1px 3px rgba(18,90,120,0.08)!important; padding:0 12px!important;}
.smg-kfield .q-field__control:before,.smg-kfield .q-field__control:after{display:none!important;}
.smg-kfield .q-field__native,.smg-kfield input,.smg-kfield .q-field__prefix{color:#0a2540!important;}
.smg-kfield .q-field__label{color:#6b8a97!important;}
.smg-kfield .q-field__marginal,.smg-kfield .q-icon{color:#6b8a97!important;}
.smg-vista{display:inline-flex; background:rgba(255,255,255,0.4); border:1px solid rgba(255,255,255,0.65); border-radius:999px; padding:3px; gap:2px;}
.smg-vista .q-btn{border-radius:999px!important; min-height:32px; padding:0 15px!important; box-shadow:none!important; font-weight:700; color:#3d6070!important;}
.smg-vista .q-btn.smg-on{background:#fff!important; color:#0a2540!important; box-shadow:0 2px 7px rgba(18,90,120,0.2)!important;}
.smg-btn-soft{background:linear-gradient(180deg, rgba(236,255,244,0.96), rgba(198,236,216,0.86))!important; color:#0f7d39!important; border:1px solid rgba(75,189,122,0.6)!important; border-radius:11px!important; box-shadow:inset 0 1px 0 rgba(255,255,255,0.9), 0 3px 8px rgba(18,160,74,0.18)!important; font-weight:700;}
.smg-btn-soft .q-icon{color:#0f7d39!important;}
.smg-klabel{color:#0a2540!important; font-weight:600;}
.smg-kcard.hot{outline:2px solid rgba(75,189,122,0.6); outline-offset:-2px; box-shadow:0 12px 30px rgba(18,90,120,0.28)!important;}
.smg-kcard.editada{border-left:3px solid #eab308!important;}
.smg-kcard, .smg-kcard .q-field__native, .smg-kcard input, .smg-kcard .q-field__label, .smg-kcard .q-select__dropdown-icon{color:#0a2540!important;}
.smg-kcard .text-gray-400{color:#6b8a97!important;}
.smg-kcard .q-field__control{background:#fff!important; border-radius:10px!important; box-shadow:inset 0 1px 3px rgba(18,90,120,0.08)!important; min-height:36px;}
.smg-kcard .q-field__control:before,.smg-kcard .q-field__control:after{border:0!important;}
.smg-kcard input[type=number]{text-align:center; font-weight:800; font-size:1.05rem;}
.smg-kcard .q-field__marginal{color:#6b8a97!important;}
/* chip informativo chico (stats / contexto de una promo) */
.smg-pchip{display:inline-flex; align-items:center; gap:5px; font-size:.74rem; font-weight:600; color:#3d6070; background:rgba(255,255,255,0.6); border:1px solid rgba(255,255,255,0.8); border-radius:999px; padding:3px 11px;}