/* Contextual Tekin page guide placements — reuses .atk-mascot animations */
.tekin-guide{
  --tekin-guide-size:200px;
  display:grid;
  grid-template-columns:var(--tekin-guide-size) minmax(0,1fr);
  gap:16px 20px;
  align-items:center;
  margin:18px 0 22px;
}
.tekin-guide--sm{--tekin-guide-size:clamp(120px,18vw,160px)}
.tekin-guide--md{--tekin-guide-size:clamp(170px,20vw,220px)}
.tekin-guide--lg{--tekin-guide-size:clamp(220px,22vw,280px)}
.tekin-guide--catalog{--tekin-guide-size:clamp(180px,18vw,230px)}
.tekin-guide__art{
  width:var(--tekin-guide-size);
  height:var(--tekin-guide-size);
  position:relative;
  margin:0 auto;
}
.tekin-guide__fallback,
.tekin-guide__art .atk-mascot{
  width:100%;height:100%;max-width:none;
}
.tekin-guide__fallback{display:block;object-fit:contain}
.tekin-guide__art .atk-mascot{--tekin-size:var(--tekin-guide-size);flex-direction:column;gap:0;align-items:center;justify-content:center}
.tekin-guide__art .atk-mascot__copy{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.tekin-guide__art .atk-mascot__art{width:var(--tekin-guide-size);height:var(--tekin-guide-size);flex:0 0 var(--tekin-guide-size)}
.tekin-guide.is-user-paused .atk-mascot__art,
.tekin-guide.is-user-paused .atk-mascot__art::before,
.tekin-guide.is-user-paused .atk-mascot__art svg circle,
.tekin-guide.is-user-paused .tekin-guide__fallback{animation:none!important;transform:none!important}
.tekin-guide__panel{min-width:0}
.tekin-guide__msg{
  margin:0 0 10px;
  color:var(--violet,#b9aef0);
  font:500 .92rem/1.5 Inter,system-ui,sans-serif;
  min-height:2.6em;
}
.tekin-guide.is-mascot-off .tekin-guide__art{display:none}
.tekin-guide.is-mascot-off{grid-template-columns:1fr}

.tekin-chooser{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}
.tekin-chooser button,.tekin-chooser select{
  min-height:44px;border-radius:12px;border:1px solid rgba(231,182,89,.34);
  background:rgba(7,11,32,.55);color:var(--text);padding:8px 12px;font:600 .85rem/1.2 Inter,system-ui,sans-serif;
}
.tekin-chooser button.is-on{border-color:rgba(246,213,144,.9);box-shadow:0 0 0 1px rgba(231,182,89,.25)}
.pcard.is-tekin-rec{border-color:rgba(231,182,89,.65);box-shadow:0 0 0 1px rgba(231,182,89,.2)}
.pcard.is-tekin-dim{opacity:.55}

@media (max-width:760px){
  .tekin-guide{grid-template-columns:1fr;justify-items:center;text-align:center}
  .tekin-guide__panel{width:100%;text-align:left}
}
