:root{
  --teamim-parse-keisarim-fill:rgba(220,0,0,.42);
  --teamim-parse-keisarim-border:rgba(178,0,0,.68);
  --teamim-parse-melachim-fill:rgba(224,132,24,.42);
  --teamim-parse-melachim-border:rgba(168,94,18,.66);
  --teamim-parse-mishnim-fill:rgba(96,155,232,.30);
  --teamim-parse-mishnim-border:rgba(47,102,192,.62);
  --teamim-parse-shalishim-fill:rgba(255,241,71,.46);
  --teamim-parse-shalishim-border:rgba(212,194,0,.58);
  --teamim-parse-meshartim-fill:rgba(54,120,96,.14);
  --teamim-parse-meshartim-border:rgba(43,98,78,.48);
  --teamim-node-surface:rgba(255,253,248,.94);
  --teamim-node-line:rgba(201,189,168,.86);
}

.teamim-stage{
  position:relative;
  overflow:hidden;
}

.teamim-stage::before,
.teamim-stage::after{
  content:"";
  position:absolute;
  pointer-events:none;
  border-radius:999px;
  filter:blur(10px);
  opacity:.85;
}

.teamim-stage::before{
  width:22rem;
  height:22rem;
  inset:auto auto -10rem -7rem;
  background:radial-gradient(circle at center, rgba(224,132,24,.22), rgba(224,132,24,0));
}

.teamim-stage::after{
  width:25rem;
  height:25rem;
  inset:-12rem -8rem auto auto;
  background:radial-gradient(circle at center, rgba(96,155,232,.16), rgba(96,155,232,0));
}

.teamim-shell{
  position:relative;
  display:grid;
  gap:2rem;
}

.teamim-section{
  display:grid;
  gap:1.2rem;
}

.teamim-section-head{
  max-width:52rem;
}

.teamim-section-head h2{
  margin:.1rem 0 .45rem;
  font-family:Georgia,"Times New Roman",ui-serif,serif;
  font-size:clamp(1.65rem, 2.5vw, 2.3rem);
  line-height:1.08;
}

.teamim-section-head p{
  margin:0;
  color:var(--ink-soft);
}

.teamim-overview-grid,
.teamim-flow-grid,
.teamim-servant-grid,
.teamim-rare-grid{
  display:grid;
  gap:1rem;
}

.teamim-overview-grid{
  grid-template-columns:repeat(auto-fit, minmax(15rem, 1fr));
}

.teamim-overview-card{
  position:relative;
  overflow:hidden;
  padding:1.35rem;
}

.teamim-overview-card::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg, rgba(20,53,52,.8), rgba(109,124,87,.4));
}

.teamim-overview-card h3{
  margin:0 0 .45rem;
  font-size:1rem;
}

.teamim-overview-card p{
  margin:0;
  color:var(--ink-soft);
}

.teamim-legend-card{
  padding:1.5rem;
  background:linear-gradient(180deg, rgba(255,253,248,.96), rgba(248,243,235,.82));
}

.teamim-parsing-text{
  margin:.4rem 0;
  color:var(--ink-soft);
  line-height:1.6;
}

.teamim-parsing-legend{
  list-style:none;
  padding:0;
  margin:.8rem 0;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(19rem, 100%), 1fr));
  gap:.7rem;
}

.teamim-parsing-legend li{
  padding:.85rem .95rem;
  border:1px solid rgba(201,189,168,.82);
  border-radius:20px;
  background:rgba(255,255,255,.72);
  line-height:1.55;
  color:var(--ink);
}

.teamim-parsing-legend li[data-rank="keisarim"]{
  border-color:var(--teamim-parse-keisarim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78)),
    linear-gradient(180deg, var(--teamim-parse-keisarim-fill), var(--teamim-parse-keisarim-fill));
}

.teamim-parsing-legend li[data-rank="melachim"]{
  border-color:var(--teamim-parse-melachim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78)),
    linear-gradient(180deg, var(--teamim-parse-melachim-fill), var(--teamim-parse-melachim-fill));
}

.teamim-parsing-legend li[data-rank="mishnim"]{
  border-color:var(--teamim-parse-mishnim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78)),
    linear-gradient(180deg, var(--teamim-parse-mishnim-fill), var(--teamim-parse-mishnim-fill));
}

.teamim-parsing-legend li[data-rank="shalishim"]{
  border-color:var(--teamim-parse-shalishim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78)),
    linear-gradient(180deg, var(--teamim-parse-shalishim-fill), var(--teamim-parse-shalishim-fill));
}

.teamim-parsing-legend li[data-rank="meshartim"]{
  border-width:1.5px;
  border-style:dashed;
  border-color:var(--teamim-parse-meshartim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78)),
    linear-gradient(180deg, var(--teamim-parse-meshartim-fill), var(--teamim-parse-meshartim-fill));
}

.teamim-legend-swatch{
  display:inline-block;
  width:1em;
  height:1em;
  border-radius:3px;
  vertical-align:-.08em;
  margin-inline-end:.32em;
}

.teamim-legend-keisarim{
  background:var(--teamim-parse-keisarim-fill);
  border:1.5px solid var(--teamim-parse-keisarim-border);
}

.teamim-legend-melachim{
  background:var(--teamim-parse-melachim-fill);
  border:1.5px solid var(--teamim-parse-melachim-border);
}

.teamim-legend-mishnim{
  background:var(--teamim-parse-mishnim-fill);
  border:1.5px solid var(--teamim-parse-mishnim-border);
}

.teamim-legend-shalishim{
  background:var(--teamim-parse-shalishim-fill);
  border:1.5px solid var(--teamim-parse-shalishim-border);
}

.teamim-legend-meshartim{
  background:var(--teamim-parse-meshartim-fill);
  border:1.5px solid var(--teamim-parse-meshartim-border);
}

.teamim-legend-rank{
  color:var(--ink-faint);
  font-size:.86em;
}

.teamim-flow-grid{
  gap:1.2rem;
}

.teamim-flow-row{
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(auto-fit, minmax(18.5rem, 1fr));
}

.teamim-chart-shell{
  padding:1.45rem;
  background:linear-gradient(180deg, rgba(255,253,248,.98), rgba(247,241,232,.9));
}

.teamim-chart-track{
  display:grid;
  gap:.9rem;
}

.teamim-chart-step{
  display:grid;
  gap:.65rem;
}

.teamim-chart-row-label{
  margin:0;
  color:var(--ink-faint);
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.03em;
  text-transform:uppercase;
}

.teamim-chart-row{
  display:grid;
  gap:.8rem;
  grid-template-columns:repeat(auto-fit, minmax(15rem, 1fr));
}

.teamim-chart-row[data-count="1"]{
  justify-content:center;
  grid-template-columns:minmax(0, 25rem);
}

.teamim-chart-card{
  display:grid;
  gap:.45rem;
  padding:1rem 1.05rem;
  border:1px solid var(--teamim-node-line);
  border-radius:22px;
  background:rgba(255,255,255,.8);
  box-shadow:var(--shadow-soft);
}

.teamim-chart-card[data-tone="family"]{
  background:linear-gradient(180deg, rgba(255,253,248,.98), rgba(246,240,228,.92));
}

.teamim-chart-card[data-rank="keisarim"]{
  border-color:var(--teamim-parse-keisarim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82)),
    linear-gradient(180deg, var(--teamim-parse-keisarim-fill), var(--teamim-parse-keisarim-fill));
}

.teamim-chart-card[data-rank="melachim"]{
  border-color:var(--teamim-parse-melachim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82)),
    linear-gradient(180deg, var(--teamim-parse-melachim-fill), var(--teamim-parse-melachim-fill));
}

.teamim-chart-card[data-rank="mishnim"]{
  border-color:var(--teamim-parse-mishnim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82)),
    linear-gradient(180deg, var(--teamim-parse-mishnim-fill), var(--teamim-parse-mishnim-fill));
}

.teamim-chart-card[data-rank="shalishim"]{
  border-color:var(--teamim-parse-shalishim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82)),
    linear-gradient(180deg, var(--teamim-parse-shalishim-fill), var(--teamim-parse-shalishim-fill));
}

.teamim-chart-card h3{
  margin:0;
  font-size:1.03rem;
  line-height:1.2;
}

.teamim-chart-subtitle{
  margin:0;
  color:var(--ink-faint);
  font-size:.84rem;
  font-weight:600;
}

.teamim-chart-list{
  margin:0;
  padding-left:1.15rem;
  display:grid;
  gap:.32rem;
  color:var(--ink-soft);
}

.teamim-chart-list li{
  line-height:1.45;
}

.teamim-chart-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--ink-faint);
  font-size:1.15rem;
  line-height:1;
}

.teamim-chart-notes{
  display:grid;
  gap:.45rem;
  padding-top:.2rem;
}

.teamim-chart-notes p{
  margin:0;
  color:var(--ink-soft);
  font-size:.92rem;
}

.teamim-family-card{
  display:grid;
  gap:1rem;
  padding:1.3rem;
}

.teamim-family-head{
  display:grid;
  gap:.4rem;
}

.teamim-rank-pill,
.teamim-node,
.teamim-chip{
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  max-width:100%;
  height:1.85rem;
  padding:0 .7rem;
  border-radius:999px;
  border:1px solid rgba(201,189,168,.82);
  background:rgba(255,255,255,.8);
  color:var(--ink);
  font-size:.84rem;
  font-weight:600;
  line-height:1;
  text-align:center;
  white-space:nowrap;
}

.teamim-rank-pill{
  width:auto;
  inline-size:max-content;
  justify-self:start;
  align-self:start;
  letter-spacing:.02em;
}

.teamim-rank-pill[data-rank="keisarim"],
.teamim-node[data-rank="keisarim"],
.teamim-chip[data-rank="keisarim"]{
  border-color:var(--teamim-parse-keisarim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.76)),
    linear-gradient(180deg, var(--teamim-parse-keisarim-fill), var(--teamim-parse-keisarim-fill));
}

.teamim-rank-pill[data-rank="melachim"],
.teamim-node[data-rank="melachim"],
.teamim-chip[data-rank="melachim"]{
  border-color:var(--teamim-parse-melachim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.76)),
    linear-gradient(180deg, var(--teamim-parse-melachim-fill), var(--teamim-parse-melachim-fill));
}

.teamim-rank-pill[data-rank="mishnim"],
.teamim-node[data-rank="mishnim"],
.teamim-chip[data-rank="mishnim"]{
  border-color:var(--teamim-parse-mishnim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.76)),
    linear-gradient(180deg, var(--teamim-parse-mishnim-fill), var(--teamim-parse-mishnim-fill));
}

.teamim-rank-pill[data-rank="shalishim"],
.teamim-node[data-rank="shalishim"],
.teamim-chip[data-rank="shalishim"]{
  border-color:var(--teamim-parse-shalishim-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.76)),
    linear-gradient(180deg, var(--teamim-parse-shalishim-fill), var(--teamim-parse-shalishim-fill));
}

.teamim-family-head h3{
  margin:0;
  font-size:1.08rem;
}

.teamim-family-head p{
  margin:0;
  color:var(--ink-soft);
}

.teamim-flow-points{
  margin:0;
  padding-left:1.2rem;
  display:grid;
  gap:.38rem;
  color:var(--ink-soft);
}

.teamim-flow-points li{
  line-height:1.5;
}

.teamim-flow-subsections{
  display:grid;
  gap:.7rem;
  margin-inline-start:1.35rem;
  padding-inline-start:.9rem;
  border-inline-start:1px solid rgba(201,189,168,.55);
}

.teamim-flow-subsection{
  display:grid;
  gap:.18rem;
}

.teamim-flow-subsection h4{
  margin:0;
  font-size:.88rem;
  color:var(--ink);
}

.teamim-flow-subsection p{
  margin:0;
  color:var(--ink-soft);
  line-height:1.5;
}

.teamim-chain-stack{
  display:grid;
  gap:.85rem;
}

.teamim-chain-option{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  gap:.6rem;
  align-items:start;
}

.teamim-chain-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:1.5rem;
  min-height:1.5rem;
  color:var(--ink-faint);
  font-size:.88rem;
  font-weight:700;
  line-height:1;
}

.teamim-chain{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  column-gap:0;
  row-gap:.55rem;
  min-width:0;
}

.teamim-node[data-tone="servant"]{
  border-style:dashed;
}

.teamim-connector{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--ink-faint);
  font-size:1rem;
  line-height:1;
}

.teamim-servant-grid{
  grid-template-columns:repeat(auto-fit, minmax(19rem, 1fr));
}

.teamim-servant-card{
  display:grid;
  gap:.95rem;
  padding:1.3rem;
}

.teamim-servant-head{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  gap:.8rem;
  align-items:start;
}

.teamim-servant-symbol{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.75rem;
  height:2.75rem;
  padding:0;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(20,53,52,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(246,240,228,.92));
  direction:rtl;
  unicode-bidi:isolate;
}

.teamim-servant-symbol-base,
.teamim-servant-symbol-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  font-size:1.2rem;
  font-weight:700;
  line-height:1;
}

.teamim-servant-symbol-base{
  position:relative;
  z-index:1;
}

.teamim-servant-symbol-mark{
  position:absolute;
  inset:0;
  z-index:2;
}

.teamim-servant-symbol-mark--above-center{
  clip-path:inset(0 24% 48% 24%);
}

.teamim-servant-symbol-mark--above-left{
  clip-path:inset(0 44% 48% 0);
}

.teamim-servant-symbol-mark--below-center{
  clip-path:inset(50% 24% 0 24%);
}

.teamim-servant-head h3{
  margin:0;
  font-size:1.05rem;
}

.teamim-servant-alias{
  margin:.12rem 0 0;
  color:var(--ink-faint);
  font-size:.88rem;
}

.teamim-servant-links{
  display:grid;
  gap:.72rem;
}

.teamim-link-row{
  display:grid;
  gap:.42rem;
}

.teamim-link-row-label{
  color:var(--ink-faint);
  font-size:.84rem;
  font-weight:700;
}

.teamim-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
}

.teamim-chip[data-rank="rare"]{
  border-style:dashed;
}

.teamim-servant-note{
  margin:0;
  color:var(--ink-soft);
  line-height:1.58;
}

.teamim-rare-grid{
  grid-template-columns:repeat(auto-fit, minmax(16rem, 1fr));
}

.teamim-rare-card{
  padding:1.2rem 1.25rem;
}

.teamim-rare-card h3{
  margin:0 0 .4rem;
  font-size:1rem;
}

.teamim-rare-card p{
  margin:0;
  color:var(--ink-soft);
  line-height:1.56;
}

html[dir="rtl"] .teamim-legend-swatch{
  margin-inline-end:0;
  margin-inline-start:.32em;
}

html[dir="rtl"] .teamim-flow-points{
  padding-left:0;
  padding-right:1.2rem;
}

html[dir="rtl"] .teamim-chart-list{
  padding-left:0;
  padding-right:1.15rem;
}

html[dir="rtl"] .teamim-chart-row-label{
  letter-spacing:0;
  text-transform:none;
}

@media (max-width: 720px){
  .teamim-family-card,
  .teamim-servant-card,
  .teamim-legend-card,
  .teamim-chart-shell{
    padding:1.1rem;
  }

  .teamim-servant-head{
    grid-template-columns:1fr;
  }

  .teamim-servant-symbol{
    width:fit-content;
  }
}
