.kern-designers{border:0;padding:0;margin:1.6rem 0}.kern-designers legend{font-size:.72rem;font-weight:700;margin-bottom:.7rem}.kern-mode-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.6rem}.kern-mode-grid label{position:relative;cursor:pointer}.kern-mode-grid input{position:absolute;left:.8rem;top:1rem;accent-color:#3546E8;width:15px;height:15px;margin:0}.kern-mode-grid label>span{display:block;min-height:100%;padding:.9rem .7rem .9rem 2.1rem;border:1px solid #CFC9DF;background:#fff;border-radius:14px;transition:background .2s,border-color .2s}.kern-mode-grid strong{font-size:.78rem;display:block}.kern-mode-grid small{display:block;font-size:.62rem;color:#615E68;line-height:1.6;margin-top:.3rem}.kern-mode-grid input:checked+span{background:#E4E2FF;border-color:#3546E8}.kern-mode-grid input:focus-visible+span{outline:3px solid #3546E8;outline-offset:3px}.kern-style-brief{padding:1.3rem 1.5rem;border:1px solid #DDD6EB;background:#fff;border-radius:16px;margin:1rem 0;color:#45424D;font-size:.83rem;max-width:950px}.kern-style-brief .eyebrow{margin:0 0 .6rem;color:#3546E8}.kern-style-brief>p{margin:.7rem 0}.kern-style-brief .kern-study-note{font-size:.7rem;color:#615E68}.kern-style-brief>a{font-size:.7rem;text-underline-offset:3px;color:#3546E8}.kern-expression{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}.kern-expression label{font-size:.7rem}.kern-expression input{display:block;width:100%;min-height:44px;accent-color:#3546E8;margin-top:.5rem}.kern-expression[hidden],.kern-style-brief[hidden]{display:none}.kern-card[data-mode=bass] .kern-board{background:#EEC45A;border-color:#D6A53F;--study-ink:#181715}.kern-card[data-mode=bass] .kern-letter{color:#181715}.kern-card[data-mode=bass] .kern-letter.is-selected{color:#A52620}.kern-card[data-mode=bass] .kern-letter:not(:first-child){clip-path:polygon(2% 0,100% 2%,97% 100%,0 98%)}.kern-card[data-mode=bass] .kern-reference .kern-letter{color:#181715!important}.kern-card[data-mode=bayer] .kern-board{background:#F0EEE7;border-color:#D4D0C5;background-image:linear-gradient(90deg,rgba(0,0,0,.025) 1px,transparent 1px);background-size:36px 36px}.kern-card[data-mode=bayer] .kern-reference .kern-letter{color:#A52F29!important}.kern-card[data-mode=carson] .kern-board{background:#E5E1D7;border-color:#CBC6BB;background-image:repeating-linear-gradient(-17deg,transparent 0 73px,rgba(40,30,20,.04) 74px 75px)}.kern-card[data-mode=carson] .kern-reference .kern-letter{color:#262421!important}.kern-card[data-mode=frutiger] .kern-board{background:#E6EDF3;border-color:#CDDAE5}.kern-card[data-mode=frutiger] .kern-reference .kern-letter{color:#173E66!important}.kern-card:not([data-mode=classic]) .kern-reference{height:clamp(110px,18vw,210px)}@media(max-width:1050px){.kern-mode-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.kern-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kern-mode-grid label:last-child{grid-column:1/-1}.kern-expression{grid-template-columns:1fr;gap:.5rem}.kern-controls{max-width:none}.kern-style-brief{padding:1rem}.kern-line-label>span{max-width:55%}}
.kern-style-brief{display:grid;grid-template-columns:210px minmax(0,1fr);gap:1.75rem;align-items:center;max-width:none}.kern-style-brief[hidden]{display:none}.kern-portrait{margin:0;align-self:center}.kern-portrait img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:transparent}.kern-portrait figcaption{font-size:.56rem;letter-spacing:.05em;color:#77717E;text-align:center;margin-top:.3rem}.kern-bio-copy>p{margin:.7rem 0}.kern-bio-copy .eyebrow{margin-top:0}.kern-bio-copy>a{font-size:.7rem;color:#3546E8;text-underline-offset:3px}@media(max-width:700px){.kern-style-brief{grid-template-columns:130px minmax(0,1fr);gap:1rem}}@media(max-width:480px){.kern-style-brief{grid-template-columns:1fr}.kern-portrait{max-width:170px;justify-self:center}.kern-bio-copy .eyebrow{font-size:.62rem}}
.kern-card{margin-bottom:1.25rem;background:#F8F6FF;overflow:hidden}.kern-heading{display:flex;justify-content:space-between;align-items:start;gap:2rem}.kern-heading .game-heading{flex:1}.kern-heading h2{max-width:440px}.kern-round{display:grid;gap:.5rem;text-align:right;color:#3546E8;padding-top:.3rem}.kern-round>span:last-child{font-size:.75rem;color:#615E68}.kern-help{font-size:.82rem;color:#615E68;max-width:720px;margin:1.3rem 0}.kern-board{background:#EFEAFB;border:1px solid #E2DCEE;border-radius:20px;padding:1.25rem clamp(.75rem,3vw,2.5rem);overflow:hidden}.kern-line-label{font-size:.6rem;font-weight:800;letter-spacing:.13em;color:#615E68;display:flex;justify-content:space-between;gap:1rem}.kern-line-label span{font-weight:500;letter-spacing:0;text-transform:none;text-align:right}.kern-word{position:relative;width:100%;height:clamp(110px,18vw,210px);margin:.5rem 0;user-select:none}.kern-word .kern-letter{position:absolute;top:50%;transform:translateY(-50%);margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#171723;line-height:1.2;font-kerning:none;letter-spacing:0;cursor:ew-resize;touch-action:pan-y;transition:color .2s}.kern-word .kern-letter.is-selected{color:#3546E8}.kern-word .kern-letter.is-selected::after{content:"";position:absolute;width:7px;height:7px;left:50%;bottom:0;background:#3546E8;border-radius:50%;transform:translate(-50%,100%)}.kern-word .kern-letter:disabled{cursor:default;opacity:1}.kern-word .kern-letter:first-child{color:#615E68;cursor:default}.kern-word .kern-letter:focus-visible{outline:2px dashed #3546E8;outline-offset:4px;border-radius:6px}.kern-word .kern-letter:active{touch-action:none}.kern-reference .kern-letter{color:#3546E8!important;cursor:default}.kern-reference{height:clamp(85px,14vw,160px)}#kern-reference-panel{border-top:1px solid #D8D1E5;padding-top:1rem}.kern-controls{display:grid;grid-template-columns:minmax(130px,200px) 1fr;gap:2rem;max-width:700px;margin:1.4rem 0}.kern-controls label{font-size:.7rem;font-weight:700;display:block}.kern-controls select{display:block;margin-top:.5rem;border:1px solid #C3BED2;background:#fff;border-radius:12px;color:#171723;width:100%;padding:.8rem;font:600 .85rem Manrope,sans-serif;min-height:46px}.kern-slider{display:flex;align-items:center;gap:.8rem;margin-top:.5rem}.kern-slider button{flex:0 0 44px;min-height:44px;background:#fff;border:1px solid #C3BED2;border-radius:12px;color:#3546E8;font-size:1.2rem}.kern-slider input{accent-color:#3546E8;width:100%;min-width:0;min-height:44px;cursor:ew-resize}.kern-scale{display:flex;justify-content:space-between;font-size:.65rem;color:#615E68;padding:0 3.5rem}.kern-result{font-size:.85rem;color:#615E68;margin:1.3rem 0}.kern-result strong{font:500 2.7rem/1 "Space Grotesk",sans-serif;letter-spacing:-.05em;color:#3546E8;display:inline-block;margin-right:1rem}.kern-result .kern-verdict{color:#171723;font-weight:700}.kern-result p{margin:.6rem 0 0;font-size:.8rem}.kern-actions{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}.kern-actions button{min-height:50px;border-radius:14px;padding:.8rem 1.2rem;border:0}.kern-actions button[hidden]{display:none}.kern-primary{background:#3546E8;color:#fff;display:inline-flex;align-items:center;gap:1.8rem;justify-content:space-between}.kern-primary:hover{background:#2634B3}.kern-secondary{background:#E8E3F4;color:#171723}.kern-note{font-size:.65rem;color:#615E68;max-width:260px;margin-left:auto}#kern-controls[hidden],#kern-reference-panel[hidden]{display:none}@media(max-width:600px){.kern-heading{gap:1rem}.kern-heading .eyebrow{font-size:.55rem}.kern-round{min-width:85px}.kern-round .eyebrow{font-size:.55rem}.kern-controls{grid-template-columns:100px 1fr;gap:1rem}.kern-note{flex-basis:100%;max-width:none;margin:.5rem 0 0}.kern-line-label{font-size:.55rem}.kern-word .kern-letter{touch-action:none}.kern-actions button{flex:1}.kern-result strong{font-size:2.2rem}}@media(prefers-reduced-motion:reduce){.kern-letter{transition:none!important}}
