:root{
  --ink:#101522;
  --muted:#687287;
  --line:#e4e8f0;
  --blue:#3157e5;
  --navy:#141c39;
  --green:#17a673;
  --orange:#ffb21c;
  --shadow:0 10px 35px rgba(30,42,80,.08);
}
*{box-sizing:border-box}
body{
  margin:0;
  color:var(--ink);
  background:#f8f9fc;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
button{cursor:pointer}
.shell{width:min(1180px,calc(100% - 32px));margin:0 auto}
.age-strip{background:var(--navy);color:#dbe2ff;font-size:12px}
.age-strip__inner{min-height:34px;display:flex;align-items:center;gap:10px}
.age-strip__inner span:first-child{
  display:grid;place-items:center;width:22px;height:22px;border-radius:50%;
  border:1px solid rgba(255,255,255,.45);font-weight:800;color:#fff
}
.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.header-inner{height:72px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:21px;letter-spacing:-.035em}
.logo-mark{
  display:grid;place-items:center;width:36px;height:36px;border-radius:11px;
  background:linear-gradient(145deg,#4168f0,#1d3fc4);color:#fff;font-weight:900;
  box-shadow:0 8px 20px rgba(49,87,229,.25)
}
.logo-mark.small{width:30px;height:30px;border-radius:9px;font-size:14px}
.header-meta{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px;font-weight:600}
.status-dot{width:8px;height:8px;background:#23b47e;border-radius:50%;box-shadow:0 0 0 4px rgba(35,180,126,.11)}
.hero{
  padding:68px 0 50px;
  display:grid;
  grid-template-columns:1fr 320px;
  gap:50px;
  align-items:end
}
.kicker{display:block;color:var(--blue);font-size:11px;font-weight:900;letter-spacing:.14em}
.hero h1{font-size:clamp(42px,6.2vw,72px);line-height:.98;letter-spacing:-.06em;margin:13px 0 18px;max-width:820px}
.hero h1 span{color:var(--blue)}
.hero-copy p{max-width:700px;color:var(--muted);font-size:17px;line-height:1.68;margin:0}
.hero-card{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow)}
.hero-card__icon{display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:12px;background:#e9f8f2;color:var(--green);font-weight:900}
.hero-card strong{font-size:14px}
.hero-card p{font-size:12px;line-height:1.5;color:var(--muted);margin:4px 0 0}
.ranking-section{padding-bottom:44px}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:20px}
.section-heading h2{font-size:32px;letter-spacing:-.04em;margin:8px 0 5px}
.section-heading p{color:var(--muted);font-size:13px;margin:0}
.result-count{font-size:12px;color:var(--muted);font-weight:700;background:#fff;border:1px solid var(--line);padding:9px 12px;border-radius:999px}
.table-head{
  display:grid;
  grid-template-columns:1.18fr .85fr 1.25fr 170px;
  gap:18px;
  padding:0 22px 9px 62px;
  color:#8992a4;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em
}
.casino-list{display:grid;gap:10px}
.casino-row{
  display:grid;
  grid-template-columns:1.18fr .85fr 1.25fr 170px;
  gap:18px;
  align-items:center;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:18px 20px;
  box-shadow:0 5px 22px rgba(30,42,80,.045);
  transition:.18s ease
}
.casino-row:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(30,42,80,.09);border-color:#d7def0}
.casino-identity{display:flex;align-items:center;gap:12px;min-width:0}
.rank-badge{
  display:grid;place-items:center;flex:0 0 28px;height:28px;border-radius:9px;
  background:#f1f3f8;color:#667085;font-size:12px;font-weight:900
}
.casino-row:first-child .rank-badge{background:#fff2ce;color:#a76d00}
.casino-logo{
  display:grid;place-items:center;flex:0 0 58px;height:58px;border-radius:14px;
  background:linear-gradient(145deg,#f4f6fb,#e9edf6);border:1px solid #e1e6ef;overflow:hidden
}
.casino-logo img{width:100%;height:100%;object-fit:contain;padding:7px}
.casino-logo span{font-weight:900;font-size:17px;color:#526078;letter-spacing:-.03em}
.casino-logo.compact{width:42px;height:42px;flex-basis:42px}
.casino-title-line{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.casino-title-line h3{margin:0;font-size:16px;letter-spacing:-.025em}
.pill{font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:#2749c9;background:#edf1ff;border:1px solid #dbe2ff;padding:4px 6px;border-radius:999px}
.stars{display:flex;align-items:center;gap:6px;margin-top:6px}
.stars span{color:var(--orange);letter-spacing:-2px;font-size:12px}
.stars b{font-size:11px;color:#737e91}
.cell-label{display:block;color:#9099aa;font-size:9px;font-weight:900;letter-spacing:.09em;margin-bottom:5px}
.offer-cell strong{display:block;font-size:16px;line-height:1.25}
.offer-cell small{display:block;margin-top:5px;color:var(--blue);font-size:11px;font-weight:700}
.details-cell{min-width:0}
.mini-facts{display:flex;gap:22px;margin-bottom:8px}
.mini-facts div{min-width:80px}
.mini-facts span{display:block;color:#8992a4;font-size:9px;text-transform:uppercase;font-weight:800;margin-bottom:2px}
.mini-facts b{font-size:12px}
.feature-chips{display:flex;gap:5px;flex-wrap:wrap}
.feature-chips span{font-size:9px;color:#4d5a70;background:#f4f6fa;border:1px solid #e9ecf2;padding:4px 6px;border-radius:7px}
.details-cell p{font-size:10px;color:#818b9d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:7px 0 0}
.action-cell{text-align:center}
.visit-button{
  width:100%;min-height:44px;padding:0 14px;
  display:flex;align-items:center;justify-content:center;gap:10px;
  border-radius:11px;background:linear-gradient(180deg,#3f66ed,#294fd5);
  color:#fff;font-size:12px;font-weight:900;
  box-shadow:0 8px 18px rgba(49,87,229,.22)
}
.visit-button:hover{background:linear-gradient(180deg,#355de8,#2246c3)}
.action-cell small{display:block;color:#929aaa;font-size:8px;margin-top:6px}
.editorial,.responsible{background:#fff;border:1px solid var(--line);border-radius:16px;padding:23px 25px;margin-bottom:18px}
.editorial{display:flex;gap:15px;align-items:flex-start}
.editorial-icon{display:grid;place-items:center;flex:0 0 36px;height:36px;border-radius:11px;background:#edf1ff;color:var(--blue);font-weight:900}
.editorial h3,.responsible h3{margin:0 0 6px;font-size:15px}
.editorial p,.responsible p{margin:0;color:var(--muted);font-size:12px;line-height:1.65}
.responsible{margin-bottom:60px}
footer{border-top:1px solid var(--line);background:#fff}
.footer-inner{height:76px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px}
.footer-brand{display:flex;align-items:center;gap:8px;color:var(--ink)}

/* login */
.login-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(145deg,#f1f4fb,#f9fafc)}
.login-card{width:min(440px,calc(100% - 28px));background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:var(--shadow)}
.login-logo{margin-bottom:28px}
.login-card h1{font-size:30px;letter-spacing:-.045em;margin:8px 0 20px}
.login-form{display:grid;gap:13px}
.login-form label span,.admin-form label span{display:block;font-size:10px;color:#707b8e;font-weight:800;margin-bottom:5px}
.login-form input,.admin-form input{
  width:100%;height:42px;padding:0 11px;border:1px solid #dce1ea;border-radius:9px;background:#fbfcfe;color:#1a2232;outline:none;font-size:12px
}
.login-form input:focus,.admin-form input:focus{border-color:#8298e8;box-shadow:0 0 0 3px rgba(49,87,229,.08)}
.button{
  min-height:42px;border-radius:10px;border:1px solid transparent;padding:0 15px;
  display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800
}
.button-primary{background:var(--blue);color:#fff}
.button-light{background:#fff;border-color:var(--line);color:#344056}
.button-danger-soft{background:#fff3f4;border-color:#f3d6d9;color:#bd3b46}
.login-button{width:100%}
.login-error{font-size:11px;color:#b63f4a;background:#fff2f3;border:1px solid #f3d4d8;padding:10px;border-radius:9px}

/* admin */
.admin-page{background:#f3f5f9}
.admin-shell{width:min(1240px,calc(100% - 32px));margin:0 auto}
.admin-header{background:#fff;border-bottom:1px solid var(--line)}
.admin-header__inner{padding:34px 0;display:flex;justify-content:space-between;gap:30px;align-items:center}
.admin-header h1{font-size:34px;letter-spacing:-.045em;margin:7px 0 7px}
.admin-header p{max-width:730px;color:var(--muted);font-size:12px;line-height:1.6;margin:0}
.admin-header__actions{display:flex;gap:9px;flex-shrink:0}
.admin-header__actions form{margin:0}
.admin-main{padding:24px 0 60px}
.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.admin-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:17px}
.admin-stat span{display:block;color:#8992a4;font-size:10px;font-weight:800;text-transform:uppercase}
.admin-stat strong{display:block;font-size:27px;margin-top:5px}
.admin-panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;margin-bottom:16px}
.admin-panel__heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:18px}
.admin-panel__heading h2{font-size:22px;letter-spacing:-.035em;margin:6px 0 0}
.admin-form{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}
.admin-form .wide{grid-column:span 2}
.form-submit{display:flex;justify-content:flex-end;margin-top:3px}
.admin-list{display:grid;gap:11px}
.admin-card{border:1px solid var(--line);border-radius:14px;padding:15px;background:#fbfcfe}
.admin-card__top{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:13px}
.admin-card__identity{display:flex;align-items:center;gap:10px}
.admin-card__identity strong{display:block;font-size:13px}
.admin-card__identity span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.state-active,.state-hidden{font-size:9px;font-weight:900;text-transform:uppercase;border-radius:999px;padding:5px 7px}
.state-active{color:#0f8a60;background:#e9f8f2}
.state-hidden{color:#7c8596;background:#eef0f4}
.edit-grid{grid-template-columns:repeat(4,1fr)}
.admin-card__actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
.admin-card__actions form{margin:0}

@media(max-width:1000px){
  .hero{grid-template-columns:1fr}
  .hero-card{max-width:420px}
  .table-head{display:none}
  .casino-row{grid-template-columns:1.1fr .8fr 1fr}
  .action-cell{grid-column:3}
  .details-cell p{display:none}
  .admin-form,.edit-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  .shell,.admin-shell{width:min(100% - 20px,1180px)}
  .header-meta{display:none}
  .hero{padding:45px 0 34px;gap:24px}
  .hero h1{font-size:43px}
  .section-heading{align-items:flex-start}
  .section-heading h2{font-size:27px}
  .casino-row{grid-template-columns:1fr;padding:15px;gap:14px}
  .offer-cell{padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .mini-facts{justify-content:space-between}
  .action-cell{grid-column:auto}
  .feature-chips{margin-top:8px}
  .details-cell p{display:block;white-space:normal}
  .editorial,.responsible{padding:18px}
  .footer-inner{height:auto;padding:22px 0;gap:15px;align-items:flex-start;flex-direction:column}
  .admin-header__inner{align-items:flex-start;flex-direction:column}
  .admin-header__actions{width:100%}
  .admin-header__actions .button{flex:1}
  .admin-stats{grid-template-columns:1fr 1fr 1fr}
  .admin-form,.edit-grid{grid-template-columns:1fr}
  .admin-form .wide{grid-column:auto}
}


.admin-form textarea{
  width:100%;
  min-height:110px;
  padding:10px 11px;
  border:1px solid #dce1ea;
  border-radius:9px;
  background:#fbfcfe;
  color:#1a2232;
  outline:none;
  font-size:12px;
  resize:vertical;
}
.admin-form textarea:focus{
  border-color:#8298e8;
  box-shadow:0 0 0 3px rgba(49,87,229,.08);
}

.details-toggle{
  margin-top:8px;
  width:100%;
  min-height:34px;
  border:1px solid #dce2ef;
  background:#f7f9fd;
  color:#405071;
  border-radius:9px;
  font-size:10px;
  font-weight:800;
}
.details-toggle:hover{
  background:#eef3ff;
  border-color:#cfd8ee;
}
.offer-details{
  grid-column:1 / -1;
  border-top:1px solid var(--line);
  margin-top:2px;
  padding-top:14px;
}
.offer-details__inner{
  background:#f7f9fc;
  border:1px solid #e6eaf1;
  border-radius:12px;
  padding:14px 16px;
}
.offer-details__inner strong{
  display:block;
  font-size:12px;
  margin-bottom:6px;
}
.offer-details__inner p{
  margin:0;
  color:#69758a;
  font-size:11px;
  line-height:1.65;
  white-space:pre-line;
}

@media(max-width:700px){
  .details-toggle{
    min-height:40px;
    font-size:11px;
  }
  .offer-details{
    margin-top:12px;
    padding-top:12px;
  }
  .offer-details__inner{
    padding:13px;
  }
}
.details-toggle {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 0;
  margin: 9px auto 2px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #52627d;
  font: inherit;
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
  transition: color .18s ease;
}

.details-toggle:hover {
  background: transparent;
  border: 0;
  color: #3157e5;
}

.offer-details {
  grid-column: 1 / -1;
  margin: 10px 0 0;
  padding: 0;
  border: 0;
}

.offer-details__inner {
  padding: 15px 18px;
  border: 1px solid #e3e8f2;
  border-radius: 12px;
  background: #f8faff;
}

.offer-details__inner strong {
  display: none;
}

.offer-details__inner p {
  margin: 0;
  color: #5e6b80;
  font-size: 11px;
  line-height: 1.65;
  white-space: pre-line;
}
/* Visitor analytics */

.visitor-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}

.visitor-stat {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8f9fc;
}

.visitor-stat span {
  display: block;
  color: #7b8699;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.visitor-stat strong {
  display: block;
  margin-top: 5px;
  font-size: 27px;
}

.visitor-stat small {
  display: block;
  margin-top: 3px;
  color: #99a1af;
  font-size: 9px;
}

.visitor-table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
}

.visitor-table {
  width: 100%;
  min-width: 850px;
  border-collapse: collapse;
  background: #fff;
}

.visitor-table th {
  padding: 10px 12px;
  text-align: left;
  color: #8690a3;
  background: #f7f8fb;
  border-bottom: 1px solid var(--line);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.visitor-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #edf0f5;
  font-size: 10px;
  vertical-align: top;
}

.visitor-table tr:last-child td {
  border-bottom: 0;
}

.visitor-time {
  white-space: nowrap;
  color: #5f6b7f;
}

.visitor-ip {
  white-space: nowrap;
  padding: 4px 6px;
  border-radius: 6px;
  background: #eef2fa;
  color: #32415e;
  font-size: 10px;
}

.visitor-agent {
  max-width: 480px;
  color: #68758a;
  word-break: break-word;
}

.visitor-empty {
  padding: 30px !important;
  text-align: center;
  color: #8d96a5;
}

.visitor-note {
  margin-top: 8px;
  color: #939baa;
  font-size: 9px;
  text-align: right;
}

@media (max-width: 700px) {
  .visitor-stats {
    grid-template-columns: 1fr 1fr;
  }

  .visitor-stat strong {
    font-size: 23px;
  }
}