.tl-page{--tl-symbols:"Segoe UI Symbol","Apple Symbols","Noto Sans Symbols","Noto Sans Symbols 2","DejaVu Sans",serif;max-width:1480px;margin:0 auto;padding:32px 36px 70px}
.tl-page *{box-sizing:border-box}
.tl-head{position:relative;padding:8px 0 26px 26px;border-bottom:1px solid var(--line)}
.tl-head:before{content:"";position:absolute;left:0;top:12px;bottom:28px;width:2px;background:var(--gold);box-shadow:0 0 12px #c4a26540}
.tl-head h1{font-family:var(--ff-display);font-weight:500;font-size:clamp(30px,4vw,49px);margin:10px 0;line-height:1.2;letter-spacing:.015em}
.tl-head h1 em{color:var(--gold-ink);font-style:normal}
.tl-head p{font-size:18px;line-height:1.6;color:var(--ink2);max-width:68ch;margin:8px 0}
.tl-label{font:11px var(--ff-ui);letter-spacing:.13em;text-transform:uppercase;color:var(--gold-ink)}
.tl-switch{display:flex;flex-wrap:wrap;gap:8px 22px;margin:22px 0 0;font:12px var(--ff-ui);letter-spacing:.04em}
.tl-switch a{color:var(--ink2);text-decoration:none;padding:7px 0;border-bottom:1px solid transparent}
.tl-switch a[aria-current],.tl-switch a:hover{color:var(--gold-ink);border-color:var(--gold)}
.tl-page :is(button,a,input,summary,[tabindex]):focus-visible{outline:2px solid var(--gold-ink);outline-offset:4px}

/* Workspace: the drawing left, capped and centred; the ledger right. */
.tl-workspace{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:24px;align-items:start;margin-top:24px}
.tl-map{min-width:0;width:100%;max-width:760px;justify-self:center;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper);box-shadow:inset 0 1px 0 var(--edge-hi)}
.tl-mapbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px 8px 15px;border-bottom:1px solid var(--line)}
.tl-mapbar>span{font:11px var(--ff-ui);letter-spacing:.07em;color:var(--mute)}
.tl-ico{flex:none;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:1px solid var(--line2);border-radius:50%;background:transparent;color:var(--ink2);cursor:pointer;line-height:0;font-family:var(--tl-symbols);font-variant-emoji:text;font-size:17px}
.tl-ico:hover{border-color:var(--gold);color:var(--gold-ink)}
.tl-toggles{display:flex;flex-wrap:wrap;gap:0 22px;padding:0 15px;border-bottom:1px solid var(--line)}
.tl-toggles button{background:none;border:0;border-bottom:1px solid transparent;padding:10px 0 9px;margin:0;font:10.5px var(--ff-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);cursor:pointer;min-height:34px}
.tl-toggles button:hover{color:var(--gold-ink)}
.tl-toggles button[aria-pressed="true"]{color:var(--gold-ink);border-bottom-color:var(--gold)}
.tl-canvas{width:100%;min-width:0;background:radial-gradient(ellipse at 50% 45%,#c4a26509,transparent 70%)}
.tl-canvas svg{display:block;width:100%;height:auto}
.tl-caption{padding:12px 16px;border-top:1px solid var(--line);font-size:14px;line-height:1.45;color:var(--mute);margin:0}

/* The drawing. Sizes are drawing units in a 640 by 1360 frame: 22 units render at 12.4 px on a 360 px phone. */
.tl-diagram{font-family:var(--ff-ui);color:var(--ink);isolation:isolate;--diagram-bg:var(--paper)}
.tl-diagram text{pointer-events:none;text-anchor:middle;fill:var(--ink);font-weight:400}
.tl-diagram .tl-rail{stroke:var(--gold);stroke-opacity:.13;stroke-width:1}
.tl-diagram .tl-arch{fill:none;stroke:var(--gold);stroke-opacity:.3;stroke-width:1}
.tl-diagram .tl-veil-line{stroke:var(--gold);stroke-opacity:.45;stroke-width:1;stroke-dasharray:5 7;fill:none;pointer-events:none}
.tl-diagram .tl-lightning{stroke:var(--gold);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;fill:none;stroke-dasharray:10 7;pointer-events:none;opacity:.8}
.tl-diagram .dimmed{opacity:.5}
.tl-diagram .tl-path{cursor:pointer;outline:none}
.tl-diagram .tl-path-under{fill:none;stroke:var(--path-color);stroke-width:32;stroke-opacity:.6;pointer-events:none}
.tl-diagram .tl-path-line{fill:none;stroke:color-mix(in srgb,var(--path-color) var(--band-mix,48%),var(--paper2));stroke-width:30;pointer-events:none;transition:stroke .15s,opacity .15s}
/* Ink per band, measured: in the dark theme Aleph, Beth, Cheth and Teth set dark ink with a light halo, and Cheth and Teth take a deeper mix of their colour so that the dark ink clears 4.5:1. */
:root:not([data-theme="light"]) .tl-diagram .tl-path[data-mix="deep"]{--band-mix:60%}
:root:not([data-theme="light"]) .tl-diagram .tl-path-label text[data-ink="dark"]{fill:var(--paper);stroke:var(--ink)}
.tl-diagram .tl-path-hit{stroke:transparent;stroke-width:36;fill:none;cursor:pointer}
.tl-diagram .tl-path:is(:hover,:focus-visible,.linked) .tl-path-line{stroke:color-mix(in srgb,var(--path-color) 70%,var(--paper2))}
.tl-diagram .tl-path.selected .tl-path-line{stroke:var(--path-color)}
.tl-diagram .tl-path:is(:hover,:focus-visible,.selected) .tl-path-under{stroke-opacity:1}
.tl-diagram .tl-path-label{cursor:pointer;pointer-events:bounding-box}
.tl-diagram .tl-path-label text{fill:var(--ink);paint-order:stroke;stroke:var(--paper);stroke-width:2.5px;stroke-linejoin:round}
.tl-diagram .tl-path-glyph{font-family:var(--tl-symbols);font-variant-emoji:text;font-size:24px}
.tl-diagram .tl-letter{font-family:var(--ff-heb);font-size:25px}
.tl-diagram .tl-numeral{font-family:var(--ff-ui);font-size:22px;letter-spacing:.04em}
.tl-diagram .tl-node{cursor:pointer;outline:none}
.tl-diagram .tl-node-disc{fill:var(--paper2);stroke:var(--node-color);stroke-width:1.5}
.tl-diagram .tl-node-wash{fill:var(--node-color);opacity:.125;pointer-events:none}
.tl-diagram .tl-node-ring{fill:none;stroke:var(--node-color);stroke-width:1;opacity:.42}
.tl-diagram .tl-node:hover .tl-node-ring,.tl-diagram .tl-node:focus-visible .tl-node-ring,.tl-diagram .tl-node.selected .tl-node-ring{opacity:1;stroke-width:2}
.tl-diagram .tl-node.selected .tl-node-disc,.tl-diagram .tl-node.linked .tl-node-disc{stroke-width:3}
.tl-diagram .tl-node.selected .tl-node-wash{opacity:.2}
.tl-diagram .tl-number{font-family:var(--ff-ui);font-size:22px;letter-spacing:.06em;fill:var(--ink2)}
.tl-diagram .tl-symbol{font-family:var(--tl-symbols);font-variant-emoji:text;font-size:30px;fill:color-mix(in srgb,var(--node-color) 70%,var(--ink))}
.tl-diagram .tl-hebrew{font-family:var(--ff-heb);font-size:25px;fill:var(--gold-ink)}
.tl-diagram .tl-name{font-family:var(--ff-display);font-size:22px;letter-spacing:.02em;paint-order:stroke;stroke:var(--paper);stroke-width:4px;stroke-linejoin:round}
.tl-diagram .tl-angel-label{cursor:pointer;outline:none}
.tl-diagram .tl-hit{fill:transparent;stroke:none}
.tl-diagram .tl-node-archangel{font-family:var(--ff-ui);font-size:22px;letter-spacing:.08em;fill:color-mix(in srgb,var(--gold-ink) 70%,var(--ink));paint-order:stroke;stroke:var(--paper);stroke-width:3px;stroke-linejoin:round}
.tl-diagram .tl-angel-label:is(:hover,:focus-visible,.selected) text{fill:var(--gold)}
.tl-diagram .tl-angel-label:is(:focus-visible,.selected) .tl-hit{stroke:var(--gold);stroke-width:1}
/* The Angels layer: the archangel stands in the slot of the English name. */
.tl-diagram .tl-angel-layer{display:none}
.tl-diagram[data-view="angels"] .tl-angel-layer{display:block}
.tl-diagram[data-view="angels"] .tl-name{display:none}
/* Structure captions: hairline text with a paper halo, no box; the box is drawn only on focus or selection. */
.tl-diagram .tl-concept{cursor:pointer;outline:none}
.tl-diagram .tl-concept rect{fill:transparent;stroke:none}
.tl-diagram .tl-concept text{font-family:var(--ff-ui);font-size:22px;letter-spacing:.08em;fill:var(--mute);paint-order:stroke;stroke:var(--paper);stroke-width:3px;stroke-linejoin:round}
.tl-diagram .tl-concept:hover text,.tl-diagram .tl-concept:focus-visible text,.tl-diagram .tl-concept.selected text{fill:var(--gold-ink)}
.tl-diagram .tl-concept:focus-visible rect,.tl-diagram .tl-concept.selected rect{fill:var(--paper);stroke:var(--gold);stroke-width:1}
.tl-diagram .tl-daath circle{fill:var(--paper);stroke:var(--mute);stroke-dasharray:4 4}
/* The pillar and world captions belong to their layers and show while the layer is on, or while one of them is the selection. */
.tl-diagram .tl-pillar-caption,.tl-diagram .tl-world{display:none}
.tl-diagram[data-view="pillars"] .tl-pillar-caption,.tl-diagram[data-view="worlds"] .tl-world,.tl-diagram .tl-pillar-caption.selected,.tl-diagram .tl-world.selected{display:inline}
.tl-diagram .tl-pillar-layer,.tl-diagram .tl-soul-layer{display:none}
.tl-diagram[data-view="pillars"] .tl-pillar-layer,.tl-diagram[data-view="soul"] .tl-soul-layer{display:block}
.tl-diagram .tl-pillar-band{fill:var(--gold);opacity:.07}
.tl-diagram[data-view="pillars"] .tl-pillar-caption text,.tl-diagram[data-view="worlds"] .tl-world text{fill:var(--gold-ink)}
.tl-diagram .tl-soul-tint{fill:var(--tone);opacity:.16}
.tl-diagram .tl-soul-name{font-family:var(--ff-ui);font-size:22px;letter-spacing:.1em;fill:var(--tone)}
/* Light theme: the gold, the tones and the node colours fall under 4.5:1 on the pale discs and paper, so these labels set the body ink. */
:root[data-theme="light"] .tl-diagram .tl-symbol,:root[data-theme="light"] .tl-diagram .tl-hebrew,:root[data-theme="light"] .tl-diagram .tl-soul-name{fill:var(--ink2)}
:root[data-theme="light"] .tl-diagram .tl-node-archangel{fill:var(--ink)}

/* Black and white. */
.tl-diagram.monochrome{--diagram-bg:#fff;--paper:#fff;--paper2:#fff;--ink:#111;--ink2:#222;--mute:#333;--gold:#111;--gold-ink:#111;--line:#888;--line2:#666;background:#fff}
.tl-diagram.monochrome .tl-node{--node-color:#111!important}
.tl-diagram.monochrome .tl-node-wash,.tl-diagram.monochrome .tl-node>path{display:none}
.tl-diagram.monochrome .tl-symbol{fill:#111}
.tl-diagram.monochrome .tl-node-ring{opacity:.65}
.tl-diagram.monochrome .tl-rail,.tl-diagram.monochrome .tl-arch{stroke-opacity:.5}
.tl-diagram.monochrome .dimmed{opacity:.7}
.tl-diagram.monochrome .tl-path{--path-color:#333}
.tl-diagram.monochrome .tl-path-under{stroke:#777;stroke-opacity:1}
.tl-diagram.monochrome .tl-path-line,.tl-diagram.monochrome .tl-path:is(:hover,:focus-visible,.linked,.selected) .tl-path-line{stroke:#eee}
.tl-diagram.monochrome .tl-path-label text{fill:#111;stroke:#fff}
.tl-diagram.monochrome .tl-soul-tint{fill:#888}
.tl-diagram.monochrome .tl-soul-name{fill:#111}

/* The ledger. */
.tl-panel{border:1px solid var(--line);border-top:2px solid var(--gold);border-radius:14px;background:var(--card);min-width:0;align-self:start;padding:0 24px 22px}
.tl-search{padding:18px 0 16px;border-bottom:1px solid var(--line)}
.tl-search label{display:block;font:10px var(--ff-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:8px}
.tl-search input{width:100%;padding:10px 12px;min-height:40px;font:15px var(--ff-body);color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:6px}
.tl-search input:focus{border-color:var(--gold);outline:none}
.tl-panel-header{padding:20px 0 0}
.tl-panel-header h2{font:500 clamp(24px,2.1vw,30px)/1.2 var(--ff-display);letter-spacing:.015em;margin:8px 0 7px}
.tl-panel-header .tl-heb{font-family:var(--ff-heb);font-size:27px;color:var(--gold-ink);float:right;padding-left:10px}
.tl-panel-header p{font-size:15px;color:var(--mute);margin:0 0 4px}
.tl-panel-body{padding:14px 0 2px}
.tl-panel-body p{font-size:16.5px;line-height:1.62;margin:0 0 15px;color:var(--ink2)}
.tl-panel-body .tl-intro{font-size:18px;line-height:1.5;color:var(--ink)}
.tl-panel-body .tl-small{font-size:14px;line-height:1.6;color:var(--mute)}
.tl-panel-body a{color:var(--gold-ink);text-underline-offset:4px}
.tl-facts{display:grid;grid-template-columns:104px minmax(0,1fr);gap:8px 14px;font-size:15px;margin:10px 0 12px}
.tl-facts dt{font:10px/1.5 var(--ff-ui);text-transform:uppercase;letter-spacing:.06em;color:var(--mute);padding-top:3px}
.tl-facts dd{margin:0;color:var(--ink2);line-height:1.5;overflow-wrap:anywhere}
.tl-links{display:flex;flex-direction:column;margin:6px 0 10px}
.tl-link{background:none;border:0;border-bottom:1px solid var(--line2);border-radius:0;padding:5px 0 4px;margin:0;font:11px var(--ff-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);cursor:pointer;min-height:30px;text-align:left}
.tl-link:hover,.tl-link[aria-pressed="true"]{color:var(--gold-ink);border-bottom-color:var(--gold)}
/* the linked places, one per line in the index's style */
.tl-links .tl-row-link{width:100%;padding:6px 0;border-bottom:1px solid var(--line);font:14.5px var(--ff-body);letter-spacing:0;text-transform:none;color:var(--ink2);min-height:34px}
.tl-links .tl-row-link:hover,.tl-links .tl-row-link[aria-pressed="true"]{color:var(--gold-ink);border-bottom-color:var(--line)}
.tl-open-entry{display:inline-block;margin:4px 0 6px;font:11px var(--ff-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);text-decoration:none}
.tl-open-entry:hover{text-decoration:underline;text-underline-offset:4px}
.tl-cards{display:grid;grid-template-columns:repeat(4,minmax(0,120px));gap:10px;margin:2px 0 14px}
.tl-card{display:block;min-width:0;text-decoration:none;color:var(--ink2)}
.tl-card img{display:block;width:100%;height:auto;border:1px solid var(--line2);border-radius:4px;transition:transform .15s}
.tl-card:hover img{transform:translateY(-3px);border-color:var(--gold)}
.tl-card span{display:block;font:10.5px/1.4 var(--ff-ui);letter-spacing:.05em;color:var(--mute);margin-top:6px}
.tl-index{padding-top:16px;margin-top:14px;border-top:1px solid var(--line)}
.tl-h{font:500 12px var(--ff-display);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink);margin:0 0 8px;display:flex;gap:10px;align-items:baseline}
.tl-h .tl-label{font-size:10px;color:var(--mute);letter-spacing:.1em}
.tl-index-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;grid-auto-flow:column}
.tl-row{display:flex;align-items:center;gap:9px;width:100%;padding:6px 0;margin:0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:var(--ink2);font:14.5px var(--ff-body);text-align:left;cursor:pointer;min-height:34px;min-width:0}
.tl-row:hover,.tl-row[aria-pressed="true"]{color:var(--gold-ink)}
.tl-row-glyph{flex:none;width:18px;text-align:center;font-family:var(--tl-symbols);font-variant-emoji:text;font-size:15px;color:var(--gold-ink)}
.tl-row-n{flex:none;font:11px var(--ff-ui);letter-spacing:.06em;color:var(--mute);min-width:18px}
.tl-row-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-row-other .tl-row-name{white-space:normal}
.tl-row-name small{display:block;font:11px/1.45 var(--ff-ui);color:var(--mute);margin-top:2px}
.tl-row-heb{flex:none;font-family:var(--ff-heb);font-size:17px;color:var(--gold-ink)}
.tl-empty{color:var(--mute);font-size:14px;margin:8px 0}
.tl-fold{margin-top:14px;border-top:1px solid var(--line)}
.tl-fold>summary{cursor:pointer;list-style:none;padding:14px 0 6px;font:500 12px var(--ff-display);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink)}
.tl-fold>summary::-webkit-details-marker{display:none}
.tl-fold>summary::before{content:"+";display:inline-block;width:1.2em;font-family:var(--ff-ui)}
.tl-fold[open]>summary::before{content:"\2212"}
.tl-structures{display:flex;flex-direction:column;padding-bottom:6px}
.tl-download{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;padding:4px 0 8px}
.tl-check{display:flex;gap:7px;align-items:center;font:11px var(--ff-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);min-height:30px}
.tl-check input{accent-color:var(--gold);margin:0}
.tl-live{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* The drawing alone, enlarged. */
.tl-enlarge{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--paper);color:var(--ink);overflow:auto;overscroll-behavior:contain;touch-action:pinch-zoom}
.tl-enlarge::backdrop{background:#080605}
.tl-enlarge-bar{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px 8px 18px;background:var(--paper2);border-bottom:1px solid var(--line)}
.tl-enlarge-bar>span{font:11px var(--ff-ui);letter-spacing:.07em;color:var(--mute)}
.tl-enlarge-body{padding:16px 16px 40px}
.tl-enlarge-body svg{display:block;width:calc(100vw - 32px);max-width:1400px;height:auto;margin:0 auto}

/* The printed key is only for the printer. */
.tl-print-key{display:none}

@media(min-width:1440px){.hc-directory-pinned .tl-page{padding-left:28px;padding-right:28px}}
@media(max-width:1200px){.tl-workspace{grid-template-columns:minmax(0,1fr) 380px}}
@media(max-width:1050px){.tl-page{padding:26px 20px 50px}.tl-workspace{gap:17px;grid-template-columns:minmax(0,1fr) minmax(330px,1fr)}.tl-panel{padding:0 19px 18px}}
@media(max-width:760px){.tl-page{padding:18px 14px 40px}.tl-head{padding-left:18px}.tl-head p{font-size:16px}.tl-head h1{font-size:34px}.tl-workspace{grid-template-columns:1fr;gap:16px;margin-top:16px}.tl-map{max-width:none}.tl-mapbar{padding:6px 8px 6px 12px}.tl-mapbar>span{font-size:10px}.tl-ico{width:38px;height:38px;font-size:19px}.tl-toggles{padding:0 12px;gap:0 18px}.tl-panel{padding:0 16px 18px}.tl-index-grid{gap:0 12px}.tl-switch{gap:8px 16px;font-size:11px}.tl-head .tl-kicker{font-size:10px}.tl-enlarge-body{padding:12px 12px 32px}.tl-enlarge-body svg{width:calc(100vw - 24px)}}
@media(max-width:400px){.tl-facts{grid-template-columns:85px minmax(0,1fr);gap:8px 12px}.tl-row{font-size:14px;gap:7px}}
@media(prefers-reduced-motion:reduce){.tl-page *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(forced-colors:active){.tl-diagram .tl-node-disc,.tl-diagram .tl-node-ring,.tl-diagram .tl-path-line{stroke:CanvasText}.tl-diagram .tl-node-disc,.tl-diagram .tl-concept rect{fill:Canvas}.tl-diagram text{fill:CanvasText}.tl-diagram .selected .tl-node-disc,.tl-diagram .selected .tl-path-line{stroke:Highlight}.tl-diagram .dimmed{opacity:.6}}

@page{size:A3 portrait;margin:10mm}
@media print{
  html,body{margin:0!important;padding:0!important;background:#fff!important}
  body:before,body:after,.hc-navwrap,.hc-footer,.hc-directory,.tl-head,.tl-mapbar,.tl-toggles,.tl-caption,.tl-panel,.tl-switch,.tl-enlarge,.tl-sheet,.tl-live{display:none!important}
  .tl-page{padding:0!important;margin:0!important;max-width:none;--paper:#fff;--paper2:#fff;--card:#fff;--ink:#111;--ink2:#333;--mute:#555;--gold-ink:#69552e;--line:#ccc;--line2:#aaa}
  .tl-workspace{display:block;margin:0}
  .tl-map{border:0;box-shadow:none;border-radius:0;overflow:visible;max-width:none}
  .tl-canvas{width:187.765mm!important;height:399mm!important;margin:0 auto;background:none}
  .tl-canvas svg{width:187.765mm!important;height:399mm!important;min-height:0;max-height:none}
  .tl-diagram .dimmed{opacity:1}
  .tl-diagram .tl-symbol{fill:#333}
  .tl-print-key{display:block;page-break-before:always;break-before:page;padding:0 4mm;color:#111;font-family:var(--ff-body)}
  .tl-print-key h2{font:500 20pt var(--ff-display);margin:0 0 4mm}
  .tl-print-key p{font-size:10.5pt;color:#333;margin:0 0 5mm}
  .tl-print-key table{width:100%;border-collapse:collapse;font-size:10pt}
  .tl-print-key th{text-align:left;font:8.5pt var(--ff-ui);letter-spacing:.08em;text-transform:uppercase;color:#555;padding:0 3mm 2mm 0;border-bottom:1px solid #888}
  .tl-print-key td{padding:1.6mm 3mm 1.6mm 0;border-bottom:1px solid #ddd;vertical-align:top}
  .tl-print-key td:first-child{font-family:var(--ff-ui);color:#555}
  .tl-print-key [lang="he"]{font-family:var(--ff-heb);font-size:12pt}
}