/* SPDX-License-Identifier: GPL-3.0-or-later */
:root {
  --bg:var(--paper); --border:var(--line); --mono:var(--font-mono); --sans:var(--font-mono);
  --pin-gpio:#37643b; --pin-power:#98591e; --pin-gnd:#626c79; --pin-system:#78558b;
  --pin-spi:#8e5518; --pin-i2c:#28678e; --pin-uart:#78558b; --pin-pwm:#86631b;
  --pin-adc:#286e60; --pin-hstx:#974965; --pin-pio:#526d26; --pin-usb:#386f81; --pin-qmi:#6d711f; --pin-sio:#456d57;
}
:root[data-theme="dark"] {
  --pin-gpio:#a7ca9b; --pin-power:#e2b56f; --pin-gnd:#a5adb8; --pin-system:#c3a5de;
  --pin-spi:#e2b56f; --pin-i2c:#92c7e2; --pin-uart:#c3a5de; --pin-pwm:#dfcf88;
  --pin-adc:#8ed1bb; --pin-hstx:#e5a3ba; --pin-pio:#c3d795; --pin-usb:#9ecdd9; --pin-qmi:#d0d398; --pin-sio:#a7cbb5;
}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 var(--mono);font-synthesis:none}button,input,select{font:inherit;color:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--control-border);background:var(--paper);border-radius:0}a{color:var(--link);text-underline-offset:.24em}button:hover{background:var(--surface);color:var(--accent)}button:disabled{cursor:default;opacity:.5}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}input::placeholder{color:var(--muted);opacity:1}::selection{background:var(--selection);color:var(--ink)}h1,h2,h3,b,strong{font-weight:500}svg.icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}span[data-icon]{display:inline-flex;align-items:center}.console-header{height:74px}.console-header__inner{gap:30px}.source-link{font-size:12px;white-space:nowrap}.console-theme select{border:1px solid var(--control-border);border-radius:0;background:var(--paper);color:var(--ink)}.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}.sidebar{position:fixed;inset:74px auto 0 0;width:220px;padding:26px 16px 20px;border-right:1px solid var(--line);background:var(--paper);display:flex;flex-direction:column;z-index:15;overflow-y:auto}.brand{display:block;font-size:18px;font-weight:500;text-decoration:none;color:var(--ink);padding-left:8px}.brand-prompt{color:var(--accent)}.brand-caption{font-size:9px;color:var(--muted);margin:8px 8px 26px}.nav-button{display:flex;align-items:center;gap:8px;text-align:left;width:100%;padding:10px 9px;font-size:11px;min-height:42px}.nav-button.current{background:var(--surface);color:var(--accent)}.count{margin-left:auto;border:1px solid var(--line);color:var(--muted);padding:0 4px;font-size:10px}.nav-section{font-size:11px;color:var(--accent);margin:28px 8px 12px}.board-nav-item{width:100%;display:flex;align-items:center;gap:10px;text-align:left;border:0;border-left:2px solid transparent;background:transparent;font-size:11px;padding:11px 8px;line-height:1.6;min-height:50px;color:var(--ink)}.board-nav-item svg{width:15px}.board-nav-item.active{border-left-color:var(--accent);background:var(--surface);color:var(--accent)}.board-nav-item small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.up-next{border-top:1px solid var(--line);margin:25px 8px;padding-top:20px;font-size:10px;color:var(--muted)}.up-next strong{display:block;color:var(--ink);font-size:14px;margin-top:10px}.up-next p{font-size:10px;line-height:1.7;margin:8px 0 17px}.coming{border:1px solid var(--line);color:var(--muted);padding:4px 6px;font-size:9px;display:inline-flex;gap:14px}.tiny-dot{width:4px;height:4px;border-radius:50%;display:inline-block;background:var(--success);margin-right:6px;vertical-align:middle}.sidebar-bottom{margin-top:auto;padding:25px 8px 0}.sidebar-bottom button{display:flex;align-items:center;gap:8px;font-size:10px;border:0;padding:0;min-height:38px;width:100%;text-align:left;color:var(--muted)}.sidebar-bottom button>span:last-child{margin-left:auto}.sidebar-bottom svg{width:15px}.version{display:flex;align-items:center;margin-top:15px;font-size:9px;color:var(--muted)}.version>span:last-child{margin-left:auto}.shell{margin-left:220px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:54px;padding:12px 30px;border-bottom:1px solid var(--line)}.breadcrumbs{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:10px}.breadcrumbs strong{font-weight:400;color:var(--ink)}.breadcrumbs>span:not(#board-family){color:var(--accent)}.top-right{font-size:10px;color:var(--muted)}.mobile-menu{display:none!important}main{max-width:1700px;margin:auto;padding:29px 30px 0}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.eyebrow{font-size:11px;line-height:1.8;color:var(--accent);margin-bottom:11px;overflow-wrap:anywhere}h1{font-size:clamp(24px,2.3vw,32px);line-height:1.45;margin:0;font-weight:500;letter-spacing:0}.page-heading p{font-size:12px;color:var(--muted);margin:10px 0 0}.heading-actions{display:flex;gap:10px;flex-shrink:0}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 12px;font-size:11px;line-height:1.5;min-height:40px;text-decoration:none;border:1px solid var(--control-border);background:var(--paper);color:var(--accent)}.button svg{width:15px}.button.primary{background:var(--accent);color:var(--paper);border-color:var(--accent)}.button:hover{background:var(--selection);color:var(--ink)}.specs{display:flex;align-items:center;gap:0;flex-wrap:wrap;margin:23px 0 25px;color:var(--muted);font-size:10px;row-gap:12px}.specs>span{display:flex;align-items:center;gap:7px;padding:0 14px;border-left:1px solid var(--line)}.specs>span:first-child{border:0;padding-left:0}.specs b{font-weight:400;color:var(--ink)}.specs svg{width:14px;height:14px;color:var(--accent)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 270px;align-items:start;gap:18px}.map-panel,.details-panel{border:1px solid var(--line);background:var(--paper);min-width:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);padding:15px 18px;min-height:63px}.panel-title{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:500}.live-dot{width:5px;height:5px;border-radius:50%;background:var(--accent);display:inline-block}.panel-title>span:last-child{font-size:10px;font-weight:400;border:1px solid var(--line);padding:2px 5px;color:var(--muted);white-space:nowrap}.view-switch{display:flex}.view-switch button{font-size:10px;display:flex;align-items:center;justify-content:center;gap:5px;padding:6px 8px;min-height:32px;border-color:var(--line);color:var(--muted)}.view-switch button+button{border-left:0}.view-switch button.active{background:var(--selection);color:var(--accent);border-color:var(--control-border)}.view-switch svg{width:13px;height:13px}.filter-bar{display:flex;align-items:center;gap:11px;padding:12px 18px;border-bottom:1px solid var(--line);min-height:57px;background:var(--surface)}.filter-label{font-size:9px;color:var(--muted)}#filters{display:flex;gap:5px;flex-wrap:wrap}.filter{display:flex;align-items:center;gap:5px;font-size:10px;padding:5px 7px;min-height:31px;color:var(--muted);border-color:var(--line)}.filter i{width:4px;height:4px;border-radius:50%;background:var(--color)}.filter.active{color:var(--color);border-color:var(--color);background:color-mix(in srgb,var(--color) 12%,var(--paper))}#reset-filters{margin-left:auto;border:0;padding:5px;min-width:24px;color:var(--muted);display:flex}#reset-filters svg{width:14px;height:14px}.search-tools{display:flex;justify-content:space-between;align-items:center;padding:10px 18px;gap:12px;border-bottom:1px solid var(--line)}.pin-search{display:flex;align-items:center;gap:8px;flex:1;min-width:0;color:var(--muted)}.pin-search svg{width:15px;height:15px}.pin-search input{width:100%;min-width:60px;background:transparent;border:0;outline:none;font-size:11px;padding:5px 0}.pin-search:focus-within{outline:1px solid var(--accent);outline-offset:5px}.pin-search input:focus-visible{outline:0}.pin-search kbd{border:1px solid var(--line);padding:0 5px;font-size:10px;background:var(--surface)}.diagram-tools{display:flex;gap:5px}.icon-button{display:inline-flex;align-items:center;justify-content:center;min-height:30px;min-width:30px;padding:6px;border:1px solid transparent;color:var(--muted)}.icon-button:hover,.icon-button[aria-pressed=true]{color:var(--accent);background:var(--selection);border-color:var(--control-border)}.icon-button svg{width:15px;height:15px}.map-content{position:relative;background-color:var(--paper);background-image:radial-gradient(color-mix(in srgb,var(--line) 50%,transparent) .6px,transparent .6px);background-size:16px 16px}.orientation{position:absolute;top:17px;left:19px;color:var(--muted);font-size:8px;display:flex;gap:9px;align-items:center}.orientation span{border:1px solid var(--line);padding:2px 5px;background:var(--surface);color:var(--accent)}#diagram{padding:43px 6px 6px}#diagram>svg{display:block;width:100%;min-height:400px;max-height:555px}#diagram.qfn-diagram>svg{max-height:720px}.canvas-caption{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--muted);padding:10px 18px 16px}.canvas-caption svg{width:13px;height:13px}#match-count{margin-left:auto;font-size:8px;white-space:nowrap}.mobile-hint{display:none}.legend{display:flex;align-items:center;gap:14px;padding:13px 18px;border-top:1px solid var(--line);font-size:9px;color:var(--muted)}.legend>span{display:flex;gap:5px;align-items:center}.dot{width:5px;height:5px;border-radius:50%;display:inline-block;background:var(--dot)}.legend-note{margin-left:auto;font-size:8px}.detail-top{display:flex;align-items:center;justify-content:space-between;padding:19px 19px 14px;color:var(--muted);font-size:10px}.detail-top svg{width:15px;height:15px;color:var(--accent)}.pin-hero{padding:0 19px}.pin-type{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);padding:3px 6px;font-size:9px}.pin-hero h2{font-size:29px;line-height:1.45;margin:13px 0 7px;overflow-wrap:anywhere}.physical-pin{font-size:11px;color:var(--muted)}.pin-description{font-size:11px;line-height:1.9;color:var(--muted);margin:15px 0 20px}.pin-info{display:flex;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 19px;padding:14px 0}.pin-info>span{flex:1;font-size:9px;color:var(--muted)}.pin-info>span+span{border-left:1px solid var(--line);padding-left:12px}.pin-info b{display:block;font-size:11px;color:var(--ink);margin-top:6px;font-weight:400}.function-section{padding:19px}.small-label{display:block;font-size:9px;color:var(--muted);margin-bottom:10px;line-height:1.8}.small-label span{font-size:8px}.function-list{display:flex;flex-direction:column;gap:7px}.function-option{display:flex;align-items:center;gap:7px;cursor:pointer;border:1px solid color-mix(in srgb,var(--color) 40%,var(--line));padding:7px 8px;color:var(--color);font-size:10px;line-height:1.5;background:color-mix(in srgb,var(--color) 6%,var(--paper));min-height:32px}.function-option input{appearance:none;width:11px;height:11px;min-width:11px;border:1px solid var(--color);border-radius:50%;margin:0;cursor:pointer}.function-option input:checked{background:var(--color);box-shadow:inset 0 0 0 2px var(--paper)}.function-option small{margin-left:auto;font-size:7px;opacity:.9}.label-section{padding:0 19px 20px}.label-section input{width:100%;padding:10px;border:1px solid var(--control-border);background:var(--paper);font-size:11px;border-radius:0}.add-plan{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--surface);color:var(--accent);padding:10px;margin-top:10px;font-size:11px;min-height:40px}.add-plan svg{width:14px;height:14px}.plan-box{padding:19px;border-top:1px solid var(--line);background:var(--surface)}.plan-heading{display:flex;align-items:center;gap:7px;font-size:11px}.plan-heading svg{width:14px;height:14px;color:var(--accent)}.plan-heading>span:last-child{margin-left:auto;font-size:10px;border:1px solid var(--line);padding:0 5px;color:var(--muted)}.empty-plan{color:var(--muted);font-size:10px;line-height:1.9;margin:16px 0 20px}.plan-row{display:flex;align-items:center;gap:6px;margin:15px 0;font-size:10px}.plan-row>button:first-child{border:0;background:transparent;text-align:left;flex:1;padding:0;line-height:1.6;color:var(--muted);overflow-wrap:anywhere}.plan-row strong{font-size:11px;color:var(--accent)}.plan-row small{display:block;color:var(--muted);margin-top:5px;font-size:10px}.remove-plan{color:var(--muted);font-size:17px;padding:0 5px;border:0;background:none}.plan-actions{display:flex;gap:7px;margin-top:18px}.plan-actions button{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px;min-height:34px;color:var(--accent);font-size:10px;background:var(--paper)}.plan-actions button:first-child{flex:1}.plan-actions svg{width:13px;height:13px}.local-note{font-size:8px;line-height:1.8;color:var(--muted);margin:13px 0 0}.below-workspace{display:flex;align-items:start;justify-content:space-between;gap:22px;margin:20px 0 30px}.below-workspace>div{display:flex;gap:9px;max-width:650px}.below-workspace svg{width:15px;height:15px;color:var(--accent);margin-top:3px}.below-workspace p{margin:0;font-size:10px;line-height:1.9;color:var(--muted)}.below-workspace strong{display:block;color:var(--ink);margin-bottom:4px}.below-workspace>a{font-size:9px;white-space:nowrap;margin-top:4px}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;padding:20px 0 25px;color:var(--muted);font-size:10px}footer a{color:var(--muted)}.pin-group{cursor:pointer;outline:none}.pin-group .pin-label{font:500 11px var(--mono)}.pin-group .pin-number{font:9px var(--mono);fill:var(--muted)}.pin-group .pin-function{font:9px var(--mono)}.pin-group:hover .pin-hit,.pin-group:focus-visible .pin-hit{fill:var(--surface)}.pin-group.selected .pin-hit{fill:var(--selection);stroke:var(--control-border);stroke-width:.8}.pin-group.assigned .pin-node{stroke:var(--accent);stroke-width:2.5}.pin-group .pin-node{fill:var(--paper)}.pin-group.dimmed{opacity:.35}.board-art text{font-family:var(--mono)}.table-content{max-height:650px;overflow:auto;background:var(--paper)}.pin-table{border-collapse:collapse;width:100%;font-size:11px;text-align:left;white-space:nowrap}.pin-table th{position:sticky;top:0;z-index:1;padding:13px;color:var(--muted);background:var(--surface);font-size:10px;font-weight:400;border-bottom:1px solid var(--line)}.pin-table td{padding:11px 13px;border-bottom:1px solid var(--line);font-size:10px}.pin-table tbody tr{cursor:pointer}.pin-table tr.selected,.pin-table tbody tr:hover{background:var(--surface)}.pin-table td>span{display:inline-block;padding:4px 5px;margin:2px 4px 2px 0;color:var(--color);background:color-mix(in srgb,var(--color) 8%,var(--paper));border:1px solid color-mix(in srgb,var(--color) 30%,var(--line));font-size:9px}.pin-table caption{padding:20px;color:var(--muted);font-size:12px}#no-matches{position:absolute;top:44%;left:12%;width:76%;text-align:center;background:var(--surface);border:1px solid var(--control-border);padding:20px;color:var(--ink);font-size:12px}dialog{width:min(750px,calc(100% - 32px));max-height:85vh;overflow:auto;background:var(--paper);color:var(--ink);border:1px solid var(--control-border);padding:30px;border-radius:0;box-shadow:none}dialog::backdrop{background:#000a}.modal-header{display:flex;justify-content:space-between;align-items:center;gap:18px}.modal-header h2{margin:0;font-size:24px;line-height:1.5;font-weight:500}.modal-description{color:var(--muted);font-size:12px;line-height:1.9}.catalog-search{display:flex;align-items:center;gap:10px;border:1px solid var(--control-border);padding:11px 13px;margin:24px 0 20px;background:var(--surface);color:var(--muted)}.catalog-search input{border:0;background:transparent;width:100%;min-width:0;outline:0;font-size:12px}#catalog-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.catalog-card{display:flex;flex-direction:column;align-items:start;gap:8px;padding:19px;text-align:left;position:relative;border:1px solid var(--line);background:var(--paper);min-width:0}.catalog-card:hover{background:var(--surface);border-color:var(--accent)}.mini-art{display:grid;place-items:center;width:45px;height:45px;border:1px solid var(--line);color:var(--accent);margin-bottom:9px}.mini-art svg{width:27px;height:27px}.catalog-card b{font-size:14px;font-weight:500}.catalog-card small{font-size:10px;color:var(--muted)}.card-meta{font-size:10px;color:var(--accent);margin-top:8px}.card-arrow{position:absolute;right:18px;top:20px;color:var(--accent)}.catalog-note{font-size:11px;line-height:1.9;color:var(--muted);margin:23px 0 0}.help-steps{padding-left:24px;color:var(--muted);font-size:13px;line-height:1.9}.help-steps li{margin:19px 0}.help-steps strong{color:var(--ink)}.help-steps kbd{border:1px solid var(--line);background:var(--surface);padding:0 5px}#help-dialog>p,#share-dialog p{font-size:12px;line-height:1.9;color:var(--muted)}.help-sources{border-top:1px solid var(--line);padding-top:18px;color:var(--muted);font-size:10px;line-height:2}#share-url{width:100%;padding:12px;border:1px solid var(--control-border);background:var(--surface);font-size:11px;margin:8px 0 18px}#toast{position:fixed;bottom:25px;left:calc(50% + 110px);max-width:calc(100% - 30px);transform:translate(-50%,15px);opacity:0;pointer-events:none;background:var(--surface);color:var(--ink);border:1px solid var(--control-border);padding:13px 18px;font-size:12px;z-index:50;transition:.2s}#toast.visible{opacity:1;transform:translate(-50%,0)}.skip{position:fixed;top:-100px;left:16px;z-index:100;background:var(--surface);border:1px solid var(--accent);padding:10px}.skip:focus{top:10px}[hidden]{display:none!important}
@media(min-width:1550px){.sidebar{width:240px;padding-inline:20px}.shell{margin-left:240px}main{padding-inline:40px}.topbar{padding-inline:40px}.workspace{grid-template-columns:minmax(0,1fr) 290px}#diagram>svg{max-height:650px}}
@media(max-width:1200px){.sidebar{width:200px;padding-inline:12px}.shell{margin-left:200px}main{padding:25px 22px 0}.topbar{padding-inline:22px}.workspace{grid-template-columns:minmax(0,1fr) 246px;gap:14px}.specs>span{padding-inline:10px}.filter-label{display:none}.filter-bar,.search-tools{padding-inline:12px}.panel-heading{padding-inline:13px}.page-heading{align-items:start;flex-direction:column;gap:18px}.heading-actions{gap:8px}.heading-actions .button{font-size:11px}.page-heading h1{font-size:28px}.below-workspace>a{display:none}.legend-note{display:none}.console-header__inner{gap:24px}}
@media(max-width:970px){.sidebar{width:190px}.shell{margin-left:190px}.workspace{grid-template-columns:minmax(0,1fr)}.details-panel{display:grid;grid-template-columns:1fr 1fr}.detail-top{grid-column:1/-1}.plan-box{border-top:0;border-left:1px solid var(--line);margin-top:-48px;padding-top:25px}.source-link{font-size:11px}.top-right{display:none}.pin-description{max-width:320px}.eyebrow{font-size:10px}}
@media(max-width:640px){.console-header{height:auto;min-height:64px}.console-header__inner{padding:12px 16px;gap:0 12px;min-height:64px}.console-theme select{font-size:11px;max-width:83px;width:83px;height:36px}.console-theme>span{display:none}.sidebar{display:none;top:64px;width:230px;box-shadow:20px 0 0 #0003}.sidebar.open{display:flex}.shell{margin-left:0}.topbar{min-height:49px;padding:8px 16px;justify-content:start;gap:12px}.mobile-menu{display:inline-flex!important;border:1px solid var(--line);min-width:32px;min-height:32px}.breadcrumbs{gap:8px;font-size:9px;min-width:0;flex-wrap:wrap}.breadcrumbs>strong{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}main{padding:23px 15px 0}.eyebrow{font-size:9px;margin-bottom:12px}h1,.page-heading h1{font-size:25px}.page-heading p{font-size:11px;line-height:1.9}.heading-actions{gap:10px}.specs{font-size:9px;row-gap:10px;margin:20px 0}.specs>span{padding-inline:8px}.specs>span:last-child{display:none}.specs svg{width:12px}.workspace{gap:16px}.panel-heading{padding:13px 12px;min-height:60px}.panel-title{font-size:12px;gap:7px}.panel-title>span:last-child{font-size:9px}.view-switch button{font-size:9px;padding:6px}.view-switch svg{width:12px}.filter-bar{padding:10px;gap:4px}#filters{gap:4px}.filter{font-size:9px;padding:5px 6px;min-height:32px}#reset-filters{min-width:23px;padding:4px}.search-tools{padding:10px 12px;gap:7px}.pin-search input{font-size:10px}.diagram-tools{gap:3px}.icon-button{min-width:29px;min-height:29px}.orientation{left:14px;font-size:8px}.map-content{overflow:hidden}#diagram{overflow-x:auto;padding:45px 0 4px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}#diagram>svg,#diagram.qfn-diagram>svg{width:640px;min-width:640px;min-height:0;max-height:none}.pin-group .pin-label{font-size:13px}.pin-group .pin-number{font-size:11px}.pin-group .pin-function{font-size:11px}.qfn-diagram .pin-group .pin-label{font-size:12px}.qfn-diagram .pin-group .pin-function{font-size:10px}.desktop-hint{display:none}.mobile-hint{display:inline}.canvas-caption{padding:12px;font-size:9px;gap:5px}.canvas-caption svg{display:none}#match-count{font-size:8px}.legend{padding:12px;gap:10px;justify-content:space-between;font-size:9px}.details-panel{display:block}.detail-top{padding:19px}.pin-hero{padding-inline:19px}.pin-info{margin-inline:19px}.function-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.function-option{min-height:38px;flex-wrap:wrap;font-size:10px}.function-option small{font-size:7px}.plan-box{margin:0;border-left:0;border-top:1px solid var(--line);padding:20px}.label-section input{font-size:12px;padding:11px}.add-plan{font-size:12px;padding:12px}.pin-description{font-size:12px}.below-workspace p{font-size:10px}footer{font-size:9px;flex-wrap:wrap;gap:12px}#toast{left:50%;width:max-content;font-size:11px}dialog{padding:22px}.modal-header h2{font-size:22px}#catalog-grid{grid-template-columns:1fr}.catalog-card{padding-left:82px;min-height:135px}.mini-art{position:absolute;top:22px;left:17px}.legend .legend-note{display:none}}
@media(max-width:370px){.console-header__inner{gap:10px;padding-inline:12px}.console-theme select{width:76px}.filter{font-size:8px;padding-inline:5px}.pin-search kbd{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Keep the shared project prompt and tools consistent with the other sites. */
.pin-atlas-site .console-nav .source-link { font-size: 12px; }
@media (max-width: 1180px) {
  .pin-atlas-site .console-header { height: auto; min-height: 74px; }
  .pin-atlas-site .console-header__inner { gap: 0 18px; min-height: 73px; }
  .pin-atlas-site .console-nav .source-link { border: 0; padding: 8px 0; }
}
@media (max-width: 640px) {
  .pin-atlas-site .console-header { min-height: 64px; }
  .pin-atlas-site .console-header__inner { gap: 0 12px; min-height: 63px; padding: 9px 16px; }
}
@media (max-width: 380px) {
  .pin-atlas-site .console-header__inner { gap: 0 8px; padding-inline: 12px; }
}
:root{--pin-pcm:#506931;--pin-clock:#8e6726;--pin-jtag:#7d5483;--pin-dpi:#7c6545;--pin-sdio:#346d70;--pin-smi:#665d8b}
:root[data-theme="dark"]{--pin-pcm:#bdd49e;--pin-clock:#e0c08c;--pin-jtag:#d5a7dc;--pin-dpi:#c6b091;--pin-sdio:#9bcdd0;--pin-smi:#bdb1e8}
.pin-evidence{padding:18px 19px;border-top:1px solid var(--line)}.pin-evidence ul{list-style:none;margin:0;padding:0}.pin-evidence li+li{margin-top:14px}.pin-evidence a{font-size:10px}.pin-evidence small{display:block;font-size:9px;color:var(--muted);line-height:1.9;margin-top:4px}.pin-evidence p{font-size:8px;line-height:1.9;color:var(--muted);margin-bottom:0}.pin-evidence p a{font-size:8px}.filter-bar{align-items:start}.filter-label{padding-top:8px}#reset-filters{margin-top:5px}

.console-language select {
  border: 1px solid var(--control-border);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
}

/* Keep discovery, editing and the saved plan distinct. */
.sidebar { padding-top: 20px; }
.sidebar .nav-section { margin: 20px 8px 8px; font-size: 12px; }
.board-nav-item { font-size: 13px; }
.board-nav-item small { font-size: 11px; }
.nav-button, .sidebar-bottom button { font-size: 13px; }
.topbar { justify-content: flex-start; padding-block: 8px; }
.breadcrumbs { font-size: 12px; }
.page-heading h1 { font-size: clamp(24px, 2.2vw, 32px); }
.page-heading p, .specs { font-size: 13px; }
.specs { margin-block: 16px 20px; }
.board-scope { border-left: 3px solid var(--accent); background: var(--surface); padding: 12px 16px; font-size: 13px; line-height: 1.8; margin: 0 0 20px; max-width: 950px; }
.workspace { grid-template-columns: minmax(0, 1fr) 330px; }
#details-home { min-width: 0; position: sticky; top: 90px; }
.details-panel { display: block; }
.detail-top { padding: 0; border-bottom: 1px solid var(--line); }
.detail-tabs { display: flex; flex: 1; min-width: 0; }
.detail-tabs button { flex: 1; border: 0; padding: 12px 8px; min-height: 48px; font-size: 12px; color: var(--muted); border-bottom: 2px solid transparent; }
.detail-tabs button[aria-selected="true"] { border-bottom-color: var(--accent); color: var(--ink); background: var(--surface); }
#plan-tab-count { display: inline-block; min-width: 20px; border: 1px solid var(--line); margin-left: 4px; }
#close-details { display: none; }
.pin-hero { padding: 16px 18px 0; }
.pin-identity { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; }
.pin-identity h2 { font-size: 27px; margin: 0 0 8px; }
.physical-pin, .pin-type { font-size: 12px; }
.pin-type { border: 0; padding: 0; background: none; }
.pin-description { font-size: 13px; margin: 10px 0 16px; line-height: 1.7; }
.function-section { border: 0; padding: 0 18px 16px; margin: 0; min-width: 0; }
.function-section legend { padding: 0; }
.small-label, .small-label span { font-size: 11px; }
.function-list { display: flex; flex-direction: column; gap: 6px; }
.function-option { font-size: 13px; min-height: 40px; padding: 8px 10px; }
.function-option input { width: 16px; height: 16px; min-width: 16px; }
.function-option small { font-size: 10px; }
.function-option:has(input:checked) { border-color: var(--color); background: color-mix(in srgb, var(--color) 16%, var(--paper)); }
.function-hint { font-size: 12px; color: var(--muted); margin: 0 0 10px; }
.more-functions { margin-top: 10px; }
.more-functions summary, .pin-evidence summary { cursor: pointer; font-size: 12px; color: var(--accent); padding: 8px 0; }
.more-functions[open] summary { margin-bottom: 6px; }
.label-section { padding: 0 18px 16px; }
.label-section input { font-size: 14px; min-height: 44px; }
.pin-evidence { padding: 8px 18px; }
.pin-evidence ul { padding-top: 10px; }
.pin-evidence a, .pin-evidence small, .pin-evidence p, .pin-evidence p a { font-size: 12px; }
.detail-action { padding: 12px 18px; border-top: 1px solid var(--line); background: var(--paper); }
.add-plan { margin: 0; min-height: 44px; font-size: 13px; background: var(--accent); color: var(--paper); }
.add-plan:hover { background: var(--selection); color: var(--ink); }
.plan-box { border: 0; margin: 0; padding: 18px; }
.plan-heading, .empty-plan, .plan-row, .plan-row strong, .plan-row small, .local-note { font-size: 13px; }
.plan-row > button:first-child { min-height: 44px; }
.remove-plan { min-width: 44px; min-height: 44px; }
.plan-actions { flex-wrap: wrap; }
.plan-actions button, .plan-actions button:first-child { flex: 1 1 auto; font-size: 12px; min-height: 44px; }
.plan-actions #share-button { flex-basis: 100%; }
.filter-label { font-size: 11px; }
.filter { font-size: 12px; min-height: 38px; }
#reset-filters { min-width: 40px; min-height: 40px; margin-top: 0; justify-content: center; align-items: center; }
.pin-search input { font-size: 14px; min-height: 36px; }
.icon-button, .view-switch button { min-width: 40px; min-height: 40px; }
.view-switch button { font-size: 12px; }
.button { font-size: 13px; min-height: 44px; }
.canvas-caption, #match-count, .legend { font-size: 11px; }
.legend-note { font-size: 10px; }
.pin-table { white-space: normal; }
.pin-table td, .pin-table th { font-size: 12px; padding: 10px; }
.pin-table td > span { font-size: 11px; white-space: nowrap; }
.pin-table tr.selected { background: var(--selection); }
.pin-table tr.selected td:first-child { box-shadow: inset 3px 0 var(--accent); }
.table-details { padding: 6px 10px; font-size: 12px; min-height: 40px; color: var(--accent); }
.table-content { max-height: min(700px, 80vh); }
.catalog-search input { font-size: 16px; }
.catalog-card small, .catalog-note { font-size: 12px; }
.catalog-card b { font-size: 16px; }
.below-workspace p, footer { font-size: 12px; }
.mobile-workbar { display: none; }
#details-dialog { padding: 0; }
@media (max-width: 1200px) and (min-width: 971px) {
  .workspace { grid-template-columns: minmax(0, 1fr) 300px; }
}
@media (max-width: 970px) {
  .workspace { grid-template-columns: minmax(0, 1fr); }
  #details-home { display: none; }
  .mobile-workbar { display: flex; position: fixed; z-index: 20; bottom: 0; left: 190px; right: 0; padding: 10px 14px max(10px, env(safe-area-inset-bottom)); gap: 10px; background: var(--paper); border-top: 1px solid var(--control-border); }
  .mobile-workbar button { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 8px; min-height: 44px; font-size: 12px; flex: 1; }
  .shell { padding-bottom: 80px; }
  #details-dialog { width: min(600px, 100%); max-width: 100%; margin: auto auto 0; max-height: 88dvh; overflow: hidden; border-bottom: 0; }
  #details-dialog .details-panel { display: flex; flex-direction: column; max-height: 88dvh; border: 0; }
  #details-dialog .detail-top { flex-shrink: 0; }
  #details-dialog #close-details { display: inline-flex; margin: 4px; }
  #details-dialog #pin-detail { display: flex; flex-direction: column; overflow: hidden; min-height: 0; }
  #details-dialog .pin-detail-body { overflow-y: auto; overscroll-behavior: contain; }
  #details-dialog .detail-action { flex-shrink: 0; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
  #details-dialog #plan-panel { overflow-y: auto; overscroll-behavior: contain; }
  .detail-tabs button { min-height: 52px; }
  body:has(#details-dialog[open]), body:has(#library-dialog[open]) { overflow: hidden; }
  #toast { left: 50%; bottom: 86px; z-index: 60; }
}
@media (max-width: 640px) {
  .topbar { gap: 12px; padding: 8px 15px; }
  .topbar .button { font-size: 12px; padding-inline: 10px; }
  .breadcrumbs { font-size: 11px; gap: 6px; }
  #board-family, .breadcrumbs > span { display: none; }
  .page-heading { gap: 12px; }
  .page-heading h1 { font-size: 24px; }
  .page-heading p, .specs { font-size: 12px; }
  .specs { margin-block: 14px 18px; }
  .mobile-workbar { left: 0; gap: 8px; padding-inline: 10px; }
  .mobile-workbar button { font-size: 11px; }
  .filter { min-height: 40px; font-size: 11px; padding-inline: 8px; }
  .search-tools { flex-wrap: wrap; }
  .pin-search { flex-basis: 100%; }
  .pin-search input, .label-section input { font-size: 16px; }
  .diagram-tools { margin-left: auto; }
  #diagram { padding-top: 40px; }
  #diagram > svg, #diagram.qfn-diagram > svg { width: 680px; min-width: 680px; }
  .canvas-caption { flex-wrap: wrap; font-size: 11px; }
  #match-count { font-size: 11px; }
  .legend { flex-wrap: wrap; font-size: 11px; }
  .function-list { display: flex; }
  .function-option { min-height: 44px; font-size: 13px; }
  .function-option small { font-size: 10px; }
  .detail-tabs button { font-size: 12px; }
  .orientation { font-size: 10px; }
  .board-scope { font-size: 12px; }
}
@media (min-width: 971px) {
  #details-home .details-panel { display: flex; flex-direction: column; max-height: max(480px, calc(100dvh - 340px)); }
  #details-home .detail-top { flex-shrink: 0; }
  #details-home #pin-detail { display: flex; flex-direction: column; overflow: hidden; min-height: 0; }
  #details-home .pin-detail-body, #details-home #plan-panel { overflow-y: auto; overscroll-behavior: contain; }
  #details-home .detail-action { flex-shrink: 0; }
}
.view-options { position: relative; }
.view-options > summary { display: none; }
@media (max-width: 640px) {
  main { padding-top: 16px; }
  .page-heading { flex-direction: row; align-items: center; }
  .page-heading > div:first-child { min-width: 0; }
  .page-heading h1 { font-size: 22px; }
  .page-heading p { display: none; }
  .heading-actions .button { font-size: 12px; padding: 8px; }
  .specs { flex-wrap: nowrap; font-size: 11px; gap: 0; }
  .specs > span { padding-inline: 6px; white-space: nowrap; }
  .specs > span:first-child { padding-left: 0; }
  .search-tools { flex-wrap: nowrap; }
  .pin-search { flex-basis: auto; }
  .view-options > summary { display: flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; cursor: pointer; color: var(--accent); border: 1px solid var(--line); list-style: none; }
  .view-options > summary::-webkit-details-marker { display: none; }
  .view-options .diagram-tools { position: absolute; top: calc(100% + 8px); right: 0; z-index: 5; background: var(--paper); border: 1px solid var(--control-border); padding: 8px; gap: 8px; box-shadow: 0 4px 12px #0002; }
}
@media (max-width: 370px) {
  .specs { flex-wrap: wrap; row-gap: 8px; }
  .page-heading h1 { font-size: 20px; }
}

/* One physical map per family, with processor functions chosen in place. */
.compatible-boards { margin: -4px 0 18px; font-size: 13px; line-height: 1.8; color: var(--ink); }
.function-reference-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 12px 18px; border-bottom: 1px solid var(--line); background: var(--surface); }
.function-reference-bar label { font-size: 12px; color: var(--ink); }
.function-reference-bar select { min-width: 0; max-width: 100%; min-height: 40px; padding: 7px 10px; font-size: 13px; border: 1px solid var(--control-border); border-radius: 0; background: var(--paper); }
.function-reference-bar p { flex-basis: 100%; margin: 0; font-size: 12px; color: var(--muted); line-height: 1.6; }
#board-nav .board-nav-item small { line-height: 1.6; }
@media (max-width: 640px) {
  .compatible-boards { font-size: 12px; margin-bottom: 14px; }
  .function-reference-bar { padding: 12px; }
  .function-reference-bar select { width: 100%; font-size: 16px; }
  .function-reference-bar p { font-size: 12px; }
}

:root { --pin-i2s: #315f92; }
:root[data-theme="dark"] { --pin-i2s: #a3c8f0; }