@charset "UTF-8";
/* Reusable STEP, flow, checklist, controls, stats and comparison UI. */
.gamelinq-steps{counter-reset:gamelinq-step;display:grid;gap:12px;margin:20px 0;padding:0;list-style:none}.gamelinq-steps>li{counter-increment:gamelinq-step;position:relative;min-height:44px;padding:10px 12px 10px 58px}.gamelinq-steps>li::before{content:counter(gamelinq-step);position:absolute;left:0;top:4px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--gamelinq-color-primary);color:#fff;font-weight:800}
.gamelinq-timeline{position:relative;display:grid;gap:20px;margin:24px 0;padding-left:28px}.gamelinq-timeline::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:var(--gamelinq-color-border)}.gamelinq-timeline__item{position:relative}.gamelinq-timeline__item::before{content:"";position:absolute;left:-27px;top:.55em;width:12px;height:12px;border-radius:50%;background:var(--gamelinq-color-teal)}
.gamelinq-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.gamelinq-flow>*{position:relative;padding:20px;border:1px solid var(--gamelinq-color-border);border-radius:var(--gamelinq-radius-md);background:#fff}.gamelinq-flow>*:not(:last-child)::after{content:"→";position:absolute;right:-17px;top:50%;z-index:1;color:var(--gamelinq-color-primary);font-weight:900}
/* GameLinQ article UI component library (2026-09-09) */
.glq-component{
  min-width:0;
  border:1px solid var(--glq-line);
  border-radius:14px;
  background:#fff;
  box-shadow:var(--glq-shadow);
}
.glq-component-title{
  display:flex;
  min-width:0;
  align-items:center;
  gap:12px;
  margin:0 0 16px;
}
.glq-component-title__number{
  display:grid;
  width:48px;
  height:48px;
  flex:0 0 48px;
  place-items:center;
  border-radius:11px;
  background:linear-gradient(145deg,#1899f0,#075fd6);
  color:#fff;
  font-size:21px;
  font-weight:900;
  box-shadow:0 6px 14px rgba(5,112,213,.2);
}
.glq-component-title h3{
  height:auto;
  margin:0;
  padding:0;
  border:0;
  background:none;
  color:var(--glq-navy);
  font-size:24px;
  line-height:1.25;
}
.glq-component-title p{
  margin:0 0 0 auto;
  color:#5c7694;
  font-size:12px;
  line-height:1.5;
}
.glq-step-list{
  display:grid;
  gap:14px;
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:glq-step;
}
.glq-step-list>li{
  counter-increment:glq-step;
  position:relative;
  display:grid;
  min-height:102px;
  grid-template-columns:58px minmax(0,1fr);
  gap:16px;
  align-items:center;
  margin-left:26px;
  padding:15px 18px;
  border:1px solid var(--glq-line);
  border-radius:12px;
  background:linear-gradient(105deg,#fff,#f0f9ff);
}
.glq-step-list>li::before{
  position:absolute;
  left:-48px;
  top:24px;
  display:grid;
  width:40px;
  height:40px;
  place-items:center;
  border-radius:50%;
  background:#e6f3fc;
  color:var(--glq-navy);
  content:counter(glq-step);
  font-weight:900;
}
.glq-step-list>li:first-child::before{background:linear-gradient(145deg,#159bf0,#075fd7);color:#fff}
.glq-step-list>li:not(:last-child)::after{
  position:absolute;
  left:-29px;
  top:65px;
  width:2px;
  height:52px;
  background:#a9d5f3;
  content:"";
}
.glq-step-list__icon{
  display:grid;
  width:54px;
  height:54px;
  place-items:center;
  border-radius:50%;
  background:#e8f5ff;
  color:var(--glq-blue);
  font-size:25px;
  font-weight:900;
}
.glq-step-list strong{display:block;color:#0873d5;font-size:19px}
.glq-step-list p{margin:3px 0 0;color:#486b91;font-size:14px;line-height:1.55}
.glq-flow{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
}
.glq-flow-card{
  position:relative;
  display:grid;
  min-height:246px;
  align-content:start;
  justify-items:center;
  padding:24px 16px 18px;
  border:1px solid var(--glq-line);
  border-radius:12px;
  background:#fff;
  text-align:center;
}
.glq-flow-card:not(:last-child)::after{
  position:absolute;
  right:-22px;
  top:44%;
  color:var(--glq-blue);
  content:"›";
  font-size:36px;
  font-weight:900;
}
.glq-flow-card__icon{
  display:grid;
  width:70px;
  height:70px;
  place-items:center;
  border-radius:50%;
  background:#eaf6ff;
  color:var(--glq-blue);
  font-size:29px;
  font-weight:900;
}
.glq-flow-card strong{margin-top:12px;font-size:18px}
.glq-flow-card p{margin:7px 0 12px;color:#506f91;font-size:13px;line-height:1.55}
.glq-flow-card small{
  align-self:end;
  width:88%;
  margin-top:auto;
  border-radius:99px;
  background:#e7f4fd;
  color:#0877d8;
  font-weight:900;
}
.glq-checklist,.glq-condition-list{
  display:grid;
  gap:9px;
  margin:0;
  padding:0;
  list-style:none;
}
.glq-checklist li,.glq-condition-list li{
  display:grid;
  min-height:64px;
  grid-template-columns:42px minmax(0,1fr) auto;
  gap:13px;
  align-items:center;
  padding:10px 14px;
  border:1px solid var(--glq-line);
  border-radius:10px;
  background:#fff;
}
.glq-checklist li::before{
  display:grid;
  width:32px;
  height:32px;
  place-items:center;
  border:2px solid #087fe0;
  border-radius:6px;
  background:#087fe0;
  color:#fff;
  content:"✓";
  font-weight:900;
  box-sizing:border-box;
}
.glq-checklist__mark{display:none}
.glq-checklist strong,.glq-condition-list strong{display:block;line-height:1.35}
.glq-checklist small,.glq-condition-list small{display:block;color:#65809d;line-height:1.4}
.glq-condition-list__icon{
  display:grid;
  width:38px;
  height:38px;
  place-items:center;
  border-radius:9px;
  background:#e9f5ff;
  color:#0875d8;
  font-weight:900;
}
.glq-tag{
  display:inline-flex;
  min-width:54px;
  min-height:28px;
  align-items:center;
  justify-content:center;
  padding:4px 11px;
  border-radius:99px;
  font-size:12px;
  font-weight:900;
}
.glq-tag--required{background:#fff0f1;color:#d91c38}
.glq-tag--optional{background:#e8f4ff;color:#0875d8}
.glq-control-groups{display:grid;gap:12px}
.glq-control-group{
  padding:14px 16px;
  border-radius:12px;
  background:linear-gradient(105deg,#f2f9ff,#eaf6ff);
}
.glq-control-group>strong{display:block;margin-bottom:12px;color:#0b3a74}
.glq-control-row{display:flex;flex-wrap:wrap;align-items:flex-start;gap:18px}
.glq-control-set{display:grid;justify-items:center;gap:7px;padding-right:18px;border-right:1px solid #b9d7eb}
.glq-control-set:last-child{padding-right:0;border-right:0}
.glq-control-set>span:last-child{color:#496b90;font-size:12px}
.glq-key{
  display:inline-grid;
  min-width:39px;
  height:39px;
  place-items:center;
  margin:0 2px;
  padding:0 10px;
  border:1px solid #b6c8d8;
  border-bottom-width:5px;
  border-radius:7px;
  background:#fff;
  color:#0b2d5e;
  font-weight:900;
  box-shadow:0 2px 5px rgba(8,45,90,.08);
}
.glq-key--wide{min-width:110px}
.glq-pad{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border:3px solid color-mix(in srgb,var(--pad) 70%,#fff);
  border-radius:50%;
  background:var(--pad);
  color:#fff;
  font-weight:900;
  box-shadow:0 4px 10px color-mix(in srgb,var(--pad) 20%,transparent);
}
.glq-stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.glq-stat{
  --stat:#087fe0;
  display:grid;
  min-height:120px;
  grid-template-columns:minmax(0,1fr);
  align-items:center;
  padding:16px;
  border-radius:12px;
  background:color-mix(in srgb,var(--stat) 8%,#fff);
}
.glq-stat__icon{
  display:none;
}
.glq-stat small{display:block;color:var(--stat);font-weight:800}
.glq-stat strong{display:block;color:var(--stat);font-size:38px;line-height:1}
.glq-stat span{color:#516f90;font-size:12px}
.glq-stat span b{margin-left:8px;color:var(--stat)}
.glq-outcomes,.glq-procon{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.glq-outcome,.glq-procon__panel{
  --tone:#10a873;
  padding:19px;
  border:1px solid color-mix(in srgb,var(--tone) 28%,#fff);
  border-radius:12px;
  background:color-mix(in srgb,var(--tone) 8%,#fff);
}
.glq-outcome--fail,.glq-procon__panel--demerit{--tone:#ee3451}
.glq-outcome h4,.glq-procon h4{
  display:flex;
  height:auto;
  align-items:center;
  gap:10px;
  margin:0 0 12px;
  padding:0 0 12px;
  border:0;
  border-bottom:1px solid color-mix(in srgb,var(--tone) 24%,#fff);
  background:none;
  color:var(--tone);
  font-size:23px;
}
.glq-outcome h4 span,.glq-procon h4 span{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:50%;
  background:var(--tone);
  color:#fff;
}
.glq-outcome ul,.glq-procon ul{margin:0;padding:0;list-style:none}
.glq-outcome li,.glq-procon li{position:relative;margin:8px 0;padding-left:25px;color:#3d6084}
.glq-outcome li::before,.glq-procon li::before{
  position:absolute;
  left:0;
  top:.15em;
  display:grid;
  width:18px;
  height:18px;
  place-items:center;
  border-radius:50%;
  background:var(--tone);
  color:#fff;
  content:"✓";
  font-size:11px;
  font-weight:900;
}
.glq-outcome--fail li::before,.glq-procon__panel--demerit li::before{content:"×"}

/* Shared two-, three-, and four-column content panels. */
.glq-procon h4 span .fa{
  color:inherit;
  font-size:18px;
  line-height:1;
}
.glq-columns{
  display:grid;
  min-width:0;
  gap:14px;
  align-items:stretch;
}
.glq-columns--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.glq-columns--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.glq-columns--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.glq-column{
  min-width:0;
  padding:18px 20px;
  border:1px solid #d6e8f6;
  border-radius:12px;
  background:linear-gradient(145deg,#fff 0%,#f5fbff 100%);
  box-shadow:0 5px 16px rgba(17,74,119,.07);
  overflow-wrap:anywhere;
}
.glq-column>strong{
  display:block;
  margin:0 0 7px;
  color:#153f6d;
  font-size:17px;
  line-height:1.4;
}
.glq-column>p{
  margin:0;
  color:#486b91;
  font-size:14px;
  line-height:1.65;
}
.glq-column>*:first-child{margin-top:0}
.glq-column>*:last-child{margin-bottom:0}
.glq-column>p:empty{display:none}
.glq-column img{max-width:100%;height:auto}

.glq-columns--2>.glq-column:nth-child(1),
.glq-columns--3>.glq-column:nth-child(1),
.glq-columns--4>.glq-column:nth-child(1){
  border-color:#b9ddf7;
  background:linear-gradient(145deg,#fff 0%,#f1f8ff 100%);
}
.glq-columns--2>.glq-column:nth-child(1)>strong,
.glq-columns--3>.glq-column:nth-child(1)>strong,
.glq-columns--4>.glq-column:nth-child(1)>strong{color:#0b6fc8}
.glq-columns--2>.glq-column:nth-child(2),
.glq-columns--3>.glq-column:nth-child(2),
.glq-columns--4>.glq-column:nth-child(2){
  border-color:#bfe8d1;
  background:linear-gradient(145deg,#fff 0%,#f1faf5 100%);
}
.glq-columns--2>.glq-column:nth-child(2)>strong,
.glq-columns--3>.glq-column:nth-child(2)>strong,
.glq-columns--4>.glq-column:nth-child(2)>strong{color:#16805b}
.glq-columns--3>.glq-column:nth-child(3),
.glq-columns--4>.glq-column:nth-child(3){
  border-color:#f0d7a7;
  background:linear-gradient(145deg,#fff 0%,#fff8ec 100%);
}
.glq-columns--3>.glq-column:nth-child(3)>strong,
.glq-columns--4>.glq-column:nth-child(3)>strong{color:#a66a12}
.glq-columns--4>.glq-column:nth-child(4){
  border-color:#d9c8f2;
  background:linear-gradient(145deg,#fff 0%,#f8f3ff 100%);
}
.glq-columns--4>.glq-column:nth-child(4)>strong{color:#7650aa}

.glq-compare-table th.is-best,.glq-compare-table td.is-best{
  border-inline:2px solid #1687e5;
  background:#eaf6ff;
  color:#076fd1;
  font-weight:900;
}
.glq-compare-table th.is-best{position:relative;border-top:2px solid #1687e5}
.glq-compare-table tr:last-child td.is-best{border-bottom:2px solid #1687e5}
.glq-rank{
  display:inline-grid;
  min-width:40px;
  height:26px;
  place-items:center;
  border-radius:99px;
  background:#e6f1fa;
  color:#143c69;
  font-weight:900;
}
.glq-rank--best{background:#087fe0;color:#fff}

@media(max-width:1024px){
  .glq-columns--3,.glq-columns--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .glq-columns--3>.glq-column:last-child:nth-child(odd){grid-column:1/-1}
}

@media(max-width:767px){
  .glq-component{border-radius:11px}
  .glq-component-title{gap:9px;margin-bottom:12px;align-items:flex-start}
  .glq-component-title__number{width:42px;height:42px;flex-basis:42px;font-size:18px}
  .glq-component-title h3{font-size:20px}
  .glq-component-title p{max-width:45%;font-size:10px}
  .glq-step-list>li{min-height:90px;grid-template-columns:45px minmax(0,1fr);gap:11px;margin-left:23px;padding:12px}
  .glq-step-list>li::before{left:-41px;width:35px;height:35px}
  .glq-step-list>li:not(:last-child)::after{left:-24px;top:59px;height:47px}
  .glq-step-list__icon{width:43px;height:43px;font-size:20px}
  .glq-step-list strong{font-size:16px}.glq-step-list p{font-size:12px}
  .glq-flow{grid-template-columns:1fr;gap:24px}
  .glq-flow-card{min-height:150px;padding:18px}
  .glq-flow-card:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-25px;transform:rotate(90deg)}
  .glq-flow-card__icon{width:55px;height:55px;font-size:23px}
  .glq-checklist li,.glq-condition-list li{min-height:57px;grid-template-columns:35px minmax(0,1fr) auto;gap:9px;padding:8px 10px}
  .glq-checklist li::before{width:29px;height:29px}.glq-condition-list__icon{width:32px;height:32px}
  .glq-checklist strong,.glq-condition-list strong{font-size:13px}.glq-checklist small,.glq-condition-list small{font-size:11px}
  .glq-tag{min-width:46px;min-height:25px;padding:3px 8px;font-size:10px}
  .glq-control-group{padding:12px}
  .glq-control-row{gap:11px}
  .glq-control-set{padding-right:10px}
  .glq-key{min-width:32px;height:34px;padding:0 7px;font-size:12px}.glq-key--wide{min-width:86px}
  .glq-pad{width:36px;height:36px}
  .glq-stats{gap:8px}
  .glq-stat{min-height:98px;grid-template-columns:minmax(0,1fr);padding:11px}
  .glq-stat__icon{display:none}
  .glq-stat strong{font-size:29px}
  .glq-outcomes,.glq-procon{grid-template-columns:1fr;gap:10px}
  .glq-outcome,.glq-procon__panel{padding:15px}
  .glq-outcome h4,.glq-procon h4{font-size:19px}
  .glq-columns--2,.glq-columns--3,.glq-columns--4{grid-template-columns:1fr}
  .glq-columns--3>.glq-column:last-child:nth-child(odd){grid-column:auto}
  .glq-column{padding:16px}
}


/* Article UI correction and reusable promotion (2026-09-09) */
.glq-component>p:empty,
.glq-demo-label>p:empty,
.glq-step-list>li>p:empty,
.glq-flow-card>p:empty,
.glq-checklist>li>p:empty,
.glq-condition-list>li>p:empty,
.glq-stat>p:empty,
.glq-outcome>p:empty,
.glq-procon__panel>p:empty{
  display:none;
}
.glq-step-list{
  padding-left:50px;
}
.glq-step-list>li{
  width:auto;
  margin-left:0;
}
.glq-flow-card__icon i,
.glq-flow-card__icon .fa{
  color:inherit;
  font-size:30px;
  line-height:1;
}
.glq-step-list__icon .fa,
.glq-stat__icon .fa{
  color:inherit;
  font-size:1em;
  line-height:1;
}

@media(max-width:767px){
  .glq-step-list{
    padding-left:42px;
  }
  .glq-step-list>li::before{
    left:-40px;
  }
  .glq-step-list>li:not(:last-child)::after{
    left:-23px;
  }
  .glq-flow-card__icon i,
  .glq-flow-card__icon .fa{
    font-size:24px;
  }
}


/* Article UI STEP cascade guard (2026-09-09) */
.entry-content .glq-step-list{
  margin:0;
  padding-left:50px;
}
.entry-content .glq-step-list>li{
  width:auto;
  margin:0;
}
@media(max-width:767px){
  .entry-content .glq-step-list{
    padding-left:42px;
  }
  .entry-content .glq-step-list>li{
    margin:0;
  }
}

/* Space between article headings and the first guide component. */
:is(.entry-content,.gamelinq-content) :is(h2,h3,h4) + :is(.glq-step-list,.glq-flow,.glq-checklist,.glq-condition-list){
  margin-top:24px;
}
@media(max-width:767px){
  :is(.entry-content,.gamelinq-content) :is(h2,h3,h4) + :is(.glq-step-list,.glq-flow,.glq-checklist,.glq-condition-list){
    margin-top:20px;
  }
}