/* =====================================================================
   Design F, cluster "signs": /horoscopes hub, the twelve sign guides
   (/horoscopes/{sign}), /horoscope/2027, /horoscope/2027/{sign} and
   /astrology-calendar-2027. Tokens only; loaded after kismet.css.
   ===================================================================== */

/* ------------------------------------------------------------ shared */
.yk-muted{font-size:.86em;color:var(--c-ink-2)}
.yk-small{max-width:680px;margin-top:10px;font-size:15.5px;line-height:1.5;color:var(--c-ink-2)}
.yk-link,.yk-small a{color:var(--c-link)}
.yk-byline{margin-top:8px;font-size:15.5px;line-height:1.4;color:var(--c-ink-2)}
.yk-byline a{color:var(--c-ink);font-weight:700;text-decoration:none}
.yk-byline a:hover{text-decoration:underline}
.yk-box{position:relative;padding:22px 20px 18px;background:var(--c-butter-lt);border-radius:var(--r-lg);box-shadow:var(--sh-print);color:var(--c-ink)}
.yk-box .tape{left:42px;width:80px;transform:rotate(-6deg)}
.yk-box .k{margin-bottom:6px}
.yk-box p:not(.k){font-size:17px;line-height:1.5}
.yk-note{max-width:680px;margin:0 0 24px;padding:14px 18px;border:2px dashed var(--c-line-2);border-radius:var(--r-md);background:var(--c-card);font-size:16px;line-height:1.5;color:var(--c-ink)}
.yk-note a{color:var(--c-link)}
details.yk-more{margin-top:10px}
details.yk-more summary{display:inline-flex;align-items:center;min-height:44px;font:400 17px/1 var(--display);color:var(--c-link);cursor:pointer}

/* ------------------------------------------------------------ /horoscopes hub */
.hub-hero{padding:4px 0 0}
.hub-grid{display:grid;gap:22px}
.hub-grid .sheet-wrap{grid-area:auto}
.hub-text .k{margin-top:14px}
.hub-text .t-h1{margin-top:6px}
.hub-pick{margin-top:16px}
@media (min-width:1080px){
  .hub-grid{grid-template-columns:minmax(0,1fr) 560px;gap:56px;align-items:center}
  .hub-text{padding-bottom:30px}
}
@media (min-width:1280px){.hub-grid{grid-template-columns:minmax(0,1fr) 600px}}
.sg-sheet .stk small{max-width:100%;white-space:normal;text-wrap:balance}
.hub-tools{margin-top:56px}
.hub-tools .tool-list{margin-top:20px}
.hub-more{margin-top:64px}
.hub-card{position:relative;max-width:920px;padding:30px 20px 22px;background:var(--c-card);border-radius:var(--r-xl);box-shadow:var(--sh-print)}
.hub-card .tape{left:44px}
.hub-card > p{margin-top:8px;color:var(--c-ink-2)}
.hub-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px;margin-top:10px}
.hub-links a{display:flex;align-items:center;min-height:40px;color:var(--c-link);font-weight:700;text-decoration:none}
.hub-links a:hover{text-decoration:underline}
.hub-27{display:flex;flex-wrap:wrap;gap:0 28px;margin-top:6px}
@media (min-width:700px){.hub-card{padding:34px 34px 26px}.hub-links{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ------------------------------------------------------------ sign guide (/horoscopes/{sign}) */
.sg-head .sh-grid,.yk-head .sh-grid{align-items:start}
.sg-head .sh-char,.yk-head .sh-char{margin-top:10px}
.sg-h1 .sg-name{display:block}
.sg-h1 .sg-arch{display:block;margin-top:6px;font-size:clamp(23px,5.6vw,30px);line-height:1.1;letter-spacing:0;color:var(--c-ink)}
@media (min-width:1080px){.sg-h1 .sg-arch{font-size:34px}}
.sg-head .chips{margin-top:12px}
/* keywords always get their own line from 700px, so the late body font never re-wraps the row (CLS) */
@media (min-width:700px){.sg-head .chips{display:grid;grid-template-columns:repeat(2,max-content);justify-content:start}.sg-head .chips li:last-child{grid-column:1/-1;justify-self:start}}
.sg-head .note p{text-wrap:pretty}
.sg-today{margin-top:26px}
.sg-clip{max-width:760px;padding:28px 22px 20px}
.sg-clip .tape{left:40px;transform:rotate(-5deg)}
.sg-clip .k{padding-right:0}
.sg-clip .more{margin-top:12px;margin-right:18px}
@media (min-width:700px){.sg-clip{padding:30px 30px 22px}}
.sg-grid{margin-top:34px}
.sg-body{min-width:0}
.sg-body .byline{margin-bottom:22px}
.sg-traits{display:grid;gap:12px;max-width:680px}
@media (min-width:700px){.sg-traits{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sg-trait{padding:16px 16px 18px;border-radius:var(--r-lg)}
.sg-trait h2{font-size:21px;margin-bottom:6px}
.sg-trait p{font-size:16.5px;line-height:1.5}
.sg-body .art-prose{margin-top:8px}
.sg-sec h2{display:flex;align-items:center;gap:12px;margin:40px 0 12px}
.sg-ic{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:50%;background:#fff;box-shadow:0 2px 0 rgba(43,19,56,.14);transform:rotate(-6deg)}
.sg-ic img{width:38px;height:38px}
.sg-sec:nth-of-type(even) .sg-ic{transform:rotate(5deg)}
.sg-cta{max-width:680px;margin-top:48px;padding:26px 22px 22px;background:var(--c-butter-lt);border-radius:var(--r-xl);box-shadow:var(--sh-print)}
.sg-cta h2{font-size:clamp(23px,3vw,28px)}
.sg-cta > p{margin-top:8px;color:var(--c-ink-2)}
.sg-cta .sg-cta-act{margin-top:16px}
.sg-links{display:flex;flex-wrap:wrap;gap:2px 22px;margin-top:12px}
.sg-links a{display:inline-flex;align-items:center;min-height:40px;color:var(--c-link);font-weight:700;text-decoration:none}
.sg-links a:hover{text-decoration:underline}
@media (min-width:700px){.sg-cta{padding:30px 32px 24px}}
.sg-body .tool-list,.yk-body .tool-list{max-width:680px;grid-template-columns:repeat(2,minmax(0,1fr))}
.sg-body .tool-list li:last-child{grid-column:1/-1}
@media (min-width:700px){.sg-body .tool-list{grid-template-columns:repeat(3,minmax(0,1fr))}.sg-body .tool-list li:last-child{grid-column:auto}}

/* ------------------------------------------------------------ 2027 sign page */
.yk-head h1{font-size:clamp(38px,10vw,48px);line-height:1;letter-spacing:-.015em}
@media (min-width:700px){.yk-head h1{font-size:clamp(48px,6vw,64px)}}
.yk-head .yk-box{grid-column:1/-1;margin-top:14px}
@media (min-width:1080px){.yk-head .yk-box{grid-column:auto;margin:0;transform:rotate(1deg)}}
.yk-grid{margin-top:30px}
.yk-body{min-width:0}
.yk-toc{max-width:680px;margin:0 0 8px;padding:18px 20px 14px;background:var(--c-card);border-radius:var(--r-lg);box-shadow:var(--sh-print)}
.yk-toc ol{counter-reset:toc;margin-top:6px;columns:1;column-gap:28px}
.yk-toc li{counter-increment:toc;break-inside:avoid}
.yk-toc a{display:flex;align-items:baseline;gap:8px;min-height:36px;padding:4px 0;color:var(--c-link);font-size:16.5px;line-height:1.3;text-decoration:none}
.yk-toc a::before{content:counter(toc);flex:none;width:22px;font:400 14px/1.4 var(--display);color:var(--c-label)}
.yk-toc a:hover{text-decoration:underline}
@media (min-width:560px){.yk-toc ol{columns:2}}
.yk-sec{margin-top:44px;scroll-margin-top:24px}
.yk-sec > h2{max-width:680px;margin-bottom:12px;font-size:clamp(25px,3.2vw,32px)}
.yk-sec > p{max-width:680px}
.yk-sec > p + p{margin-top:1em}
.yk-prose{max-width:680px}
.yk-prose p+p{margin-top:1em}
.yk-grid4{display:grid;gap:14px}
@media (min-width:760px){.yk-grid4{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}
.yk-card{padding:18px 18px 16px;border-radius:var(--r-lg);min-width:0}
.yk-card h3{margin-bottom:8px;font-size:21px}
.yk-card .yk-prose p{font-size:16.5px;line-height:1.55}
.yk-card .yk-sky{margin-top:12px;font-size:14.5px}
.yk-sky-list{margin-top:4px;display:grid;gap:4px}
.yk-sky-list li{font-size:15.5px;line-height:1.4}
.yk-sky-list b{font-weight:700}
.yk-quick{max-width:680px}
.yk-quick li{line-height:1.5}
.yk-quick strong{font-weight:700}
.yk-sec .word{max-width:680px;margin-top:6px}
.yk-word p{font:400 clamp(22px,3vw,28px)/1.22 var(--display);text-wrap:pretty}
.word .tape{left:40px}
.yk-faq{max-width:680px}
.yk-faq dt{margin-top:18px;font:400 19px/1.25 var(--display)}
.yk-faq dt:first-child{margin-top:4px}
.yk-faq dd{margin:6px 0 0;padding-bottom:16px;border-bottom:1.5px dotted var(--c-line-2);color:var(--c-ink-2);font-size:17px;line-height:1.55}
.yk-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:680px}
@media (min-width:700px){.yk-links{grid-template-columns:repeat(3,minmax(0,1fr))}}
.yk-links a{display:flex;align-items:center;min-height:48px;padding:10px 14px;background:var(--c-card);border-radius:var(--r-md);box-shadow:0 3px 0 var(--c-line-2);color:var(--c-ink);font-size:15.5px;font-weight:700;line-height:1.25;text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.yk-links a:hover{transform:translateY(-2px);box-shadow:0 5px 0 var(--c-line-2)}
.yk-fine{max-width:680px;margin-top:34px}

/* computed tables: design F data table; stacked rows on phones */
.yk-sec .table-wrap{max-width:none}
.yk-table{font-size:16px}
.yk-table td.yk-when{font:400 16.5px/1.3 var(--display);white-space:nowrap}
.yk-table td.yk-when .yk-muted{font:400 13.5px/1.4 var(--body)}
.yk-table td{line-height:1.4}
.yk-table .hand-cell{min-width:180px}
@media (min-width:701px){
  .yk-table{min-width:560px}
  .yk-table td:first-child:not(.yk-when){font:400 16.5px/1.3 var(--display)}
  .yk-table:is([data-computed="eclipses"],[data-computed="moons"],[data-computed="aspects"],[data-computed="ingresses"],[data-computed="ingresses-fast"]).cal td:is(:nth-child(4),:nth-child(5)),
  .yk-table[data-computed="seasons"] td:is(:nth-child(3),:nth-child(4)){white-space:nowrap}
}
@media (max-width:700px){
  .yk-table,.yk-table tbody{display:block}
  .yk-table thead{display:none}
  .yk-table tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 0;padding:14px 0;border-bottom:1.5px dotted var(--c-line-2)}
  .yk-table tbody tr:last-child{border-bottom:0}
  .yk-table.cal td,.yk-table td{display:block;padding:0;border:0;font-weight:400;color:inherit;font-size:15.5px;grid-column:auto}
  .yk-table td:not(:first-child){margin-right:14px}
  .yk-table td.yk-when{flex:1 0 100%;margin-bottom:2px;font-size:18px;white-space:normal}
  .yk-table td.yk-when br{display:none}
  .yk-table td.yk-when .yk-muted{margin-left:6px}
  .yk-table td:nth-child(2){font-weight:700}
  .yk-table .hand-cell,.yk-table.cal td.hand-cell{flex:1 0 100%;min-width:0;margin-top:4px;font-size:21px;color:var(--c-hand)}
  /* columns that read better on their own line */
  .yk-table[data-computed="key-dates"] td,.yk-table[data-computed="eclipses"] td:last-child,.yk-table[data-computed="retrogrades"] td:last-child{flex:1 0 100%}
  .yk-table[data-computed="key-dates"] td:last-child{color:var(--c-ink-2)}
  .yk-table[data-computed="retrogrades"] td{flex:1 0 100%;margin-right:0}
  .yk-table[data-computed="retrogrades"] td:first-child{margin-bottom:2px;font:400 18px/1.25 var(--display)}
  .yk-table[data-computed="retrogrades"] td:nth-child(2),.yk-table[data-computed="retrogrades"] td:nth-child(3){margin-top:2px;font:400 15.5px/1.45 var(--body)}
  .yk-table[data-computed="retrogrades"] td:nth-child(2)::before{content:"Backward: ";font:400 14px var(--body);color:var(--c-ink-2)}
  .yk-table[data-computed="retrogrades"] td:nth-child(3)::before{content:"Forward: ";font:400 14px var(--body);color:var(--c-ink-2)}
  .yk-table[data-computed="retrogrades"] td:nth-child(4):not(.hand-cell){margin-top:4px;color:var(--c-ink-2)}
}

/* ------------------------------------------------------------ 2027 hub */
.yk-hub-head{padding-top:4px}
.yk-hub-head .k{margin-top:14px}
.yk-hub-head .t-h1{margin-top:6px}
.yk-intro{max-width:880px;margin-top:22px}
.yk-hub-signs{margin-top:36px}
.yk-signs{display:grid;gap:14px}
@media (min-width:640px){.yk-signs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.yk-signs{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}
.yk-sign{display:grid;grid-template-columns:72px minmax(0,1fr);gap:0 14px;height:100%;padding:16px 16px 18px;background:var(--c-card);border-radius:var(--r-lg);box-shadow:0 4px 0 var(--c-line-2);text-decoration:none;color:var(--c-ink);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.yk-sign:hover{transform:translateY(-3px);box-shadow:0 7px 0 var(--c-line-2)}
.yk-sign .zs{grid-row:span 3;width:72px;height:72px;transform:rotate(var(--r))}
.yk-sign:hover .zs{animation:wob .7s var(--ease)}
.yk-sign strong{font:400 21px/1.15 var(--display)}
.yk-sign span{margin-top:2px;font-size:14.5px;color:var(--c-ink-2)}
.yk-sign em{margin-top:8px;font-style:normal;font-size:15.5px;line-height:1.45}
.yk-hub-cal{margin-top:8px}
.yk-cal-link{max-width:880px;margin:0;font-size:17px}

/* ------------------------------------------------------------ astrology calendar */
.yk-cal{padding-top:4px}
.yk-cal-head{max-width:880px;margin-top:14px}
.yk-cal-head .lede{margin-top:8px}
.yk-cal-top{display:grid;gap:18px;margin-top:26px}
.yk-cal-top .yk-toc{margin:0;max-width:none}
.yk-cal-top .yk-quick{margin-bottom:0}
.yk-cal-top .yk-quick li{font-size:16.5px}
@media (min-width:960px){.yk-cal-top{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:start}.yk-cal-top .yk-toc ol{columns:1}}
.yk-cal .yk-sec{max-width:1120px}
.yk-cal .yk-sec > p,.yk-cal .yk-sec > h2{max-width:760px}
.yk-cal .yk-links{max-width:880px}
@media (min-width:1000px){.yk-cal .yk-links{grid-template-columns:repeat(4,minmax(0,1fr))}}