/* Натальна карта онлайн (/astrology/natalna-karta/): форма, результат (три головні точки, колесо, «Гортати час»,
   налаштування, значення, таблиці для астрологів), пояснення, друк. Підключається лише на цій сторінці
   (inc/tools/natal.php). Усі класи з префіксом tn-. */

.tn-main{padding-block:34px 100px}

/* «Хлібні крихти» */
.tn-crumbs{margin-bottom:30px;font-size:13px;font-weight:750;line-height:1.5}
.tn-crumbs ol{display:flex;flex-wrap:wrap;gap:4px 0;margin:0;padding:0;list-style:none}
.tn-crumbs li{display:inline-flex;align-items:center;min-width:0}
.tn-crumbs li+li::before{content:"›";margin:0 10px;color:var(--dim);font-weight:500}
.tn-crumbs a{display:inline-flex;align-items:center;min-height:32px;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px}
.tn-crumbs a:hover{color:var(--blue)}
.tn-crumbs [aria-current]{color:var(--dim)}

/* Заголовок */
.tn-head{max-width:860px;padding-bottom:36px}
.tn-head h1{font-size:clamp(36px,4.8vw,66px);line-height:1.08;letter-spacing:-.07em;margin:14px 0 20px;overflow-wrap:break-word}
.tn-lead{font-size:18px;line-height:1.6;max-width:62ch}

/* Панель з формою */
.tn-panel{--tn-peach:#f9c1b2;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:40px 56px;padding:40px;background:var(--tn-peach);border:2px solid var(--ink);box-shadow:7px 7px 0 var(--ink)}
.tn-form-title{font-size:clamp(22px,2.2vw,28px);line-height:1.2;letter-spacing:-.05em;margin:0 0 18px}
.tn-form-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.tn-form .field{margin-top:0}
.tn-form .field input{min-height:51px}
.tn-form .field input:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.tn-form .check-label{min-height:44px;margin:4px 0 0;color:var(--ink);font-weight:600;line-height:1.35}
.tn-form .check-label input{accent-color:var(--blue);width:20px;height:20px;flex-shrink:0;margin:0}
.tn-form .place-finder{margin-top:14px}
.tn-form .field-help{font-weight:500;line-height:1.5}
/* Стандартний червоний помилки на персиковому тлі має замалий контраст, тут темніший */
.tn-panel .error-message{color:#8f1a36}
.tn-error{margin:16px 0 0;font-weight:700}
.tn-error:empty{margin:0}
.tn-place .error-message{margin:0}
.tn-place .place-results{margin-top:2px}
.tn-place .place-option{width:100%;min-height:44px;align-items:center;text-align:left;color:var(--ink);font:inherit;font-size:14px;font-weight:650;line-height:1.4}
.tn-place .place-option:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.tn-place .place-chosen{flex-wrap:nowrap}
.tn-place .place-chosen span{min-width:0;overflow-wrap:anywhere}
.tn-place .place-chosen .text-link{flex-shrink:0;min-height:44px}
.tn-place .place-chosen .text-link:focus-visible{outline-offset:3px}

/* Підказки міста під полем (places.js): список поверх форми, фокус лишається в полі */
.tn-form .place-search{position:relative}
.tn-form .place-suggest{position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;background:#fffdf8;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.tn-form .place-suggest[hidden],.tn-form .place-suggest-list[hidden]{display:none}
.tn-form .place-suggest-list{list-style:none;margin:0;padding:0}
.tn-form .place-suggest-option{min-height:44px;padding:12px 14px;border-bottom:1px solid var(--border);font-size:14px;font-weight:500;line-height:1.35;color:var(--ink);cursor:pointer;overflow-wrap:anywhere}
.tn-form .place-suggest-option strong{font-weight:800}
.tn-form .place-suggest-option:hover{background:var(--lilac)}
.tn-form .place-suggest-option[aria-selected=true]{background:var(--lilac);box-shadow:inset 4px 0 0 var(--blue)}
.tn-form .place-suggest-more{display:block;width:100%;min-height:44px;margin:0;padding:12px 14px;border:0;background:var(--ivory);font:inherit;font-size:13px;font-weight:700;line-height:1.4;color:var(--dim);text-align:left;cursor:pointer}
.tn-form .place-suggest-more:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}

.tn-submit{margin-top:22px}
.tn-submit[aria-disabled=true]{cursor:progress;opacity:.8}
.tn-submit[aria-disabled=true]:hover{transform:none;box-shadow:4px 4px 0 var(--ink)}
.tn-submit-icon{display:inline-flex}

/* Що буде в результаті */
.tn-preview{align-self:start;padding:24px;background:#fff8ecd9;border:2px solid var(--ink)}
.tn-preview ul{display:grid;gap:12px;margin:14px 0 0;padding:0;list-style:none}
.tn-preview li{display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:1.45}
.tn-preview li svg{flex-shrink:0;margin-top:2px;color:var(--blue)}
.tn-preview-note{margin-top:16px;padding-top:14px;border-top:1px solid var(--border);font-size:13px;line-height:1.5;color:var(--dim)}


/* ---------- Значки планет, знаків і аспектів ----------
   «Selena Astro»: підмножина Noto Sans Symbols (Noto Project Authors, SIL OFL 1.1, assets/fonts/LICENSE-noto-sans-symbols.txt).
   Символи йдуть із U+FE0E, тож iPhone не підставляє кольорові емодзі. */
@font-face{font-family:'Selena Astro';font-style:normal;font-weight:100 900;font-display:block;src:url(../fonts/astro-symbols.woff2) format('woff2');unicode-range:U+260A-260D,U+263D,U+263F-2640,U+2642-2646,U+2648-2653,U+26B7-26BC}
@font-face{font-family:'Selena Astro';font-style:normal;font-weight:100 900;font-display:block;src:url(../fonts/astro-symbols-2.woff2) format('woff2');unicode-range:U+2609,U+25A1,U+25B3,U+2BD3}
.tn-g{display:inline-block;font-family:'Selena Astro','Noto Sans Symbols','Noto Sans Symbols 2','Segoe UI Symbol','Apple Symbols',sans-serif;font-style:normal;font-weight:500;line-height:1;font-variant-emoji:text;text-decoration:none}
.tn-g--svg{width:1em;height:1em;vertical-align:-.12em}
.tn-g--text{font-family:var(--font-body);font-weight:850;font-size:.7em;letter-spacing:-.02em}

/* ---------- Результат ---------- */
.tn-output{margin-top:48px;scroll-margin-top:16px}
.tn-noscript{margin-block:24px 0}
.tn-output:empty{display:none}
.tn-result-head{max-width:900px;margin-bottom:22px}
.tn-result-title{font-size:clamp(26px,3vw,40px);line-height:1.15;letter-spacing:-.06em;margin:10px 0 10px;outline:none;overflow-wrap:break-word}
.tn-result-title:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.tn-facts{font-size:14px;font-weight:650;color:var(--dim);overflow-wrap:anywhere}
.tn-result-note{margin-top:14px;padding-left:12px;border-left:3px solid var(--coral);font-size:14px;line-height:1.55;max-width:70ch}
.tn-result-note[hidden]{display:none}

/* Три головні точки під заголовком: асцендент видно одразу, навіть на телефоні */
.tn-big3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:40px}
.tn-b3{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:16px;align-items:center;min-width:0;padding:18px 20px;background:#fffdf8;border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.tn-b3-glyph{grid-row:1/4;display:grid;place-items:center;width:52px;height:52px;border:2px solid var(--ink);border-radius:50%;background:var(--lilac);color:var(--ink);font-size:28px}
.tn-b3-glyph .tn-g--text{font-size:17px}
.tn-b3--sun .tn-b3-glyph{background:var(--coral)}
.tn-b3-label{font-size:12px;font-weight:850;letter-spacing:.13em;text-transform:uppercase;line-height:1.4;color:var(--blue)}
.tn-b3-sign{display:flex;align-items:center;gap:8px;min-width:0;font-family:var(--font-display);font-size:clamp(20px,2vw,27px);font-weight:700;letter-spacing:-.05em;line-height:1.2}
.tn-b3-sign .tn-g{flex-shrink:0;font-size:.85em;letter-spacing:0}
.tn-b3-sign span:last-child{min-width:0;overflow-wrap:anywhere}
.tn-b3-meta{font-size:13px;font-weight:700;line-height:1.45;color:var(--dim);font-variant-numeric:tabular-nums}
.tn-b3--asc{background:var(--blue);color:var(--ivory)}
.tn-b3--asc .tn-b3-label{color:var(--mint)}
.tn-b3--asc .tn-b3-meta{color:#e5deff}
.tn-b3--asc .tn-b3-glyph{background:var(--mint)}
.tn-b3--missing{background:#fff8ecb3;color:var(--ink);border-style:dashed;box-shadow:none}
.tn-b3--missing .tn-b3-label{color:var(--blue)}
.tn-b3--missing .tn-b3-meta{color:var(--dim)}
.tn-b3-add{justify-self:start;min-height:44px;padding:0;border:0;background:none;font:inherit;font-size:14px;font-weight:800;color:var(--ink);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px;cursor:pointer}
.tn-b3-add:hover{color:var(--blue)}

/* Колесо й панель поруч */
.tn-chart{display:grid;grid-template-columns:minmax(0,720px) minmax(0,1fr);grid-template-rows:auto 1fr;grid-template-areas:"wheel side" "save side";gap:24px 36px;align-items:start}
.tn-wheel{grid-area:wheel;margin:0;min-width:0;padding:16px;background:#fffdf8;border:2px solid var(--ink);box-shadow:6px 6px 0 var(--ink)}
.tn-side{grid-area:side}
.tn-save{grid-area:save}
.tn-key-box{order:3}
.tn-key-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-bottom:14px}
.tn-wheel-box{width:100%;aspect-ratio:1/1}
.tn-wheel-svg{display:block;width:100%;height:auto;overflow:visible}
.tn-w-planet{cursor:default}
.tn-tool-btn{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:10px 16px;background:var(--ivory);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font:inherit;font-size:14px;font-weight:800;line-height:1.25;color:var(--ink);text-align:left;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.tn-tool-btn:hover{background:var(--mint);transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.tn-tool-btn:focus-visible,.tn-step-btn:focus-visible,.tn-sort-btn:focus-visible,.tn-b3-add:focus-visible,.tn-settings summary:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.tn-tool-btn svg{flex-shrink:0}
.tn-tool-btn[aria-pressed=true]{background:var(--lilac)}

.tn-legend{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0;padding:0;list-style:none;font-size:13px;font-weight:600;line-height:1.4;color:var(--dim)}
.tn-legend li{display:inline-flex;align-items:center;gap:8px}
.tn-key{display:inline-block;width:26px;height:0;border-top:2.5px solid var(--blue)}
.tn-key--hard{border-color:#d1402a}
.tn-key--minor{border-top:2px dashed var(--dim)}
.tn-key-text{font-weight:900;color:var(--blue)}
.tn-key-text--retro{color:#d1402a}
.tn-key-text+.tn-key-text{margin-left:4px}
.tn-key-head .tn-tool-btn{min-height:44px;padding:8px 12px;font-size:13px;box-shadow:2px 2px 0 var(--ink)}
.tn-glyph-key{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:6px 14px;margin:12px 0 0;padding:12px 0 0;border-top:1px dashed var(--border);list-style:none;font-size:13px;font-weight:650;line-height:1.3}
.tn-glyph-key li{display:flex;align-items:center;gap:8px;min-width:0}
.tn-glyph-key .tn-g{flex-shrink:0;width:22px;font-size:18px;text-align:center;color:var(--ink)}

/* Панель поруч із колесом: «Гортати час», налаштування, збереження */
.tn-side{display:grid;gap:22px;align-content:start;min-width:0}
.tn-box{min-width:0;padding:20px;background:#fffdf8;border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.tn-box[hidden]{display:none}
.tn-box-title{margin:0;font-size:19px;line-height:1.25;letter-spacing:-.045em}
.tn-step{background:var(--mint)}
.tn-step-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px;margin-bottom:14px}
.tn-step-now{font-family:var(--font-display);font-size:18px;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.tn-step.is-pending .tn-step-now{opacity:.65}
.tn-step-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.tn-step-btn{min-width:0;min-height:46px;padding:6px 4px;border:2px solid var(--ink);background:var(--ivory);box-shadow:2px 2px 0 var(--ink);font:inherit;font-size:14px;font-weight:800;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;cursor:pointer}
.tn-step-btn--plus{background:#fffdf8}
.tn-step-btn:hover{background:var(--lilac)}
.tn-step-btn:active{transform:translate(2px,2px);box-shadow:none}
.tn-step-note{min-height:1.5em;margin-top:10px;font-size:13px;font-weight:650;line-height:1.5;color:var(--dim)}
.tn-step-note.is-error{color:#8f1a36}

.tn-settings{padding:0}
.tn-settings summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:58px;padding:14px 20px;list-style:none;cursor:pointer;font-family:var(--font-display);font-size:17px;font-weight:700;line-height:1.25;letter-spacing:-.04em}
.tn-settings summary::-webkit-details-marker{display:none}
.tn-settings summary svg{flex-shrink:0;transition:transform .15s ease}
.tn-settings[open] summary svg{transform:rotate(180deg)}
.tn-settings summary:hover{color:var(--blue)}
.tn-settings-body{display:grid;gap:18px;padding:4px 20px 20px;border-top:1px solid var(--border)}
.tn-set{min-width:0;margin:0;padding:0;border:0}
.tn-set[hidden],.tn-choice[hidden]{display:none}
.tn-set legend,.tn-set>label{display:block;margin:14px 0 8px;padding:0;font-size:12px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.tn-select{position:relative}
.tn-select::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.tn-select select{width:100%;min-height:48px;padding:0 40px 0 14px;border:2px solid var(--ink);border-radius:0;background:var(--ivory);font:inherit;font-size:15px;font-weight:700;color:var(--ink);appearance:none;-webkit-appearance:none;cursor:pointer}
.tn-select select:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.tn-choices{display:flex;flex-wrap:wrap;gap:8px}
.tn-choices--2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.tn-choice{display:inline-flex;align-items:center;gap:9px;min-width:0;min-height:46px;padding:8px 12px;border:2px solid var(--ink);background:var(--ivory);font-size:14px;font-weight:700;line-height:1.25;cursor:pointer}
.tn-choice:hover{background:#fffdf8}
.tn-choice:has(input:checked){background:var(--lilac)}
.tn-choice input{flex-shrink:0;width:18px;height:18px;margin:0;accent-color:var(--blue)}
.tn-choice input:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.tn-choice .tn-g{flex-shrink:0;font-size:18px}
.tn-set-note{font-size:13px;line-height:1.5;color:var(--dim)}

.tn-save-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.tn-save-grid .tn-tool-btn{width:100%;padding:10px 14px}
.tn-save-note{margin-top:12px;font-size:13px;line-height:1.5;color:var(--dim)}
.tn-save-note:empty{margin:0}
.tn-link-field{display:block;width:100%;min-height:44px;margin-top:8px;padding:8px 10px;border:2px solid var(--ink);background:var(--ivory);font:inherit;font-size:13px}
.tn-copy-area{position:fixed;top:0;left:-9999px;width:1px;height:1px;opacity:0}

/* ---------- Значення простими словами ---------- */
.tn-result-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:start}
.tn-result-grid--even{grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:56px}
.tn-block{min-width:0}
.tn-block h3,.tn-meanings>h3{font-size:clamp(21px,2.1vw,27px);line-height:1.2;letter-spacing:-.05em;margin:0 0 14px}
.tn-block-intro{font-size:14px;line-height:1.55;color:var(--dim);margin-bottom:12px;max-width:62ch}
.tn-sign-link{display:inline-block;padding:10px 0;margin:-10px 0;font-weight:750;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:4px}
.tn-sign-link:hover{color:var(--blue)}

.tn-meanings{margin-top:64px}
.tn-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.tn-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0;padding:22px;background:#fffdf8;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.tn-card-glyph{position:absolute;top:18px;right:18px;display:grid;place-items:center;width:46px;height:46px;border:2px solid var(--ink);border-radius:50%;background:var(--lilac);color:var(--ink);font-size:24px}
.tn-card-glyph .tn-g--text{font-size:15px}
.tn-card--sun .tn-card-glyph,.tn-card--mars .tn-card-glyph{background:var(--coral)}
.tn-card--asc .tn-card-glyph,.tn-card--venus .tn-card-glyph{background:var(--mint)}
.tn-card--jupiter .tn-card-glyph{background:#fcd8ce}
.tn-card--saturn .tn-card-glyph{background:#dcdffd}
.tn-card-hint{padding-right:58px;font-size:12px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;line-height:1.4;color:var(--blue)}
.tn-card-title{padding-right:58px;font-family:var(--font-display);font-size:clamp(20px,1.9vw,24px);font-weight:700;line-height:1.2;letter-spacing:-.05em;overflow-wrap:break-word}
.tn-card-title .tn-sign-link{font-weight:inherit;text-decoration-thickness:2px}
.tn-card-meta{font-size:13px;font-weight:700;color:var(--dim)}
.tn-card-note{font-size:13px;line-height:1.5;border-left:3px solid var(--coral);padding-left:12px}
.tn-card-text{font-size:15px;line-height:1.6}
.tn-card--missing{background:#fff8ecb3;border-style:dashed;box-shadow:none}
.tn-card--missing .text-link{margin-top:auto;min-height:44px}
.tn-card--outer{background:var(--lilac)}
.tn-card--outer .tn-card-hint,.tn-card--outer .tn-card-title{padding-right:0}
.tn-outer-list{display:grid;gap:10px;margin:4px 0 6px;padding:0;list-style:none;width:100%}
.tn-outer-list li{display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:1.4}
.tn-outer-list li>.tn-g{width:22px;margin-top:1px;font-size:19px;text-align:center;color:var(--blue)}
.tn-outer-list li>span{display:grid;gap:2px;min-width:0}
.tn-outer-meta{font-size:13px;color:var(--dim)}

.tn-aspect-list{display:grid;gap:0;margin:0;padding:0;list-style:none}
.tn-aspect{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid #211f4629}
.tn-aspect-mark{flex-shrink:0;width:24px;padding-top:1px;font-size:19px;line-height:1.1;text-align:center;color:var(--ink)}
.tn-aspect--trine .tn-aspect-mark,.tn-aspect--sextile .tn-aspect-mark{color:var(--blue)}
.tn-aspect--square .tn-aspect-mark,.tn-aspect--opposition .tn-aspect-mark{color:#d1402a}
.tn-aspect-phrase{font-size:15px;line-height:1.45}
.tn-aspect-orb{font-size:13px;font-weight:600;color:var(--dim);white-space:nowrap}
.tn-aspect-meaning{margin-top:3px;font-size:13px;line-height:1.5;color:var(--dim)}
.tn-aspect-types{display:grid;gap:8px;margin:0 0 10px;padding:14px 16px;list-style:none;background:#fffdf8;border:2px solid var(--ink)}
.tn-aspect-type{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.5}
.tn-aspect-type strong{font-weight:800}
.tn-aspect-more{margin-top:14px}
.tn-aspect-more summary{display:flex;align-items:center;min-height:44px;cursor:pointer;font-size:14px;font-weight:800;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}
.tn-aspect-more summary:hover{color:var(--blue)}
.tn-aspect-more[open] summary{margin-bottom:6px}

.tn-element-list{display:grid;gap:10px;margin:0 0 14px;padding:0;list-style:none}
.tn-element{display:grid;grid-template-columns:90px minmax(0,1fr) 62px;align-items:center;gap:12px;font-size:14px;font-weight:750}
.tn-element-bar{position:relative;height:16px;border:2px solid var(--ink);background:#fffdf8}
.tn-element-bar span{position:absolute;inset:0 auto 0 0;background:var(--lilac)}
.tn-element--fire .tn-element-bar span{background:var(--coral)}
.tn-element--earth .tn-element-bar span{background:var(--mint)}
.tn-element--water .tn-element-bar span{background:var(--blue)}
.tn-element-count{font-size:13px;color:var(--dim);text-align:right;white-space:nowrap}
.tn-element-text{font-size:16px;line-height:1.6}

/* ---------- Для астрологів ---------- */
.tn-pro{margin-top:80px;padding-top:44px;border-top:2px solid var(--ink)}
.tn-pro-head{max-width:760px;margin-bottom:30px}
.tn-pro-heading{margin:8px 0 10px;font-size:clamp(26px,3vw,38px);line-height:1.15;letter-spacing:-.06em}
.tn-pro-lead{font-size:16px;line-height:1.6;color:var(--dim)}
.tn-pro-body{display:grid;gap:48px}
.tn-pro-pair{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:start}
.tn-pro-block{position:relative;min-width:0}
.tn-pro-title{margin:0 0 8px;font-family:var(--font-display);font-size:clamp(20px,2vw,25px);font-weight:700;line-height:1.2;letter-spacing:-.05em}
.tn-pro-intro{max-width:72ch;margin-bottom:12px;font-size:14px;line-height:1.55;color:var(--dim)}
.tn-pro-missing{display:grid;justify-items:start;gap:14px;padding:20px;border:2px dashed var(--ink);background:#fff8ecb3}
.tn-pro-missing p{font-size:15px;line-height:1.6}

/* Таблиці: гортаються лише всередині свого блоку, сторінка ніколи */
.tn-scroll{position:relative;max-width:100%;overflow-x:auto;background:#fffdf8;border:2px solid var(--ink);-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.tn-scroll:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.tn-scroll--fit{width:fit-content}
.tn-t{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;line-height:1.35}
.tn-t th,.tn-t td{padding:9px 12px;border-bottom:1px solid #211f4624;text-align:left;vertical-align:middle;white-space:nowrap}
.tn-t thead th{font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);background:var(--ivory);border-bottom:2px solid var(--ink)}
.tn-t tbody tr:last-child>*{border-bottom:0}
.tn-t tbody th{font-weight:750}
.tn-t .tn-c{text-align:center}
.tn-t .tn-r{text-align:right}
.tn-num{font-variant-numeric:tabular-nums}
.tn-t--points tbody td.tn-num,.tn-t--houses tbody th.tn-num{font-weight:800}
/* Перший стовпчик лишається на місці, коли таблицю гортають убік */
.tn-t--points tr>:first-child,.tn-t--aspects tr>:first-child,.tn-t--houses tr>:first-child{position:sticky;left:0;z-index:1;background:#fffdf8;box-shadow:inset -1px 0 0 #211f4624}
.tn-t--points thead tr>:first-child,.tn-t--aspects thead tr>:first-child,.tn-t--houses thead tr>:first-child{background:var(--ivory)}
.tn-pl{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}
/* Значок-малюнок (Колесо Фортуни) не зсуває базову лінію: інакше рядок на пів пікселя вищий і пропадає межа */
.tn-pl>.tn-g--svg,.tn-pair>.tn-g--svg{flex-shrink:0;vertical-align:middle}
.tn-pl .tn-g{width:22px;font-size:18px;text-align:center;color:var(--blue)}
.tn-pl .tn-g--text{font-size:12px}
.tn-pos{display:inline-flex;align-items:center;gap:7px}
.tn-pos .tn-g{width:18px;font-size:17px;text-align:center}
.tn-pos--fire .tn-g{color:#c23a22}
.tn-pos--earth .tn-g{color:#1d7a4f}
.tn-pos--air .tn-g{color:#6c4fc4}
.tn-pos--water .tn-g{color:var(--blue)}
.tn-pos-sign{display:inline-block;min-width:5.4em;font-weight:650}
.tn-pos-deg{font-weight:800;font-variant-numeric:tabular-nums}
.tn-flag{display:inline-block;min-width:28px;padding:1px 6px;border:1.5px solid var(--ink);background:#fcd8ce;font-size:12px;font-weight:850;line-height:1.5;text-align:center}
.tn-flag--st{background:var(--lilac)}
.tn-flag--none{border-color:transparent;background:none;color:var(--dim)}
.tn-unsure{font-size:12px;font-weight:700;color:#8f1a36;white-space:normal}
.tn-row-angle>*{background:var(--ivory)}
.tn-t tr:not(.tn-row-angle)+.tn-row-angle>*{border-top:2px solid var(--ink)}
.tn-angle-tag{margin-left:6px;padding:1px 5px;background:var(--blue);color:var(--ivory);font-size:10px;font-weight:900;letter-spacing:.04em;vertical-align:1px}
.tn-t .tn-topic{min-width:15em;font-size:13px;line-height:1.45;color:var(--dim);white-space:normal}
.tn-topic-inline{display:none}
.tn-phone-note{display:none}

/* Аспектаріум: трикутна сітка */
.tn-grid{border-collapse:collapse;font-size:13px}
.tn-grid th,.tn-grid td{width:46px;min-width:46px;height:46px;padding:0;text-align:center;vertical-align:middle;border:1px solid #211f4626}
.tn-grid-h{background:var(--ivory);color:var(--ink);font-size:19px;font-weight:500}
.tn-grid-h .tn-g--text{font-size:12px}
.tn-grid thead .tn-grid-h{border-bottom:2px solid var(--ink)}
.tn-grid-row{position:sticky;left:0;z-index:1;border-right:2px solid var(--ink)!important}
.tn-grid-corner{position:sticky;left:0;z-index:2;background:var(--ivory);border-right:2px solid var(--ink)!important;border-bottom:2px solid var(--ink)!important}
.tn-grid-empty{border-color:transparent!important;background:transparent}
.tn-grid-cell{background:#fffdf8;line-height:1}
.tn-grid-cell .tn-g{display:block;margin:0 auto 3px;font-size:17px}
.tn-grid-orb{display:block;font-size:10px;font-weight:750;color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.tn-phase{margin-left:1px;font-weight:900;color:var(--ink)}
.tn-grid-cell--hard{background:#fdece6}
.tn-grid-cell--hard .tn-g{color:#d1402a}
.tn-grid-cell--soft{background:#eceeff}
.tn-grid-cell--soft .tn-g{color:var(--blue)}
.tn-grid-cell--green{background:#e3f5ec}
.tn-grid-cell--green .tn-g{color:#1d8657}
.tn-grid-cell--neutral{background:#f1eee6}
.tn-grid-cell--minor{background:#fffdf8}
.tn-grid-legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin:12px 0 0;padding:0;list-style:none;font-size:13px;font-weight:650;color:var(--dim)}
.tn-grid-legend li{display:inline-flex;align-items:center;gap:7px}
.tn-grid-legend .tn-g{font-size:17px;color:var(--ink)}
.tn-grid-key--hard .tn-g{color:#d1402a}
.tn-grid-key--soft .tn-g{color:var(--blue)}
.tn-grid-key--green .tn-g{color:#1d8657}

/* Список аспектів */
.tn-sort{display:inline-flex;flex-wrap:wrap;margin-bottom:12px;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
.tn-sort-btn{min-height:44px;padding:8px 16px;border:0;background:var(--ivory);font:inherit;font-size:14px;font-weight:800;color:var(--ink);cursor:pointer}
.tn-sort-btn+.tn-sort-btn{border-left:2px solid var(--ink)}
.tn-sort-btn:hover{background:var(--mint)}
.tn-sort-btn[aria-pressed=true]{background:var(--ink);color:var(--ivory)}
.tn-asp-type{font-weight:750}
.tn-asp-type .tn-g{width:20px;margin-right:7px;font-size:17px;text-align:center}
.tn-asp-type--hard .tn-g{color:#d1402a}
.tn-asp-type--soft .tn-g{color:var(--blue)}
.tn-asp-type--green .tn-g{color:#1d8657}
.tn-asp-type--minor span:last-child{font-weight:600;color:var(--dim)}

/* Стихії, хрести, полярність, півкулі */
.tn-dist-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}
.tn-dist{min-width:0;padding:16px 18px;background:#fffdf8;border:2px solid var(--ink)}
.tn-dist-title{margin:0 0 6px;font-family:var(--font-display);font-size:16px;font-weight:700;letter-spacing:-.03em}
.tn-t--dist th,.tn-t--dist td{padding:8px 6px;white-space:normal}
.tn-t--dist th{padding-left:0;font-size:13px;font-weight:700;line-height:1.35}
.tn-t--dist td:last-child{padding-right:0}
.tn-dist-n{width:2.2em;font-size:15px;font-weight:850}
.tn-dist-list{font-size:17px;line-height:1.5}
.tn-dist-item{display:inline-block;margin-right:5px}
.tn-dist-extra{font-size:12px;font-weight:850;color:var(--blue);white-space:nowrap}
.tn-dominants{display:flex;flex-wrap:wrap;gap:8px 24px;margin:16px 0 0;padding:0;list-style:none;font-size:15px}

/* Мідпойнти */
.tn-mid-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}
.tn-t--mid{background:#fffdf8;border:2px solid var(--ink)}
.tn-t--mid th,.tn-t--mid td{padding:7px 10px}
.tn-pair{display:inline-flex;align-items:center;gap:3px;color:var(--dim)}
.tn-pair .tn-g{font-size:17px;color:var(--ink)}
.tn-pair .tn-g--text{font-size:11px}

/* Технічні дані */
.tn-tech{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;margin:0;border-top:2px solid var(--ink)}
.tn-tech-row{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:14px;padding:11px 0;border-bottom:1px solid #211f4624}
.tn-tech dt{font-size:13px;font-weight:700;line-height:1.45;color:var(--dim)}
.tn-tech dd{margin:0;font-size:14px;font-weight:750;line-height:1.45;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}

/* ---------- Пояснення ---------- */
.tn-explain{max-width:780px;margin-top:96px}
.tn-explain-section{padding:30px 0;border-top:2px solid var(--ink)}
.tn-explain-section:first-child{border-top:0;padding-top:0}
.tn-explain-section h2{display:flex;align-items:baseline;gap:12px;font-size:clamp(23px,2.4vw,32px);line-height:1.2;letter-spacing:-.05em;margin:0 0 14px;overflow-wrap:break-word;min-width:0}
.tn-explain-section h2::before{content:"";flex-shrink:0;width:12px;height:12px;border:2px solid var(--ink);background:var(--lilac);transform:translateY(-1px)}
.tn-explain-section--coral h2::before{background:var(--coral)}
.tn-explain-section--blue h2::before{background:var(--blue)}
.tn-explain-section--mint h2::before{background:var(--mint)}
.tn-explain-section p{font-size:17px;line-height:1.7;max-width:68ch}
.tn-explain-section p+p{margin-top:14px}

/* ---------- Пропозиція розбору ---------- */
.tn-offer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px 48px;margin-top:64px;padding:clamp(22px,3.4vw,40px);background:var(--lilac);border:2px solid var(--ink);box-shadow:7px 7px 0 var(--ink)}
.tn-offer .eyebrow{color:var(--ink)}
.tn-offer h2{font-size:clamp(25px,2.8vw,36px);line-height:1.15;letter-spacing:-.055em;margin:8px 0 12px}
.tn-offer-copy p:not(.eyebrow){font-size:15px;line-height:1.6;max-width:60ch}
.tn-offer-copy .tn-offer-note{margin-top:12px;font-size:13px;color:var(--dim)}
.tn-offer-options{display:grid;gap:16px;align-content:start}
.tn-option{display:grid;gap:10px;justify-items:start;padding:22px;background:#fffdf8;border:2px solid var(--ink)}
.tn-option h3{font-size:clamp(19px,1.8vw,22px);line-height:1.25;letter-spacing:-.04em}
.tn-option p{font-size:14px;line-height:1.55}
.tn-option .button{margin-top:4px;gap:14px}
.tn-offer-more{min-height:44px;font-size:14px}

/* ---------- Ще безкоштовно ---------- */
.tn-related{margin-top:72px}
.tn-related h2{font-size:clamp(25px,2.8vw,34px);line-height:1.2;letter-spacing:-.055em;margin-bottom:22px}
.tn-related-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.tn-related-list a{position:relative;display:grid;align-content:start;gap:6px;height:100%;min-height:110px;padding:18px 48px 18px 18px;background:#fffdf8;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.tn-related-list a:hover{background:var(--mint);transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.tn-related-list strong{font-family:var(--font-display);font-size:17px;font-weight:750;line-height:1.25;letter-spacing:-.04em}
.tn-related-list span{font-size:13px;line-height:1.45;color:var(--dim)}
.tn-related-list svg{position:absolute;top:18px;right:16px}


@media(prefers-reduced-motion:reduce){.tn-related-list a,.tn-tool-btn,.tn-settings summary svg{transition:none}}

@media(max-width:1180px){
  .tn-chart{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"wheel" "side" "save"}
  .tn-wheel{width:100%;max-width:720px;justify-self:center}
  .tn-side{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto 1fr;align-items:start}
  .tn-key-box{order:0;grid-row:span 2}
  .tn-pro-pair{grid-template-columns:minmax(0,1fr);gap:48px}
}
@media(max-width:1100px){
  .tn-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tn-dist-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1000px){
  .tn-panel{grid-template-columns:minmax(0,1fr);gap:28px}
  .tn-result-grid,.tn-result-grid--even{grid-template-columns:minmax(0,1fr)}
  .tn-offer{grid-template-columns:minmax(0,1fr)}
  .tn-related-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .tn-big3{gap:12px}
  .tn-b3{grid-template-columns:minmax(0,1fr);grid-template-rows:none;row-gap:4px;padding:14px}
  .tn-b3-glyph{grid-row:auto;width:40px;height:40px;margin-bottom:4px;font-size:22px}
  .tn-b3-glyph .tn-g--text{font-size:14px}
  .tn-side{grid-template-columns:minmax(0,1fr);grid-template-rows:none}
  .tn-key-box{grid-row:auto}
  .tn-mid-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tn-tech{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:620px){
  .tn-main{padding-block:22px 70px}
  .tn-crumbs{margin-bottom:20px;font-size:12px}
  .tn-crumbs li+li::before{margin:0 7px}
  .tn-head{padding-bottom:26px}
  .tn-head h1{font-size:clamp(30px,9vw,40px);letter-spacing:-.06em}
  .tn-lead{font-size:16px}
  .tn-panel{padding:20px;box-shadow:4px 4px 0 var(--ink)}
  .tn-form-row{grid-template-columns:minmax(0,1fr);gap:14px}
  /* «Знайти» лишається поруч із полем міста */
  .tn-form .place-search{flex-direction:row;gap:8px}
  .tn-form .place-search input{min-width:0}
  .tn-form .place-button{width:auto;flex-shrink:0;padding-inline:14px;box-shadow:3px 3px 0 var(--ink)}
  .tn-submit{width:100%}
  .tn-preview{padding:18px}
  .tn-output{margin-top:36px}
  .tn-result-title{font-size:clamp(24px,7vw,30px)}
  /* Три точки в один ряд: асцендент видно одразу під заголовком */
  .tn-big3{gap:8px;margin-bottom:28px}
  .tn-b3{padding:10px 9px 11px;box-shadow:3px 3px 0 var(--ink)}
  .tn-b3-glyph{width:34px;height:34px;font-size:19px;margin-bottom:2px}
  .tn-b3-glyph .tn-g--text{font-size:12px}
  .tn-b3-label{font-size:10px;letter-spacing:.07em}
  .tn-b3-sign{font-family:var(--font-body);font-size:15px;font-weight:850;letter-spacing:-.02em}
  .tn-b3-sign .tn-g{display:none}
  .tn-b3-meta{font-size:11.5px;line-height:1.35}
  .tn-b3-add{font-size:13px;min-height:44px}
  .tn-chart{gap:22px}
  /* Колесо на всю ширину: так значки найбільші */
  .tn-wheel{padding:0;background:none;border:0;box-shadow:none}
  .tn-key-head .tn-tool-btn{width:100%}
  .tn-legend{font-size:12px;gap:6px 14px}
  .tn-glyph-key{grid-template-columns:repeat(2,minmax(0,1fr));font-size:12.5px}
  .tn-box{padding:16px;box-shadow:4px 4px 0 var(--ink)}
  .tn-settings{padding:0}
  .tn-settings summary{padding:12px 16px;font-size:16px}
  .tn-settings-body{padding:4px 16px 16px}
  .tn-step-grid{gap:6px}
  .tn-step-btn{font-size:13px;padding:6px 2px}
  .tn-step-now{font-size:16px}
  .tn-choices--2{grid-template-columns:minmax(0,1fr)}
  .tn-meanings{margin-top:48px}
  .tn-cards{grid-template-columns:minmax(0,1fr);gap:16px}
  .tn-card{padding:18px}
  .tn-card-glyph{top:14px;right:14px;width:42px;height:42px;font-size:22px}
  .tn-result-grid--even{margin-top:44px;gap:44px}
  .tn-element{grid-template-columns:74px minmax(0,1fr) 50px;gap:10px;font-size:13px}
  .tn-pro{margin-top:56px;padding-top:32px}
  .tn-pro-body{gap:40px}
  .tn-t{font-size:13px}
  .tn-t th,.tn-t td{padding:8px 9px}
  .tn-pos-sign{min-width:5.2em}
  /* Телефон: у таблиці домів тема під куспідом, у списку аспектів лише значок аспекту й без стовпчика «Кут» */
  .tn-t--houses .tn-topic{display:none}
  .tn-topic-inline{display:block;margin-top:3px;font-size:12px;font-weight:500;line-height:1.4;color:var(--dim);white-space:normal}
  .tn-t--houses td{white-space:normal}
  .tn-t--aspects .tn-col-angle{display:none}
  /* Список аспектів на телефоні: лише значки точок, щоб орбіс і фаза вміщались без прокрутки (назви лишаються для читачів екрана) */
  .tn-phone-note{display:block;margin:-4px 0 12px;font-size:13px;line-height:1.5;color:var(--dim)}
  .tn-t--aspects .tn-pl>span:last-child{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .tn-t--aspects .tn-pl .tn-g{width:24px;font-size:20px}
  .tn-t--aspects .tn-pl .tn-g--text{font-size:13px}
  .tn-asp-type span:not(.tn-g){display:none}
  .tn-asp-type .tn-g{margin-right:0}
  .tn-step-note:empty{min-height:0;margin-top:0}
  .tn-save-grid{grid-template-columns:minmax(0,1fr)}
  .tn-grid th,.tn-grid td{width:42px;min-width:42px;height:42px}
  .tn-dist-grid,.tn-mid-grid{grid-template-columns:minmax(0,1fr)}
  .tn-explain{margin-top:70px}
  .tn-explain-section{padding:26px 0}
  .tn-explain-section h2{font-size:22px;gap:10px}
  .tn-explain-section h2::before{width:10px;height:10px}
  .tn-explain-section p{font-size:16px;line-height:1.65}
  .tn-offer{margin-top:48px;box-shadow:4px 4px 0 var(--ink)}
  .tn-option{padding:18px}
  .tn-option .button{width:100%;white-space:normal;justify-content:space-between;text-align:left}
  .tn-related{margin-top:56px}
  .tn-related-list{grid-template-columns:minmax(0,1fr);gap:12px}
  .tn-related-list a{min-height:0;box-shadow:3px 3px 0 var(--ink)}
}

/* ---------- Друк: колесо й таблиці на A4, без шапки, підвалу й кнопок ---------- */
@media print{
  @page{size:A4;margin:12mm}
  html,body{margin:0!important;background:#fff!important}
  *{box-shadow:none!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .header,.footer,.skip-link,#wpadminbar,.tn-crumbs,.tn-head,.tn-panel,.tn-noscript,.tn-step,.tn-settings,.tn-save,.tn-key-head,.tn-meanings,.tn-offer,.tn-explain,.tn-related,.tn-sort,.tn-add-time,.tn-b3-add,.tn-pro-missing .button{display:none!important}
  .tn-main{width:auto!important;margin:0!important;padding:0!important}
  .tn-output{margin:0}
  .tn-result-head{margin-bottom:4mm}
  .tn-result-title{font-size:18pt;margin:2mm 0}
  .tn-facts{font-size:9pt}
  .tn-big3{gap:4mm;margin-bottom:5mm}
  .tn-b3{padding:3mm 4mm;border-width:1px}
  .tn-chart{display:block}
  .tn-wheel{max-width:150mm;margin:0 auto;padding:0;border:0;break-inside:avoid}
  .tn-side{display:block}
  .tn-key-box{max-width:150mm;margin:2mm auto 0;padding:0;border:0;background:none}
  .tn-glyph-key{grid-template-columns:repeat(5,minmax(0,1fr));font-size:8pt;margin-top:2mm;padding-top:2mm}
  .tn-legend{justify-content:center;font-size:8.5pt}
  .tn-pro{break-before:page;margin-top:0;padding-top:0;border-top:0}
  .tn-pro-head{margin-bottom:5mm}
  .tn-pro-lead{font-size:9pt}
  .tn-pro-body{gap:6mm}
  .tn-pro-pair{grid-template-columns:minmax(0,1fr);gap:6mm}
  .tn-scroll{overflow:visible;border-width:1px}
  .tn-t{font-size:8.5pt}
  .tn-t th,.tn-t td{padding:1.4mm 2mm}
  .tn-t .tn-topic{display:none}
  .tn-grid th,.tn-grid td{width:9mm;min-width:9mm;height:9mm}
  .tn-grid-cell .tn-g{font-size:11pt}
  .tn-grid-orb{font-size:6.5pt}
  .tn-dist-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:4mm}
  .tn-mid-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:4mm}
  .tn-tech{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tn-dist,.tn-t--mid,.tn-tech-row,.tn-t tr,.tn-grid{break-inside:avoid}
  .tn-pro-title,.tn-pro-intro{break-after:avoid}
  .tn-phone-note{display:none!important}
  .tn-pro-title{font-size:13pt}
  .tn-pro-intro{font-size:8.5pt;margin-bottom:2mm}
}