/* === ok-hub: hub template layout (ranked casino lists) === */
.ok-hub-page{background:var(--ok-bg);padding-bottom:var(--ok-sp-8)}

/* Commercial hero: editorial authority, solid navy, restrained */
.ok-hub-hero{background:var(--ok-hero-2);border-radius:10px;padding:48px 56px 40px;margin-bottom:var(--ok-sp-5);color:#fff}
.ok-hub-hero-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:40px;align-items:start}
.ok-hub-hero-main{min-width:0}
.ok-hub-trustpanel{background:#14203f;border:1px solid #2b3a66;border-radius:10px;padding:22px 24px}
.ok-hub-trustpanel>b{display:block;font-family:var(--ok-font-display);font-size:16.5px;color:#fff;margin-bottom:10px}
.ok-hub-trustpanel ul{list-style:none;margin:0;padding:0}
.ok-hub-trustpanel li{position:relative;padding:6px 0 6px 24px;font-size:13.5px;line-height:1.55;color:var(--ok-on-dark)}
.ok-hub-trustpanel li::before{content:"\2713";position:absolute;left:0;top:6px;color:var(--ok-mint);font-weight:700}
.ok-hub-trustpanel>a{display:inline-block;margin-top:10px;font-size:13px;font-weight:600;color:var(--ok-on-dark);text-decoration:underline}
@media(max-width:1024px){.ok-hub-hero-grid{grid-template-columns:minmax(0,1fr)}}
.ok-hub-kicker{display:inline-flex;flex-wrap:wrap;gap:8px 14px;align-items:center;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ok-mint);margin:0 0 16px;border-bottom:1px solid rgba(255,255,255,.18);padding-bottom:10px}
.ok-hub-kicker span+span::before{content:"\00B7";margin-right:14px;color:var(--ok-on-dark-dim)}
@media(max-width:700px){.ok-hub-kicker span{display:block}.ok-hub-kicker span+span::before{content:"";margin:0}}
.ok-hub-page .ok-hub-hero h1{color:#fff;font-family:var(--ok-font-display);font-size:clamp(27px,6vw,44px);font-weight:700;margin:0;letter-spacing:-.02em;line-height:1.12;overflow-wrap:break-word}
.ok-hub-intro{margin:16px 0 0;font-size:17px;line-height:1.65;color:var(--ok-on-dark);max-width:72ch}
.ok-hub-dateline{margin:14px 0 0;font-size:14px;color:var(--ok-on-dark);max-width:64ch}
.ok-hub-verified{color:var(--ok-mint);font-weight:700;margin-right:2px}
.ok-hub-dateline a{color:var(--ok-on-dark);text-decoration:underline}
.ok-hub-actions{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;margin-top:22px}
.ok-hub-anchorbtn{background:#fff;color:var(--ok-ink) !important;font-weight:700;box-shadow:none}
.ok-hub-anchorbtn:hover{background:var(--ok-mint-dim);transform:none}
.ok-hub-methlink{font-size:14px;font-weight:600;color:var(--ok-on-dark);text-decoration:underline}
.ok-hub-stats{display:flex;flex-wrap:wrap;gap:12px 48px;border-top:1px solid rgba(255,255,255,.14);margin-top:34px;padding-top:24px}
.ok-hub-stats b{display:block;font-family:var(--ok-font-display);font-size:21px;color:#fff}
.ok-hub-stats span{font-size:11.5px;color:var(--ok-on-dark-dim);font-weight:700;text-transform:uppercase;letter-spacing:.06em}

/* Article surface */
.ok-hub-main{background:var(--ok-card);border:1px solid var(--ok-line-2);border-radius:10px;overflow:hidden}
/* Two-column shell + sticky "På denna sida" index rail (fills the readable-width whitespace) */
.ok-hubshell{display:grid;grid-template-columns:minmax(0,1fr) 284px;gap:32px;align-items:start}
.ok-hubshell .ok-hub-main{min-width:0}
.ok-hubrail{position:sticky;top:88px;align-self:start;min-width:0}
.ok-hubtoc{background:#fff;border:1px solid var(--ok-line-2);border-radius:12px;padding:15px 16px;box-shadow:0 1px 2px rgba(11,16,34,.04)}
.ok-hubtoc-h{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ok-text-soft);margin:0 0 9px}
.ok-hubtoc ol{list-style:none;margin:0;padding:0;counter-reset:htoc;display:flex;flex-direction:column;gap:1px}
.ok-hubtoc a{display:flex;gap:9px;align-items:baseline;padding:7px 9px;border-radius:8px;font-size:13px;color:var(--ok-text-soft);text-decoration:none;line-height:1.35;transition:background var(--ok-dur) var(--ok-ease),color var(--ok-dur) var(--ok-ease)}
.ok-hubtoc a::before{counter-increment:htoc;content:counter(htoc,decimal-leading-zero);font-family:var(--ok-font-display);font-weight:700;font-size:10.5px;color:var(--ok-muted);flex:0 0 auto}
.ok-hubtoc a:hover{background:var(--ok-surface-cool);color:var(--ok-ink)}
.ok-hubtoc a.is-active{background:var(--ok-surface-mint);color:var(--ok-green-ink);font-weight:600}
.ok-hubtoc a.is-active::before{color:var(--ok-green-ink)}
@media(max-width:980px){.ok-hubshell{grid-template-columns:1fr}.ok-hubrail{display:none}}
/* Månadens casino — featured single-casino promo card (ported from the editorial rail) */
.ok-hubrail .okgd-motm{margin-bottom:16px}
/* Rail-toplista (ported from ok-guide.css — same module as news/guide rails) */
.okc-kick{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ok-mint);margin-bottom:9px}
.okc-kick .okc-i{width:14px;height:14px}
.ok-hubrail .okgd-railtop{margin:0 0 16px}
.okgd-railtop{background:#fff;border:1px solid var(--ok-line);border-radius:14px;padding:14px 16px;box-shadow:0 8px 26px -16px rgba(11,16,34,.3)}
.okgd-railtop .okc-kick{color:var(--ok-green-ink);margin-bottom:8px}
.okgd-railtop-list{display:flex;flex-direction:column}
.okgd-mini-row{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:9px;align-items:center;padding:8px 4px;border-radius:9px;text-decoration:none}
.okgd-mini-row+.okgd-mini-row{border-top:1px solid var(--ok-line)}
.okgd-mini-row:hover{background:var(--ok-surface-cool)}
.okgd-mini-rank{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:var(--ok-surface-cool);font-family:var(--ok-font-display);font-weight:700;font-size:12px;color:var(--ok-ink)}
.okgd-mini-row:first-child .okgd-mini-rank{background:var(--ok-green-deep);color:#fff}
.okgd-railtop .okc-brand{grid-area:auto;width:34px;height:24px}
.okgd-railtop .okc-brand-img img{max-width:34px;max-height:22px}
.okgd-railtop .okc-brand-mono{width:24px;height:24px;font-size:12px;border-radius:7px}
.okgd-mini-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.okgd-mini-top{display:flex;align-items:center;gap:7px;min-width:0}
.okgd-mini-name{font-family:var(--ok-font-display);font-weight:700;font-size:13px;color:var(--ok-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 1 auto}
.okgd-mini-bonus{font-size:10.5px;color:var(--ok-green-ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.okgd-railtop .okc-score{padding:2px 6px;flex:0 0 auto}
.okgd-railtop .okc-score b{font-size:13px}
.okgd-railtop-all{display:block;text-align:center;margin-top:9px;font-size:12.5px;font-weight:600;color:var(--ok-action);text-decoration:none}
.okgd-railtop-all:hover{text-decoration:underline}
.okgd-motm{background:linear-gradient(165deg,#182a54,#0c1730);border:1px solid rgba(255,196,79,.30);border-radius:14px;padding:15px 17px;display:flex;flex-direction:column;gap:10px}
.okgd-motm-kick{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ok-gold)}
.okgd-motm-kick .okc-i{width:13px;height:13px;fill:var(--ok-gold);stroke:none}
.okgd-motm-head{display:flex;align-items:center;gap:10px}
.okgd-motm .okc-brand{grid-area:auto;flex:0 0 auto;width:40px;height:40px;background:#fff;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:5px;overflow:hidden}
.okgd-motm .okc-brand-img{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.okgd-motm .okc-brand-img img{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
.okgd-motm .okc-brand-mono{font-family:var(--ok-font-display);font-weight:700;font-size:18px;color:var(--ok-ink)}
.okgd-motm-name{font-family:var(--ok-font-display);font-size:15px;font-weight:700;color:#fff;margin-right:auto}
.ok-hub-page .okgd-motm .okc-score{background:rgba(255,255,255,.14)}
.ok-hub-page .okgd-motm .okc-score b{color:#fff}
.ok-hub-page .okgd-motm .okc-score i{color:#aeb9d6}
.okgd-motm-bonus{display:flex;align-items:center;gap:7px;margin:0;font-size:12.5px;line-height:1.4;color:var(--ok-mint)}
.okgd-motm-bonus .okc-i{width:14px;height:14px;color:var(--ok-gold);stroke:currentColor;fill:none;flex:0 0 auto}
.okgd-motm .ok-btn{width:100%;margin-top:2px}

/* Search box */
.ok-hubsearch-row{margin-bottom:2px}
.ok-hubsearch{display:flex;align-items:center;gap:8px;width:100%;max-width:340px;background:#fff;border:1px solid var(--ok-line-2);border-radius:999px;padding:0 14px;transition:border-color var(--ok-dur) var(--ok-ease),box-shadow var(--ok-dur) var(--ok-ease)}
.ok-hubsearch:focus-within{border-color:var(--ok-action);box-shadow:0 0 0 3px var(--ok-action-ring)}
.ok-hubsearch-i{width:16px;height:16px;color:var(--ok-muted);flex:0 0 auto}
.ok-hubsearch-input{flex:1;min-width:0;border:0;outline:0;background:none;font:inherit;font-size:14px;padding:9px 0;color:var(--ok-ink)}
.ok-hubsearch-input::placeholder{color:var(--ok-muted)}
/* Uttagstid line under the bonus */
.ok-hubrow-meta{font-size:11.5px;color:var(--ok-muted);line-height:1.45}
.ok-hubrow-uttag{color:var(--ok-text-soft);font-weight:600}

/* Sticky mobile CTA bar (top pick) — keeps a CTA on screen through the long scroll */
.ok-hub-stickybar{display:none}
@media(max-width:980px){
  .ok-hub-hasbar .ok-hub-stickybar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:200;align-items:center;gap:10px;padding:9px 13px;background:#fff;border-top:1px solid var(--ok-line-2);box-shadow:0 -8px 24px rgba(11,16,34,.14)}
  .ok-hub-stickybar-brand{flex:0 0 auto}
  .ok-hub-stickybar-brand .okc-brand{grid-area:auto;width:46px;height:30px;display:flex;align-items:center;justify-content:center;background:#fff}
  .ok-hub-stickybar-brand .okc-brand-img{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
  .ok-hub-stickybar-brand .okc-brand-img img{max-width:46px;max-height:28px;width:auto;height:auto}
  .ok-hub-stickybar-brand .okc-brand-mono{width:30px;height:30px;font-size:14px;border-radius:8px}
  .ok-hub-stickybar-id{display:flex;align-items:center;gap:8px;min-width:0;margin-right:auto}
  .ok-hub-stickybar-id b{font-family:var(--ok-font-display);font-size:14.5px;color:var(--ok-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ok-hub-stickybar .ok-btn{white-space:nowrap;flex:0 0 auto;padding:11px 20px}
  .ok-hub-hasbar{padding-bottom:68px}
}

/* Mobile "På denna sida" index (collapsible; desktop uses the rail) */
.ok-hub-mtoc{display:none}
@media(max-width:980px){
  .ok-hub-mtoc{display:block;margin:0 0 6px;border:1px solid var(--ok-line-2);border-radius:10px;background:#fff}
  .ok-hub-mtoc>summary{cursor:pointer;padding:12px 15px;font-family:var(--ok-font-display);font-weight:700;font-size:14px;color:var(--ok-ink);list-style:none;display:flex;align-items:center;gap:8px}
  .ok-hub-mtoc>summary::-webkit-details-marker{display:none}
  .ok-hub-mtoc>summary::before{content:"+";color:var(--ok-action);font-size:19px;line-height:1;font-weight:400}
  .ok-hub-mtoc[open]>summary::before{content:"–"}
  .ok-hub-mtoc ol{list-style:none;margin:0;padding:2px 8px 10px;counter-reset:mt;display:flex;flex-direction:column;gap:1px}
  .ok-hub-mtoc a{display:flex;gap:9px;align-items:baseline;padding:8px 9px;border-radius:8px;font-size:13.5px;color:var(--ok-text-soft);text-decoration:none;line-height:1.35}
  .ok-hub-mtoc a::before{counter-increment:mt;content:counter(mt,decimal-leading-zero);font-family:var(--ok-font-display);font-weight:700;font-size:10.5px;color:var(--ok-muted);flex:0 0 auto}
}
.ok-hub-main>*:first-child{border-top:0}

/* Narrow editorial text inside the wide surface */
.ok-hub-main .ok-sec p:not(.ok-comp-line),.ok-hub-main .ok-steps li,.ok-hub-main .ok-faq details,.ok-hub-main .ok-empty,.ok-hub-main .ok-checklist li{max-width:74ch}
.ok-hub-listlead{font-size:15px;color:var(--ok-text-soft);margin-top:-6px}
.ok-hub-main .ok-sec-header h2{font-size:30px}

/* Toplist: the primary commercial module — cards clearly stronger than rows */
.ok-hub-topgrid{grid-template-columns:repeat(3,1fr);gap:18px;margin-top:14px}
.ok-hub-topgrid .ok-ccard{padding:34px 28px 28px;gap:11px}
.ok-hub-topgrid .ok-ccard-rank{width:34px;height:34px;font-size:16px;border-radius:9px}
.ok-hub-topgrid .ok-ccard-logo{height:60px}
.ok-hub-topgrid .ok-ccard-logo img{max-height:60px}
.ok-hub-topgrid .ok-ccard-name{font-size:23px;min-height:0}
.ok-hub-topgrid .ok-ccard-score{font-size:16.5px;padding:8px 20px}
.ok-hub-topgrid .ok-ccard-why{font-size:14.5px;-webkit-line-clamp:3}
.ok-hub-topgrid .ok-ccard-bonus{font-size:15px;padding:10px 14px}
.ok-hub-topgrid .ok-ccard .ok-btn{padding:15px 26px;font-size:16px}
.ok-hub-topgrid .ok-ccard .ok-ccard-rev{font-size:14.5px}
@media(max-width:1024px){.ok-hub-topgrid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.ok-hub-topgrid{grid-template-columns:1fr}}

/* Featured card (#1, data-driven) + card USP bullets */
.ok-ccard--featured{border:2px solid var(--ok-green-deep)}
.ok-ccard-flag{position:absolute;top:-1px;left:50%;transform:translate(-50%,-50%);background:var(--ok-green-deep);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border-radius:6px;padding:6px 16px;white-space:nowrap}
.ok-hub-topgrid .ok-ccard--featured{padding-top:40px}
.ok-ccard-usps{list-style:none;margin:2px 0 0;padding:0;text-align:left}
.ok-ccard-usps li{position:relative;padding:4px 0 4px 24px;font-size:13.5px;color:var(--ok-text);line-height:1.5}
.ok-ccard-usps li::before{content:"\2713";position:absolute;left:2px;top:4px;color:var(--ok-green-deep);font-weight:700}

/* Decision rows (positions 4+): rank, why, score, bonus, CTA — no data columns */

@media(max-width:900px){

}

/* Comparison table: core product component (hub-scoped overrides) */
.ok-hub-page .ok-crowtable{margin:16px 0 10px}
.ok-hub-page .ok-crow{padding:22px 24px;box-shadow:none}
.ok-hub-page .ok-crow:hover{transform:none;box-shadow:none;border-color:var(--ok-ink)}
.ok-hub-page .ok-crow-head{padding:0 24px 12px;font-size:12px;color:var(--ok-ink-2);border-bottom:2px solid var(--ok-line-2);margin-bottom:4px}
.ok-hub-page .ok-crow-name img{height:30px;max-width:84px}
.ok-hub-page .ok-crow-name a{font-size:17.5px}
.ok-hub-page .ok-crow-score{font-family:var(--ok-font-display);font-weight:700;font-size:16px;color:var(--ok-green-ink)}
.ok-hub-page .ok-crow-cta .ok-btn{padding:12px 18px;font-size:14px;white-space:nowrap}

/* Sort controls */
.ok-hub-sort{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0 14px;font-size:13.5px;color:var(--ok-text-soft);font-weight:600}
.ok-sortbtn{border:1px solid var(--ok-line-2);background:#fff;border-radius:8px;padding:10px 16px;min-height:44px;font-size:13.5px;font-weight:600;color:var(--ok-text);cursor:pointer;font-family:var(--ok-font-body)}
.ok-sortbtn.is-active{background:var(--ok-ink);border-color:var(--ok-ink);color:#fff}
.is-alt-sort .ok-crow-rank{display:none}

/* Methodology trust anchor */
.ok-sec--method{background:#f8fafc}
.ok-weighttable{border-top:2px solid var(--ok-line-2);margin:14px 0 18px;max-width:860px}
.ok-weightrowline{display:grid;grid-template-columns:64px 200px 1fr;gap:16px;align-items:baseline;padding:11px 2px;border-bottom:1px solid var(--ok-line)}
.ok-weightrowline b{font-family:var(--ok-font-display);font-size:17px;color:var(--ok-ink)}
.ok-wt-label{font-weight:700;font-size:14.5px;color:var(--ok-ink)}
.ok-wt-desc{font-size:14px;color:var(--ok-text)}
@media(max-width:700px){.ok-weightrowline{grid-template-columns:56px 1fr}.ok-wt-desc{grid-column:2;margin-top:2px}}

/* Score scale interpretation */
.ok-scalerow{display:flex;flex-wrap:wrap;gap:8px 28px;border-bottom:1px solid var(--ok-line-2);padding:0 2px 14px;margin:0 0 16px;font-size:13.5px;color:var(--ok-text);max-width:860px}
.ok-scalerow b{font-family:var(--ok-font-display);color:var(--ok-green-ink);margin-right:4px}

/* Rich steps */
.ok-steps--rich li{padding:12px 0 12px 40px;font-size:15.5px}
.ok-steps--rich li::before{width:26px;height:26px;font-size:13px;border-radius:9px;top:12px}
.ok-steps--rich li b{display:block;color:var(--ok-ink);font-size:16px}
.ok-steps--rich li p{margin:4px 0 0;font-size:15px;color:var(--ok-text);line-height:1.6}

/* Editorial essay sections: H2 left, text right (desktop) */
@media(min-width:901px){
  .ok-sec--essay{display:grid;grid-template-columns:280px minmax(0,1fr);column-gap:56px;align-items:start}
  .ok-sec--essay .ok-sec-header{grid-column:1;grid-row:1;margin-bottom:0;align-self:start}
  .ok-sec--essay p,.ok-sec--essay ul,.ok-sec--essay ol,.ok-sec--essay h3{grid-column:2}
  .ok-sec--essay ul,.ok-sec--essay ol{margin:0 0 14px;padding-left:22px}
  .ok-sec--essay li{margin:0 0 8px;line-height:1.65}
  .ok-hub-main .ok-sec--essay .ok-sec-header h2{font-size:23px;line-height:1.3}
}

/* Related comparisons: internal-navigation cards */
.ok-relgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:14px}
.ok-relcard{display:flex;flex-direction:column;gap:5px;border:1px solid var(--ok-line-2);border-radius:8px;padding:16px 18px;background:#fff}
.ok-relcard:hover{border-color:var(--ok-ink)}
.ok-relcard b{font-family:var(--ok-font-display);font-size:15.5px;color:var(--ok-ink)}
.ok-relcard b span{color:var(--ok-green-deep)}
.ok-relcard-d{font-size:13px;color:var(--ok-text-soft);line-height:1.5}
.ok-methodgrid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.ok-methodgrid .ok-relcard{padding:20px 22px;gap:6px}
.ok-methodgrid .ok-relcard>b{font-size:17px}
.ok-relcard--static{cursor:default}
.ok-relcard--static:hover{border-color:var(--ok-line-2)}
.ok-method-type{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ok-green-ink)}
.ok-method-type--id{color:var(--ok-warn-text)}

/* Licence verification module (licence hub) */
.ok-lictable{border-top:2px solid var(--ok-line-2);margin:18px 0 12px;max-width:860px}
.ok-lictable-head{display:grid;grid-template-columns:1.4fr 1fr 1.2fr 1.2fr;gap:16px;padding:10px 2px;font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ok-text-soft)}
.ok-licrow{display:grid;grid-template-columns:1.4fr 1fr 1.2fr 1.2fr;gap:16px;padding:12px 2px;border-bottom:1px solid var(--ok-line);font-size:14.5px;align-items:baseline}
.ok-licrow a{font-weight:700;color:var(--ok-ink)}
.ok-licrow a:hover{color:var(--ok-green-deep)}
.ok-licrow-ok{color:var(--ok-green-ink);font-weight:600}
.ok-licrow-flag{color:var(--ok-warn-text) !important;font-weight:600;text-decoration:underline}
.ok-licrow-na{color:var(--ok-text-soft)}
.ok-licrow-sub{display:block;font-size:12.5px;color:var(--ok-text-soft);font-weight:400;margin-top:2px}
.ok-hub-main .ok-h3{font-size:19px;margin:26px 0 4px}
.ok-lictable--status .ok-licrow{grid-template-columns:1.4fr 2.6fr}
/* Källänk (nya/uttag-modulerna): datum + liten länk till belägget */
.ok-licrow-src{font-size:11.5px;font-weight:600 !important;color:var(--ok-text-soft) !important;text-decoration:underline;white-space:nowrap;margin-left:4px}
.ok-licrow-src:hover{color:var(--ok-green-deep) !important}
.ok-licrow-note{grid-column:1/-1;font-size:12.5px;color:var(--ok-text-soft);padding:0 2px 12px;border-bottom:1px solid var(--ok-line);margin-top:-6px}
/* Uttag: 6 kolumner, casino×metod-grupper (〃 = samma casino som raden ovan) */
.ok-lictable--uttag .ok-lictable-head,.ok-lictable--uttag .ok-licrow{grid-template-columns:1.2fr .9fr 1.1fr .7fr .8fr .9fr;gap:12px}
.ok-lictable--uttag .ok-licrow{border-bottom-color:transparent}
.ok-lictable--uttag .ok-licrow--grpfirst{border-top:1px solid var(--ok-line)}
.ok-lictable--uttag .ok-licrow:last-child{border-bottom:1px solid var(--ok-line)}
.ok-licrow-cont{color:var(--ok-text-soft);font-weight:400}
/* Stängda: 3 kolumner */
.ok-lictable--stangda .ok-lictable-head,.ok-lictable--stangda .ok-licrow{grid-template-columns:1fr 2.2fr .8fr}
/* Ändringslogg */
.ok-logglist{list-style:none;margin:12px 0 0;padding:0;border-top:2px solid var(--ok-line-2);max-width:860px}
.ok-logglist li{padding:11px 2px;border-bottom:1px solid var(--ok-line);font-size:14.5px}
.ok-logglist time{font-weight:700;font-variant-numeric:tabular-nums;margin-right:4px}
@media(max-width:700px){
  .ok-lictable-head{display:none}
  .ok-licrow{grid-template-columns:1fr 1fr;row-gap:8px}
  .ok-licrow>[role=cell]:first-child{grid-column:1/-1}
  .ok-licrow [data-col]::before{content:attr(data-col);display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--ok-text-soft);font-weight:700;margin-bottom:2px}
  .ok-lictable--uttag .ok-licrow,.ok-lictable--stangda .ok-licrow{grid-template-columns:1fr 1fr}
  .ok-lictable--uttag .ok-licrow{border-bottom:1px solid var(--ok-line)}
  .ok-licrow-cont{display:none}
  .ok-licrow-name .screen-reader-text{position:static;width:auto;height:auto;clip:auto;clip-path:none;font-size:12.5px;color:var(--ok-text-soft);font-weight:600}
}

/* Utility surfaces: search + 404 (editorial flat, no commercial modules) */
.ok-utility-page{background:var(--ok-bg);padding-bottom:var(--ok-sp-8)}
.ok-utility{max-width:760px;padding-top:34px}
.ok-utility-head h1{font-size:clamp(26px,3.4vw,34px);margin:6px 0 14px;letter-spacing:-.015em}
.ok-utility-lead{font-size:16px;color:var(--ok-text);max-width:60ch}
.ok-searchform{display:flex;gap:10px;margin:16px 0 6px;max-width:560px}
.ok-searchform input{flex:1;min-width:0;border:1px solid var(--ok-line-2);border-radius:8px;padding:13px 16px;font-size:15px;font-family:var(--ok-font-body);background:#fff;color:var(--ok-ink)}
.ok-searchform input:focus{outline:2px solid var(--ok-ink);outline-offset:1px}
.ok-utility-count{font-size:13.5px;color:var(--ok-text-soft);margin:10px 0 0}
.ok-srclist{border-top:2px solid var(--ok-line-2);margin-top:18px}
.ok-srchit{padding:18px 2px;border-bottom:1px solid var(--ok-line)}
.ok-srchit-type{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ok-text-soft);margin-bottom:4px}
.ok-srchit h2,.ok-srchit h3{font-size:18.5px;margin:0 0 4px}
.ok-srchit h2 a,.ok-srchit h3 a{color:var(--ok-ink)}
.ok-srchit h2 a:hover,.ok-srchit h3 a:hover{color:var(--ok-green-deep)}
.ok-srchit-score{font-size:13.5px;font-weight:600;color:var(--ok-green-ink);margin:0 0 3px}
.ok-srchit-x{font-size:14.5px;color:var(--ok-text);line-height:1.6;margin:0 0 4px;max-width:70ch}
.ok-srcsuggest{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px}
.ok-srcsuggest a{font-weight:600;color:var(--ok-ink);text-decoration:underline;font-size:14.5px}
.ok-srcsuggest a:hover{color:var(--ok-green-deep)}
.ok-utility-sec{margin-top:34px}
.ok-utility-sec h2{font-size:21px;margin-bottom:6px}
.ok-utility .ok-pagination,.ok-utility .nav-links{display:flex;gap:12px;margin-top:20px;font-weight:600}

/* RG note: calm green surface */
.ok-sec--rgnote{background:var(--ok-success-surface)}

@media(max-width:900px){
  .ok-hub-hero{padding:30px 22px}
  .ok-hub-page .ok-crow-head{display:none}
  .ok-hub-stats{gap:12px 28px}
}

/* ═══ Hub pass 2026-07-05 (impeccable): comparison rows read as a data table, not sales
   cards — no shadow/lift, flush rows, quiet review link (CTA diet: one primary CTA per
   casino, carried by the toplist). Essays form one cool trust zone with a chapter threshold. */
.ok-hub-main .ok-crowtable{gap:0;border:1px solid var(--ok-line-2);border-radius:10px;background:#fff;overflow:hidden}
.ok-hub-main .ok-crow{box-shadow:none;border:0;border-bottom:1px solid var(--ok-line);border-radius:0;padding:13px 16px}
.ok-hub-main .ok-crow:last-child{border-bottom:0}
@media(hover:hover) and (pointer:fine){
  .ok-hub-main .ok-crow:hover{transform:none;box-shadow:none;background:#f8fafc}
}
.ok-hub-main .ok-crow-cta a{font-size:14px;font-weight:600;white-space:nowrap}
.ok-hub-main .ok-sec--essay{background:var(--ok-surface-cool)}
.ok-hub-main .ok-sec:not(.ok-sec--essay)+.ok-sec--essay{border-top:2px solid var(--ok-line-2)}

/* ═══ Dense hub list — filterable/sortable decision core (v3) ═══ */
/* Action colour = blue per locked system (green is a verdict colour, not a button). */
.ok-hub-page .ok-btn--primary{background:var(--ok-action);box-shadow:0 1px 2px rgba(20,67,173,.25),0 6px 14px -6px rgba(26,86,219,.45)}
.ok-hub-page .ok-btn--primary:hover{background:var(--ok-action-deep);box-shadow:0 2px 4px rgba(20,67,173,.3),0 10px 20px -6px rgba(26,86,219,.5)}
.ok-hub-page a:focus-visible,.ok-hub-page .ok-btn:focus-visible,.ok-hub-page summary:focus-visible,.ok-hub-page button:focus-visible{outline:3px solid var(--ok-action-ring);outline-offset:2px}

.ok-hubfilter{display:flex;flex-direction:column;gap:9px;margin:4px 0 14px}
.ok-hubfilter-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.ok-hubfilter-lbl{font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ok-muted);margin-right:2px}
.ok-fchip,.ok-hubfilter .ok-sortbtn{font:inherit;font-size:13.5px;font-weight:600;line-height:1;padding:8px 15px;border-radius:999px;border:1px solid var(--ok-line-2);background:#fff;color:var(--ok-text-soft);cursor:pointer;transition:background var(--ok-dur) var(--ok-ease),border-color var(--ok-dur) var(--ok-ease),color var(--ok-dur) var(--ok-ease)}
.ok-fchip:hover,.ok-hubfilter .ok-sortbtn:hover{border-color:var(--ok-action);color:var(--ok-ink)}
.ok-fchip.is-active{background:var(--ok-action);border-color:var(--ok-action);color:#fff}
.ok-hubfilter .ok-sortbtn.is-active{background:var(--ok-ink);border-color:var(--ok-ink);color:#fff}
.ok-hubfilter-count{font-size:12.5px;color:var(--ok-muted);margin-left:auto;font-variant-numeric:tabular-nums}

.ok-hublist{display:flex;flex-direction:column;gap:10px;margin:0}
.ok-hubrow{display:grid;grid-template-columns:38px 92px minmax(0,1fr) 100px 172px 178px;gap:16px;align-items:center;background:#fff;border:1px solid var(--ok-line);border-radius:14px;padding:13px 18px;box-shadow:0 1px 2px rgba(11,16,34,.04)}
@media(hover:hover){.ok-hubrow{transition:box-shadow var(--ok-dur) var(--ok-ease)}.ok-hubrow:hover{box-shadow:0 2px 4px rgba(11,16,34,.06),0 16px 32px -20px rgba(11,16,34,.28)}}
.ok-hubrow[hidden]{display:none}
.ok-hubrow--p1{border-color:var(--ok-mint);box-shadow:0 0 0 1px var(--ok-mint),0 10px 26px -18px rgba(11,124,77,.45)}
.ok-hubrow-rank{width:30px;height:30px;border-radius:9px;background:var(--ok-ink);color:#fff;font-family:var(--ok-font-display);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;justify-self:center}
.ok-hubrow--p1 .ok-hubrow-rank{background:var(--ok-podium-1)}
.ok-hubrow--p2 .ok-hubrow-rank{background:var(--ok-podium-2)}
.ok-hubrow--p3 .ok-hubrow-rank{background:var(--ok-podium-3)}
.ok-hubrow-logo{width:92px;height:52px;display:flex;align-items:center;justify-content:center}
.ok-hubrow-logo .okc-brand{grid-area:auto;width:92px;height:52px;display:flex;align-items:center;justify-content:center;background:transparent;padding:0}
.ok-hubrow-logo .okc-brand-img{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.ok-hubrow-logo .okc-brand-img img{max-width:92px;max-height:46px;width:auto;height:auto;display:block}
.ok-hubrow-logo .okc-brand-mono{width:46px;height:46px;border-radius:10px;font-size:18px}
.ok-hubrow-id{min-width:0;display:flex;flex-direction:column;gap:4px}
.ok-hubrow-name{font-family:var(--ok-font-display);font-size:16px;font-weight:700;color:var(--ok-link);text-decoration:none}
.ok-hubrow-name:hover{text-decoration:underline}
.ok-hubrow-best{font-size:12.5px;color:var(--ok-muted)}
.ok-hubrow-best b{color:var(--ok-text);font-weight:600}
.ok-hubrow-marks{display:flex;flex-wrap:wrap;gap:5px;margin-top:1px}
.ok-hubrow-mark{font-size:11px;font-weight:600;color:var(--ok-green-ink);background:var(--ok-surface-mint);border-radius:5px;padding:2px 7px;white-space:nowrap}
.ok-hubrow-score{justify-self:center}
/* Score pill (shared component — ported so it styles on the hub too) */
.ok-hub-page .okc-score{display:inline-flex;align-items:baseline;gap:1px;padding:4px 9px;border-radius:8px;background:var(--ok-surface-cool);font-family:var(--ok-font-display);line-height:1}
.ok-hub-page .okc-score b{font-size:15.5px;color:var(--band,var(--ok-ink))}
.ok-hub-page .okc-score i{font-size:9.5px;font-style:normal;color:var(--ok-muted)}
.ok-hub-page .okc-s1{--band:var(--ok-band-1)}.ok-hub-page .okc-s2{--band:var(--ok-band-2)}.ok-hub-page .okc-s3{--band:var(--ok-band-3)}
.ok-hub-page .okc-s4{--band:var(--ok-band-4)}.ok-hub-page .okc-s5{--band:var(--ok-band-5)}.ok-hub-page .okc-s0{--band:var(--ok-muted)}
.ok-hubrow-bonus{display:flex;flex-direction:column;gap:2px;font-size:13px;min-width:0}
.ok-hubrow-bonus b{color:var(--ok-gold-text);font-weight:700;line-height:1.3}
.ok-hubrow-nobonus{color:var(--ok-muted)}
.ok-hubrow-min{font-size:11.5px;color:var(--ok-muted)}
.ok-hubrow-cta{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.ok-hubrow-cta .ok-btn{width:100%;white-space:nowrap;padding:11px 14px;font-size:14.5px}
.ok-hubrow-cta a:not(.ok-btn){text-align:center;font-size:12.5px;color:var(--ok-link);font-weight:600;text-decoration:none;white-space:nowrap}
.ok-hubrow-cta a:not(.ok-btn):hover{text-decoration:underline}
.ok-hublist-empty{text-align:center;padding:26px 20px;color:var(--ok-muted);background:#fff;border:1px dashed var(--ok-line-2);border-radius:14px}
.ok-hublist-reset{background:none;border:0;color:var(--ok-action);font-weight:600;cursor:pointer;text-decoration:underline;font-size:inherit}
.ok-hublist-more{display:block;width:100%;margin-top:12px;padding:13px;background:#fff;border:1px solid var(--ok-line-2);border-radius:12px;font-family:var(--ok-font-display);font-weight:700;font-size:14.5px;color:var(--ok-action);cursor:pointer;transition:background var(--ok-dur) var(--ok-ease),border-color var(--ok-dur) var(--ok-ease)}
.ok-hublist-more:hover{background:var(--ok-surface-cool);border-color:var(--ok-action)}
.ok-hublist-more[hidden]{display:none}

/* Detailed data table, collapsed by default (secondary to the dense list) */
.ok-hubtable-fold{margin-top:6px}
.ok-hubtable-fold>summary{cursor:pointer;padding:13px 18px;font-family:var(--ok-font-display);font-weight:700;font-size:15px;color:var(--ok-ink);background:#fff;border:1px solid var(--ok-line-2);border-radius:12px;list-style:none;display:flex;align-items:center;gap:9px}
.ok-hubtable-fold>summary::-webkit-details-marker{display:none}
.ok-hubtable-fold>summary::before{content:"+";color:var(--ok-action);font-size:20px;font-weight:400;line-height:1}
.ok-hubtable-fold[open]>summary{border-radius:12px 12px 0 0;border-bottom:0}
.ok-hubtable-fold[open]>summary::before{content:"–"}
.ok-hubtable-fold .ok-hub-sort{margin:16px 0 12px}

@media(max-width:820px){
  .ok-hubrow{grid-template-columns:30px 54px minmax(0,1fr) auto;grid-template-areas:"rank logo id score" "bonus bonus bonus bonus" "cta cta cta cta";gap:9px 12px;padding:13px 14px}
  .ok-hubrow-rank{grid-area:rank;width:26px;height:26px;font-size:12.5px;border-radius:8px}
  .ok-hubrow-logo{grid-area:logo;width:54px;height:38px}
  .ok-hubrow-logo .okc-brand{width:54px;height:38px}
  .ok-hubrow-logo .okc-brand-img img{max-width:54px;max-height:32px}
  .ok-hubrow-logo .okc-brand-mono{width:34px;height:34px;font-size:15px}
  .ok-hubrow-id{grid-area:id}
  .ok-hubrow-score{grid-area:score;justify-self:end;align-self:start}
  .ok-hubrow-bonus{grid-area:bonus;flex-direction:row;gap:4px 10px;align-items:baseline;flex-wrap:wrap;align-self:center}
  .ok-hubrow-cta{grid-area:cta}
  .ok-hubrow-marks{gap:4px;margin-top:2px}
  .ok-hubrow-mark{font-size:10px;padding:2px 6px}
  .ok-hubfilter-count{margin-left:0;width:100%}
}