.metro-container{display:grid;gap:12px;width:100%;grid-auto-rows:minmax(120px,1fr)}@media (max-width:639px){.metro-container{grid-template-columns:repeat(2,1fr);gap:12px;grid-auto-rows:minmax(100px,1fr)}}@media (min-width:640px) and (max-width:767px){.metro-container{grid-template-columns:repeat(3,1fr);gap:14px;grid-auto-rows:minmax(110px,1fr)}}@media (min-width:768px) and (max-width:1023px){.metro-container{grid-template-columns:repeat(4,1fr);gap:16px;grid-auto-rows:minmax(120px,1fr)}}@media (min-width:1024px) and (max-width:1079px){.metro-container{grid-template-columns:repeat(3,1fr);gap:16px;grid-auto-rows:minmax(130px,1fr)}}@media (min-width:1080px) and (max-width:1600px){.metro-container{grid-template-columns:repeat(4,1fr);gap:24px;grid-auto-rows:minmax(160px,1fr)}}@media (min-width:1600px) and (max-width:1919px){.metro-container{grid-template-columns:repeat(6,1fr);gap:20px;grid-auto-rows:minmax(180px,1fr)}}@media (min-width:1920px){.metro-container{grid-template-columns:repeat(4,1fr);gap:24px;grid-auto-rows:minmax(160px,1fr)}}.metro-tile{position:relative;border-radius:16px;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;display:flex;flex-direction:column;text-decoration:none;color:white;background:linear-gradient(135deg,var(--tile-from),var(--tile-to));box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.metro-tile:hover{transform:scale(1.02);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}.metro-tile:active{transform:scale(.98)}.metro-tile-medium,.metro-tile-small{grid-column:span 1;grid-row:span 1}.metro-tile-large{grid-column:span 2;grid-row:span 2}.metro-tile-wide{grid-column:span 2;grid-row:span 1}.metro-tile-tall{grid-column:span 1;grid-row:span 2}@media (min-width:1024px) and (max-width:1079px){.metro-tile-medium{grid-column:span 2;grid-row:span 1}.metro-tile-wide{grid-column:span 3;grid-row:span 1}}@media (min-width:1080px) and (max-width:1439px){.metro-tile-medium{grid-column:span 1;grid-row:span 1}.metro-tile-wide{grid-column:span 2;grid-row:span 1}.metro-tile-large{grid-column:span 2;grid-row:span 2}}@media (min-width:1440px) and (max-width:1599px){.metro-tile-medium{grid-column:span 1;grid-row:span 1}.metro-tile-wide{grid-column:span 2;grid-row:span 1}.metro-tile-large{grid-column:span 2;grid-row:span 2}}@media (min-width:1600px) and (max-width:1919px){.metro-tile-medium,.metro-tile-small{grid-column:span 2;grid-row:span 1}.metro-tile-large{grid-column:span 2;grid-row:span 2}.metro-tile-wide{grid-column:span 2;grid-row:span 1}}@media (min-width:1920px){.metro-tile-medium,.metro-tile-small{grid-column:span 1;grid-row:span 1}.metro-tile-large{grid-column:span 2;grid-row:span 2}.metro-tile-wide{grid-column:span 2;grid-row:span 1}}.metro-tile-content{position:relative;z-index:10;padding:16px;height:100%;display:flex;flex-direction:column}@media (min-width:768px){.metro-tile-content{padding:20px}}@media (min-width:1024px) and (max-width:1079px){.metro-tile-content{padding:16px}}@media (min-width:1080px) and (max-width:1439px){.metro-tile-content{padding:18px}}@media (min-width:1440px) and (max-width:1599px){.metro-tile-content{padding:20px}}@media (min-width:1600px) and (max-width:1919px){.metro-tile-content{padding:24px}}@media (min-width:1920px){.metro-tile-content{padding:22px}}.metro-tile-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:auto}.metro-tile-icon{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;background:rgba(255,255,255,.2);backdrop-filter:blur(4px);padding:10px}.metro-tile-large .metro-tile-icon{padding:12px}.metro-tile-stats{text-align:right}.metro-tile-stats-value{font-size:1.5rem;font-weight:700;line-height:1;display:flex;align-items:center;gap:4px;justify-content:flex-end}@media (min-width:768px){.metro-tile-stats-value{font-size:1.75rem}}@media (min-width:1080px) and (max-width:1439px){.metro-tile-stats-value{font-size:1.5rem}}@media (min-width:1440px) and (max-width:1599px){.metro-tile-stats-value{font-size:1.75rem}}@media (min-width:1600px) and (max-width:1919px){.metro-tile-stats-value{font-size:2rem}}@media (min-width:1920px){.metro-tile-stats-value{font-size:1.875rem}}.metro-tile-stats-label{font-size:.75rem;color:rgba(255,255,255,.7);margin-top:2px}.metro-tile-footer{margin-top:auto}.metro-tile-title{font-weight:600;line-height:1.2;margin-bottom:2px;font-size:1rem}.metro-tile-large .metro-tile-title{font-size:1.25rem}@media (min-width:768px){.metro-tile-title{font-size:1.125rem}.metro-tile-large .metro-tile-title{font-size:1.5rem}}@media (min-width:1080px) and (max-width:1439px){.metro-tile-title{font-size:1rem}.metro-tile-large .metro-tile-title{font-size:1.375rem}}@media (min-width:1440px) and (max-width:1599px){.metro-tile-title{font-size:1.125rem}.metro-tile-large .metro-tile-title{font-size:1.5rem}}@media (min-width:1600px) and (max-width:1919px){.metro-tile-title{font-size:1.25rem}.metro-tile-large .metro-tile-title{font-size:1.75rem}}@media (min-width:1920px){.metro-tile-title{font-size:1.25rem}.metro-tile-large .metro-tile-title{font-size:1.625rem}}.metro-tile-subtitle{color:rgba(255,255,255,.8);font-size:.75rem}.metro-tile-large .metro-tile-subtitle{font-size:.875rem}.metro-tile-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.2),transparent);opacity:.4}.metro-tile-pattern{position:absolute;inset:0;opacity:.1}.metro-tile-pattern-dots{background-image:radial-gradient(circle,currentColor 1px,transparent 0);background-size:20px 20px}.metro-tile-pattern-grid{background-image:linear-gradient(currentColor 1px,transparent 0),linear-gradient(90deg,currentColor 1px,transparent 0);background-size:20px 20px}.metro-tile-pattern-lines{background-image:repeating-linear-gradient(45deg,currentColor,currentColor 1px,transparent 0,transparent 15px)}.metro-tile-shine{pointer-events:none;position:absolute;inset:0;overflow:hidden}.metro-tile-shine:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transform:translateX(-120%);transition:transform .6s ease}.metro-tile:hover .metro-tile-shine:before{transform:translateX(120%)}.metro-tile-glow{position:absolute;inset:0;opacity:0;background:linear-gradient(0deg,rgba(255,255,255,.1),transparent);transition:opacity .3s ease}.metro-tile:hover .metro-tile-glow{opacity:1}.metro-tile-indigo{--tile-from:#6366f1;--tile-to:#4f46e5}.metro-tile-teal{--tile-from:#14b8a6;--tile-to:#0d9488}.metro-tile-slate{--tile-from:#475569;--tile-to:#334155}@keyframes metro-fade-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.metro-tile-animate{animation:metro-fade-in .6s ease-out both}.metro-trend-up{color:#10b981}.metro-trend-down{color:#ef4444;transform:rotate(180deg)}