/* Barra del tablero (copia propia de ProjectHub). Colores: los toma de app-*.css Si tu proyecto ya define estas variables, se usan las tuyas. */
:root{--hub-red:#d71920;--hub-red-text:#b3141a;--hub-panel:#fff;--hub-ink:#141414;--hub-line:#e9e7e4;--hub-line-2:#d9d6d2;--hub-muted:#6b6762;--hub-soft:#8a857f}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--hub-red-text:#ff5a60;--hub-panel:#1a1a1a;--hub-ink:#f2f1ef;--hub-line:#2c2c2c;--hub-line-2:#3a3a3a;--hub-muted:#a8a49f;--hub-soft:#7d7973}}
:root[data-theme=dark]{--hub-red-text:#ff5a60;--hub-panel:#1a1a1a;--hub-ink:#f2f1ef;--hub-line:#2c2c2c;--hub-line-2:#3a3a3a;--hub-muted:#a8a49f;--hub-soft:#7d7973}
.hub-hero{background:#0f0f0f;border:1px solid #262626;color:#fff;border-radius:16px;padding:24px 28px;margin-bottom:24px;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center}
.hub-hero::after{content:"";position:absolute;right:-80px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(215,25,32,.55),rgba(215,25,32,0) 70%)}
.hub-hero .hub-bot{width:132px;height:132px;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 10px 18px rgba(0,0,0,.35))}
.hub-hero .hub-copy{position:relative;z-index:1;min-width:0}
.hub-hero .hub-welcome{color:#ff5a60;font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.hub-hero h1{margin:4px 0 0;font-size:1.65rem;line-height:1.2;color:#fff}
.hub-hero p{color:#bdbab5;margin:6px auto 0;max-width:560px}
.hub-strip{box-sizing:border-box;width:100%;margin:-10px 0 24px;padding:9px 14px;background:var(--panel,var(--hub-panel));border:1px solid var(--line,var(--hub-line));border-top:3px solid var(--red,var(--hub-red));border-radius:12px;color:var(--ink,var(--hub-ink));font-size:13px;line-height:1.4;text-align:center}
.hub-strip .ch-main{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap}
.hub-strip .ch-weather,.hub-strip .ch-currency,.hub-strip .ch-holiday{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap}
.hub-strip .ch-icon{width:38px;height:38px;object-fit:contain}
.hub-strip .ch-head{font-weight:700;color:var(--red-text,var(--hub-red-text))}
.hub-strip .ch-divider{height:27px;width:1px;background:var(--line-2,var(--hub-line-2))}
.hub-strip .ch-note{font-size:10px;color:var(--soft,var(--hub-soft));margin-top:3px}
.hub-strip .ch-rate{white-space:nowrap}.hub-strip .ch-rate b{font-weight:650}
.hub-strip .ch-muted{color:var(--muted,var(--hub-muted))}
.hub-strip .ch-value{font-size:17px;font-weight:750}
.hub-strip .ch-holiday .ch-head{display:inline-flex;align-items:center;gap:5px}
.hub-strip .ch-head .ico{width:15px;height:15px;display:inline-block;flex:0 0 auto}
@media(max-width:720px){.hub-hero{padding:20px}.hub-hero .hub-bot{width:96px;height:96px}.hub-hero h1{font-size:1.3rem}.hub-strip{padding:8px}.hub-strip .ch-main{gap:6px}.hub-strip .ch-divider{display:none}.hub-strip .ch-weather,.hub-strip .ch-currency,.hub-strip .ch-holiday{width:100%;gap:7px}.hub-strip .ch-icon{width:30px;height:30px}.hub-strip .ch-note{font-size:9px}}
