.preference-page{box-sizing:border-box;color:var(--text)}.preference-page *,.preference-page *:before,.preference-page *:after{box-sizing:inherit}.preference-page svg{flex:0 0 auto}.preference-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.preference-shell{display:grid;width:min(100%,54rem);margin:0 auto}.preference-page-header{display:grid;grid-template-areas:"title action";grid-template-columns:minmax(0,1fr) auto;gap:.9rem;align-items:center;min-width:0;padding-bottom:1rem;border-bottom:1px solid hsl(from var(--surface1) h s l / .5);h1{grid-area:title;margin:0;color:var(--text);font-size:1.5rem;font-weight:760;letter-spacing:0;line-height:1.08}}.preference-header-actions{grid-area:action;justify-self:end;display:flex;align-items:center;gap:.28rem;min-width:0}.preference-back-link,.preference-reset-action{display:inline-flex;align-items:center;justify-content:center;gap:.42rem;min-width:0;min-height:2.25rem;padding:.5rem .72rem;border:1px solid transparent;border-radius:8px;color:var(--subtext0);background:transparent;font:650 .84rem / 1.2 var(--font-sans-serif);text-decoration:none;cursor:pointer;span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}&:hover{border-color:hsl(from var(--surface1) h s l / .6);color:var(--text);background:hsl(from var(--base) h s l / .36)}&:focus-visible{outline:2px solid var(--mauve);outline-offset:2px}}.preference-panel{display:grid;gap:.28rem;min-width:0;padding:clamp(1rem,2.4vw,1.35rem) 0;background:transparent}.preference-page-header+.preference-panel{padding-top:clamp(1.15rem,2.5vw,1.5rem)}.preference-panel+.preference-panel{margin-top:.3rem;border-top:1px solid hsl(from var(--surface1) h s l / .52);padding-top:clamp(1.15rem,2.6vw,1.55rem)}.preference-panel__header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.9rem;align-items:center;min-width:0;padding:0 0 .45rem;h2{margin:0;color:var(--text);font-size:1.02rem;font-weight:720;line-height:1.25}}.preference-row{display:grid;grid-template-columns:minmax(10rem,.72fr) minmax(0,1.28fr);gap:clamp(1rem,3vw,1.8rem);align-items:center;min-width:0;padding:.72rem 0}.preference-row--stacked{grid-template-columns:1fr;gap:.65rem}.preference-row--control-only{grid-template-columns:1fr;gap:0;padding:.58rem 0}.preference-row--preview{grid-template-columns:1fr;align-items:start}.preference-row__label{display:grid;gap:.18rem;min-width:0;color:var(--subtext1);font-size:.8rem;font-weight:650;line-height:1.28;small{color:var(--subtext0);font-size:.74rem;font-weight:520;line-height:1.35}}.preference-choice-group{margin:0;padding:0;border:0;min-width:0;min-inline-size:0}.preference-choice-group--segmented{display:grid;justify-self:end;gap:.32rem}.preference-choice-group--mode{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.8rem,2vw,1.35rem);width:100%}.preference-choice-group--font-size{display:flex;align-items:center;justify-self:end;width:min(100%,17.5rem);gap:.35rem}.preference-choice-group--font-type{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem}.preference-choice-group--font-weight{grid-template-columns:repeat(3,minmax(0,1fr));width:min(100%,17.5rem)}.preference-choice-button{min-width:0;border-radius:6px;color:var(--subtext0);background:transparent;cursor:pointer;&:hover{color:var(--text);background-color:hsl(from var(--surface1) h s l / .42)}&:focus-visible{outline:2px solid var(--mauve);outline-offset:2px}&.is-active{color:var(--text);background-color:hsl(from var(--surface1) h s l / .72)}}.preference-choice-button--segmented{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;min-height:2.05rem;padding:.42rem .68rem;border:1px solid transparent;border-radius:8px;font:650 .78rem / 1.2 var(--font-sans-serif)}.preference-choice-button--segmented.is-active{border-color:hsl(from var(--mauve) h s l / .36)}.preference-choice-button--theme-mode{display:grid;gap:.48rem;align-content:start;justify-items:center;width:100%;min-width:0;padding:0;border:0;border-radius:0;color:var(--subtext0);background:transparent;cursor:pointer;&:hover,&.is-active{color:var(--text);background:transparent}}.theme-mode-preview{position:relative;display:block;width:100%;aspect-ratio:1.42;overflow:hidden;border:2px solid var(--surface0);border-radius:10px;background:transparent;box-shadow:inset 0 1px hsl(from var(--text) h s l / .04);.preference-choice-button--theme-mode:hover &,.preference-choice-button--theme-mode.is-active &{border-color:var(--lavender)}}.theme-mode-preview__pane{position:absolute;inset:0;overflow:hidden;background:var(--mantle)}.theme-mode-preview--system .theme-mode-preview__pane--light{inset:0 50% 0 0}.theme-mode-preview--system .theme-mode-preview__pane--dark{inset:0 0 0 50%}.theme-mode-preview__pane:before{content:"";position:absolute;top:22%;left:27%;right:27%;height:.32rem;border-radius:999px;background:var(--text);box-shadow:0 .58rem 0 -.08rem hsl(from var(--overlay0) h s l / .18)}.theme-mode-preview__surface{position:absolute;right:9%;bottom:-.24rem;left:9%;height:63%;border:.5px solid var(--surface0);border-radius:9px 9px 0 0;background:var(--base);&:before{content:"";position:absolute;top:24%;left:9%;width:28%;height:.36rem;border-radius:999px;background:var(--subtext0);box-shadow:0 .92rem 0 -.09rem hsl(from var(--subtext1) h s l / .5),0 1.84rem 0 -.09rem hsl(from var(--subtext0) h s l / .58)}}.theme-mode-label{color:inherit;font:680 .9rem / 1.2 var(--font-sans-serif)}.preference-row--control-only>.preference-choice-group{justify-self:stretch;width:100%}.preference-row--control-only>.preference-choice-group--font-type{width:100%}.preference-theme-controls{display:grid;gap:1.15rem;min-width:0;padding:.2rem 0 .1rem}.preference-theme-schemes{display:grid;gap:.45rem;min-width:0}.theme-scheme-control{display:grid;grid-template-columns:minmax(10rem,.72fr) minmax(0,1.28fr);gap:clamp(1rem,3vw,1.8rem);align-items:center;min-width:0;padding:.42rem 0}.theme-scheme-title{min-width:0;color:var(--subtext1);font:650 .8rem / 1.28 var(--font-sans-serif)}.theme-scheme-select-shell{display:block;justify-self:end;width:min(100%,17.5rem);min-width:0}.theme-scheme-select{width:100%;min-width:0;min-height:2.15rem;padding:.38rem 2rem .38rem .62rem;border:1px solid hsl(from var(--surface2) h s l / .66);border-radius:7px;color:var(--text);background:hsl(from var(--base) h s l / .62);font:680 .82rem / 1.2 var(--font-sans-serif);&:hover{border-color:hsl(from var(--surface2) h s l / .86);background:hsl(from var(--base) h s l / .78)}&:focus-visible{outline:2px solid var(--mauve);outline-offset:2px}}.preference-choice-button--size{--font-size-preview: 16px;flex:1;display:inline-flex;align-items:center;justify-content:center;min-width:2.2rem;height:2.2rem;padding:0;border:1px solid transparent;border-radius:8px;&.is-active,&:hover{border-color:hsl(from var(--mauve) h s l / .48);color:var(--text);background-color:hsl(from var(--surface1) h s l / .58)}}.font-size-btn[data-size=small]{--font-size-preview: 12px}.font-size-btn[data-size=medium-small]{--font-size-preview: 14px}.font-size-btn[data-size=medium-large]{--font-size-preview: 18px}.font-size-btn[data-size=large]{--font-size-preview: 20px}.font-size-preview{font-size:var(--font-size-preview);font-weight:650;line-height:1}.preference-choice-group--article-width{display:flex;align-items:center;justify-self:end;width:min(100%,17.5rem);gap:.35rem}.preference-choice-button--width{--width-preview: 60%;flex:1;display:inline-flex;align-items:center;justify-content:center;min-width:2.2rem;height:2.2rem;padding:0 .3rem;border:1px solid transparent;border-radius:8px;&.is-active,&:hover{border-color:hsl(from var(--mauve) h s l / .48);color:var(--text);background-color:hsl(from var(--surface1) h s l / .58)}}.font-width-btn[data-width=narrow]{--width-preview: 30%}.font-width-btn[data-width=medium-narrow]{--width-preview: 45%}.font-width-btn[data-width=medium-wide]{--width-preview: 78%}.font-width-btn[data-width=wide]{--width-preview: 95%}.font-width-preview{display:block;width:var(--width-preview);height:.4rem;border-radius:999px;background:currentColor;opacity:.72}.font-line-height-stack{display:grid;grid-template-columns:minmax(0,1fr) 2.8rem;gap:.7rem;align-items:center;min-width:0}.font-line-height-control{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;min-width:0}.font-line-height-slider{width:100%;height:1.5rem;margin:0;appearance:none;background:transparent;cursor:pointer}.font-line-height-slider::-webkit-slider-runnable-track{height:.28rem;border-radius:999px;background:linear-gradient(90deg,hsl(from var(--mauve) h s l / .88),hsl(from var(--surface2) h s l / .7))}.font-line-height-slider::-webkit-slider-thumb{width:1rem;height:1rem;margin-top:-.36rem;border:2px solid var(--surface0);border-radius:50%;appearance:none;background:var(--text);box-shadow:0 0 0 1px hsl(from var(--mauve) h s l / .25)}.font-line-height-slider::-moz-range-track{height:.28rem;border:none;border-radius:999px;background:linear-gradient(90deg,hsl(from var(--mauve) h s l / .88),hsl(from var(--surface2) h s l / .7))}.font-line-height-slider::-moz-range-thumb{width:1rem;height:1rem;border:2px solid var(--surface0);border-radius:50%;background:var(--text);box-shadow:0 0 0 1px hsl(from var(--mauve) h s l / .25)}.font-line-height-label{color:var(--subtext0);font-size:.75rem;font-weight:600;white-space:nowrap}.font-line-height-value{justify-self:end;color:var(--subtext1);font-size:.88rem;font-variant-numeric:tabular-nums}.preference-choice-button--type{--font-type-preview-family: var(--font-serif);display:grid;justify-items:center;gap:.25rem;min-width:0;padding:.65rem .5rem;border:1px solid hsl(from var(--surface1) h s l / .68);border-radius:8px;background:hsl(from var(--base) h s l / .38);&:hover{border-color:hsl(from var(--overlay0) h s l / .9)}&.is-active{border-color:hsl(from var(--mauve) h s l / .5)}}.font-type-btn[data-font=sans-serif]{--font-type-preview-family: var(--font-sans-serif)}.font-type-btn[data-font=mono]{--font-type-preview-family: var(--font-mono)}.font-type-btn[data-font=handwriting]{--font-type-preview-family: var(--font-handwriting)}.font-type-preview{font-size:1.35rem;font-family:var(--font-type-preview-family);line-height:1}.font-type-name{max-width:100%;font-size:.74rem;font-weight:650;line-height:1.2;text-align:center;overflow-wrap:anywhere}.font-weight-btn{--font-weight-preview: 400;font-weight:var(--font-weight-preview)}.font-weight-btn[data-weight=light]{--font-weight-preview: 300}.font-weight-btn[data-weight=medium]{--font-weight-preview: 500}.font-option-name{max-width:100%;font-size:.8rem;line-height:1.2;text-align:center;overflow-wrap:anywhere}.font-custom-form{display:grid;gap:.75rem}.font-custom-field{display:grid;gap:.375rem;min-width:0;color:var(--subtext0);font-size:.75rem;font-weight:650;small{color:var(--subtext0);font-size:.72rem;font-weight:500;line-height:1.35}}.font-custom-field :is(input,textarea){width:100%;min-width:0;padding:.625rem .75rem;border:1px solid hsl(from var(--surface1) h s l / .68);border-radius:8px;color:var(--text);background:hsl(from var(--base) h s l / .42);font:.8125rem / 1.45 var(--font-mono);outline:none;transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease}.font-custom-field textarea{resize:vertical}.font-custom-field :is(input,textarea)::placeholder{color:var(--overlay1)}.font-custom-field :is(input,textarea):focus{border-color:hsl(from var(--mauve) h s l / .62);background:hsl(from var(--base) h s l / .62);box-shadow:0 0 0 3px hsl(from var(--mauve) h s l / .1)}.font-custom-family-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.625rem}.font-custom-reset{justify-self:start;min-height:2.25rem;padding:.5rem .75rem;border:1px solid hsl(from var(--surface1) h s l / .68);border-radius:8px;color:var(--subtext0);background:transparent;font-size:.8125rem;font-weight:650;cursor:pointer;transition:border-color .2s ease,background-color .2s ease,color .2s ease;&:hover{border-color:hsl(from var(--overlay0) h s l / .9);color:var(--text);background:hsl(from var(--surface1) h s l / .42)}}.font-preview-copy{width:100%;max-width:100%;min-height:100%;color:var(--subtext1);font-size:var(--article-font-size);font-family:var(--article-font-family);line-height:var(--article-line-height);font-weight:var(--article-font-weight);.font-preview-title{margin:0 0 .625rem;color:var(--text);font-size:1.15em;line-height:1.35;font-weight:var(--article-bold-font-weight)}.font-preview-excerpt{margin:0 0 .85rem;color:var(--subtext0);line-height:inherit;&:last-child{margin-bottom:0}}}.font-preview-marker{color:var(--subtext0);font:700 .72em / 1.2 var(--font-sans-serif)}@media(max-width:900px){.theme-scheme-control{grid-template-columns:1fr}.theme-scheme-select-shell{justify-self:stretch;width:100%}}@media(max-width:768px){.preference-standalone{padding:1.35rem 1.15rem 2rem}}@media(max-width:640px){.preference-page-header{gap:.24rem .65rem}.preference-page-header h1{font-size:1.35rem}.preference-page-header :is(.preference-back-link,.preference-reset-action){min-height:2rem;padding:.42rem .5rem}.preference-header-actions{gap:.18rem}.preference-panel__header,.preference-row{grid-template-columns:1fr}.preference-panel__header{gap:.65rem}.preference-choice-group--font-size,.preference-choice-group--article-width,.preference-choice-group--font-weight{justify-self:stretch;width:100%}.theme-scheme-control{grid-template-columns:1fr;padding:.45rem 0}.font-line-height-stack,.font-line-height-control,.preference-choice-group--font-type,.font-custom-family-grid{grid-template-columns:1fr}.font-line-height-value{justify-self:start}}