.training-hub-period{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.training-hub-period h3,.training-hub-period p{margin:4px 0}.training-hub-period p{color:var(--muted)}.training-hub-period label{width:150px;margin:0}
.training-hub-metrics .metric-attention{border-color:color-mix(in srgb,var(--warning,#e59f23) 55%,var(--line))}
.training-hub-progress{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.training-hub-progress article>div:first-child{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.training-hub-progress h3,.training-hub-progress p{margin:4px 0}.training-hub-progress p{color:var(--muted);font-size:12px}.training-hub-progress article>div>b{color:var(--primary);font-size:24px}
.training-hub-bar{height:10px;margin:16px 0 10px;overflow:hidden;border-radius:999px;background:var(--line)}.training-hub-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--primary),#66a1ff)}.training-hub-bar.success i{background:linear-gradient(90deg,#07865c,#36b37e)}
.training-hub-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}.training-hub-actions button{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:14px;min-height:92px;margin:0;padding:16px 18px;border:1px solid var(--line);background:var(--surface-soft);color:var(--ink);text-align:left;box-shadow:none}.training-hub-actions button:hover{border-color:var(--primary);background:var(--surface-accent);transform:translateY(-1px)}.training-hub-actions button>span{display:grid;width:40px;height:40px;place-items:center;border-radius:12px;background:var(--surface-accent);color:var(--primary);font-weight:900}.training-hub-actions b,.training-hub-actions small{display:block}.training-hub-actions small{margin-top:5px;color:var(--muted);line-height:1.4}.training-hub-actions i{color:var(--primary);font-size:20px;font-style:normal}
@media(max-width:820px){.training-hub-actions,.training-hub-progress{grid-template-columns:1fr}}@media(max-width:560px){.training-hub-period{align-items:stretch;flex-direction:column}.training-hub-period label{width:100%}.training-hub-actions button{grid-template-columns:38px minmax(0,1fr)}.training-hub-actions button>i{display:none}}
