.page-head{padding-top:clamp(36px,6vw,72px);padding-bottom:clamp(28px,4vw,44px);}
.type-tool-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px;}
.type-tool-tabs button{font:12px var(--mono);padding:9px 13px;border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;}
.type-tool-tabs button:hover{border-color:var(--accent);color:var(--accent);}
.type-tool-tabs button.on{border-color:var(--accent);background:var(--accent);color:var(--text-inverse);}
.type-panel[hidden]{display:none!important;}
.pairing-section{border-top:1px solid var(--line);}
.font-pair-tool{border:1px solid var(--line);background:var(--surface);}
.font-pair-tool *{box-sizing:border-box;}
.fp-head{display:grid;grid-template-columns:1fr minmax(260px,410px);gap:30px;padding:24px;border-bottom:1px solid var(--line);}
.fp-head h2{font-size:clamp(22px,3.5vw,34px);margin-top:8px;}
.fp-head p{font-size:14px;align-self:end;}
.fp-toolbar{display:grid;grid-template-columns:auto 1fr 1fr;gap:24px;align-items:end;padding:20px 24px;border-bottom:1px solid var(--line);background:var(--surface-2);}
.fp-generate{height:46px;padding:0 28px;border:1px solid var(--accent);background:var(--accent);color:var(--text-inverse);font:500 14px var(--mono);cursor:pointer;}
.fp-generate:hover{background:var(--accent-hover);}
.fp-choice{border:0;min-width:0;}
.fp-choice legend{font:11px var(--mono);color:var(--muted);margin-bottom:7px;}
.fp-choice > div{display:grid;grid-template-columns:repeat(3,1fr);}
.fp-choice button{min-height:38px;border:1px solid var(--line);border-right:0;background:var(--surface);color:var(--text);font:11px var(--mono);cursor:pointer;padding:7px;}
.fp-choice button:last-child{border-right:1px solid var(--line);}
.fp-choice button:hover{color:var(--accent);}
.fp-choice button.on{background:var(--text);color:var(--text-inverse);border-color:var(--text);}
.fp-fonts{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line);}
.fp-font-card{padding:22px 24px;min-width:0;}
.fp-font-card:first-child{border-right:1px solid var(--line);}
.fp-role{font:11px var(--mono);color:var(--muted);}
.fp-font-name{font-size:clamp(25px,4vw,38px);line-height:1.1;margin:10px 0 18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fp-font-actions{display:grid;grid-template-columns:1fr auto;gap:8px;}
.fp-font-actions select{min-width:0;width:100%;height:42px;border:1px solid var(--line);background:var(--surface);padding:0 10px;font:12px var(--mono);color:var(--text);}
.fp-lock{height:42px;border:1px solid var(--text);background:var(--surface);color:var(--text);padding:0 13px;font:11px var(--mono);cursor:pointer;}
.fp-lock[aria-pressed="true"]{background:var(--text);color:var(--text-inverse);}
.fp-font-card > a{display:inline-flex;align-items:center;min-height:36px;margin-top:7px;color:var(--accent);font:12px var(--mono);text-decoration:underline;text-underline-offset:3px;}
.fp-preview-head{display:flex;justify-content:space-between;gap:20px;padding:14px 24px;border-bottom:1px solid var(--line);font:12px var(--mono);color:var(--muted);}
.fp-preview{padding:clamp(28px,6vw,72px) clamp(24px,7vw,84px);min-height:470px;background:var(--surface);}
.fp-preview h2,.fp-preview h3,.fp-preview p{outline:0;cursor:text;text-wrap:pretty;}
.fp-preview h2:focus,.fp-preview h3:focus,.fp-preview p:focus{box-shadow:inset 0 -2px var(--accent);}
.fp-preview h2{font-size:clamp(46px,8vw,88px);line-height:.98;letter-spacing:0;max-width:900px;margin:0 0 28px;}
.fp-preview h3{font-size:clamp(19px,3vw,30px);line-height:1.25;font-weight:500;max-width:760px;margin:0 0 22px;}
.fp-preview p{font-size:clamp(16px,2vw,20px);line-height:1.7;max-width:760px;color:var(--text-soft);}
.fp-status{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:16px 24px;border-top:1px solid var(--line);background:var(--surface-2);font:11px/1.5 var(--mono);color:var(--muted);}
.fp-status span:last-child{text-align:right;}
.typography-lab-section{border-top:1px solid var(--line);}
.type-lab{border:1px solid var(--line);background:var(--surface);}
.lab-head{display:grid;grid-template-columns:1fr minmax(260px,410px);gap:30px;padding:24px;border-bottom:1px solid var(--line);}
.lab-head h2{font-size:clamp(22px,3.5vw,34px);margin-top:8px;}
.lab-head p{font-size:14px;align-self:end;}
.lab-head code{font-family:var(--mono);color:var(--accent);}
.lab-controls{display:grid;gap:18px;padding:20px 24px;background:var(--surface-2);border-bottom:1px solid var(--line);}
.scale-controls{grid-template-columns:1fr 1fr 1.2fr;}
.lab-controls label{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;font:11px var(--mono);color:var(--muted);}
.lab-controls input[type=range]{grid-column:1/-1;width:100%;accent-color:var(--accent);}
.lab-controls select{grid-column:1/-1;height:38px;border:1px solid var(--line);background:var(--surface);padding:0 9px;font:11px var(--mono);color:var(--text);}
.lab-controls output{color:var(--text);font-variant-numeric:tabular-nums;}
.scale-result{display:grid;grid-template-columns:1.35fr .65fr;border-bottom:1px solid var(--line);}
.scale-specimen{padding:38px 30px;overflow:hidden;}
.scale-line{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:15px 0;border-bottom:1px solid var(--line);white-space:nowrap;}
.scale-line:last-child{border-bottom:0;}
.scale-line span{font:10px var(--mono);color:var(--muted);}
.scale-table{border-left:1px solid var(--line);}
.scale-table-row{display:grid;grid-template-columns:1fr 1fr 1fr;padding:14px 16px;border-bottom:1px solid var(--line);font:11px var(--mono);}
.scale-table-row:first-child{color:var(--muted);background:var(--surface-2);}
.scale-table-row:last-child{border-bottom:0;}
.code-output{display:grid;grid-template-columns:1fr auto;gap:0;background:var(--text);color:var(--text-inverse);}
.code-output pre{margin:0;padding:18px 20px;overflow:auto;font:11px/1.65 var(--mono);white-space:pre-wrap;}
.code-output button{border:0;border-left:1px solid color-mix(in srgb,var(--accent-contrast) 25%,transparent);background:var(--accent);color:var(--text-inverse);padding:0 20px;font:11px var(--mono);cursor:pointer;}
.hierarchy-layout{display:grid;grid-template-columns:.8fr 1.2fr;border-bottom:1px solid var(--line);}
.hierarchy-controls{border-right:1px solid var(--line);}
.hierarchy-row{padding:14px 16px;border-bottom:1px solid var(--line);}
.hierarchy-row:last-child{border-bottom:0;}
.hierarchy-row > b{display:block;font:500 12px var(--mono);margin-bottom:10px;}
.hierarchy-fields{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;}
.hierarchy-fields label{font:9px var(--mono);color:var(--muted);}
.hierarchy-fields input,.hierarchy-fields select{display:block;width:100%;height:34px;margin-top:4px;border:1px solid var(--line);background:var(--surface);padding:0 6px;font:10px var(--mono);color:var(--text);}
.hierarchy-preview{padding:clamp(30px,5vw,64px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0;overflow:hidden;}
.hierarchy-preview .hb-caption{font-size:12px;line-height:1.4;color:var(--accent);text-transform:uppercase;margin-bottom:16px;}
.hierarchy-preview .hb-h1{margin:0 0 18px;max-width:720px;}
.hierarchy-preview .hb-h2{margin:0 0 18px;max-width:650px;}
.hierarchy-preview .hb-body{margin:0 0 24px;max-width:620px;color:var(--text-soft);}
.hierarchy-preview .hb-button{border:1px solid var(--text);background:var(--text);color:var(--text-inverse);padding:11px 18px;}
.readability-controls{grid-template-columns:repeat(4,1fr);}
.readability-layout{display:grid;grid-template-columns:1.35fr .65fr;border-bottom:1px solid var(--line);}
.readability-layout > div:first-child{padding:24px;border-right:1px solid var(--line);}
.readability-text-label{display:block;font:11px var(--mono);color:var(--muted);margin-bottom:7px;}
#rdText{display:block;width:100%;min-height:100px;border:1px solid var(--line);padding:12px;font:13px/1.5 var(--mono);resize:vertical;color:var(--text);}
.readability-preview{padding:32px 0 12px;overflow:auto;}
.readability-preview p{margin:0;color:var(--text);}
.readability-score{padding:28px 24px;background:var(--surface-2);}
.score-number{font:500 clamp(50px,7vw,76px)/1 var(--mono);color:var(--accent);}
.score-number small{font-size:.28em;color:var(--text);}
#rdVerdict{font:500 14px var(--mono);margin:12px 0 20px;}
.readability-checks{border-top:1px solid var(--line);}
.readability-check{padding:11px 0;border-bottom:1px solid var(--line);font:11px/1.45 var(--mono);}
.readability-check b{display:block;font-weight:500;color:var(--success);}
.readability-check.warn b{color:var(--warning);}.readability-check.bad b{color:var(--danger);}
@media(max-width:780px){
  .fp-toolbar{grid-template-columns:1fr 1fr;}.fp-generate{grid-column:1/-1;}.fp-head{grid-template-columns:1fr;gap:12px;}
  .lab-head{grid-template-columns:1fr;gap:12px;}.scale-controls{grid-template-columns:1fr 1fr;}.scale-controls label:last-child{grid-column:1/-1;}.scale-result,.hierarchy-layout,.readability-layout{grid-template-columns:1fr;}.scale-table,.hierarchy-controls{border-left:0;border-right:0;border-top:1px solid var(--line);}.readability-layout > div:first-child{border-right:0;border-bottom:1px solid var(--line);}.readability-controls{grid-template-columns:1fr 1fr;}
}
@media(max-width:580px){
  .fp-toolbar{grid-template-columns:1fr;gap:16px;padding:16px;}.fp-generate{grid-column:auto;width:100%;}.fp-fonts{grid-template-columns:1fr;}.fp-font-card:first-child{border-right:0;border-bottom:1px solid var(--line);}.fp-preview-head{align-items:flex-start;flex-direction:column;gap:4px;padding:12px 16px;}.fp-preview{min-height:390px;padding:38px 20px;}.fp-preview h2{font-size:44px;}.fp-status{grid-template-columns:1fr;}.fp-status span:last-child{text-align:left;}
  .scale-controls,.readability-controls{grid-template-columns:1fr;}.scale-controls label:last-child{grid-column:auto;}.scale-result{overflow:hidden;}.scale-specimen{padding:24px 16px;}.scale-line{white-space:normal;}.scale-table-row{grid-template-columns:1fr .8fr .8fr;padding:12px 10px;font-size:9px;}.code-output{grid-template-columns:1fr;}.code-output button{border-left:0;border-top:1px solid color-mix(in srgb,var(--accent-contrast) 25%,transparent);padding:14px;}.hierarchy-fields{grid-template-columns:1fr 1fr;}.hierarchy-fields label:last-child{grid-column:1/-1;}
}

/* Tools density pass */
.fp-head,.lab-head{padding:30px;gap:34px}
.fp-toolbar{gap:28px;padding:24px 30px}
.fp-choice > div{gap:8px}
.fp-choice button{border:1px solid var(--line)}
.fp-choice button:last-child{border-right:1px solid var(--line)}
.fp-font-card{padding:28px 30px}
.fp-preview-head{padding:16px 30px}
.fp-status{gap:24px;padding:18px 30px}
.lab-controls{gap:22px;padding:24px 30px}
.hierarchy-row{padding:18px 20px}
.hierarchy-fields{gap:10px}
.readability-layout > div:first-child,.readability-score{padding:30px}
@media(max-width:580px){
  .fp-head,.lab-head,.fp-toolbar,.fp-font-card,.lab-controls,.readability-layout > div:first-child,.readability-score{padding:18px}
}

/* Swiss consistency */
.fp-toolbar,.lab-controls,.fp-status,.readability-score,.scale-table-row:first-child{background:var(--soft);}
.fp-preview h2{letter-spacing:0;}
.fp-preview h2,.fp-preview h3,.fp-preview p{font-family:var(--sans);}
.code-output pre,#rdText{font-family:var(--code);}
.readability-check.warn b{color:var(--danger);}
.readability-check.bad b{color:var(--danger);}
.readability-check b{color:var(--accent);}