/* Small tools (st_): Islamic midnight, the Prophet's family tree, name generator, Hijri months, six days of Shawwal. Builds on ak.css tokens. */
.st_two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.tool_field input[type=time]{width:100%;min-height:2.75rem;padding:.6rem .85rem;border-radius:var(--r2);border:1px solid var(--line);background:var(--page);font:400 .9375rem/1.4 var(--font);
  box-shadow:0 1px 2px rgba(10,10,10,.05);-webkit-appearance:none;appearance:none}
.tool_field input[type=time]:focus-visible{outline:none;border-color:var(--lapis);box-shadow:var(--ring)}
.st_out{padding:.85rem 1rem;border-radius:var(--r2);background:var(--lapis-tint);box-shadow:inset 0 0 0 1px rgba(29,58,138,.2);font-size:.9375rem;line-height:1.5}
.st_out:empty{display:none}
.st_out b{font:500 1.25rem/1.2 var(--mono);letter-spacing:-.02em;color:var(--lapis)}
.st_tbl{overflow-x:auto;border-radius:var(--r2);background:var(--page);box-shadow:inset 0 0 0 1px var(--line)}
.st_tbl .times th,.st_tbl .times td{padding:.7rem .75rem;font-size:.875rem}
.st_tbl .times td.t{font:500 .9375rem/1.2 var(--mono);white-space:nowrap}
.st_tbl .times td:last-child,.st_tbl .times th:last-child{text-align:left}
@media (max-width:420px){.st_tbl .times th,.st_tbl .times td{padding:.6rem .45rem;font-size:.8125rem}.st_tbl .times td.t{font-size:.8125rem}}

/* Family tree */
.st_ft{display:grid;gap:1.25rem}
.st_bar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:space-between}
.st_bar .tool_ab button{height:2.25rem;padding:0 .85rem;font-size:.875rem}
.st_grp{display:grid;gap:.75rem;padding:1.25rem;border-radius:var(--r2);background:var(--page);box-shadow:inset 0 0 0 1px var(--line);scroll-margin-top:6rem}
.st_grp[hidden]{display:none}
.st_grp > h3{font:500 1.125rem/1.3 var(--font);letter-spacing:-.015em}
.st_grp > p.note{margin-block-start:-.4rem}
.st_list,.st_list ul{display:grid;gap:.375rem;margin:0;padding:0;list-style:none}
.st_list ul{position:relative;margin:.375rem 0 0 1rem;padding-inline-start:1rem;border-inline-start:2px solid var(--line)}
.st_list ul > li{position:relative}
.st_list ul > li::before{content:"";position:absolute;top:1.4rem;left:-1rem;width:.85rem;border-top:2px solid var(--line)}
@media (max-width:480px){.st_list ul{margin-inline-start:.5rem;padding-inline-start:.75rem}.st_list ul > li::before{left:-.75rem;width:.6rem}.st_grp{padding:1rem .85rem}}
.st_chain{counter-reset:none}
.st_chain > li{position:relative;padding-inline-start:1.5rem}
.st_chain > li::before{content:"";position:absolute;top:0;bottom:-.375rem;left:.4rem;border-inline-start:2px solid var(--gold-soft)}
.st_chain > li::after{content:"";position:absolute;top:1.15rem;left:.15rem;width:.6rem;height:.6rem;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px var(--page)}
.st_chain > li:first-child::before{top:1.2rem}
.st_chain > li:last-child::before{bottom:auto;height:1.2rem}
.st_node{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.1rem .75rem;align-items:baseline;width:100%;padding:.6rem .8rem;border:0;border-radius:var(--r2);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-soft);
  text-align:left;cursor:pointer;font-size:.9375rem;line-height:1.35;transition:box-shadow .15s,background-color .15s}
.st_node:hover{box-shadow:inset 0 0 0 1px #CFCFD4}
.st_node:focus-visible{outline:none;box-shadow:var(--ring)}
.st_node[aria-expanded="true"]{background:var(--lapis-tint);box-shadow:inset 0 0 0 1px rgba(29,58,138,.35)}
.st_node b{font-weight:500}
.st_node .st_ar{margin-left:auto;font:400 1.0625rem/1.2 var(--arabic);color:var(--gold-ink)}
.st_node small{flex-basis:100%;font-size:.8125rem;color:var(--muted)}
.st_node b{min-width:0}
.st_node .st_gen{font:400 .8125rem/1 var(--mono);color:var(--faint);margin-inline-end:.4rem}
.st_det{display:grid;gap:.4rem;margin:.375rem 0 .25rem;padding:.75rem .85rem;border-radius:var(--r2);background:var(--page);box-shadow:inset 0 0 0 1px var(--line);font-size:.9375rem;line-height:1.6}
.st_det[hidden]{display:none}
.st_det p{font-size:.9375rem;line-height:1.6}
.st_det .st_src{font:400 .8125rem/1.5 var(--mono);color:var(--muted)}
.st_det .st_when{font-size:.8125rem;color:var(--lapis)}
.st_me .st_node{background:linear-gradient(180deg,#22419A,var(--lapis));color:#fff;box-shadow:none}
.st_me .st_node small,.st_me .st_node .st_gen{color:var(--gold-soft)}
.st_me .st_node .st_ar{color:var(--gold-soft)}
.st_me .st_node[aria-expanded="true"]{box-shadow:0 0 0 3px var(--gold-soft)}
.st_cols{display:grid;gap:1rem}
@media (min-width:900px){.st_cols{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}}

/* Name generator */
@media (max-width:1023px){.st_gen .tool_side{order:-1}}
.st_res{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr));gap:.6rem}
.st_res .in_card b a{color:var(--text)}
.st_res .in_card b a:hover{text-decoration:underline}
.st_tags{display:flex;flex-wrap:wrap;gap:.3rem;margin-block-start:.2rem}
.st_saved{display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0;list-style:none}
.st_saved a{display:inline-flex;align-items:center;height:2rem;padding:0 .75rem;border-radius:999px;font-size:.875rem;background:var(--page);box-shadow:inset 0 0 0 1px var(--line)}
.st_saved a:hover{box-shadow:inset 0 0 0 1px var(--text)}
.st_count{font:400 .8125rem/1.4 var(--mono);color:var(--muted)}

/* Hijri months */
.st_mon{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr));align-items:start}
.st_mcard{display:grid;gap:.5rem;padding:1.1rem 1.15rem;border-radius:var(--r2);background:var(--page);box-shadow:inset 0 0 0 1px var(--line);scroll-margin-top:6rem}
.st_mcard.is-now{box-shadow:inset 0 0 0 2px var(--lapis)}
.st_mtop{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem}
.st_mtop h3{font:500 1.125rem/1.3 var(--font);letter-spacing:-.015em}
.st_mtop h3 span{font:400 .8125rem var(--mono);color:var(--faint);margin-inline-end:.35rem}
.st_mar{font:400 1.625rem/1.3 var(--arabic);color:var(--lapis);white-space:nowrap}
.st_mtl{font:italic 400 1rem/1.4 var(--translit);color:var(--muted)}
.st_mcard p{font-size:.9375rem;line-height:1.6}
.st_mcard ul{display:grid;gap:.25rem;margin:0;padding:0;list-style:none;font-size:.875rem}
.st_mcard ul a{color:var(--lapis)}
.st_mcard ul a:hover{text-decoration:underline}
.st_mdates{font:400 .8125rem/1.6 var(--mono);color:var(--muted)}
.st_mtable td.st_ar2{font:400 1.25rem/1.2 var(--arabic);color:var(--lapis);white-space:nowrap}
.st_mtable tr.is-now td{background:var(--lapis-tint)}
.st_mtable tr.is-now td:first-child{box-shadow:inset 3px 0 0 var(--lapis)}

/* Six days of Shawwal */
.st_week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.3rem}
.st_week span{font:400 .8125rem/1 var(--mono);color:var(--muted);text-align:center;padding-block:.35rem}
.st_day{position:relative;display:grid;place-items:center;gap:.05rem;min-height:3.25rem;padding:.3rem .1rem;border:0;border-radius:var(--r1);background:var(--page);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;
  font:500 .9375rem/1 var(--mono);color:var(--text);transition:box-shadow .15s,background-color .15s}
.st_day small{font:400 .625rem/1.1 var(--font);color:var(--muted)}
.st_day:hover{box-shadow:inset 0 0 0 1px #BDBDC4}
.st_day:focus-visible{outline:none;box-shadow:var(--ring)}
.st_day.is-mt{box-shadow:inset 0 -3px 0 var(--gold),inset 0 0 0 1px var(--line)}
.st_day.is-plan{background:var(--gold-tint);box-shadow:inset 0 0 0 1.5px var(--gold)}
.st_day.is-done{background:var(--lapis);color:#fff;box-shadow:none}
.st_day.is-done small{color:var(--gold-soft)}
.st_day.is-today::after{content:"";position:absolute;top:.25rem;right:.25rem;width:.375rem;height:.375rem;border-radius:50%;background:var(--gold)}
.st_day[disabled]{cursor:not-allowed;background:repeating-linear-gradient(135deg,var(--raised) 0 3px,var(--page) 3px 6px);color:var(--faint)}
.st_day.is-past:not(.is-done){opacity:.6}
.st_prog{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.3rem}
.st_prog i{height:.5rem;border-radius:999px;background:var(--raised)}
.st_prog i.is-on{background:var(--lapis)}
.st_legend{display:flex;flex-wrap:wrap;gap:.4rem 1rem;font-size:.8125rem;color:var(--muted)}
.st_legend i{display:inline-block;width:.875rem;height:.875rem;border-radius:3px;vertical-align:-2px;margin-inline-end:.35rem;box-shadow:inset 0 0 0 1px var(--line)}
.st_legend .lg-done{background:var(--lapis);box-shadow:none}
.st_legend .lg-plan{background:var(--gold-tint);box-shadow:inset 0 0 0 1.5px var(--gold)}
.st_legend .lg-mt{background:var(--page);box-shadow:inset 0 -3px 0 var(--gold),inset 0 0 0 1px var(--line)}
.st_legend .lg-no{background:repeating-linear-gradient(135deg,var(--raised) 0 3px,var(--page) 3px 6px)}
