.vakt24-wrap{--red:#E60000;--green:#1db954;--text:#111;--bg:#fff;--card:#f7f7f7;--muted:#777;
  --ok:#2ecc71;--mid:#f1c40f;--bad:#e74c3c;
  font-family:system-ui,Arial,sans-serif; width:100%; max-width:1280px; margin:0 auto; padding:6px 12px}
.vakt24-wrap.wide-full{max-width:none}
body .vakt24-wrap.boxed{max-width:1000px}
@media(min-width:1400px){.vakt24-wrap{max-width:1380px}}
.vakt24-hero{display:flex;gap:12px;align-items:center;margin:6px 0 12px 0}
.vakt24-logo{height:32px}
.vakt24-title{margin:0}
.vakt24-sub{margin:2px 0 0 0;color:var(--muted);font-size:14px}

.sharebox{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0 16px 0}
.share-title{font-weight:600}
.icon-btn{width:34px;height:34px;border-radius:999px;border:1px solid #ddd;background:#fff;cursor:pointer;font-weight:700}
.btn{background:var(--red);border:none;color:#fff;padding:10px 14px;border-radius:10px;cursor:pointer}
.btn-outline{background:#fff;border:1px solid #ddd;color:#333}
.btn-pill{background:#eee;color:#333;border:1px solid #ddd;border-radius:999px;margin-right:8px}
.btn-pill.active{background:var(--red);color:#fff;border-color:var(--red)}

.v-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:960px){.v-grid{grid-template-columns:1fr}}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media(max-width:880px){.grid3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.grid2,.grid3{grid-template-columns:1fr}}

.card{background:var(--card);border:1px solid #e6e6e6;border-radius:12px;padding:14px}
.card h3{margin:0 0 10px 0}
label{display:flex;flex-direction:column;font-size:14px;margin-bottom:8px}
input,select{padding:10px;border:1px solid #d0d0d0;border-radius:8px;font-size:15px;width:100%;background:#fff;box-sizing:border-box}
input:focus,select:focus{outline:0;border-color:var(--red);box-shadow:0 0 0 3px rgba(230,0,0,.12)}
.toggle{display:flex;align-items:center;gap:8px;font-size:13px}
.flex-between{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}

.table{width:100%;border-collapse:separate;border-spacing:0 6px}
.table th,.table td{padding:6px;font-size:14px;vertical-align:middle}
.table tbody tr{background:#fff;border:1px solid #eee;border-radius:8px}
.table input{max-width:130px}

.chartbox{position:relative;height:440px}
@media(max-width:900px){.chartbox{height:360px}}
@media(max-width:600px){.chartbox{height:320px}}

.long-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:start}
@media(max-width:1100px){.long-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.long-grid{grid-template-columns:1fr}}
.long-col{background:#fff;border:1px solid #eee;border-radius:10px;padding:10px}
.long-col h4{margin:0 0 8px 0}
.long-row{display:flex;align-items:center;justify-content:space-between;padding:6px 0;border-top:1px solid #f2f2f2}
.cell{padding:2px 8px;border-radius:8px;font-weight:600}
.best{background:rgba(46,204,113,.18);color:#145a32}
.mid{background:rgba(241,196,15,.2);color:#7a5f00}
.worst{background:rgba(231,76,60,.18);color:#7b241c}

@media(prefers-color-scheme:dark){
  .vakt24-wrap{--text:#f5f5f5;--bg:#111;--card:#1a1a1a;--muted:#aaa}
  body .vakt24-wrap{color:var(--text)}
  .card{border-color:#222}
  .table tbody tr{background:#151515;border-color:#222}
  .btn-outline{background:transparent;color:#ddd;border-color:#333}
  .best{background:rgba(46,204,113,.25);color:#a7f3d0}
  .mid{background:rgba(241,196,15,.25);color:#fde68a}
  .worst{background:rgba(231,76,60,.25);color:#fecaca}
}