.mods{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.mods .card{padding:1.6rem}
.mods .card ul{list-style:none;margin-top:.8rem;display:grid;gap:.3rem}
.mods .card li{font-size:.88rem;color:var(--muted);padding-left:1rem;position:relative}
.mods .card li::before{content:"";position:absolute;left:0;top:.65em;width:6px;height:6px;border-radius:50%;background:var(--orange)}
.mock{background:#fff;border-radius:24px;box-shadow:var(--shadow-lg);border:1px solid var(--line);overflow:hidden}
.mock-top{background:var(--navy);color:#fff;padding:.8rem 1.1rem;display:flex;align-items:center;gap:.7rem;font-size:.85rem;font-weight:600}
.mock-top svg{width:26px;height:26px}
.mock-body{display:grid;grid-template-columns:150px 1fr;min-height:330px}
.side{background:var(--bg);padding:1rem .7rem;display:grid;gap:.25rem;align-content:start}
.side span{font-size:.78rem;padding:.45rem .6rem;border-radius:8px;color:var(--muted);font-weight:600;display:flex;gap:.45rem;align-items:center}
.side span svg.i{width:15px;height:15px}
.side span.on{background:#fff;color:var(--navy);box-shadow:var(--shadow-sm)}
.main{padding:1.1rem}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin-bottom:.9rem}
.kpi{background:var(--bg);border-radius:12px;padding:.7rem .8rem}
.kpi small{font-size:.68rem;color:var(--muted);display:block}
.kpi b{font-size:1.05rem;color:var(--navy)}
.kpi em{font-style:normal;font-size:.7rem;color:var(--teal);font-weight:700}
.inv{width:100%;border-collapse:collapse;font-size:.76rem}
.inv th{text-align:left;color:var(--muted);font-weight:600;padding:.4rem;border-bottom:1px solid var(--line)}
.inv td{padding:.5rem .4rem;border-bottom:1px solid var(--line);color:var(--ink)}
.inv tr{animation:slideIn .6s var(--ease) both}
.inv tr:nth-child(2){animation-delay:.15s}.inv tr:nth-child(3){animation-delay:.3s}.inv tr:nth-child(4){animation-delay:.45s}
.st{font-size:.66rem;padding:.12rem .45rem;border-radius:99px;background:var(--teal-l);color:var(--teal);font-weight:700}
.st.o{background:var(--orange-l);color:var(--orange)}
.loc{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.loc div{display:flex;gap:.8rem;align-items:flex-start;padding:1.2rem;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);transition:.3s}
.loc div:hover{background:rgba(255,255,255,.1);transform:translateY(-4px)}
.loc svg.i{color:var(--orange-2);margin-top:3px}
.loc b{color:#fff;display:block}
.loc span{font-size:.9rem;color:#AFC3D2}
@media(max-width:1080px){.mods{grid-template-columns:repeat(2,1fr)}.loc{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.mods,.loc{grid-template-columns:1fr}.mock-body{grid-template-columns:1fr}.side{display:none}}