:root{
  --tk-fg:#e6feff;
  --tk-accent:#00e6ff;
  --tk-panel-bg:#0b1a20;
  --tk-panel-bg2:#0a1418;
  --tk-panel-bd:#00e6ff44;
  --tk-chip:#0d2730;
  --tk-btn-bd:#00e6ff77;
  --tk-btn-bg:transparent;
  --tk-btn-fg:var(--tk-fg);
  --tk-toolbar-bg:#06090c;
  --tk-toolbar-panel:#0c1820;
  --tk-toolbar-panel2:#0f212c;
  --tk-toolbar-shadow:0 10px 30px rgba(0,0,0,.45);
}

body[data-kinksurvey="1"].has-category-panel,
body.tk-ksv.has-category-panel{padding-left:0;}

body[data-kinksurvey="1"] .tk-hero{
  display:flex; flex-direction:column; align-items:center; gap:28px;
  margin:18px auto 26px; text-align:center;
}
body[data-kinksurvey="1"] .tk-hero .row,
body[data-kinksurvey="1"] .tk-hero .tk-row{display:flex; flex-wrap:wrap; justify-content:center; gap:28px;}
body[data-kinksurvey="1"] .tk-hero .row .cta,
body[data-kinksurvey="1"] .tk-hero .tk-row .cta,
body[data-kinksurvey="1"] .tk-hero .row .tk-cta,
body[data-kinksurvey="1"] .tk-hero .tk-row .tk-cta{display:inline-flex; align-items:center; justify-content:center; text-align:center;}
body[data-kinksurvey="1"] #startSurvey{display:inline-flex; margin-inline:auto;}
.tk-hero{
  display:flex; flex-direction:column; align-items:center; gap:18px;
  margin:6px auto 26px; text-align:center;
}
.tk-heroTop{display:flex; justify-content:center}
.tk-heroRow{display:flex; gap:14px; flex-wrap:wrap; justify-content:center}

.tk-title{
  font-weight:900; letter-spacing:.25px;
  font-size:clamp(28px, 4.6vw, 54px);
  margin:10px 0 8px;
  color:#d7fbff;
  text-shadow:0 2px 0 #001219;
}

.tk-btn{
  display:inline-block; padding:14px 22px; border:2px solid var(--tk-btn-bd);
  border-radius:12px; background:var(--tk-btn-bg); color:var(--tk-btn-fg);
  font-weight:800; letter-spacing:.2px; cursor:pointer; transition:.15s ease;
  box-shadow:0 0 0 1px #00141a inset;
}
.tk-btn:hover{transform:translateY(-1px); background:#07212a}
.tk-btn.xl{padding:16px 26px; font-size:1.05rem}

.tk-pill{
  display:inline-block; padding:12px 18px; border:2px solid var(--tk-btn-bd);
  border-radius:12px; color:var(--tk-fg); text-decoration:none; font-weight:800;
  background:transparent; box-shadow:0 0 0 1px #00141a inset;
}
.tk-pill:hover{background:#082029; transform:translateY(-1px)}

.tk-theme{display:flex; align-items:center; gap:10px; color:#c6f6ff; font-weight:700}
.tk-theme select{
  background:#071a1f; color:#eaffff; border:2px solid var(--tk-btn-bd);
  border-radius:10px; padding:8px 12px; outline:none;
}

/* Pop-out categories toolbar + drawer */
.tk-toolbar{
  position:sticky; top:0; z-index:40;
  display:flex; gap:12px; align-items:center; justify-content:center;
  background:linear-gradient(to bottom, rgba(6,9,12,.95), rgba(6,9,12,.6) 60%, rgba(6,9,12,0));
  padding:12px 12px 16px;
  backdrop-filter:blur(6px);
}

.tk-toolbar .tk-chip{margin-left:4px}

.tk-btn.tk-toolbar-btn{
  appearance:none;
  border:2px solid var(--tk-accent);
  color:var(--tk-fg);
  background:transparent;
  border-radius:12px;
  padding:10px 16px;
  font:600 16px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  cursor:pointer;
  transition:transform .05s ease, box-shadow .2s ease, background .2s ease;
  box-shadow:0 0 0 0 rgba(0,230,255,.35) inset;
}

.tk-btn.tk-toolbar-btn:hover{background:rgba(0,230,255,.08)}
.tk-btn.tk-toolbar-btn:active{transform:translateY(1px)}
.tk-btn.tk-toolbar-btn.primary{background:rgba(0,230,255,.12)}

#tkDrawerBackdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.45);
  backdrop-filter:blur(2px); z-index:60; display:none;
}

#tkCategoryDrawer{
  position:fixed; left:0; top:0; height:100dvh; width:min(420px,92vw);
  background:linear-gradient(180deg, var(--tk-toolbar-panel2), #0a151d);
  color:var(--tk-fg);
  border-right:2px solid rgba(0,230,255,.35);
  box-shadow:var(--tk-toolbar-shadow);
  transform:translateX(-100%);
  transition:transform .22s ease;
  z-index:61;
  display:grid; grid-template-rows:auto 1fr;
}

.tk-drawer-header{
  padding:14px 14px 10px; border-bottom:1px solid rgba(0,230,255,.18);
  display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center;
}

.tk-drawer-title{
  font:700 18px/1.25 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.2px;
}

.tk-drawer-actions{
  display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end;
}

.tk-chip{
  font:700 13px/1.1 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--tk-fg);
  background:rgba(0,230,255,.12);
  border:1px solid rgba(0,230,255,.3);
  padding:6px 10px;
  border-radius:999px;
}

.tk-drawer-body{overflow:auto; padding:12px 12px 16px;}

body.tk-drawer-open #tkDrawerBackdrop{display:block}
body.tk-drawer-open #tkCategoryDrawer{transform:translateX(0)}

.tk-fullscreen #tkCategoryDrawer{
  left:0;
  top:0;
  width:100vw;
  max-width:100vw;
  height:100dvh;
  transform:translateX(0) !important;
  border-right:none;
  border-radius:0;
  z-index:9999;
}

.tk-fullscreen #tkDrawerBackdrop{display:none !important}
.tk-fullscreen #tkToolbar{display:none !important}
.tk-body-lock{overflow:hidden}

.tk-original-panel-hidden{display:none !important}

#tkCategoryDrawer .category-list label,
#tkCategoryDrawer .category-list .category-row{
  display:grid; grid-template-columns:auto 1fr; align-items:center;
  gap:10px; padding:10px 12px; margin:8px 0;
  border:1px solid rgba(0,230,255,.18);
  border-radius:12px;
  background:rgba(255,255,255,.02);
}

#tkCategoryDrawer .category-list label:hover{background:rgba(255,255,255,.05)}

#tkDrawerContent .category-list{margin:0}

/* Wider, easier-to-see category panel */
.tk-wide-panel{
  width:min(980px, 94vw) !important;
  background:linear-gradient(180deg,var(--tk-panel-bg),var(--tk-panel-bg2));
  border:1px solid var(--tk-panel-bd);
  border-radius:14px; padding:14px !important;
  box-shadow:0 10px 40px #0009, 0 0 0 1px #00141a inset;
  color:var(--tk-fg);
}

/* Counter bar */
.tk-catbar{
  display:flex; align-items:center; justify-content:flex-start;
  gap:12px; padding:10px 8px 12px;
}
.tk-catbar button{min-width:0}
.tk-counter{
  display:inline-flex; align-items:center; gap:7px; font-weight:800;
  background:var(--tk-chip); border:1px solid #00e6ff22; color:var(--tk-fg);
  padding:6px 10px; border-radius:10px;
}

/* Category list: grid + headings */
.tk-catgrid{
  display:grid; grid-template-columns:repeat(2, minmax(300px, 1fr));
  gap:14px 18px; margin-top:8px;
}
@media (max-width: 860px){
  .tk-catgrid{grid-template-columns:1fr}
}
.tk-letter{
  grid-column:1/-1; display:flex; align-items:center; gap:10px;
  font-weight:900; color:#aaf9ff; margin:12px 0 4px;
}
.tk-letter::after{
  content:""; height:1px; background:#00e6ff22; flex:1;
}

/* Each checkbox row prettier */
.tk-cat{
  display:flex; align-items:center; gap:12px;
  background:#07191f; border:1px solid #00e6ff22; border-radius:12px;
  padding:12px 14px;
}
.tk-cat input[type="checkbox"]{width:18px; height:18px}
.tk-cat .lbl{font-weight:800; letter-spacing:.15px}

/* Make original category panel easier to read */
.category-panel{color:var(--tk-fg)}