/* Miltima – Kezdőlap */
/* ---------- kezdőlap ---------- */
.home{overflow:auto;margin:10px -6px 0;padding:0 6px 4px}
.hgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
.hero{grid-column:1/-1;display:flex;align-items:center;gap:18px;padding:16px 20px;border-radius:var(--radius);background:linear-gradient(115deg,#0b1130 0%,var(--t-d2) 55%,var(--t-a2) 100%);color:#fff;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;right:-60px;top:-80px;width:320px;height:240px;background:radial-gradient(closest-side,rgba(var(--t-a3-rgb),.35),transparent);pointer-events:none}
.hero h2{margin:0;font-size:19px;font-weight:700;letter-spacing:-.2px}
.hero p{margin:4px 0 0;color:var(--on2);font-size:12.5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hero p em{font-style:normal;background:rgba(255,255,255,.12);border-radius:10px;padding:1px 8px;color:#fff;font-weight:600;font-size:11.5px}
.hero .acts{margin-left:auto;display:flex;gap:8px;position:relative;z-index:1}
.hbtn{height:34px;padding:0 14px;border-radius:10px;font-weight:600;font-size:13px;display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.18);white-space:nowrap}
.hbtn:hover{background:rgba(255,255,255,.18)}
.hbtn.w{background:#fff;color:var(--navy);border-color:#fff}.hbtn.w:hover{background:#eef1ff}
.hbtn svg.i{width:16px;height:16px}
.kpi{grid-column:span 3;padding:14px 16px;display:flex;flex-direction:column;gap:10px;min-width:0}
.k-top{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--muted);font-weight:500}
.k-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--bg);color:var(--fg);border:1px solid var(--bd);flex:none}
.k-ic svg.i{width:16px;height:16px}
.k-delta{margin-left:auto;font-size:11px;font-weight:600;padding:2px 7px;border-radius:10px;background:#f1f3f7;color:var(--muted);white-space:nowrap}
.k-val{display:flex;align-items:baseline;gap:6px}
.k-val b{font-size:28px;font-weight:800;letter-spacing:-.6px;line-height:1}
.k-val span{color:var(--muted);font-size:12.5px}
.k-bar{height:6px;border-radius:4px;background:#eef0f5;overflow:hidden}
.k-bar i{display:block;height:100%;background:var(--fg);border-radius:4px;opacity:.75}
.kpi.warn{--bg:#fef6e7;--bd:#f7dfaf;--fg:#c87410}
.kpi.ok{--bg:#e3f5eb;--bd:#c4e8d3;--fg:#1d8a4e}
.panel{padding:14px 16px;display:flex;flex-direction:column;min-width:0}
.ph{display:flex;align-items:center;gap:8px;margin-bottom:12px;min-height:24px}
.ph h3{margin:0;font-size:14px;font-weight:700}
.ph small{color:var(--muted);font-size:12px}
.lnk{margin-left:auto;font-size:12px;color:var(--accent);font-weight:600;display:flex;align-items:center;gap:2px;white-space:nowrap}
.lnk svg.i{width:14px;height:14px}
.lnk:hover{text-decoration:underline}
.span8{grid-column:span 8}.span4{grid-column:span 4}
.legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:11.5px;color:#3a4057;margin:-2px 0 12px}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{width:10px;height:10px;border-radius:3px;background:var(--fg);opacity:.82}
.legend i.none{background:repeating-linear-gradient(135deg,#d9dce5 0 2px,#f4f5f8 2px 4px);opacity:1}
.wchart{display:flex;gap:10px;height:230px}
.wk-y{display:flex;flex-direction:column-reverse;justify-content:space-between;font-size:10.5px;color:var(--faint);text-align:right;width:20px;padding-bottom:32px;margin-top:-6px}
.wk-plot{flex:1;position:relative;display:flex;gap:14px;padding:0 6px}
.wk-plot .gl{position:absolute;left:0;right:0;border-top:1px dashed #eceef3;pointer-events:none}
.wk-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0;position:relative;z-index:1}
.wk-stack{flex:1;width:min(64px,100%);display:flex;flex-direction:column-reverse;gap:2px;cursor:default;transition:transform .15s}
.wk-col:hover .wk-stack{transform:translateY(-2px)}
.wk-stack i{display:block;background:var(--fg);opacity:.82;min-height:0}
.wk-stack i:first-child{border-radius:0 0 4px 4px}
.wk-stack i:last-child{border-radius:4px 4px 0 0}
.wk-stack i:only-child{border-radius:4px}
.wk-stack i.none{background:repeating-linear-gradient(135deg,#d9dce5 0 3px,#f4f5f8 3px 6px);opacity:1}
.wk-x{font-size:11px;color:var(--muted);text-align:center;line-height:1.3;height:24px;white-space:nowrap}
.wk-x b{display:inline-block;color:var(--text);font-size:12px;margin-left:3px}
.wk-col.today .wk-x{color:var(--accent);font-weight:700}
.wk-col.today .wk-x b{color:#fff;background:var(--accent);border-radius:10px;padding:0 7px}
.wk-col.hol .wk-stack{opacity:.35}
.mtabs{display:flex;background:#f1f3f7;border-radius:9px;padding:3px;margin-bottom:10px}
.mtabs button{flex:1;height:26px;border-radius:7px;font-size:12px;font-weight:500;color:#3a4057;display:flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap}
.mtabs button em{font-style:normal;font-size:11px;color:var(--muted)}
.mtabs button.on{background:#fff;font-weight:700;box-shadow:0 1px 3px rgba(16,24,64,.08)}
.plist{display:flex;flex-direction:column;margin:0 -8px}
.mtabs+.plist{overflow:auto;max-height:226px}
.pr{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:9px;min-width:0}
.pr:hover{background:#f7f8fb}
.pr .av{width:30px;height:30px;font-size:10.5px;font-weight:700;background:hsl(var(--h) 75% 95%);color:hsl(var(--h) 50% 36%);box-shadow:inset 0 0 0 1px hsl(var(--h) 60% 86%)}
.pr-t{flex:1;min-width:0;line-height:1.25}
.pr-t b{display:block;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-t small{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden}
.pr-t small i{width:6px;height:6px;border-radius:50%;background:var(--tc);flex:none}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;padding:1px 8px;border-radius:10px;background:var(--bg);color:var(--fg);border:1px solid var(--bd);white-space:nowrap}
.chip svg.i{width:12px;height:12px}
.pr-r{text-align:right;font-size:11.5px;color:var(--muted);white-space:nowrap;display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.pr-r b{color:var(--text);font-weight:600;font-size:12px}
.live{font-size:10px;font-weight:700;color:#16a34a;background:#e7f6ec;border-radius:8px;padding:1px 6px;text-transform:uppercase;letter-spacing:.3px}
.tm{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px 10px;padding:7px 0;border-bottom:1px solid var(--line-2)}
.tm:last-child{border-bottom:0}
.tm-n{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;min-width:0}
.tm-n i{width:8px;height:8px;border-radius:50%;flex:none}
.tm-c{font-size:11.5px;color:var(--muted)}
.tm-c b{color:var(--text)}
.tm-bar{grid-column:1/-1;display:flex;gap:2px;height:8px;cursor:default}
.tm-bar i{display:block;height:100%;background:var(--fg);opacity:.82}
.tm-bar i:first-child{border-radius:4px 0 0 4px}.tm-bar i:last-child{border-radius:0 4px 4px 0}
.tm-bar i:only-child{border-radius:4px}
.tm-bar i.none{background:repeating-linear-gradient(135deg,#d9dce5 0 3px,#f4f5f8 3px 6px);opacity:1}
.todo .pr-r{flex-direction:row;align-items:center;gap:6px}
.todo .pr-r button{font-size:12px;font-weight:600;color:var(--accent);padding:4px 8px;border-radius:7px}
.todo .pr-r button:hover{background:var(--accent-soft)}
.todo-n{font-size:11px;font-weight:700;color:#c87410;background:#fef6e7;border-radius:8px;padding:1px 7px}
.allok{display:flex;flex-direction:column;align-items:center;gap:8px;padding:28px 10px;color:var(--muted);font-size:12.5px;text-align:center}
.allok svg.i{width:34px;height:34px;padding:7px;border-radius:50%;background:#e7f6ec;color:#16a34a}
@media (max-width:1280px){.kpi{grid-column:span 6}.span8{grid-column:1/-1}.span4{grid-column:span 6}}
@media (max-width:760px){.kpi,.span4{grid-column:1/-1}.hero{flex-wrap:wrap}.hero .acts{margin-left:0}}


/* ---------- kezdőlap: betöltő animáció ---------- */
.hload{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;min-height:320px;animation:hfade .3s ease both}
.hload.out{animation:hout .28s ease forwards}
.hl-logo{width:128px;height:128px;position:relative;isolation:isolate}
.hl-logo::before{content:"";position:absolute;inset:-36px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--t-a2-rgb),.22),rgba(var(--t-a3-rgb),.08) 60%,transparent);z-index:-1;animation:hglow 1.6s ease-in-out infinite}
.hl-logo img{width:100%;height:100%;object-fit:contain;display:block;animation:hlogo .9s cubic-bezier(.2,.9,.25,1.15) both,hfloat 2.4s ease-in-out .9s infinite}
.hl-bar{width:168px;height:4px;border-radius:4px;background:#e6e9f2;overflow:hidden}
.hl-bar i{display:block;height:100%;width:0;border-radius:4px;background:var(--grad);animation:hbar 1.15s cubic-bezier(.45,0,.2,1) .15s forwards}
.hload span{font-size:12px;color:var(--muted);letter-spacing:.3px;animation:hfade .5s ease .35s both}
.hgrid.anim>*{animation:hrise .55s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(var(--i,0) * 70ms)}
.hgrid.anim .wk-stack{animation:hgrow .75s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(350ms + var(--j,0) * 70ms);transform-origin:bottom}
.hgrid.anim .k-bar i,.hgrid.anim .tm-bar{animation:hfill .9s cubic-bezier(.2,.8,.2,1) .35s backwards;transform-origin:left}
@keyframes hfade{from{opacity:0}to{opacity:1}}
@keyframes hout{to{opacity:0;transform:scale(.96)}}
@keyframes hlogo{from{opacity:0;transform:scale(.55) translateY(14px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@keyframes hfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes hglow{0%,100%{opacity:.6;transform:scale(.92)}50%{opacity:1;transform:scale(1.05)}}
@keyframes hbar{to{width:100%}}
@keyframes hrise{from{opacity:0;transform:translateY(14px)}}
@keyframes hgrow{from{transform:scaleY(0);opacity:0}}
@keyframes hfill{from{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){.hload *,.hgrid.anim *,.hgrid.anim>*{animation-duration:.01s!important;animation-delay:0s!important}}

