/* Round 27 Craft lane: one type scale, one set of details, phone fixes.
   Linked last in index.html. Screen only; print.css keeps its own sizes. */
:root{--ts-12:12px;--ts-14:14px;--ts-16:16px;--ts-19:19px;--ts-24:24px;--ts-32:32px;--ts-48:48px;--ts-72:72px}

/* r27-type-remap:start (generated, do not edit by hand) */
@media screen{
:root{font-size:16px}
button,input,select{font-size:inherit}
.brand{font-size:24px}
.edition{font-size:16px}
.masthead button{font-size:14px}
.context{font-size:14px}
.pair-title{font-size:clamp(70px,8.5vw,138px)}
.pair-title .join{font-size:.44em}
.pair-title .long-name{font-size:.45em}
.short-reading-text p{font-size:19px}
.short-reading-text button{font-size:inherit}
.highlights span{font-size:16px}
.highlights strong{font-size:72px}
@media(max-width:700px){.highlights strong{font-size:48px}}
.highlights small{font-size:12px}
.body-label-text{font-size:14px}
.arc-key{font-size:13px}
.endpoint-label{font-size:14px}
.stage-caption{font-size:12px}
.segments button{font-size:14px}
.meter-family h3{font-size:14px}
.meter-family h3 strong{font-size:24px}
.meter-family h3 small{font-size:12px}
.gauge-index{font-size:12px}
.gauge-name{font-size:14px}
.gauge-value{font-size:32px}
.gauge-condition,.gauge-estimate{font-size:12px}
.register-scale{font-size:12px}
.reading-head{font-size:12px}
#reading-content h2{font-size:48px}
#reading-content h2>span:not(.arrival-subject,.arrival-object,.muted){font-size:72px}
#reading-content .lead-effect{font-size:19px}
.contact-meta,.point-note,.scale-note{font-size:14px}
.arrival-orb{font-size:16px}
.effect-chips button{font-size:14px}
summary{font-size:14px}
.meter-link-list button{font-size:14px}
#first-contact,#read-long{font-size:14px}
.total>span{font-size:14px}
.total strong{font-size:48px}
.total small{font-size:12px}
#resolution-sentence{font-size:16px}
.play-buttons button{font-size:14px}
.contact-picker select{font-size:14px}
.full-reading-link{font-size:14px}
#running-line{font-size:14px}
.rail-actions button{font-size:14px}
#estimate-controls label{font-size:16px}
#inference-status{font-size:14px}
.evidence-key{font-size:12px}
.single-reading strong{font-size:72px}
.single-reading small{font-size:14px}
.interaction-reading strong{font-size:72px}
.interaction-reading p{font-size:14px}
.footer{font-size:14px}
#selfcheck{font-size:12px}
@media(min-width:701px) and (max-width:1150px){.pair-title{font-size:90px}}
@media(max-width:700px){.brand{font-size:19px}}
@media(max-width:700px){.masthead button{font-size:14px}}
@media(max-width:700px){.context{font-size:12px}}
@media(max-width:700px){.pair-title{font-size:65px}}
@media(max-width:700px){.pair-title .person-b{font-size:1.14em}}
@media(max-width:700px){.pair-title .join{font-size:.55em}}
@media(max-width:700px){.pair-title .long-name{font-size:.6em}}
@media(max-width:700px){.pair-title .person-b.long-name{font-size:.66em}}
@media(max-width:700px){.highlights span{font-size:14px}}
@media(max-width:700px){.highlights strong{font-size:48px}}
@media(max-width:700px){.highlights small{font-size:12px}}
@media(max-width:700px){.stage-caption{font-size:12px}}
@media(max-width:700px){.arc-key{font-size:13px}}
@media(max-width:700px){#reading-content h2{font-size:32px}}
@media(max-width:700px){#reading-content .lead-effect{font-size:16px}}
@media(max-width:700px){.segments button{font-size:14px}}
@media(max-width:700px){.meter-family h3{font-size:16px}}
@media(max-width:700px){.meter-family h3 strong{font-size:24px}}
@media(max-width:700px){.meter-family h3 small{font-size:12px}}
@media(max-width:700px){.gauge-name{font-size:16px}}
@media(max-width:700px){.gauge-value{font-size:32px}}
@media(max-width:700px){.gauge-condition,.gauge-estimate{font-size:12px}}
@media(max-width:700px){.gauge-index{font-size:12px}}
@media(max-width:700px){.register-scale{font-size:12px}}
@media(max-width:700px){.total>span{font-size:12px}}
@media(max-width:700px){.total strong{font-size:32px}}
@media(max-width:700px){.total small{font-size:12px}}
@media(max-width:700px){#resolution-sentence{font-size:16px}}
@media(max-width:700px){.contact-picker select{font-size:12px}}
@media(max-width:700px){.play-buttons button{font-size:14px}}
@media(max-width:700px){#running-line{font-size:12px}}
@media(max-width:700px){.rail-actions button{font-size:14px}}
@media(max-width:700px){.evidence-key{font-size:12px}}
@media(max-width:700px){#estimate-controls label{font-size:16px}}
@media(max-width:700px){.reading-panel.active #sheet-toggle{font-size:14px}}
@media(max-width:700px){.reading-panel.active #reading-kicker{font-size:12px}}
@media(max-width:700px){.single-reading strong{font-size:72px}}
@media(max-width:700px){.interaction-reading strong{font-size:48px}}
@media(max-width:700px){.interaction-reading p{font-size:14px}}
@media(max-width:700px){.short-reading-text p{font-size:16px}}
.total strong{font-size:32px}
@media(max-width:700px){.total strong{font-size:24px}}
.long-reading .total-value{font-size:32px}
@media(max-width:700px){.long-reading .total-value{font-size:24px}}
.entry-intro h1{font-size:16px}
.entry-intro #demo{font-size:14px}
.entry-intro p{font-size:14px}
body[data-state=empty] .pair-title{font-size:clamp(90px,10vw,145px)}
.identity>span{font-size:12px}
.identity input{font-size:32px}
.entry-handover{font-size:16px}
.entry-receipt{font-size:16px}
.entry-receipt [id$=place-confirmation]{font-size:14px}
.receipt-edit{font-size:12px}
.assembling-status{font-size:14px}
.step-caption{font-size:16px}
.date-fields label,.time-row label,.window-field{font-size:14px}
.date-fields input{font-size:24px}
.step-controls button{font-size:14px}
.time-certainty button{font-size:14px}
.time-row input{font-size:32px}
.time-row select{font-size:14px}
.window-field select{font-size:16px}
.place-wrap input{font-size:24px}
.place-list li{font-size:16px}
.place-list small{font-size:14px}
.place-status{font-size:14px}
.field-error{font-size:16px}
.field-error button{font-size:14px}
.fold-choices small{font-size:12px}
.date-alternative{font-size:14px}
.entry-footer p{font-size:14px}
.entry-actions button{font-size:16px}
#entry-ready{font-size:16px}
#entry-error{font-size:16px}
#entry-error button{font-size:16px}
.record-label{font-size:12px}
@media(max-width:1150px) and (min-width:701px){.identity input{font-size:32px}}
@media(max-width:1150px) and (min-width:701px){.date-fields input{font-size:24px}}
@media(max-width:700px){.entry-intro h1{font-size:16px}}
@media(max-width:700px){.entry-intro p{font-size:14px}}
@media(max-width:700px){body[data-state=empty] .pair-title{font-size:65px}}
@media(max-width:700px){body[data-state=empty] .pair-title .join{font-size:.34em}}
@media(max-width:700px){body[data-state=empty] .pair-title .person-b{font-size:.85em}}
@media(max-width:700px){body[data-state=empty] .pair-title .person-a{font-size:.85em}}
@media(max-width:700px){body[data-state=empty] .pair-title .long-name{font-size:.35em}}
@media(max-width:700px){.identity input{font-size:32px}}
@media(max-width:700px){.identity>span{font-size:12px}}
@media(max-width:700px){.entry-handover{font-size:14px}}
@media(max-width:700px){.entry-receipt{font-size:14px}}
@media(max-width:700px){.entry-receipt [id$=place-confirmation]{font-size:14px}}
@media(max-width:700px){.assembling-status{font-size:14px}}
@media(max-width:700px){.date-fields input{font-size:24px}}
@media(max-width:700px){.time-row input{font-size:32px}}
@media(max-width:700px){.time-certainty button{font-size:14px}}
@media(max-width:700px){.time-row select{font-size:14px}}
@media(max-width:700px){.place-wrap input{font-size:24px}}
@media(max-width:700px){.place-status{font-size:14px}}
@media(max-width:700px){.entry-actions .primary{font-size:16px}}
@media(max-width:700px){#entry-ready{font-size:14px}}
@media(max-width:700px){.entry-footer p{font-size:12px}}
@media(max-width:700px){.masthead #motion-toggle{font-size:0}}
@media(max-width:700px){.masthead #motion-toggle:after{font-size:16px}}
@media(max-width:700px){body[data-state=loading] .pair-title{font-size:60px}}
.r24-name-hint{font-size:14px}
.entry-name-nudge p{font-size:16px}
.chapter-head h2,.coverage h2{font-size:72px}
@media(max-width:700px){.chapter-head h2,.coverage h2{font-size:48px}}
.chapter-head p{font-size:16px}
.truth-lead{font-size:48px}
.truth-copy>p{font-size:19px}
.truth-copy details p{font-size:16px}
.coverage-counts p{font-size:16px}
.coverage-counts strong{font-size:72px}
.coverage>p{font-size:16px}
.coverage-summary strong{font-size:24px}
.coverage-summary p{font-size:16px}
.coverage-list li{font-size:14px}
.inline-note,.point-note,.range-note,.total-note{font-size:14px}
.contact-toolbar label{font-size:14px}
.contact-toolbar select{font-size:16px}
.contact-toolbar button{font-size:14px}
.instrument-heading{font-size:32px}
.instrument-heading small{font-size:14px}
.instrument-definition{font-size:16px}
.contact-heading h3{font-size:32px}
.body-label small{font-size:14px}
.aspect-label{font-size:14px}
.orb{font-size:14px}
.contact-reading>p{font-size:19px}
.contact-reading .voice-emphasis{font-size:14px}
.complete-contact>summary{font-size:14px}
.flag{font-size:14px}
.effect-line p{font-size:16px}
.effect-score{font-size:14px}
.role-line{font-size:14px}
.condition{font-size:14px!important}
.source-id{font-size:14px}
blockquote{font-size:16px}
.estimated-reading h4{font-size:24px}
.estimated-line p{font-size:16px}
.estimated-note{font-size:14px}
.also-measured>summary{font-size:32px}
.also-measured li{font-size:14px}
.empty-reading{font-size:16px}
.meter-group h3{font-size:24px}
.group-caption{font-size:16px}
.meter-row summary{font-size:16px}
.meter-value{font-size:32px}
.meter-note{font-size:14px}
.meter-definition{font-size:16px}
.meter-proof{font-size:14px}
.total-value{font-size:48px}
.personal-table,.comparison-table{font-size:16px}
.personal-table small{font-size:14px}
.personal-table thead th:not(:first-child){font-size:32px}
.personal-table td{font-size:24px}
.person-total{font-size:48px}
.comparison-table th{font-size:24px}
.comparison-table caption{font-size:14px}
.mini-row{font-size:14px}
.candidate h4{font-size:16px}
.candidate-number{font-size:72px}
.candidate p{font-size:14px}
.angle-copy p{font-size:16px}
.time-samples{font-size:16px}
.dialog-head h2{font-size:48px}
@media(max-width:1150px) and (min-width:701px){.meter-row summary{font-size:14px}}
@media(max-width:1150px) and (min-width:701px){.meter-value{font-size:32px}}
@media(max-width:1150px) and (min-width:701px){.truth-lead{font-size:32px}}
@media(max-width:700px){.chapter-head h2,.coverage h2{font-size:48px}}
@media(max-width:700px){.chapter-head p{font-size:16px}}
@media(max-width:700px){.truth-lead{font-size:32px}}
@media(max-width:700px){.truth-copy>p{font-size:16px}}
@media(max-width:700px){.coverage-counts strong{font-size:48px}}
@media(max-width:700px){.coverage-counts p{font-size:14px}}
@media(max-width:700px){.coverage>p{font-size:16px}}
@media(max-width:700px){.contact-toolbar select{font-size:14px}}
@media(max-width:700px){.contact-toolbar .voice-switch button{font-size:14px}}
@media(max-width:700px){.contact-toolbar #print-reading{font-size:14px}}
@media(max-width:700px){.instrument-heading{font-size:32px}}
@media(max-width:700px){.instrument-heading small{font-size:12px}}
@media(max-width:700px){.instrument-definition{font-size:16px}}
@media(max-width:700px){.contact-heading h3{font-size:24px}}
@media(max-width:700px){.body-label small{font-size:14px}}
@media(max-width:700px){.contact-reading>p{font-size:19px}}
@media(max-width:700px){.contact-reading .voice-emphasis{font-size:14px}}
@media(max-width:700px){.effect-line p{font-size:16px}}
@media(max-width:700px){.meter-row summary{font-size:16px}}
@media(max-width:700px){.long-reading .total-value{font-size:32px}}
@media(max-width:700px){.long-reading .totals>div{font-size:14px}}
@media(max-width:700px){.personal-table th,.personal-table td{font-size:14px}}
@media(max-width:700px){.personal-table td{font-size:19px}}
@media(max-width:700px){.personal-table thead th:not(:first-child){font-size:24px}}
@media(max-width:700px){.personal-table small{font-size:12px}}
@media(max-width:700px){.personal-table .person-total{font-size:24px}}
@media(max-width:700px){.angle-copy p{font-size:16px}}
@media(max-width:700px){.dialog-head h2{font-size:32px}}
@media(max-width:700px){.comparison-table th{font-size:19px}}
@media(max-width:700px){.comparison-table td:before{font-size:24px}}
@media(max-width:700px){.dialog-head h2{font-size:32px}}
@media(max-width:700px){.candidate-number{font-size:72px}}
.result-visual>header h2{font-size:72px}
@media(max-width:700px){.result-visual>header h2{font-size:48px}}
.result-visual>header p{font-size:14px}
.rose-label{font-size:12px}
.rose-percentile{font-size:10px}
.rose-centre-number{font-size:22px}
.rose-centre-copy{font-size:10px}
.mirror-headings{font-size:14px}
.mirror-meter-name{font-size:14px}
.mirror-meter-name small{font-size:12px}
.mirror-side{font-size:12px}
.result-tabs button{font-size:14px}
.composite-house-number{font-size:10px}
.composite-wheel-label{font-size:11px}
.composite-body-label{font-size:10px}
.crowd-meter-name{font-size:12px}
.crowd-percentile{font-size:12px}
@media(max-width:700px){.result-visual>header h2{font-size:48px}}
@media(max-width:700px){.mirror-meter-name{font-size:16px}}
@media(max-width:700px){.crowd-meter-name{font-size:14px}}
.short-reading-extra{font-size:14px}
.summary-detail summary{font-size:14px}
.summary-detail button{font-size:inherit}
.summary-detail button{font-size:14px}
.summary-detail-theme{font-size:12px}
.rose-band{font-size:10px}
.rose-centre-band{font-size:14px}
.rose-centre-band.band-none{font-size:12px}
html:not([data-owner-check]) .gauge-value{font-size:14px}
html:not([data-owner-check]) .highlights strong{font-size:32px}
@media(max-width:700px){html:not([data-owner-check]) .highlights strong{font-size:24px}}
html:not([data-owner-check]) .meter-value{font-size:16px}
#reading-content h2>span.meter-band{font-size:32px}
#reading-content h2>span.meter-band.band-none{font-size:24px}
#reading-content h2>span.raw-figure{font-size:24px}
.meter-rank{font-size:16px}
.leading-title{font-size:12px}
.leading-list button{font-size:inherit}
.leading-text{font-size:16px}
.leading-meta{font-size:12px}
.meter-all summary{font-size:14px}
.light-note{font-size:14px}
@media(max-width:700px){#reading-content h2>span.meter-band{font-size:24px}}
@media(max-width:600px){#rose-visual[data-narrow="true"] .rose-label{font-size:var(--rose-label-size,30px)}}
@media(max-width:600px){#rose-visual .rose-centre-band{font-size:22px}}
.crowd-caption{font-size:12px}
.rose-words{font-size:14px}
.rose-words-band{font-size:12px}
.rose-words li.rose-words-key{font-size:12px}
.r14-share-end p{font-size:24px}
@media(max-width:700px){.r14-share-end p{font-size:19px}}
.r14-share-open{font-size:14px}
.r14-head h2{font-size:48px}
@media(max-width:700px){.r14-head h2{font-size:32px}}
.r14-head p{font-size:14px}
.r14-strong-rank{font-size:72px}
@media(max-width:700px){.r14-strong-rank{font-size:48px}}
.r14-strong-title{font-size:32px}
@media(max-width:700px){.r14-strong-title{font-size:24px}}
.r14-strong-meta{font-size:12px}
.r14-strong-meaning{font-size:16px}
.r14-themes li{font-size:14px}
.r14-strong-more summary{font-size:14px}
.r14-strong-more summary::after{font-size:19px}
.r14-strong-more li{font-size:16px}
.r14-strong-more em{font-size:14px}
.r14-link{font-size:14px}
.r14-to-wheels{font-size:16px}
.r14-axis{font-size:12px}
.r14-corner{font-size:12px}
.r14-usual-label{font-size:12px}
.r14-pair-name{font-size:16px}
.r14-axis-x{font-size:12px}
.r14-where-bands dt{font-size:14px}
.r14-where-bands dd{font-size:32px}
@media(max-width:700px){.r14-where-bands dd{font-size:24px}}
.r14-where-sentence{font-size:19px}
.r14-where-note,.r14-where-missing{font-size:14px}
.r14-mix-table thead th{font-size:14px}
.r14-mix-table thead th small{font-size:12px}
.r14-mix-table tbody th{font-size:14px}
.r14-mix-words p{font-size:16px}
.r14-mix-words .is-together{font-size:19px}
.r14-mix-note{font-size:12px!important}
.r14-planets .r14-head h2{font-size:48px}
@media(max-width:700px){.r14-planets .r14-head h2{font-size:32px}}
.r14-chips-name{font-size:14px}
.r14-chip{font-size:14px}
.r14-chip small{font-size:12px}
.r14-focus-hint,.r14-focus-none{font-size:14px}
.r14-focus-head h3{font-size:24px}
.r14-clear{font-size:14px}
.r14-focus-name{font-size:16px}
.r14-focus-meaning{font-size:14px}
.r14-focus-themes{font-size:12px}
.r14-focus-themes .r14-link{font-size:14px}
.r14-share-head h2{font-size:32px}
.r14-share-sizes button{font-size:14px}
.r14-share-preview figcaption{font-size:12px}
.r14-share-save{font-size:14px}
.r14-share-actions button{font-size:14px}
.r14-share-status{font-size:12px}
@media(max-width:700px){.r14-strong-rank{font-size:48px}}
@media(max-width:700px){.r14-strong-title{font-size:19px}}
@media(max-width:700px){.r14-corner{font-size:12px}}
@media(max-width:700px){.r14-pair-name{font-size:14px}}
@media(max-width:700px){.r14-mix-table thead th{font-size:12px}}
.r14-strong-only{font-size:14px}
.r14-strongest>.r14-head h2{font-size:72px}
@media(max-width:700px){.r14-strongest>.r14-head h2{font-size:48px}}
@media(max-width:700px){.r14-strongest>.r14-head h2{font-size:32px}}
.total-overall{font-size:14px}
.total-overall span{font-size:12px}
.total-overall strong{font-size:16px}
.total-overall small{font-size:12px}
details.fold>summary::before{font-size:19px}
.fold-note{font-size:14px}
.short-reading-pointer{font-size:14px}
@media(max-width:700px){.contact-heading h3{font-size:19px}}
@media(max-width:700px){.body-label small{font-size:12px}}
@media(max-width:700px){.contact-heading .aspect-label{font-size:14px}}
@media(max-width:700px){.contact-heading .orb{font-size:12px}}
@media(max-width:700px){.contact-reading>p{font-size:16px}}
@media(max-width:700px){.contact-reading .voice-emphasis{font-size:14px}}
@media(max-width:700px){.contact-card .condition,.contact-card .reading-condition{font-size:14px}}
.r17-layers-head h2{font-size:12px}
.r17-layers-head p{font-size:14px}
.r17-switch button{font-size:16px}
.r17-soon{font-size:12px}
.r17-line{font-size:14px}
.r17-moved{font-size:14px}
.r17-near-key{font-size:14px}
.r17-near-tip{font-size:14px}
.r17-invite{font-size:16px}
.r17-invite button{font-size:16px}
.r17-seek h3{font-size:32px}
@media(max-width:700px){.r17-seek h3{font-size:24px}}
.r17-seek-sentence{font-size:19px}
.r17-profile dt{font-size:12px}
.r17-wants{font-size:16px}
.r17-fit{font-size:14px}
.r17-carry-title{font-size:12px}
.r17-carry-main{font-size:16px}
.r17-carry-where{font-size:14px}
.r17-conflict{font-size:14px}
.r17-tag{font-size:12px}
.r17-partial{font-size:14px}
@media (max-width:600px){.r17-switch button{font-size:16px}}
@media (max-width:600px){.r17-seek-sentence{font-size:16px}}
.r20-led{font-size:14px}
.r14-themes .r20-leads{font-size:12px}
.r20-note{font-size:14px}
.r20-condition{font-size:14px}
.r20-also-head h2{font-size:32px}
@media(max-width:700px){.r20-also-head h2{font-size:24px}}
.r20-also-head p{font-size:14px}
.r20-also-name{font-size:12px}
.r20-also-words{font-size:16px}
.r20-marks-head h2{font-size:72px}
@media(max-width:700px){.r20-marks-head h2{font-size:48px}}
.r20-marks-head p{font-size:16px}
.r20-marks-name{font-size:48px}
@media(max-width:700px){.r20-marks-name{font-size:32px}}
.r20-marks-sub{font-size:12px}
.r20-marks-list li::before{font-size:12px}
.r20-marks-tag{font-size:12px}
.r20-marks-words{font-size:16px}
.r20-marks-note{font-size:14px}
@media(max-width:700px){.result-tabs button{font-size:12px}}
@media(max-width:360px){.result-tabs button{font-size:12px}}
.r22-plain{font-size:.5em}
#rose-title .r22-plain,#mirror-title .r22-plain,#crowd-title .r22-plain,#r14-where-title .r22-plain,#r14-mix-title .r22-plain,#r14-planets-title .r22-plain,.coverage h2 .r22-plain,.chapter-head h2 .r22-plain,.reading-panel h2 .r22-plain{font-size:19px}
@media(max-width:700px){#rose-title .r22-plain,#mirror-title .r22-plain,#crowd-title .r22-plain,#r14-where-title .r22-plain,#r14-mix-title .r22-plain,#r14-planets-title .r22-plain,.coverage h2 .r22-plain,.chapter-head h2 .r22-plain,.reading-panel h2 .r22-plain{font-size:16px}}
.edition .r22-plain{font-size:.87em}
.print-composite-page h2 .r22-plain,.print-coverage h2 .r22-plain{font-size:.6em}
.r14-strong-more summary .r22-plain{font-size:.92em}
.coverage .r22-intro{font-size:16px}
.result-tabs .r22-tab-name{font-size:inherit}
.result-tabs .r22-tab-line{font-size:12px}
@media(max-width:600px){.result-tabs .r22-tab-line{font-size:12px}}
@media(max-width:360px){.result-tabs .r22-tab-line{font-size:12px}}
.r22-tab-intro h2{font-size:12px}
.r22-tab-intro h2 .r22-plain{font-size:12px}
.r22-tab-intro p{font-size:16px}
@media(max-width:700px){.r22-tab-intro p{font-size:16px}}
.r22-pick label{font-size:12px}
.r22-pick select{font-size:16px}
.r22-pick-status,.r22-save-status{font-size:14px}
.r22-save{font-size:14px}
.r22-people summary{font-size:16px}
.r22-people-note{font-size:14px}
.r22-person-line{font-size:14px}
.r22-delete{font-size:14px}
#rose-visual .rose-centre-share{font-size:11.5px}
@media(max-width:600px){#rose-visual .rose-centre-share{font-size:15px}}
.r14-where-bands .r22-bs{font-size:16px}
.reading-panel .meter-band .r22-bs,.reading-panel .meter-band .r22-sep{font-size:.62em}
.r23-davison>.r23-plate-head h2{font-size:32px}
@media(max-width:700px){.r23-davison>.r23-plate-head h2{font-size:24px}}
.r23-davison>.r23-plate-head p{font-size:16px}
.r23-wheel-link button{font-size:16px}
.r23-plate-head h3{font-size:32px}
@media(max-width:700px){.r23-plate-head h3{font-size:24px}}
.r23-plate-head p{font-size:16px}
.r23-choose button{font-size:14px}
.r23-note{font-size:14px}
.r23-focus-hint{font-size:14px}
.r23-focus-text{font-size:16px}
.r23-focus-links{font-size:14px}
.r23-legend{font-size:14px}
.r23-stage-head{font-size:19px}
.r23-wheel .r23-sign-name{font-size:10.5px}
.r23-wheel .r23-degree{font-size:12px}
.r23-wheel.two-rings .r23-degree{font-size:12px}
.r23-register summary{font-size:19px}
.r23-register table{font-size:14px}
.r23-register thead th{font-size:12px}
.r23-register thead th small{font-size:12px}
.r23-reg-cell{font-size:14px}
.r23-sky-head h4{font-size:24px}
.r23-switch{font-size:14px}
.r23-when label{font-size:12px}
.r23-when small{font-size:12px}
.r23-when input{font-size:16px}
.r23-step button{font-size:24px}
.r23-step-word{font-size:14px}
.r23-sky-read{font-size:16px}
.r23-sky-intro{font-size:14px}
.r23-sky-note{font-size:14px}
.r23-sky-main{font-size:16px}
.r23-sky-meta{font-size:14px}
.r23-sky-more{font-size:14px}
.r23-how{font-size:14px}
@media(max-width:700px){.r23-plate-head p{font-size:14px}}
@media(max-width:360px){.r23-choose button{font-size:14px}}
.r24-sky-reading{font-size:14px}
.r27-davison-reading h3{font-size:24px}
.r27-davison-reading li::before{font-size:16px}
.r27-davison-reading .r27-dav-name{font-size:14px}
.r27-davison-reading .r27-dav-line{font-size:16px}
.r25-export{font-size:14px}
.r25-export button{font-size:inherit}
.r27-answer .r27-lead{font-size:32px}
.r27-answer .r27-lead button{font-size:inherit}
.r27-answer .total>span{font-size:14px}
.r27-answer .total strong{font-size:24px}
.r27-answer .total small{font-size:12px}
.r27-answer .total-overall{font-size:14px}
.r27-answer #resolution-sentence{font-size:14px}
.r27-answer .r27-rest-text p{font-size:19px}
.r27-answer-rose-link{font-size:14px}
.r27-whats-this>summary{font-size:14px}
.r27-whats-this>summary::after{font-size:16px}
.r27-counts>summary::after{font-size:19px}
.r27-counts-title{font-size:16px}
.r27-counts-state{font-size:14px}
.r27-counts-lede{font-size:14px}
.r27-themes-head h2{font-size:48px}
.r27-see-label{font-size:14px}
.r27-see-tabs button{font-size:14px}
@media(max-width:700px){.r27-answer .r27-lead{font-size:24px}}
@media(max-width:700px){.r27-answer .total strong{font-size:19px}}
@media(max-width:700px){.r27-answer .total small{font-size:12px}}
@media(max-width:700px){.r27-answer-rose-link{font-size:12px}}
@media(max-width:700px){.r27-answer .r27-rest-text p{font-size:16px}}
@media(max-width:700px){.r27-themes-head h2{font-size:32px}}
.r27-themes>[role=tabpanel]>header h2{font-size:32px}
.r27-spine-names{font-size:16px}
.r27-spine-tabs button{font-size:14px}
.r27-spine select{font-size:14px}
.r27-card-time{font-size:14px}
.complete-contact>.voice-emphasis{font-size:14px}
.r27-could{font-size:12px}
.r14-where-bands .r27-could,#highlights .r27-could{font-size:14px}
}
/* r27-type-remap:end */

/* ---- Jobs set by hand (after the remap so they win) ---- */
/* Type jobs. Desktop and tablet use the full scale; phones (700px and below) step each job down once.
   Section title 72 / 48 · Sub-section title and rank numerals 48 / 32 · Card title 32 / 24
   Small title 24 / 19 · Lead sentence and heading brackets 19 / 16 · Body 16 · Controls and notes 14 · Labels 12 */
@media screen{
/* Section titles: one size, looser tracking so the word gaps stay open (P3-9). */
.result-visual>header h2,.r14-head h2,.r14-strongest>.r14-head h2,.r14-planets .r14-head h2,.chapter-head h2,.coverage h2,.r20-marks-head h2{font-size:var(--ts-72);letter-spacing:-.03em}
/* Sub-section titles and the big numerals. */
#reading-content h2,.r20-also-head h2,.truth-lead,.r23-davison>.r23-plate-head h2,.dialog-head h2{font-size:var(--ts-48);letter-spacing:-.03em}
.r14-strong-rank{font-size:var(--ts-48)}
.also-measured>summary{font-size:var(--ts-24)}
/* The bracket after a heading is set like "(Your 14 themes at a glance)" everywhere (P1-10). */
#reading-content h2>span.r22-plain,.r14-head h2 .r22-plain,.chapter-head h2 .r22-plain,.coverage h2 .r22-plain,.result-visual>header h2 .r22-plain,.r20-also-head h2 .r22-plain,#rose-title .r22-plain,#mirror-title .r22-plain,#crowd-title .r22-plain,#r14-where-title .r22-plain{display:block;margin-top:10px;font:400 var(--ts-19)/1.35 var(--body);letter-spacing:0;color:var(--muted);max-width:40ch}
.edition .r22-plain{font-size:var(--ts-14)}
.r14-strong-more summary .r22-plain{font-size:inherit}
/* The pair's names: one shared size worked out in renderNames so both names fit (P1-8). */
#pair-title[data-fit] .person-a,#pair-title[data-fit] .person-b{font-size:var(--pair-name);letter-spacing:-.06em;overflow-wrap:normal;word-break:normal;hyphens:manual}
#pair-title[data-fit] .join{font-size:var(--pair-join)}
}
@media screen and (max-width:700px){
.result-visual>header h2,.r14-head h2,.r14-strongest>.r14-head h2,.r14-planets .r14-head h2,.chapter-head h2,.coverage h2,.r20-marks-head h2{font-size:var(--ts-48)}
#reading-content h2,.r20-also-head h2,.truth-lead,.r23-davison>.r23-plate-head h2,.dialog-head h2{font-size:var(--ts-32)}
.r14-strong-rank{font-size:var(--ts-32)}
.r14-strong-title,.contact-heading h3{font-size:var(--ts-24)}
#reading-content h2>span.r22-plain,.r14-head h2 .r22-plain,.chapter-head h2 .r22-plain,.coverage h2 .r22-plain,.result-visual>header h2 .r22-plain,.r20-also-head h2 .r22-plain,#rose-title .r22-plain,#mirror-title .r22-plain,#crowd-title .r22-plain,#r14-where-title .r22-plain{font-size:var(--ts-16)}
}

/* ---- One fold marker, drawn icons (P2-1, P2-2, P2-3, P3-13) ---- */
:root{--r27-i-right:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");--r27-i-left:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 6l-6 6 6 6'/%3E%3C/svg%3E");--r27-i-down:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E");--r27-i-up:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E");--r27-i-back:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 6l-6 6 6 6'/%3E%3C/svg%3E");--r27-i-forward:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");--r27-i-out:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E")}
@media screen{
/* Every fold opens the same way: a drawn plus before the words; opening folds its upright away into a minus. */
details:not(.meter-row)>summary{list-style:none}
details:not(.meter-row)>summary::-webkit-details-marker{display:none}
details:not(.meter-row)>summary::before{content:'';flex:none;align-self:center;display:inline-block;width:11px;height:11px;margin:0 12px 0 1px;vertical-align:.02em;color:inherit;font:inherit;background:linear-gradient(currentColor,currentColor) center/100% 1.6px no-repeat,linear-gradient(currentColor,currentColor) center/1.6px 100% no-repeat;transition:background-size 220ms cubic-bezier(.2,.7,.2,1)}
details[open]:not(.meter-row)>summary::before,details.fold[open]>summary::before{content:'';background-size:100% 1.6px,1.6px 0%}
details.fold>summary::before{margin-right:0}
.r14-strong-more summary::after{content:none}
/* "What else it brings (More about this link)" reads as one line of words, not three columns (P2-3). */
.r14-strong-more summary{display:block;padding:12px 0;line-height:1.4}
.r14-strong-more summary .r22-plain{display:inline;margin-left:.3em;color:var(--muted);text-decoration:none}
.summary-detail summary{text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:5px}
/* Drawn arrows in the planet-symbol family: 24-unit grid, round ends, one stroke weight. */
.r27-i{display:inline-block;flex:none;margin-left:.2em;width:1em;height:1em;vertical-align:-.14em;background:currentColor;-webkit-mask:var(--r27-i) center/100% 100% no-repeat;mask:var(--r27-i) center/100% 100% no-repeat}
.r27-i[data-i=right]{--r27-i:var(--r27-i-right)}.r27-i[data-i=left]{--r27-i:var(--r27-i-left)}.r27-i[data-i=down]{--r27-i:var(--r27-i-down)}.r27-i[data-i=up]{--r27-i:var(--r27-i-up)}.r27-i[data-i=back]{--r27-i:var(--r27-i-back)}.r27-i[data-i=forward]{--r27-i:var(--r27-i-forward)}.r27-i[data-i=out]{--r27-i:var(--r27-i-out)}
/* Arrow-only spans the page already marks aria-hidden: the typed character shrinks to nothing and a drawn arrow
   takes its place (drawn on ::before so no text ever sits on its own colour). */
.r23-step button>span[aria-hidden=true],.r23-wheel-link button>span[aria-hidden=true],.r14-axis-y>span,.r14-axis-x-title>span{display:inline-block;font-size:0;line-height:0;vertical-align:middle;--r27-sz:16px}
.r23-step button>span[aria-hidden=true]::before,.r23-wheel-link button>span[aria-hidden=true]::before,.r14-axis-y>span::before,.r14-axis-x-title>span::before{content:'';display:inline-block;width:var(--r27-sz);height:var(--r27-sz);background:currentColor;-webkit-mask:var(--r27-i) center/100% 100% no-repeat;mask:var(--r27-i) center/100% 100% no-repeat}
.r23-step button:has(>span[aria-hidden=true]){display:flex;align-items:center;justify-content:center}
.r23-step button[aria-label^=Back]>span[aria-hidden=true]{--r27-i:var(--r27-i-back);--r27-sz:18px}.r23-step button[aria-label^=Forward]>span[aria-hidden=true]{--r27-i:var(--r27-i-forward);--r27-sz:18px}
.r23-wheel-link button>span[aria-hidden=true]{--r27-i:var(--r27-i-down);margin-left:.2em}
.r14-axis-y>span{--r27-i:var(--r27-i-down);--r27-sz:12px;margin-bottom:4px}.r14-axis-x-title>span{--r27-i:var(--r27-i-right);--r27-sz:12px;margin:0 4px}
/* The three group marks, drawn like the theme chips: filled dot (warmth), turned box (friction), ring (intensity). */
.r27-mark{display:inline-block;flex:none;width:8px;height:8px;margin-right:.55em;vertical-align:.08em;border-radius:50%;background:currentColor}
.r27-mark.demand{border-radius:1px;transform:rotate(45deg);width:7px;height:7px}
.r27-mark.neutral{background:transparent;border:1.5px solid currentColor}
.gauge-estimate:not(:empty)::before{content:'';display:inline-block;width:7px;height:7px;margin-right:.45em;vertical-align:.05em;border:1.3px solid currentColor;border-radius:50%}
}
@media (prefers-reduced-motion:reduce){details>summary::before{transition:none}}

/* ---- Headings, running text, labels, header, tap targets (P2-8, P2-9, P3-4, P2-19, P3-12, P2-15, P3-2) ---- */
:root{--r27-measure:34em;--r27-i-moon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14.5A8 8 0 1 1 9.5 4a6.5 6.5 0 0 0 10.5 10.5z'/%3E%3C/svg%3E");--r27-i-sun:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2.5v2M12 19.5v2M2.5 12h2M19.5 12h2M5.3 5.3l1.4 1.4M17.3 17.3l1.4 1.4M5.3 18.7l1.4-1.4M17.3 6.7l1.4-1.4'/%3E%3C/svg%3E")}
@media screen{
/* Each section's explanation sits under its heading, left-aligned, one gap, about 60 to 65 characters a line (P2-8). */
.r14-head,.r14-strongest>.r14-head,.result-visual>header,.r20-also-head,.r17-layers-head,.chapter-head{display:block}
.r17-layers-head p{text-align:left;margin-top:8px;font-size:var(--ts-14)}
.chapter-head p{margin-top:14px}
.r14-head p,.r14-strongest>.r14-head p,.result-visual>header p,.r20-also-head p{max-width:var(--r27-measure);margin-top:14px;text-align:left;font-size:var(--ts-16);line-height:1.55;color:var(--muted)}
.r14-head h2,.result-visual>header h2{max-width:none}
/* Running text never runs past about 65 characters a line (P2-9). */
.r27-answer #resolution-sentence,.r27-answer .r27-summary-rest,.r27-answer #short-reading-more,.r27-counts-lede,.short-reading-text p,.crowd-caption,.contact-meta,.inline-note,.contact-reading .condition,.contact-reading .voice-emphasis,.contact-reading>p,.r22-tab-intro p,.effect-line p,.chapter-head p,.truth-copy>p,.summary-note,.r17-layers-head p,.r14-mix-note,.r14-where-read p{max-width:var(--r27-measure)}
/* Machine labels become sentence case at a readable size (P3-4, lead ruling 5). The aspect line keeps its words. */
.r22-tab-intro h2,.r17-layers-head h2{font:500 var(--ts-24)/1.2 var(--display);letter-spacing:-.01em;text-transform:none;color:var(--ink);margin:0 0 10px}
.r22-tab-intro h2 .r22-plain{display:inline;font:400 var(--ts-16)/1.35 var(--body);color:var(--muted);letter-spacing:0}
.r14-strong-meta,.r17-profile dt,.r17-carry-title,.r20-marks-sub,.total-overall span,.r20-also-name,.summary-detail-theme,.leading-title,.r17-tag,.r17-soon{text-transform:none;letter-spacing:0}
.r14-strong-meta{font-size:var(--ts-14)}
.r17-profile dt,.r17-carry-title,.r20-marks-sub{font-size:var(--ts-14);font-weight:600;color:var(--ink)}
.r20-also-name{font-size:var(--ts-14);color:var(--ink)}
.total-overall span{font-size:var(--ts-14)}
/* Look switch: one pill, a drawn moon or sun, the word hidden only on the narrowest phones (P2-15, P3-2). */
.masthead .brand{white-space:nowrap}
.masthead #ground-toggle{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--rule);border-radius:999px;font-size:var(--ts-14);line-height:1;white-space:nowrap}
.masthead #ground-toggle::before{content:'';flex:none;width:15px;height:15px;background:currentColor;-webkit-mask:var(--r27-i-moon) center/100% 100% no-repeat;mask:var(--r27-i-moon) center/100% 100% no-repeat}
html[data-ground=night] .masthead #ground-toggle::before{-webkit-mask-image:var(--r27-i-sun);mask-image:var(--r27-i-sun)}
.masthead #ground-toggle:hover{border-color:var(--ink)}
/* The lighter-estimates tick box: a 24 px box on a full-width 44 px row (P3-12). */
label:has(>#include-inferred){display:flex;align-items:center;gap:12px;min-height:44px;cursor:pointer}
#include-inferred{flex:none;width:24px;height:24px;margin:0;accent-color:var(--ink);cursor:pointer}
}
@media screen and (max-width:700px){
.r22-tab-intro h2,.r17-layers-head h2{font-size:var(--ts-19)}
.r22-tab-intro h2 .r22-plain{font-size:var(--ts-14)}
}
@media screen and (max-width:360px){
.masthead #ground-toggle{width:44px;min-height:44px;padding:0;justify-content:center;gap:0;font-size:0;border-color:transparent}
.masthead #ground-toggle::before{width:18px;height:18px}
}
/* "Stay with a connection": on tablets the two points stack as two labelled rows instead of breaking after the "/" (P2-19). */
@media screen and (min-width:701px) and (max-width:1150px){
h3.contact-pair{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
h3.contact-pair .pair-join{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
}

/* ---- The Rose (P2-4 and the lead's Rose item) ---- */
@media screen{
/* Drawing text on the scale at full size (the Rose is drawn 1:1 from about 1024 up): names 12, their words 12, centre 12 / 19.
   Below 1151 px the words under each name keep their smaller drawing size so the side labels stay inside the screen. */
.rose-centre-copy{font-size:12px}
.rose-centre-band{font-size:19px}
#rose-visual .rose-centre-share,.rose-centre-band.rose-centre-share{font-size:12px;font-weight:500;fill:var(--muted)}
.rose-centre-band.band-none{font-size:14px}
}
@media screen and (min-width:1151px){.rose-percentile,.rose-band{font-size:12px}}
@media screen and (max-width:600px){
/* On phones the circle is too small to read; the line under the Rose ("The middle is ...") says it in page type. */
#rose-visual .rose-centre-copy,#rose-visual .rose-centre-band{display:none}
}

/* ---- Colour meaning (P2-11) ----
   Person A and warmth each move a little (about 6 on the CIEDE2000 scale in Paper, 7 in Carbon) so they sit
   more than 25 apart in both looks; Intensity gets its own hue (ochre) instead of the muted text colour.
   Measured CIEDE2000, Paper / Carbon: Person A to warmth 26.3 / 26.5 (was 12.9 / 13.5); warmth to friction
   28.7 / 25.5; Person A to Person B 35.0 / 30.8; Intensity to muted text 27.1 / 28.0 (was 3.6 / 2.3).
   Text contrast on the page ground, Paper / Carbon: Person A 5.3 / 9.8, warmth 7.8 / 7.5, Intensity 4.9 / 9.0. */
:root{--day-warm:#6c0fb4;--day-neutral:#a05400;--night-warm:#ba87ff;--night-neutral:#e6a23c;--pa:#0363ba}
:root[data-ground=night]{--pa:#72bdff}
/* "Not a future." is set in ink: the warmth colour means warmth, never decoration. */
.truth-lead em{color:var(--ink)}

/* ---- The merged structure (Layout lane, round 27) ---- */
@media screen{
/* Folds added in this round use the same drawn marker, before the words. */
.r27-whats-this>summary::after,.r27-counts>summary::after{content:none}
/* A bracket inside a button or control reads at the label size, not half its parent. */
button .r22-plain,summary .r22-plain,label .r22-plain,.r23-wheel-link .r22-plain{font-size:var(--ts-12)}
}
@media screen and (max-width:700px){
/* Inside the themes block each view's heading sits one step below the block's own heading (32 on phones). */
.r27-themes>[role=tabpanel]>header h2{font-size:var(--ts-24)}
}
@media screen{
/* A theme's word and its "could read" range wrap like the rest of the line instead of travelling as one
   unbreakable box, so nothing in the five strongest runs past the edge of a phone (e2e-r14). */
.r14-themes li .r14-theme-band{display:inline;white-space:normal}
.r14-themes li .r20-leads{white-space:normal}
}
@media screen{
/* Previous / next connection: arrow-only buttons (named by their aria-label) get the drawn arrows too. */
button[aria-label="Previous connection"],button[aria-label="Next connection"]{font-size:0;display:inline-flex;align-items:center;justify-content:center}
button[aria-label="Previous connection"]::before,button[aria-label="Next connection"]::before{content:'';width:18px;height:18px;background:currentColor;-webkit-mask:var(--r27-i-left) center/100% 100% no-repeat;mask:var(--r27-i-left) center/100% 100% no-repeat}
button[aria-label="Next connection"]::before{-webkit-mask-image:var(--r27-i-right);mask-image:var(--r27-i-right)}
}
@media screen{.r27-i[data-i=left],.r27-i[data-i=back]{margin:0 .25em 0 0}}
@media screen{
/* Where you sit: a long pair of names wraps beside its dot instead of pushing the page sideways on small phones. */
.r14-pair-name{white-space:normal;width:max-content;max-width:min(240px,62vw);line-height:1.2}
}
@media screen and (max-width:360px){
/* The phone bar's two pickers: the view picker takes only the room it needs so "Jump to a section" fits at 320. */
.r27-spine .r27-spine-view{flex:0 0 128px}
.r27-spine select{padding-left:10px;padding-right:26px}
}
@media screen{
/* Polish r27 (item 5): each Mirror bar in its theme's colour, as in the Rose. The fill draws in currentColor,
   and the person column's muted text colour had turned every bar grey. */
.mirror-row.warm .mirror-bar-fill{background:var(--warm)}
.mirror-row.demand .mirror-bar-fill{background:var(--demand)}
.mirror-row.neutral .mirror-bar-fill{background:var(--neutral)}
/* A touch more ink than the old .82 so the lightest family (intensity on Paper) keeps 3:1 against the page.
   Round 27 finish: the Rose's petals take the same ink, so a theme's colour is the same in the Rose and the Mirror. */
:root{--r27-shape-ink:.92}
.mirror-row .mirror-bar-fill{opacity:var(--r27-shape-ink)}
.rose-shape{fill-opacity:var(--r27-shape-ink)}
}
@media screen and (max-width:700px){
/* Polish r27 (item 4): on a phone the Marks heading sits right under the tab that already names it, so it takes the
   32 step on one line (as the themes block does) and "What it's like for ..." reaches the first screen. */
.r20-marks-head h2{font-size:var(--ts-32)}
}