/* Corammers workspace: compact inventory, quiet chrome, progressive detail. */
.row-login{margin:6px 0}.row-login button{padding:5px 9px;font-size:12px;min-height:32px;border-radius:6px}.site-operations{margin-top:20px}
.hosting-switcher{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.hosting-choice{display:grid;gap:4px;min-width:145px;flex:1;padding:15px 17px;background:var(--card);border:1px solid var(--border);border-radius:12px;color:var(--ink);text-decoration:none}.hosting-choice strong{font-size:14px;overflow-wrap:anywhere}.hosting-choice span{font-size:12px;color:var(--muted)}.hosting-choice.selected{border-color:#d4b130;background:var(--surface);box-shadow:inset 0 -3px #f5cc42}.site-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.site-actions form{margin:0}.hosting-websites{margin-top:30px}.inline-check{display:flex;gap:10px;align-items:flex-start}.inline-check input{width:auto;margin-top:5px}.status.down{background:#fff0ed;color:#a13728;border-color:#efc7bf}.status.backup{background:#fff5dc;color:#84610b;border-color:#f1e3bd}
@media(max-width:900px){.inventory-table thead{display:none}}
:root{--muted:#626b7d;--surface:#f7f8fa;--accent:#f5cc42;--focus:#397ab8}
[data-theme=dark]{--muted:#aeb8cb;--surface:#222733;--accent:#f5cc42;--focus:#79b7ef}
body{font-size:16px;line-height:1.5}.workspace main{max-width:1900px;padding:34px 40px 64px}.sidebar nav>a{font-size:14px}.sidebar{overflow-y:auto}.sidebar .nav-label{font-size:12px}.sidebar-bottom{padding-bottom:12px}.sidebar .brand{letter-spacing:-.02em}h1{font-size:38px;letter-spacing:-.045em}h2{font-size:20px;letter-spacing:-.025em}.heading p{margin:8px 0 0}.heading{gap:18px}.eyebrow{text-transform:uppercase;letter-spacing:.09em;font-size:12px}.client-grid{gap:16px}.client-card{border-radius:16px}.card-category{height:34px}.card-top h2{font-size:18px}.card-stats strong{font-size:26px}.card-bottom{font-size:13px}.card-stats span{font-size:13px}.client-card:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.button,button{font-size:14px;min-height:42px}.secondary{background:var(--card);color:var(--ink);border:1px solid var(--border);box-shadow:0 1px 2px #00000006}.secondary:hover{background:var(--surface);color:var(--ink)}.breadcrumbs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px;font-size:14px;color:var(--muted)}.breadcrumbs a{color:var(--muted);font-size:14px}.breadcrumbs a:hover{text-decoration:underline}.client-heading{display:flex;gap:18px;align-items:center;margin-bottom:28px}.hero-avatar{width:64px;height:64px;font-size:22px;border-radius:20px}.client-heading h1{margin:3px 0;line-height:1.2}.client-heading p{margin:4px 0 0}.client-heading>.status{margin-left:auto;flex-shrink:0}.overview-strip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);border-radius:16px;overflow:hidden;margin-bottom:32px;background:var(--card)}.overview-item{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 22px;border-right:1px solid var(--border);text-decoration:none;color:var(--muted);position:relative}.overview-item:last-child{border-right:0}.overview-item strong{font-size:28px;font-weight:650;letter-spacing:-.04em;color:var(--ink)}.overview-item span{font-size:14px}.overview-item.selected{background:var(--surface);color:var(--ink)}.overview-item.selected:after{content:'';position:absolute;height:3px;bottom:0;left:20px;right:20px;background:var(--accent);border-radius:4px}.overview-item:hover{background:var(--surface)}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 18px}.section-heading h2{margin:0}.section-heading p{margin:4px 0 0}.inventory-surface{border:1px solid var(--border);background:var(--card);border-radius:16px;overflow:hidden}.inventory-toolbar{display:flex;align-items:center;gap:10px;padding:18px;border-bottom:1px solid var(--border);background:var(--card)}.inventory-toolbar label{margin:0;min-width:0}.inventory-toolbar .search-field{flex:1}.inventory-toolbar input,.inventory-toolbar select{height:44px;margin:0;border-radius:8px;font-size:14px}.inventory-toolbar select{padding-right:28px}.inventory-toolbar button{border-radius:8px;padding:10px 18px;min-height:44px}.clear-filters{font-size:14px;color:var(--muted);padding:10px}.inventory-table{table-layout:fixed;width:100%;font-size:14px}.inventory-table th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;background:var(--surface);padding:13px 20px}.inventory-table th:first-child{width:34%}.inventory-table th:last-child{width:170px}.inventory-table td{padding:18px 20px;vertical-align:middle}.inventory-table tr:last-child td{border-bottom:0}.inventory-table tbody tr:hover{background:var(--surface)}.record-identity{display:flex;gap:12px;align-items:center;min-width:0}.record-icon{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border:1px solid var(--border);border-radius:10px;color:var(--muted);background:var(--card);font-family:ui-monospace,monospace;font-size:12px;font-weight:600}.record-name{min-width:0}.record-name>a{display:block;font-weight:650;text-decoration:none;overflow-wrap:anywhere;line-height:1.4}.record-name>a:hover{text-decoration:underline}.record-name>span{display:block;color:var(--muted);font-size:13px;margin-top:4px;overflow-wrap:anywhere}.hosting-label{font-family:ui-monospace,monospace;font-size:12px;overflow-wrap:anywhere;color:var(--muted)}.client-link{font-size:14px;text-decoration:none;overflow-wrap:anywhere}.client-link:hover{text-decoration:underline}.status{display:inline-flex;align-items:center;gap:7px;border:1px solid transparent;padding:4px 9px;border-radius:7px;font-size:13px;white-space:nowrap;font-weight:550}.status.live{background:#e9f7f0;color:#16764b;border-color:#d4ebde}.status.live:before{content:'';width:6px;height:6px;background:currentColor;border-radius:50%}.status.staging{background:#fff5dc;color:#84610b;border-color:#f1e3bd}.status.neutral{background:var(--surface);color:var(--muted);border-color:var(--border)}[data-theme=dark] .status.live{background:#193b30;color:#88ddb6;border-color:#295b47}[data-theme=dark] .status.staging{background:#443919;color:#eed083;border-color:#5b4b25}.row-actions{text-align:right;white-space:nowrap}.row-actions a{font-size:13px;text-decoration:none}.external-link{color:var(--muted);margin-right:15px}.details-link{font-weight:600}.row-actions a:hover{text-decoration:underline}.list-footer{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--border);padding:16px 20px;color:var(--muted);font-size:13px}.list-footer>div{display:flex;gap:10px;align-items:center}.page-button{display:inline-block;padding:7px 11px;border:1px solid var(--border);border-radius:7px;font-size:13px;color:var(--ink);text-decoration:none;background:var(--card)}.page-button.disabled{opacity:.45}.page-position{padding:0 4px}.data-caption{font-size:12px;color:var(--muted);margin:14px 2px}.list-empty{text-align:center;padding:45px 20px}.list-empty>.record-icon{margin:0 auto;font-size:24px;width:48px;height:48px}.list-empty h3{margin:15px 0 5px}.list-empty p{color:var(--muted);margin:0 0 16px}.total-chip{background:var(--surface);border:1px solid var(--border);padding:8px 13px;border-radius:9px;font-size:14px;white-space:nowrap}.detail-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,1fr);gap:24px}.detail-panel{padding:24px;border:1px solid var(--border);border-radius:16px;background:var(--card)}.detail-aside{display:grid;align-content:start;gap:20px}.detail-panel h2{margin:0 0 16px}.detail-panel .section-heading h2{margin:0}.property-list{display:block;margin:10px 0 0}.property-list>div{display:grid;grid-template-columns:160px 1fr;gap:24px;padding:17px 0;border-bottom:1px solid var(--border)}.property-list>div:last-child{border-bottom:0}.property-list dt{color:var(--muted);font-size:14px}.property-list dd{font-size:14px;overflow-wrap:anywhere}.credential-callout{border-top:3px solid var(--accent)}.credential-callout h2{margin:12px 0}.record-heading h1{overflow-wrap:anywhere;font-size:34px}.add-record-panel details{margin:0}.add-record-panel summary{margin-bottom:0}.add-record-panel details[open] summary{margin-bottom:24px}.add-record-panel{margin-top:28px}.detail-aside a{font-size:14px}.inventory-table-wrap{width:100%;overflow:auto}.notice{background:var(--surface);color:var(--ink);border-color:var(--border)}
@media(min-width:1600px){.client-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1200px){.workspace main{padding:28px 24px}.overview-item{padding:16px;display:block}.overview-item strong{display:block;margin-top:4px}.inventory-table th,.inventory-table td{padding-left:14px;padding-right:14px}.inventory-table th:last-child{width:145px}.inventory-table th:first-child{width:32%}.detail-grid{grid-template-columns:minmax(0,1.4fr) minmax(240px,1fr)}}
@media(max-width:900px){.detail-grid{grid-template-columns:1fr}.overview-item span{font-size:13px}.inventory-toolbar{flex-wrap:wrap}.inventory-toolbar .search-field{flex-basis:100%}.inventory-toolbar select{width:100%}.inventory-toolbar label:not(.search-field){flex:1}.client-heading>.status{display:none}.inventory-table th{display:none}.inventory-table,.inventory-table tbody,.inventory-table tr,.inventory-table td{display:block;width:100%}.inventory-table tr{padding:18px;border-bottom:1px solid var(--border)}.inventory-table td{border:0;padding:5px 0;display:flex;align-items:center;justify-content:space-between;gap:12px}.inventory-table td[data-label]:not(:first-child):before{content:attr(data-label);font-size:13px;color:var(--muted)}.inventory-table td:first-child{padding-bottom:12px}.inventory-table td.row-actions{justify-content:flex-end;padding-top:15px}.row-actions a{padding:6px 10px;border:1px solid var(--border);border-radius:6px;min-height:34px}.list-footer{flex-wrap:wrap}.list-footer>div{margin-left:auto}}
@media(max-width:760px){.workspace main{padding:24px 16px 40px}.client-heading{gap:12px}.hero-avatar{width:48px;height:48px;border-radius:14px;font-size:18px}.client-heading h1{font-size:29px}.client-heading .eyebrow{font-size:11px}.overview-strip{grid-template-columns:repeat(2,1fr);margin-bottom:24px}.overview-item{display:flex;border-bottom:1px solid var(--border);padding:12px 16px}.overview-item:nth-child(2){border-right:0}.overview-item:nth-last-child(-n+2){border-bottom:0}.overview-item strong{font-size:24px;margin:0}.overview-item.selected:after{left:0;right:auto;top:0;bottom:0;width:3px;height:auto}.section-heading{align-items:flex-start;flex-direction:column;gap:12px}.section-heading .button{font-size:13px;padding:9px 14px;min-height:38px}.inventory-toolbar{padding:14px;gap:8px}.inventory-toolbar button{flex:1}.clear-filters{padding:8px}.inventory-toolbar label:not(.search-field){min-width:115px}.list-footer{padding:14px;gap:12px}.list-footer>div{width:100%;justify-content:space-between}.detail-panel{padding:20px}.property-list>div{grid-template-columns:1fr;gap:6px}.property-list dd{margin-bottom:0}.record-heading h1{font-size:28px}.record-heading .button{margin-top:15px}.breadcrumbs{margin-bottom:20px;font-size:13px}.breadcrumbs a{font-size:13px}.sidebar{max-width:85vw}.client-grid{grid-template-columns:1fr}.client-card{padding:18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media(max-width:760px){.inventory-toolbar label:not(.search-field){flex:1 1 calc(50% - 8px);min-width:0}.inventory-toolbar button{flex:1 1 100%}.row-actions a{min-height:40px;display:inline-flex;align-items:center}}

/* website row actions: Open is a real control, Details stays a text link.
   The old spacing came from .external-link's margin-right; the row is now a
   flex line with a gap, so both actions align on one baseline at every width.
   .page-button is the house style for small controls — Open matches it. */
.row-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;white-space:nowrap}
.open-site{display:inline-flex;align-items:center;gap:5px;padding:7px 11px;border:1px solid var(--border);border-radius:7px;background:var(--card);color:var(--ink);font-size:13px;font-weight:600;line-height:1.2;text-decoration:none}
.open-site:hover{background:var(--surface);text-decoration:none}
.open-site:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.open-site .ext{font-size:11px;opacity:.6}
.open-site:hover .ext{opacity:1}
.details-link{display:inline-flex;align-items:center;gap:5px;color:var(--muted)}
.details-link:hover{color:var(--ink)}
/* room for both actions on one line */
.inventory-table th:last-child{width:196px}
@media(max-width:1200px){.inventory-table th:last-child{width:178px}}
/* end website row actions */

/* Team & permissions: the access grid. Columns stay narrow so many clients
   fit; the person column is sticky so a row stays readable while scrolling. */
details summary{cursor:pointer;padding:4px 0}
/* Team & permissions: people list, and the per-person access editor. */
[hidden]{display:none!important}
.access-table th.act,.access-table td.act{width:150px;text-align:right}
.access-table td.who strong{display:block}
.access-table td.who .status{margin:6px 6px 0 0;font-size:11px;padding:1px 6px}
.access-table tr.is-off td{opacity:.6}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:7px;border:1px solid var(--border);background:var(--surface);font-size:13px;white-space:nowrap}
.chip em{font-style:normal;font-weight:650;font-size:12px;color:#16764b}
.chip em.manage{color:#a65e00}
.chip small{color:var(--muted);font-size:12px}
.chip.admin,.chip.all{background:#e9f7f0;border-color:#d4ebde;color:#16764b;font-weight:600}
.chip.none{color:var(--muted)}
[data-theme=dark] .chip.admin,[data-theme=dark] .chip.all{background:#193b30;border-color:#295b47;color:#88ddb6}
[data-theme=dark] .chip em{color:#88ddb6}
[data-theme=dark] .chip em.manage{color:#f2c46d}
.heading h1 .status{margin-left:10px;vertical-align:middle;font-size:12px}
.heading .eyebrow a{color:var(--muted);text-decoration:none;letter-spacing:0;text-transform:none;font-weight:600}
.heading .eyebrow a:hover{color:var(--ink)}
.access-editor h2{margin:0 0 14px}
.access-modes{display:grid;gap:10px}
.access-mode{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 16px;border:1px solid var(--border);border-radius:10px}
.access-mode:has(input[name=mode]:checked){border-color:#16764b;background:#f3faf6}
[data-theme=dark] .access-mode:has(input[name=mode]:checked){background:#193b30;border-color:#295b47}
.access-editor .pick{display:flex;align-items:flex-start;gap:12px;flex:1;min-width:220px;margin:0;font:inherit;color:var(--ink);cursor:pointer;letter-spacing:0;text-transform:none}
.access-editor .pick input{width:18px;height:18px;margin:2px 0 0;flex-shrink:0;border-radius:50%}
.access-editor .pick strong{display:block;font-size:15px}
.access-editor .pick small{display:block;color:var(--muted);font-size:13px;font-weight:400}
.seg{display:inline-flex;position:relative;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--card)}
.seg label{margin:0;font:inherit;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;letter-spacing:0;text-transform:none}
.seg input{position:absolute;opacity:0;width:0;height:0;margin:0}
.seg span{display:block;padding:8px 14px;border-right:1px solid var(--border)}
.seg label:last-child span{border-right:0}
.seg input:checked+span{background:#163956;color:#fff}
[data-theme=dark] .seg input:checked+span{background:#eef0f6;color:#111}
.seg input:focus-visible+span{outline:2px solid var(--focus);outline-offset:-2px}
.access-client{border:1px solid var(--border);border-radius:10px;padding:12px 16px;margin-bottom:10px}
.access-client.on{border-color:#16764b}
.access-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.access-row .name{flex:1;min-width:180px}
.access-row .name strong{display:block;font-size:15px}
.access-row .name small{color:var(--muted);font-size:12px}
.access-row select.scope{width:auto;height:38px;font-size:13px;margin:0;padding:0 28px 0 12px}
.access-records{margin-top:12px;padding-top:12px;border-top:1px dashed var(--border)}
.access-records input[type=search]{height:38px;width:100%;max-width:320px;font-size:14px;margin:0 0 12px;border:1px solid var(--border);border-radius:8px;padding:0 12px;background:var(--card);color:var(--ink)}
.access-records fieldset{border:0;padding:0;margin:0 0 12px;min-width:0}
.access-records legend{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:0;margin-bottom:6px;display:flex;gap:10px;align-items:center}
.access-records legend .muted{font-weight:600}
.access-records legend button{min-height:0;padding:0;margin:0;background:none;border:0;color:var(--focus);font-size:12px;font-weight:600;text-transform:none;letter-spacing:0;cursor:pointer;box-shadow:none;flex:0 0 auto}
.access-records .items{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:2px 16px;max-height:240px;overflow:auto;padding-right:6px}
.access-records .item{display:flex;align-items:center;gap:8px;margin:0;padding:4px 0;font:inherit;font-size:13px;font-weight:400;color:var(--ink);cursor:pointer;letter-spacing:0;text-transform:none;min-width:0}
.access-records .item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.access-records .item input{width:16px;height:16px;margin:0;flex-shrink:0;border-radius:3px}
.access-actions{display:flex;gap:12px;align-items:center;margin:20px 0}
.access-actions button{min-height:44px;padding:10px 22px;flex:0 0 auto}
@media(max-width:760px){.access-table td.act{text-align:left}.access-row .seg{order:2}.access-row select.scope{order:3;width:100%}}
/* Activity log */
.activity-toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin:0 0 16px}
.activity-toolbar label{margin:0;min-width:0;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.activity-toolbar select{display:block;margin-top:6px;height:40px;width:auto;min-width:210px;font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink)}
.activity-table td{vertical-align:top}
.activity-table th.when,.activity-table td.when{width:130px;white-space:nowrap}
.activity-table td.when time{color:var(--muted);cursor:default}
.activity-table th.who,.activity-table td.who{width:210px;font-weight:600;overflow-wrap:anywhere}
.activity-table th.via,.activity-table td.via{width:170px;white-space:nowrap;color:var(--muted);text-align:right}
.activity-table td.what{line-height:1.5}
.kind-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin:0 9px 2px 0;vertical-align:middle;background:var(--border)}
.kind-credentials .kind-dot{background:#d08a00}
.kind-access .kind-dot{background:#397ab8}
.kind-records .kind-dot{background:#16764b}
.kind-account .kind-dot{background:#a13728}
.kind-browsing td.what{color:var(--muted)}
@media(max-width:760px){.activity-table th.via,.activity-table td.via{text-align:left}}
/* Deleting records and credentials */
.row-delete{margin:0}
.row-delete button,.secret-delete button{padding:7px 10px;min-height:34px;border-radius:7px;border:1px solid var(--border);background:var(--card);color:#a13728;font-size:13px;font-weight:600;box-shadow:none}
.row-delete button:hover,.secret-delete button:hover{background:#fff0ed;border-color:#efc7bf}
[data-theme=dark] .row-delete button,[data-theme=dark] .secret-delete button{color:#f0a396}
[data-theme=dark] .row-delete button:hover,[data-theme=dark] .secret-delete button:hover{background:#3a2422;border-color:#5d3630}
.inventory-table th:last-child{width:250px}
.danger-panel{margin-top:20px;border:1px solid #efc7bf;background:#fffaf9}
[data-theme=dark] .danger-panel{border-color:#5d3630;background:#241b1a}
.danger-panel h2{color:#a13728}
[data-theme=dark] .danger-panel h2{color:#f0a396}
.danger-panel ul{margin:10px 0 18px;padding-left:20px;color:var(--muted);font-size:14px;line-height:1.7}
.danger-panel form{margin:0}
.danger-panel button{background:#a13728;color:#fff;border:0;min-height:44px;padding:11px 20px;border-radius:8px;font-size:14px;font-weight:650}
.danger-panel button:hover{background:#8a2f22}
.secret-actions{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.secret-actions button{min-height:36px}
.secret-delete button{padding:8px 12px}
.secret-actions form{margin:0}
@media(max-width:760px){.secret-actions{justify-content:flex-start}}
/* Row actions. A <td> must stay a table cell: display:flex on the cell itself
   takes it out of the row box, so its bottom border stopped lining up with the
   rest of the row. The flex row lives on an inner wrapper instead, and every
   control in it shares one height so Open, Details and Delete line up. */
.inventory-table td.row-actions{display:table-cell;vertical-align:middle;text-align:right}
.row-actions-inner{display:flex;align-items:center;justify-content:flex-end;gap:8px;white-space:nowrap}
.row-actions-inner>*{flex:0 0 auto;margin:0}
.row-actions-inner .open-site,.row-actions-inner .details-link,.row-actions-inner button{display:inline-flex;align-items:center;height:34px;min-height:34px;padding:0 11px;border-radius:7px;font-size:13px;line-height:1;font-weight:600}
.row-actions-inner .details-link{border:1px solid var(--border);background:var(--card);color:var(--muted);text-decoration:none}
.row-actions-inner .details-link:hover{background:var(--surface);color:var(--ink);text-decoration:none}
@media(max-width:900px){.inventory-table td.row-actions{display:block;padding-top:14px}.row-actions-inner{gap:10px}}
/* Three actions (Open, Details, Delete) need a wider last column, so give the
   name column back some space at laptop widths and let client names break at
   spaces rather than mid-word. */
@media(max-width:1200px){.inventory-table th:first-child{width:26%}}
.client-link{overflow-wrap:break-word}
/* Harness library: skills and agents */
.library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:1px;background:var(--border)}
.library-card{display:flex;flex-direction:column;gap:10px;padding:20px;background:var(--card);text-decoration:none;color:var(--ink);min-width:0}
.library-card:hover{background:var(--surface)}
.library-card:focus-visible{outline:3px solid var(--focus);outline-offset:-3px}
.library-card .card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.library-card h2{margin:0;font-size:16px;font-weight:650;letter-spacing:-.01em;overflow-wrap:anywhere}
.library-card .card-head .status{font-size:11px;padding:2px 7px;flex-shrink:0}
.library-card .card-desc{margin:0;color:var(--muted);font-size:13.5px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.library-card .card-foot{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:4px}
.library-card .chip{display:inline-flex;align-items:center;padding:3px 8px;border:1px solid var(--border);border-radius:6px;background:var(--surface);font-size:12px;color:var(--muted);max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.library-card .chip.mono{font-family:ui-monospace,monospace;font-size:11.5px}
.library-card .card-source{margin-left:auto;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.file-list{margin:0;padding-left:18px;font-size:13px;line-height:1.9}
.file-list code{font-size:12px}

/* Markdown bodies (skill instructions, agent prompts) */
.markdown-body{font-size:14.5px;line-height:1.7;overflow-wrap:anywhere}
.markdown-body>:first-child{margin-top:0}
.markdown-body h1{font-size:22px;letter-spacing:-.02em;margin:26px 0 10px}
.markdown-body h2{font-size:18px;margin:24px 0 8px}
.markdown-body h3{font-size:15px;margin:20px 0 6px}
.markdown-body h4,.markdown-body h5,.markdown-body h6{font-size:14px;margin:16px 0 6px}
.markdown-body p,.markdown-body ul,.markdown-body ol,.markdown-body blockquote{margin:0 0 12px}
.markdown-body ul,.markdown-body ol{padding-left:22px}
.markdown-body li{margin:4px 0}
.markdown-body li>ul,.markdown-body li>ol{margin:4px 0}
.markdown-body code{font-family:ui-monospace,monospace;font-size:12.5px;background:var(--surface);border:1px solid var(--border);border-radius:5px;padding:1px 5px}
.markdown-body pre{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px 16px;overflow:auto;margin:0 0 14px}
.markdown-body pre code{background:none;border:0;padding:0;font-size:12.5px;line-height:1.6;white-space:pre}
.markdown-body blockquote{border-left:3px solid var(--border);padding:2px 0 2px 14px;color:var(--muted)}
.markdown-body hr{border:0;border-top:1px solid var(--border);margin:22px 0}
.markdown-body table{width:100%;border-collapse:collapse;font-size:13.5px;margin:0 0 14px;table-layout:auto}
.markdown-body th,.markdown-body td{border:1px solid var(--border);padding:8px 10px;text-align:left;vertical-align:top}
.markdown-body th{background:var(--surface);font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.markdown-body a{overflow-wrap:anywhere}

/* Create / edit form */
.library-form{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin:0}
.library-form>label{display:block;margin:0 0 18px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-width:0}
.library-form>label.full{grid-column:1/-1}
.library-form input,.library-form select,.library-form textarea{display:block;width:100%;margin-top:7px;font:inherit;font-size:14px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink);background:var(--card);border:1px solid var(--border);border-radius:8px;padding:10px 12px;height:auto;min-height:44px}
.library-form textarea{min-height:0;line-height:1.6;resize:vertical}
.library-form textarea.mono{font-family:ui-monospace,monospace;font-size:13px;line-height:1.65}
.library-form small{display:block;margin-top:6px;font-size:12px;font-weight:400;letter-spacing:0;text-transform:none}
.library-form label.check{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink);align-self:center;margin-bottom:18px}
.library-form label.check input{width:17px;height:17px;min-height:0;margin:0;flex-shrink:0;border-radius:4px}
.library-form .form-actions{grid-column:1/-1;display:flex;align-items:center;gap:12px;margin-top:4px}
.library-form .form-actions button{min-height:44px;padding:11px 22px}
@media(max-width:900px){.library-form{grid-template-columns:1fr}.library-grid{grid-template-columns:1fr}}
.property-list dd code{display:inline-block;max-width:100%;max-height:96px;overflow:auto;overflow-wrap:anywhere}
.record-heading p.muted{max-width:1000px}
/* Skill files: the tree, the file header and the code view */
.library-tabs{display:flex;gap:8px;margin:0 0 20px;flex-wrap:wrap}
.library-tabs a{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:1px solid var(--border);border-radius:9px;background:var(--card);color:var(--muted);font-size:14px;font-weight:600;text-decoration:none}
.library-tabs a:hover{background:var(--surface);color:var(--ink)}
.library-tabs a.active{background:var(--pill);color:var(--pill-text);border-color:var(--pill)}
.library-tabs .count{font-size:12px;padding:1px 7px;border-radius:20px;background:var(--surface);color:var(--muted)}
.library-tabs a.active .count{background:#ffffff26;color:inherit}
.files-layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:20px;align-items:start}
.files-tree{border:1px solid var(--border);border-radius:14px;background:var(--card);padding:14px;max-height:78vh;overflow:auto;position:sticky;top:20px}
.tree-group+.tree-group{margin-top:16px}
.tree-group h3{margin:0 0 8px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-family:ui-monospace,monospace}
.files-tree ul{list-style:none;margin:0;padding:0}
.files-tree li+li{margin-top:2px}
.files-tree a{display:block;padding:7px 9px;border-radius:8px;text-decoration:none;color:var(--ink);min-width:0}
.files-tree a:hover{background:var(--surface)}
.files-tree a.active{background:var(--surface);box-shadow:inset 2px 0 0 var(--accent)}
.files-tree .fname{display:block;font-family:ui-monospace,monospace;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.files-tree .fmeta{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.files-main{border:1px solid var(--border);border-radius:14px;background:var(--card);padding:22px;min-width:0}
.file-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;background:none;color:inherit;padding:0;border:0}
.file-head h2{margin:0 0 6px;font-family:ui-monospace,monospace;font-size:15px;overflow-wrap:anywhere}
.file-head p{margin:0;font-size:14px;max-width:70ch}
.file-head .page-button{flex-shrink:0}
.file-chips{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
.file-chips .chip{padding:3px 9px;border:1px solid var(--border);border-radius:6px;background:var(--surface);font-size:12px;color:var(--muted)}
.file-chips .chip.mono{font-family:ui-monospace,monospace}
.file-outline{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:18px 0 0;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.outline-group h4{margin:0 0 8px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.outline-group ul{list-style:none;margin:0;padding:0;font-size:13px}
.outline-group li{padding:3px 0;line-height:1.5}
.outline-group li code{font-size:12px;background:var(--card);border:1px solid var(--border);border-radius:5px;padding:1px 6px}
.outline-group li span{display:block;color:var(--muted);font-size:12px;margin-top:2px}
pre.code{counter-reset:codeline;margin:18px 0 0;padding:16px 16px 16px 0;background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:auto;max-height:70vh;font-family:ui-monospace,monospace;font-size:12.5px;line-height:1.65;tab-size:4}
pre.code:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
pre.code .cl{counter-increment:codeline;display:block;padding-left:4.2em;position:relative;white-space:pre}
pre.code .cl::before{content:counter(codeline);position:absolute;left:0;width:3.2em;text-align:right;color:var(--muted);opacity:.55;font-size:11.5px;user-select:none;-webkit-user-select:none}
pre.code .cl:hover{background:#00000008}
[data-theme=dark] pre.code .cl:hover{background:#ffffff0a}
pre.code .t-com{color:#6a7a86;font-style:italic}
pre.code .t-str{color:#0a7b62}
pre.code .t-key{color:#8250a6;font-weight:600}
pre.code .t-num{color:#b3541e}
pre.code .t-dec{color:#b3541e}
[data-theme=dark] pre.code .t-com{color:#8b9aa6}
[data-theme=dark] pre.code .t-str{color:#7fd1b9}
[data-theme=dark] pre.code .t-key{color:#d0a6f0}
[data-theme=dark] pre.code .t-num,[data-theme=dark] pre.code .t-dec{color:#f0a877}
.code-note{margin:12px 0 0;font-size:13px}
.file-delete{margin:18px 0 0}
.file-delete button{padding:7px 11px;min-height:34px;border-radius:7px;border:1px solid var(--border);background:var(--card);color:#a13728;font-size:13px;font-weight:600;box-shadow:none}
.file-delete button:hover{background:#fff0ed;border-color:#efc7bf}
[data-theme=dark] .file-delete button{color:#f0a396}
code.endpoint{display:block;font-size:12px;overflow-wrap:anywhere;padding:8px 10px;background:var(--surface);border:1px solid var(--border);border-radius:8px}
@media(max-width:1100px){.files-layout{grid-template-columns:1fr}.files-tree{position:static;max-height:none}}
@media(max-width:760px){.files-main{padding:16px}.file-head{flex-direction:column}pre.code{font-size:12px}}
/* Website sign-in panel */
.wp-login{display:inline-flex;align-items:center;gap:5px;padding:0 11px;height:34px;border:1px solid var(--border);border-radius:7px;background:var(--card);color:var(--ink);font-size:13px;font-weight:600;line-height:1;text-decoration:none;white-space:nowrap}
.wp-login:hover{background:var(--surface);text-decoration:none}
.wp-login .ext{font-size:11px;opacity:.6}
.login-panel{margin-top:20px}
.login-panel .section-heading{margin:0 0 4px}
.login-list{display:block;margin:6px 0 0}
.login-list>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;padding:14px 0;border-bottom:1px solid var(--border)}
.login-list>div:last-child{border-bottom:0}
.login-list dt{color:var(--muted);font-size:13px}
.login-list dd{margin:0;font-size:14px;overflow-wrap:anywhere}
.login-list code.pick{user-select:all;font-family:ui-monospace,monospace;font-size:13px;background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:3px 8px}
.login-note{display:block;margin-top:5px;font-size:12px;color:var(--muted)}
.login-secret{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.login-secret .masked{font-family:ui-monospace,monospace;letter-spacing:2px;color:var(--muted)}
.login-secret form{margin:0}
.login-secret button{min-height:32px;padding:6px 12px;font-size:13px}
.login-oneclick{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 0 0}
.login-oneclick .login-note{margin:0}
.login-edit{margin-top:18px;border-top:1px solid var(--border);padding-top:14px}
.login-edit summary{cursor:pointer;font-size:14px}
.login-form{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin-top:14px}
.login-form>label{display:block;margin:0 0 16px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-width:0}
.login-form input{display:block;width:100%;margin-top:7px;height:44px;padding:0 12px;font:inherit;font-size:14px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink);background:var(--card);border:1px solid var(--border);border-radius:8px}
.login-form small{display:block;margin-top:6px;font-size:12px;font-weight:400;letter-spacing:0;text-transform:none}
.login-form .login-actions{grid-column:1/-1}
.login-form .login-actions button{min-height:44px;padding:11px 20px}
@media(max-width:760px){.login-list>div{grid-template-columns:1fr;gap:4px}.login-form{grid-template-columns:1fr}}
/* A website row can carry four actions (Open, WP Login, Details, Delete). Give
   the column room for them, and let them wrap rather than overflow the cell and
   sit on top of the Hosting column. */
.inventory-table th:last-child{width:345px}
.inventory-table th:first-child{width:30%}
.row-actions-inner{flex-wrap:wrap;row-gap:6px;gap:7px}
@media(max-width:1200px){.inventory-table th:last-child{width:250px}.inventory-table th:first-child{width:30%}}
/* Skill families: one card per router, sub-skills listed on its own page */
.library-card .chip.family{background:var(--pill);color:var(--pill-text);border-color:transparent;font-weight:600}
.family-note{margin:-6px 0 16px;font-size:13px;color:var(--muted)}
.family-note code{font-family:ui-monospace,monospace;font-size:12px;background:var(--surface);border:1px solid var(--border);border-radius:5px;padding:1px 5px}
.family-panel{grid-column:1/-1;margin-top:20px}
.family-panel .section-heading{margin:0 0 4px}
.family-panel>p{margin:0 0 14px}
.family-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:1px;background:var(--border);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.family-list li{background:var(--card);min-width:0}
.family-list a{display:flex;flex-direction:column;gap:4px;padding:12px 14px;text-decoration:none;color:var(--ink);height:100%}
.family-list a:hover{background:var(--surface)}
.family-list a:focus-visible{outline:3px solid var(--focus);outline-offset:-3px}
.family-name{display:flex;align-items:center;gap:8px;min-width:0}
.family-name code{font-family:ui-monospace,monospace;font-size:12.5px;font-weight:600;color:var(--ink)}
.family-name .status{font-size:11px;padding:1px 6px}
.family-purpose{font-size:13px;line-height:1.55;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:760px){.family-list{grid-template-columns:1fr}}
/* A rendered skill body carries wide code blocks and tables. Grid and flex
   children do not shrink below their content unless told to, so those were
   stretching the detail grid past the viewport and giving the whole page a
   horizontal scrollbar on a phone. Contain them instead. */
.detail-grid>*{min-width:0}
.markdown-body{min-width:0;max-width:100%}
.markdown-body pre{max-width:100%}
.markdown-body table{display:block;width:max-content;max-width:100%;overflow-x:auto}

/* A reference rail lists pages, not code: the purpose earns more room
   than a byte count, and may wrap to a second line. */
.files-tree .fmeta{white-space:normal;line-height:1.35}
.reference-body{max-width:72ch}

/* The files layout pane must shrink too: a rendered reference with a wide
   code block or table was pushing the page past the viewport. */
.files-layout>*{min-width:0}
.files-main{overflow:hidden}
.reference-body pre,.reference-body table{max-width:100%}

/* A client brief's inline code carries paths and commands long enough to push a phone
   screen sideways. Code in a <pre> scrolls in its own box; inline code wraps instead. */
:not(pre) > code{overflow-wrap:anywhere;word-break:break-word}

/* ---- Add access (SSH / FTP / API) ------------------------------------------ */
.heading-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.connect-glyph{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:var(--accent);color:#1d1d1f;font:700 18px/1 ui-monospace,SFMono-Regular,monospace}
.connect-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:24px;align-items:start}
.connect-form{margin:0}
.connect-section{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin:0 0 16px;padding:22px 24px 6px;border:1px solid var(--border);border-radius:18px;background:var(--card);min-width:0}
.connect-section legend{float:left;grid-column:1/-1;width:100%;display:flex;align-items:center;gap:10px;margin:0 0 18px;padding:0;font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.connect-section legend .optional{margin-left:2px}
.connect-section .step{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--pill);color:var(--pill-text);font-size:13px;font-weight:700}
.connect-section label,.connect-section .field-label{display:block;margin:0 0 16px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);min-width:0}
.connect-section .field-label{margin:0 0 8px}
.connect-section input:not([type=radio]),.connect-section select,.connect-section textarea{display:block;width:100%;margin-top:7px;padding:0 12px;height:44px;font:inherit;font-size:14px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink);background:var(--card);border:1px solid var(--border);border-radius:9px}
.connect-section textarea{height:auto;padding:10px 12px;line-height:1.5;resize:vertical}
.connect-section textarea.mono,.connect-section input[spellcheck=false]{font-family:ui-monospace,SFMono-Regular,monospace;font-size:13px}
.connect-section input:focus-visible,.connect-section select:focus-visible,.connect-section textarea:focus-visible{outline:2px solid var(--focus);outline-offset:1px;border-color:transparent}
.connect-section small{display:block;margin-top:6px;font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;line-height:1.45}
.connect-section .full,.connect-section .field-group{grid-column:1/-1}
.connect-section .field-group{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.connect-section .field-group[hidden],.connect-section [hidden]{display:none}
.optional{font-style:normal;font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted);font-size:12px;margin-left:6px}
.connect-hint{margin:-4px 0 16px;font-size:13px;line-height:1.55;color:var(--muted)}
.connect-hint strong{color:var(--ink);font-weight:600}
.connect-hint code,.connect-steps code,.install-way code{font-size:12px;background:var(--surface);border:1px solid var(--border);border-radius:5px;padding:1px 5px}
.connect-seg{display:inline-flex;flex-wrap:wrap;margin:0 0 18px}
.connect-seg label{margin:0}
.connect-seg span{padding:9px 14px}
.auth-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 18px}
.connect-section label.auth-choice{display:flex;gap:10px;align-items:flex-start;margin:0;padding:14px;border:1px solid var(--border);border-radius:12px;cursor:pointer;text-transform:none;letter-spacing:0;color:var(--ink);font-size:14px;background:var(--card);transition:border-color .15s,background .15s}
.connect-section input[type=radio]{display:inline-block;width:auto;height:auto;padding:0;border:0;margin:0}
.auth-choice input{margin:3px 0 0;width:16px;height:16px;accent-color:var(--pill);flex-shrink:0}
.auth-choice span{display:grid;gap:4px}
.auth-choice strong{font-size:14px}
.auth-choice small{margin:0;color:var(--muted)}
.connect-section label.auth-choice:has(input:checked){border-color:var(--ink);background:var(--surface);box-shadow:inset 0 0 0 1px var(--ink)}
.install-now{padding:16px 16px 2px;margin:0 0 16px;border:1px dashed var(--border);border-radius:12px;background:var(--surface)}
.connect-actions{display:flex;gap:12px;align-items:center;margin:6px 0 0}
.connect-aside{position:sticky;top:24px}
.connect-steps{margin:12px 0 14px;padding-left:20px;display:grid;gap:12px;font-size:14px;line-height:1.55;color:var(--muted)}
.connect-steps strong{color:var(--ink)}
.wizard-pointer{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.wizard-pointer>div{flex:1;min-width:220px}
.wizard-pointer p{margin:4px 0 0}
.type-cell{display:inline-flex;flex-wrap:wrap;gap:6px;align-items:center}
.chip.mono{font-family:ui-monospace,SFMono-Regular,monospace;font-size:12px;letter-spacing:.02em}
/* connection panel on a host / API account */
.connection-panel,.status-panel{margin-top:20px}
.connection-panel .section-heading h2{margin:2px 0 0}
.connection-last{margin:0 0 14px;padding:12px 14px;border-radius:10px;background:var(--surface);border:1px solid var(--border);font-size:14px;line-height:1.55}
.connection-last.good{background:#e9f7f0;border-color:#d4ebde}
.connection-last.good strong{color:#16764b}
[data-theme=dark] .connection-last.good{background:#15352a;border-color:#23523f}
[data-theme=dark] .connection-last.good strong{color:#7fd7ad}
.fact-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:0;list-style:none}
.fact-chips li{display:inline-flex;gap:6px;align-items:baseline;padding:5px 10px;border:1px solid var(--border);border-radius:8px;background:var(--card);font-size:13px;font-family:ui-monospace,SFMono-Regular,monospace;max-width:100%;overflow-wrap:anywhere}
.fact-chips li span{font-family:inherit;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.hostkey-warning{margin:0 0 16px;padding:16px 18px;border:1px solid #efc7bf;background:#fff0ed;color:#6f2419;border-radius:12px;font-size:14px;line-height:1.55}
.hostkey-warning p{margin:8px 0}
.hostkey-warning code{font-size:12px;overflow-wrap:anywhere}
[data-theme=dark] .hostkey-warning{background:#3a1d19;border-color:#6d342b;color:#ffd9d1}
.connection-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.connection-actions form{margin:0}
.copy-field{display:inline-flex;align-items:center;gap:8px;min-width:0;max-width:100%;padding:4px 4px 4px 12px;border:1px solid var(--border);border-radius:30px;background:var(--surface)}
.copy-field code{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.copy-field.block{display:flex;align-items:flex-start;border-radius:12px;padding:10px 10px 10px 12px}
.copy-field.block code{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.55;flex:1}
button.copy{padding:7px 14px;font-size:13px;flex-shrink:0}
button.copied{background:#e9f7f0;color:#16764b;border-color:#d4ebde}
button.busy{opacity:.7;cursor:progress}
.key-install,.key-rotate{margin-top:20px;border-top:1px solid var(--border);padding-top:16px}
.key-install>summary,.key-rotate>summary{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline;cursor:pointer;font-size:15px}
.key-rotate>summary{font-size:14px;color:var(--muted)}
.key-box{margin:16px 0;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--card)}
.key-box pre{margin:0;padding:14px 16px;background:var(--surface);font:12.5px/1.6 ui-monospace,SFMono-Regular,monospace;white-space:pre-wrap;overflow-wrap:anywhere;user-select:all}
.key-box-actions{display:flex;flex-wrap:wrap;gap:10px;padding:12px 14px;border-top:1px solid var(--border)}
.key-box-actions .button{padding:7px 14px;font-size:13px}
.install-ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.install-way{padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--card);min-width:0}
.install-way.primary-way{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.install-way h3{margin:0 0 6px;font-size:15px;letter-spacing:-.02em}
.install-way p{margin:0 0 10px;line-height:1.5}
.panel-steps{margin:8px 0 10px;padding:0;list-style:none;display:grid;gap:8px;font-size:13px;line-height:1.45;color:var(--muted)}
.panel-steps strong{display:block;color:var(--ink);font-size:13px}
.inline-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:10px 0 0}
.inline-form label{margin:0;flex:1;min-width:180px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.inline-form input,.inline-form select{margin-top:6px;height:42px;padding:0 12px;font-size:14px;border-radius:9px;text-transform:none;letter-spacing:0}
.inline-form button{height:42px;padding:0 18px}
@media (max-width:1100px){.connect-choices{grid-template-columns:1fr 1fr}.install-ways{grid-template-columns:1fr}.connect-layout{grid-template-columns:1fr}.connect-aside{position:static}}
@media (max-width:700px){.connect-choices,.auth-choices,.connect-section,.connect-section .field-group{grid-template-columns:1fr}.connect-section{padding:18px 16px 4px}.copy-field{border-radius:12px}}
/* ---- Dashboard ------------------------------------------------------------- */
.dash-heading{align-items:flex-end}
.dash-stats .overview-item span{display:grid;gap:3px}
.dash-stats .overview-item small{font-size:12px;color:var(--muted);font-weight:500}
.dash-stats .overview-item strong{font-size:28px;letter-spacing:-.04em;color:var(--ink)}
em.bad{font-style:normal;color:#a13728;font-weight:650}
[data-theme=dark] em.bad{color:#ff9d8c}
.dash-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start}
.dash-main{min-width:0}
.dash-side{display:grid;gap:18px;position:sticky;top:24px}
.dash-side .detail-panel h2{font-size:17px;margin:0}
.dash-clients{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.dash-client{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden;transition:border-color .16s,box-shadow .16s}
.dash-client:hover{border-color:#a7afbe;box-shadow:0 8px 24px #00000008}
.dash-client-main{display:flex;gap:12px;align-items:center;padding:16px 16px 12px;text-decoration:none;color:var(--ink)}
.dash-client-main .avatar{width:40px;height:40px;border-radius:13px;font-size:14px;flex-shrink:0}
.dash-client-name{display:grid;gap:5px;min-width:0}
.dash-client-name strong{font-size:16px;letter-spacing:-.025em;line-height:1.25;overflow-wrap:anywhere}
.level{justify-self:start;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:6px;background:var(--surface);color:var(--muted);border:1px solid var(--border)}
.level-manage,.level-admin{background:#163956;color:#fff;border-color:#163956}
.level-read{background:#e9f7f0;color:#16764b;border-color:#d4ebde}
[data-theme=dark] .level-manage,[data-theme=dark] .level-admin{background:#eef0f6;color:#111;border-color:#eef0f6}
[data-theme=dark] .level-read{background:#15352a;color:#7fd7ad;border-color:#23523f}
.dash-client-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:0;padding:0 16px 12px;gap:8px}
.dash-client-stats div{display:grid;gap:2px}
.dash-client-stats dt{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.dash-client-stats dd{margin:0;font-size:18px;font-weight:700;letter-spacing:-.03em;display:flex;align-items:baseline;gap:6px}
.dash-client-stats dd small{font-size:11px;font-weight:500;color:#16764b;letter-spacing:0}
.dash-client-actions{display:flex;margin-top:auto;border-top:1px solid var(--border)}
.dash-client-actions a{flex:1;text-align:center;padding:11px 8px;font-size:13px;font-weight:650;text-decoration:none;color:var(--ink)}
.dash-client-actions a:hover{background:var(--surface)}
.dash-client-actions a+a{border-left:1px solid var(--border)}
.dash-client-actions a.add{color:#163956}
[data-theme=dark] .dash-client-actions a.add{color:var(--accent)}
.dash-team{margin-top:34px}
.dash-team-table,.access-table{width:100%}
.dash-team-table td small,.access-table td small,.login-cell small{display:block;margin-top:4px;font-size:12px;color:var(--muted)}
small.mono{font-family:ui-monospace,SFMono-Regular,monospace}
.dash-team-table tr.is-off td{opacity:.55}
.dash-team-table td.act{text-align:right}
.attention-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.attention-list a{display:grid;gap:2px;padding:10px 12px;border:1px solid var(--border);border-left:4px solid var(--border);border-radius:10px;text-decoration:none;color:var(--ink);background:var(--card)}
.attention-list a:hover{background:var(--surface)}
.attention-list .tone-down a{border-left-color:#d9534a}
.attention-list .tone-neutral a{border-left-color:var(--accent)}
.attention-list .what{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.attention-list strong{font-size:14px;overflow-wrap:anywhere}
.attention-list small{font-size:12px;color:var(--muted);line-height:1.45}
.more-link{display:inline-block;margin-top:12px;font-size:13px;font-weight:650;color:var(--ink)}
.dash-side .section-heading .more-link{margin:0}
.recent-row{display:flex;gap:10px;padding:10px 0;border-top:1px solid var(--border)}
.recent-row:first-of-type{border-top:0}
.recent-row .kind-dot{margin-top:6px;flex-shrink:0}
.recent-row p{margin:0;font-size:13px;line-height:1.5}
.recent-row small{font-size:12px;color:var(--muted)}
.dash-account p{margin:6px 0 0}
/* ---- Team sign-in -------------------------------------------------------------- */
.signin-panel .section-heading{align-items:flex-start}
.signin-panel h2{margin:0}
.invite-link{margin:0 0 16px;padding:14px 16px;border:1px solid var(--accent);border-radius:12px;background:var(--surface);font-size:14px;line-height:1.55}
.invite-link .copy-field{margin-top:10px}
.signin-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:4px 0 16px}
.signin-facts div{padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}
.signin-facts dt{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.signin-facts dd{margin:4px 0 0;font-size:14px;font-weight:600;overflow-wrap:anywhere}
.signin-actions{display:flex;flex-wrap:wrap;gap:10px}
.signin-actions form,.signin-revoke{margin:0}
.signin-revoke{margin-top:10px}
.add-access-toggle{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.add-access-toggle input[type=checkbox]{width:18px;height:18px;margin:2px 0 0;flex-shrink:0;accent-color:var(--pill)}
.add-access-toggle span{display:grid;gap:4px}
.add-access-toggle small{font-weight:400;line-height:1.5}
.owned-title{margin:18px 0 8px}
.owned-list{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:6px}
.owned-list li{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;font-size:14px}
.owned-list span{font-size:12px;color:var(--muted)}
@media (max-width:1100px){.dash-grid{grid-template-columns:1fr}.dash-side{position:static}}
@media (max-width:700px){.signin-facts{grid-template-columns:1fr}.dash-client-stats{padding:0 14px 12px}}
/* ---- Test buttons in lists ------------------------------------------------- */
.row-test{margin:0}
.row-actions-inner .row-test button{padding:6px 12px;font-size:13px;background:var(--card);color:var(--ink);border:1px solid var(--border);border-radius:20px;white-space:nowrap}
.row-actions-inner .row-test button:hover{background:var(--surface);opacity:1}
.row-actions-inner .row-test button:disabled{cursor:progress}
.conn-when{display:block;margin-top:5px;font-size:12px;color:var(--muted);white-space:nowrap}
.inventory-table tr.test-ok td{background:#f3fbf7;transition:background .4s}
.inventory-table tr.test-bad td{background:#fff6f4;transition:background .4s}
[data-theme=dark] .inventory-table tr.test-ok td{background:#16271f}
[data-theme=dark] .inventory-table tr.test-bad td{background:#2c1b18}
.test-all{white-space:nowrap}
.test-all-status{font-size:13px;color:var(--muted);align-self:center}
/* ---- Sign-in pages (login, two-step code, setup) ---------------------------- */
body.auth-page{min-height:100vh;background:var(--canvas)}
.auth-split{display:grid;grid-template-columns:minmax(380px,44%) 1fr;min-height:100vh}
.auth-brand{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:40px 48px;color:#eef0f6;background:
  radial-gradient(600px 420px at 12% 108%,rgba(255,210,45,.20),transparent 60%),
  radial-gradient(520px 380px at 110% -10%,rgba(57,122,184,.22),transparent 60%),
  linear-gradient(160deg,#16191f 0%,#0f1115 100%)}
.auth-brand::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);pointer-events:none}
.auth-brand>*{position:relative}
.auth-logo{display:inline-flex;align-items:center;gap:11px;color:#fff;text-decoration:none;font-size:19px;font-weight:750;letter-spacing:-.03em}
.auth-logo span:not(.brand-mark){font-weight:500;color:#a2a9bd;letter-spacing:.02em;font-size:15px}
.auth-logo .brand-mark{width:28px;height:28px;border-radius:9px;box-shadow:0 0 0 4px rgba(255,210,45,.14)}
.auth-pitch{max-width:470px}
.auth-kicker{margin:0 0 14px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#ffd22d}
.auth-pitch h2{margin:0 0 30px;font-size:clamp(28px,2.6vw,38px);line-height:1.15;letter-spacing:-.035em;color:#fff;font-weight:700}
.auth-points{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.auth-points li{display:flex;gap:14px;align-items:flex-start}
.auth-points li>span:last-child{display:grid;gap:2px;font-size:14px;line-height:1.5;color:#a2a9bd}
.auth-points strong{color:#eef0f6;font-size:15px;font-weight:650}
.auth-point-icon{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border-radius:11px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);color:#ffd22d}
.auth-foot{margin:0;font-size:12.5px;color:#7d8599}
main.auth-main{max-width:none;min-height:0;margin:0;padding:48px 32px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px}
.auth-card{width:100%;max-width:440px;padding:40px;background:var(--card);border:1px solid var(--border);border-radius:22px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 24px 60px -24px rgba(16,24,40,.18)}
.auth-card-head{margin-bottom:26px}
.auth-eyebrow{display:inline-block;margin-bottom:12px;padding:4px 10px;border-radius:30px;background:var(--surface);border:1px solid var(--border);font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.auth-card-head h1{margin:0 0 8px;font-size:32px;line-height:1.1;letter-spacing:-.04em;color:var(--ink)}
.auth-card-head p{margin:0;color:var(--muted);font-size:15px;line-height:1.55}
.auth-form{display:grid;gap:18px;margin:0}
.auth-field{display:block;margin:0;font-size:13px;font-weight:650;color:var(--ink)}
.auth-field>span{display:block;margin-bottom:8px}
.auth-field small{display:block;margin-top:8px;font-size:12.5px;font-weight:400;line-height:1.5;color:var(--muted)}
.auth-field input{margin:0;height:50px;padding:0 15px;font-size:15px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--ink);transition:border-color .15s,box-shadow .15s}
.auth-field input::placeholder{color:var(--muted);opacity:.7}
.auth-field input:hover{border-color:#b9bfcc}
.auth-field input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 4px rgba(32,33,36,.08)}
[data-theme=dark] .auth-field input:focus{box-shadow:0 0 0 4px rgba(238,240,246,.12)}
.auth-field input[readonly]{background:var(--surface);color:var(--muted)}
.auth-field input.code-input{font-family:ui-monospace,SFMono-Regular,monospace;font-size:22px;letter-spacing:.4em;text-align:center}
.auth-submit{width:100%;height:52px;min-height:52px;margin-top:4px;border-radius:14px;font-size:15px;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:10px}
.auth-submit::after{content:"→";font-size:17px;transition:transform .15s}
.auth-submit:hover::after{transform:translateX(3px)}
.auth-submit.busy::after{content:""}
.auth-submit.secondary{background:var(--card);color:var(--ink);border:1px solid var(--border)}
.auth-alert{margin:0 0 20px;padding:12px 14px;border-radius:12px;font-size:14px;line-height:1.5;border:1px solid}
.auth-alert p{margin:0}
.auth-alert.bad{background:#fff0ed;border-color:#efc7bf;color:#8a2f22}
.auth-alert.ok{background:#e9f7f0;border-color:#d4ebde;color:#16603f}
[data-theme=dark] .auth-alert.bad{background:#3a1d19;border-color:#6d342b;color:#ffd9d1}
[data-theme=dark] .auth-alert.ok{background:#15352a;border-color:#23523f;color:#bdeed5}
.caps-hint{margin:-8px 0 0;font-size:12.5px;font-weight:600;color:#a15c07}
.caps-hint::before{content:"⇪ "}
.auth-help{margin-top:26px;padding-top:22px;border-top:1px solid var(--border);display:grid;gap:10px}
.auth-help p{margin:0;font-size:13.5px;line-height:1.55;color:var(--muted)}
.auth-help strong{color:var(--ink);font-weight:600}
.auth-more{margin-top:22px;padding-top:18px;border-top:1px solid var(--border)}
.auth-more summary{cursor:pointer;font-size:13.5px;color:var(--muted);font-weight:600}
.auth-more .auth-form{margin-top:16px}
.auth-trust{display:flex;align-items:center;gap:7px;margin:0;font-size:12.5px;color:var(--muted)}
/* show / hide password (every password field in the portal) */
.pw-field{position:relative;display:block}
.pw-field input{padding-right:48px}
.pw-toggle{position:absolute;top:50%;right:6px;transform:translateY(-50%);display:grid;place-items:center;width:38px;height:38px;min-height:0;padding:0;border:0;border-radius:9px;background:transparent;color:var(--muted);box-shadow:none;cursor:pointer}
.pw-toggle:hover{background:var(--surface);color:var(--ink);opacity:1}
.pw-toggle:focus-visible{outline:2px solid var(--focus);outline-offset:0}
.pw-toggle svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pw-toggle[aria-pressed=true]{color:var(--ink)}
@media (max-width:960px){
  .auth-split{grid-template-columns:1fr}
  .auth-brand{padding:24px 22px;gap:0;flex-direction:row;align-items:center}
  .auth-pitch,.auth-foot{display:none}
  main.auth-main{padding:32px 16px 40px;justify-content:flex-start}
  .auth-card{padding:28px 22px;border-radius:18px}
  .auth-card-head h1{font-size:28px}
}
/* ==== Dashboard + clients redesign (2026-10-01) ============================== */
:root{--ok:#1f9d63;--ok-soft:#e9f7f0;--bad:#d9534a;--bad-soft:#fff0ed;--warn:#d98a0b;--warn-soft:#fff6e5;--idle:#cfd5df}
[data-theme=dark]{--ok:#3fc486;--ok-soft:#15352a;--bad:#ff7b6b;--bad-soft:#3a1d19;--warn:#f0b34a;--warn-soft:#3a2d12;--idle:#3a4150}
/* health bar */
.hbar{display:flex;height:8px;border-radius:99px;overflow:hidden;background:var(--surface);box-shadow:inset 0 0 0 1px var(--border)}
.hbar.thin{height:6px}
.hbar .hseg{display:block;height:100%;width:0;transition:width .5s ease}
.hbar .hseg+.hseg{box-shadow:-1px 0 0 var(--card)}
.hseg.live{background:var(--ok)}.hseg.down{background:var(--bad)}.hseg.backup{background:#8a94a6}.hseg.idle{background:var(--idle)}
/* badges, buttons */
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:99px;font-size:12px;font-weight:650;line-height:1.3;white-space:nowrap}
.badge.bad{background:var(--bad-soft);color:var(--bad)}.badge.warn{background:var(--warn-soft);color:var(--warn)}.badge.ok{background:var(--ok-soft);color:var(--ok)}
.badge.bad::before,.badge.warn::before,.badge.ok::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.ghost-btn{display:inline-flex;align-items:center;height:32px;padding:0 12px;border:1px solid var(--border);border-radius:9px;background:var(--card);color:var(--ink);font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.ghost-btn:hover{background:var(--surface)}
.avatar.sm{width:36px;height:36px;border-radius:11px;font-size:13px;flex-shrink:0}
.more-link.block{display:block;margin-top:14px}
em.bad{font-style:normal;color:var(--bad);font-weight:650}
/* hero */
.dash-hero,.page-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:26px}
.dash-hero h1,.page-hero h1{margin:6px 0 8px;font-size:40px;letter-spacing:-.045em;line-height:1.05}
.dash-hero p,.page-hero p{margin:0;color:var(--muted);font-size:15.5px}
.dash-hero p strong{color:var(--ink)}
.dash-meta{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.role-chip{display:inline-flex;padding:3px 10px;border-radius:99px;background:var(--surface);border:1px solid var(--border);font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.role-chip.admin{background:var(--pill);color:var(--pill-text);border-color:var(--pill)}
.dash-hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.dash-hero-actions .button{min-height:42px;padding:10px 18px}
/* KPI cards */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:26px}
.kpi{display:flex;flex-direction:column;gap:10px;padding:20px 20px 18px;border:1px solid var(--border);border-radius:18px;background:var(--card);text-decoration:none;color:var(--ink);transition:border-color .15s,box-shadow .15s,transform .15s}
.kpi:hover{border-color:#b9bfcc;box-shadow:0 10px 30px -18px rgba(16,24,40,.35);transform:translateY(-1px)}
.kpi-label{font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.kpi-value{font-size:36px;line-height:1;letter-spacing:-.045em;font-weight:750}
.kpi-sub{font-size:13px;color:var(--muted);min-height:18px}
/* content blocks */
.card-block{padding:22px;border:1px solid var(--border);border-radius:18px;background:var(--card)}
.card-block+.card-block{margin-top:20px}
.card-block h2{margin:0;font-size:18px;letter-spacing:-.025em}
.block-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}
.block-head p{margin:4px 0 0;font-size:13px;color:var(--muted)}
.block-head .more-link{margin:2px 0 0;white-space:nowrap}
.count-pill{display:inline-grid;place-items:center;min-width:26px;height:26px;padding:0 8px;border-radius:99px;font-size:13px;font-weight:700}
.count-pill.bad{background:var(--bad-soft);color:var(--bad)}
.dash-side .card-block+.card-block{margin-top:18px}
/* client health list */
.health-list{list-style:none;margin:0;padding:0}
.health-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.2fr) minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px 10px;border-top:1px solid var(--border);border-radius:0}
.health-row:first-child{border-top:0}
.health-row:hover{background:var(--surface);border-radius:12px}
.health-name{display:flex;align-items:center;gap:12px;min-width:0;text-decoration:none;color:var(--ink)}
.health-name>span:last-child{display:grid;min-width:0}
.health-name strong{font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.health-name small{font-size:12.5px;color:var(--muted)}
.health-sites{display:grid;gap:6px;min-width:0}
.health-sites small{font-size:12px;color:var(--muted)}
.health-badges{display:flex;flex-wrap:wrap;gap:6px}
.health-actions{display:flex;gap:6px}
/* team list */
.team-list{list-style:none;margin:0;padding:0}
.team-list li{display:grid;grid-template-columns:auto minmax(0,1.4fr) minmax(0,1fr) auto 64px auto;align-items:center;gap:14px;padding:10px 4px;border-top:1px solid var(--border)}
.team-list li:first-child{border-top:0}
.team-list li.is-off{opacity:.55}
.team-who{display:grid;min-width:0}
.team-who strong{font-size:14px}
.team-who small{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.team-access,.team-seen{font-size:13px;color:var(--muted)}
/* attention + timeline */
.all-clear{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:12px;background:var(--ok-soft)}
.all-clear span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ok);color:#fff;font-weight:700;flex-shrink:0}
.all-clear p{margin:0;font-size:13.5px;line-height:1.5}
.attention-list{margin:0}
.timeline{list-style:none;margin:0;padding:0 0 0 4px;position:relative}
.timeline li{position:relative;padding:0 0 16px 22px}
.timeline li::before{content:"";position:absolute;left:5px;top:14px;bottom:0;width:1px;background:var(--border)}
.timeline li:last-child{padding-bottom:0}.timeline li:last-child::before{display:none}
.timeline .dot{position:absolute;left:0;top:5px;width:11px;height:11px;border-radius:50%;background:var(--card);border:2px solid #8a94a6}
.timeline .kind-credentials .dot{border-color:var(--warn)}.timeline .kind-access .dot{border-color:#6b7cff}.timeline .kind-records .dot{border-color:var(--ok)}
.timeline p{margin:0;font-size:13.5px;line-height:1.45}
.timeline small{font-size:12px;color:var(--muted)}
.account-card p{margin:6px 0}
/* clients page */
.client-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:8px}
.client-toolbar .search-field.grow{flex:1 1 280px}
.client-toolbar input[type=search]{margin:0;height:46px;border-radius:12px;padding:0 14px;font-size:15px}
.filter-seg{border-radius:12px}
.filter-seg span{padding:11px 14px;display:flex;align-items:center;gap:7px}
.filter-seg em{font-style:normal;font-size:11.5px;padding:1px 7px;border-radius:99px;background:var(--surface);color:var(--muted)}
.filter-seg input:checked+span em{background:rgba(255,255,255,.18);color:inherit}
.sort-field select{margin:0;height:46px;border-radius:12px;padding:0 12px;min-width:170px}
.result-count{margin:0 0 16px;font-size:13px;color:var(--muted)}
.client-grid-v2{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.client-tile{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:20px;background:var(--card);overflow:hidden;transition:border-color .16s,box-shadow .16s,transform .16s}
.client-tile:hover{border-color:#b9bfcc;box-shadow:0 14px 34px -20px rgba(16,24,40,.35);transform:translateY(-2px)}
.client-tile[hidden]{display:none}
.client-tile.has-issues{box-shadow:inset 3px 0 0 var(--bad)}
.client-tile.has-issues:hover{box-shadow:inset 3px 0 0 var(--bad),0 14px 34px -20px rgba(16,24,40,.35)}
.tile-main{display:flex;flex-direction:column;gap:16px;padding:20px 20px 16px;text-decoration:none;color:var(--ink);flex:1}
.tile-head{display:flex;align-items:center;gap:12px}
.tile-title{min-width:0;flex:1}
.tile-title h2{margin:0;font-size:17px;letter-spacing:-.03em;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile-title span{display:block;font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0;padding:12px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.tile-stats div{display:grid;gap:2px}
.tile-stats dt{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tile-stats dd{margin:0;font-size:22px;font-weight:750;letter-spacing:-.04em}
.tile-health{display:grid;gap:9px}
.tile-health-text{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13px;font-weight:600;flex-wrap:wrap}
.tile-badges{display:flex;gap:6px;flex-wrap:wrap}
.tile-actions{display:flex;border-top:1px solid var(--border)}
.tile-actions a{flex:1;text-align:center;padding:11px 8px;font-size:13px;font-weight:650;text-decoration:none;color:var(--ink)}
.tile-actions a:hover{background:var(--surface)}
.tile-actions a+a{border-left:1px solid var(--border)}
.tile-actions a.add{color:#163956}
[data-theme=dark] .tile-actions a.add{color:var(--accent)}
.empty-state{padding:40px 24px;text-align:center;border:1px dashed var(--border);border-radius:18px;color:var(--muted)}
.empty-state h3{margin:0 0 6px;color:var(--ink)}
.empty-state p{margin:0}
.new-client{margin-top:28px}
@media (max-width:1200px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.health-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}.health-badges{display:none}}
@media (max-width:760px){.dash-hero h1,.page-hero h1{font-size:30px}.kpis{grid-template-columns:1fr 1fr;gap:10px}.kpi{padding:14px}.kpi-value{font-size:28px}.health-row{grid-template-columns:1fr auto}.health-sites{grid-column:1/-1;order:3}.team-list li{grid-template-columns:auto 1fr auto}.team-access,.team-seen,.team-login{display:none}.filter-seg{width:100%}.filter-seg label{flex:1}.sort-field{flex:1}.sort-field select{width:100%}}
.team-list li{grid-template-columns:36px minmax(0,1.5fr) minmax(0,1fr) 84px 72px 84px}
.team-list li>.ghost-btn{justify-self:end}
.attention-more{margin:12px 0 0;font-size:12.5px;color:var(--muted);line-height:1.6}
.attention-more a{color:var(--ink);font-weight:600}
@media (max-width:760px){.team-list li{grid-template-columns:36px minmax(0,1fr) auto}}
.health-row{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) minmax(0,.95fr) auto}
@media (max-width:1200px){.health-row{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) auto}}
@media (max-width:760px){.health-row{grid-template-columns:1fr auto}}
@media (max-width:760px){.health-name strong{white-space:normal;overflow:visible}.health-actions .ghost-btn{padding:0 10px}}
/* ---- Single client page -------------------------------------------------------- */
.avatar.xl{width:72px;height:72px;border-radius:22px;font-size:24px;flex-shrink:0}
.avatar.xs{width:30px;height:30px;border-radius:50%;font-size:11px;border:2px solid var(--card);flex-shrink:0}
.client-hero{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:26px 28px;margin-bottom:18px;border:1px solid var(--border);border-radius:22px;background:linear-gradient(135deg,var(--card) 55%,var(--surface))}
.client-hero-id{display:flex;gap:20px;align-items:center;min-width:0}
.client-hero-text{min-width:0}
.client-hero-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px}
.client-hero h1{margin:0;font-size:36px;letter-spacing:-.045em;line-height:1.1}
.client-hero-sub{margin:6px 0 0;color:var(--muted);font-size:15px}
.client-contacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.client-contacts a{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border:1px solid var(--border);border-radius:99px;background:var(--card);font-size:13px;color:var(--ink);text-decoration:none}
.client-contacts a:hover{background:var(--surface)}
.client-hero-side{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:16px}
.client-hero-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.client-hero-actions .button{min-height:42px;padding:10px 18px}
.client-people{display:flex;align-items:center;gap:10px}
.client-people a{color:var(--muted);font-weight:600}
.people-stack{display:flex}
.people-stack .avatar+.avatar{margin-left:-8px}
.client-alert{display:flex;gap:12px;align-items:center;margin-bottom:18px;padding:12px 16px;border:1px solid #efc7bf;border-radius:14px;background:var(--bad-soft)}
[data-theme=dark] .client-alert{border-color:#6d342b}
.client-alert-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--bad);color:#fff;font-weight:800;font-size:13px;flex-shrink:0}
.client-alert p{margin:0;font-size:14px;color:var(--ink)}
.client-alert a{color:var(--bad);font-weight:650}
.client-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:22px}
.client-tab{position:relative;display:grid;gap:4px;padding:16px 18px;border:1px solid var(--border);border-radius:16px;background:var(--card);color:var(--ink);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.client-tab:hover{border-color:#b9bfcc}
.client-tab.active{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.client-tab-label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.client-tab strong{font-size:28px;line-height:1.05;letter-spacing:-.04em}
.client-tab-sub{font-size:12.5px;color:var(--muted)}
.client-tab-sub.bad{color:var(--bad);font-weight:600}
.client-body.with-aside{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start}
.client-main{min-width:0}
.client-aside{position:sticky;top:24px;display:grid;gap:16px}
.client-aside .card-block+.card-block{margin-top:0}
.notes-text{margin:0;font-size:14px;line-height:1.6;color:var(--ink);white-space:pre-line}
.host-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.host-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--border);border-radius:99px;background:var(--card);color:var(--ink);font-size:13.5px;font-weight:600;text-decoration:none}
.host-chip:hover{background:var(--surface)}
.host-chip.active{background:var(--pill);color:var(--pill-text);border-color:var(--pill)}
.host-chip em{font-style:normal;font-size:11.5px;padding:1px 7px;border-radius:99px;background:var(--surface);color:var(--muted)}
.host-chip.active em{background:rgba(255,255,255,.18);color:inherit}
.conn-dot{width:8px;height:8px;border-radius:50%;background:var(--idle)}
.conn-dot.live{background:var(--ok)}.conn-dot.down{background:var(--bad)}
@media (max-width:1200px){.client-body.with-aside{grid-template-columns:1fr}.client-aside{position:static;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}}
@media (max-width:900px){.client-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.client-hero-side{align-items:flex-start}.client-hero-actions{justify-content:flex-start}}
@media (max-width:600px){.client-hero{padding:20px}.client-hero-id{align-items:flex-start}.avatar.xl{width:56px;height:56px;font-size:19px;border-radius:17px}.client-hero h1{font-size:28px}.client-tab{padding:12px 14px}.client-tab strong{font-size:22px}}
.notes-strip{display:flex;align-items:center;gap:16px;margin:-6px 0 20px;padding:12px 16px;border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:12px;background:var(--card)}
.notes-strip-label{flex-shrink:0;font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.notes-strip p{flex:1;margin:0;font-size:13.5px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.notes-strip .more-link{margin:0;white-space:nowrap;flex-shrink:0}
@media (max-width:700px){.notes-strip{flex-wrap:wrap}.notes-strip p{flex-basis:100%}}

/* add access: one page for SSH, FTP and API */
.connect-hero{margin:0 0 26px}
.connect-hero h1{margin:4px 0 6px}
.connect-hero p{max-width:720px;margin:0}
.connect-form{counter-reset:cstep}
.connect-form [hidden]{display:none!important}
.connect-form .connect-section:not([hidden])>legend .step,.connect-form .notes-section>summary .step{display:inline-grid;counter-increment:cstep}
.connect-form .connect-section:not([hidden])>legend .step::before,.connect-form .notes-section>summary .step::before{content:counter(cstep)}
.connect-main{min-width:0}
.kind-section{padding-bottom:22px}
.kind-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.connect-section label.kind-card{position:relative;display:flex;flex-direction:column;gap:12px;align-items:flex-start;margin:0;padding:18px;border:1px solid var(--border);border-radius:16px;background:var(--card);cursor:pointer;text-transform:none;letter-spacing:0;font-size:14px;color:var(--ink);transition:border-color .15s,box-shadow .15s,transform .15s}
.connect-section label.kind-card:hover{border-color:#a7afbe;transform:translateY(-1px);box-shadow:0 8px 22px #0000000a}
.kind-card input{position:absolute;opacity:0;pointer-events:none}
.kind-glyph{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;border-radius:13px;background:var(--surface);border:1px solid var(--border);color:var(--ink);font:700 15px/1 ui-monospace,SFMono-Regular,monospace;transition:background .15s,border-color .15s}
.kind-text{display:grid;gap:4px;min-width:0}
.kind-text strong{font-size:15px;letter-spacing:-.01em}
.kind-text small{margin:0;color:var(--muted);font-size:13px;line-height:1.45}
.kind-tick{position:absolute;top:16px;right:16px;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--border);background:var(--card)}
.connect-section label.kind-card:has(input:checked){border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);background:var(--surface)}
.kind-card:has(input:checked) .kind-glyph{background:var(--accent);border-color:var(--accent);color:#1d1d1f}
.kind-card:has(input:checked) .kind-tick{border-color:var(--ink);background:var(--ink)}
.kind-card:has(input:checked) .kind-tick::after{content:'';position:absolute;left:6px;top:2.5px;width:5px;height:9px;border:solid var(--card);border-width:0 2px 2px 0;transform:rotate(45deg)}
.kind-card:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.server-fields{grid-template-columns:minmax(0,1fr) 150px}
.connect-hint.where{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin:-4px 0 16px;padding:10px 14px;border-radius:10px;background:var(--surface);border:1px solid var(--border);color:var(--ink)}
.connect-hint.where span{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.notes-section{display:block;padding:18px 24px}
.notes-section>summary{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:16px;font-weight:700;letter-spacing:-.02em;list-style:none}
.notes-section>summary::-webkit-details-marker{display:none}
.notes-section>summary::after{content:'+';margin-left:auto;font-size:20px;font-weight:400;color:var(--muted)}
.notes-section[open]>summary::after{content:'–'}
.notes-section[open]>summary{margin-bottom:16px}
.notes-section label{margin-bottom:6px}
.connect-actions{position:sticky;bottom:0;z-index:5;display:flex;align-items:center;gap:12px;margin:18px 0 0;padding:14px 16px;border:1px solid var(--border);border-radius:16px;background:var(--card);box-shadow:0 -8px 24px #0000000d}
.connect-summary{margin:0 auto 0 4px;font-size:14px;color:var(--muted);min-width:0}
.connect-summary strong{color:var(--ink)}
.connect-actions button{min-width:170px}
.connect-guide .eyebrow{display:block;margin:0 0 10px}
.connect-guide .connect-steps{margin:0 0 18px}
.need-list{margin:0 0 22px;padding:0;list-style:none;display:grid;gap:8px;font-size:14px;line-height:1.5}
.need-list li{position:relative;padding-left:24px}
.need-list li::before{content:'';position:absolute;left:0;top:4px;width:14px;height:14px;border-radius:4px;border:1.5px solid var(--border)}
.need-list em{font-style:normal;color:var(--muted)}
.connect-note{margin:0 0 10px;font-size:13px;line-height:1.55;color:var(--muted)}
.connect-note:last-child{margin:0;padding-top:14px;border-top:1px solid var(--border)}
.connect-note .lock{margin-right:6px}
@media (max-width:1000px){.connect-layout{grid-template-columns:1fr}.connect-aside{position:static}}
@media (max-width:640px){.connect-section{grid-template-columns:1fr;padding:18px 16px 4px}.connect-section .field-group,.server-fields{grid-template-columns:1fr}.auth-choices{grid-template-columns:1fr}.kind-picker{grid-template-columns:1fr}.connect-section label.kind-card{flex-direction:row;padding:14px 44px 14px 14px}.connect-actions{padding:10px;gap:10px;border-radius:14px}.connect-summary{display:none}.connect-actions .button,.connect-actions button{flex:1;min-width:0}}

/* add access: SSH key pair + Google refresh token */
@media (max-width:1300px){.kind-picker{grid-template-columns:repeat(2,minmax(0,1fr))}}
.auth-choices.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.key-pair-facts{margin:0 0 18px;padding:0;list-style:none;display:grid;gap:10px}
.key-pair-facts li{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);font-size:13px;line-height:1.5;color:var(--muted)}
.key-pair-facts strong{color:var(--ink)}
.key-ico{flex-shrink:0;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font:700 12px/1 ui-monospace,monospace;background:var(--card);border:1px solid var(--border);color:var(--ink)}
.key-ico.pub::before{content:'pub'}.key-ico.priv::before{content:'🔒';font-size:12px}
.key-ico.pub{width:34px;font-size:10px}
.key-load{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 0 16px}
.key-load small{flex:1;min-width:220px;margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.connect-section label.file-pick{position:relative;display:inline-flex;align-items:center;margin:0;padding:9px 14px;border:1px dashed var(--muted);border-radius:10px;background:var(--surface);cursor:pointer;font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink)}
.connect-section label.file-pick:hover{border-style:solid}
.connect-section label.file-pick input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;margin:0}
.connect-section label.file-pick:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.token-guide{margin:2px 0 18px;padding:18px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.token-guide-title{margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.guide-way{margin:0 0 10px;border:1px solid var(--border);border-radius:12px;background:var(--card)}
.guide-way>summary{display:flex;gap:12px;align-items:center;padding:12px 14px;cursor:pointer;list-style:none}
.guide-way>summary::-webkit-details-marker{display:none}
.guide-way>summary::after{content:'+';margin-left:auto;color:var(--muted);font-size:18px}
.guide-way[open]>summary::after{content:'–'}
.guide-way>summary>span:last-of-type{display:grid;gap:2px}
.guide-way>summary strong{font-size:14px}
.guide-way>summary small{margin:0;font-size:12px;color:var(--muted)}
.way-tag{display:grid;place-items:center;flex-shrink:0;width:26px;height:26px;border-radius:50%;background:var(--accent);color:#1d1d1f;font-weight:700;font-size:13px}
.guide-steps{margin:0;padding:4px 18px 14px 40px;display:grid;gap:10px;font-size:14px;line-height:1.55}
.guide-steps .copy-field{margin:8px 0 4px}
.guide-steps code,.guide-tips code,.replace-token code{font-size:12px;background:var(--surface);border:1px solid var(--border);border-radius:5px;padding:1px 5px;overflow-wrap:anywhere}
.guide-steps .copy-field code{background:none;border:0;padding:0}
.guide-tips{margin:14px 0 0;padding:0 0 0 18px;display:grid;gap:6px;font-size:13px;line-height:1.5;color:var(--muted)}
.guide-tips strong{color:var(--ink)}
.private-key-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 4px;padding:14px 16px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.private-key-row>div{display:grid;gap:2px;min-width:0;flex:1}
.private-key-row form{margin:0}
.replace-token{margin-top:16px;border-top:1px solid var(--border);padding-top:14px}
.replace-token>summary{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;cursor:pointer}
.replace-token-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:14px 0 8px}
.replace-token-form label{flex:1;min-width:240px;margin:0;font-size:13px;font-weight:600}
.replace-token-form input{width:100%;margin-top:6px}
@media (max-width:640px){.auth-choices.two{grid-template-columns:1fr}.token-guide{padding:12px}.guide-steps{padding:4px 12px 12px 30px}}
@media (max-width:640px){.kind-picker{grid-template-columns:1fr}}

/* Connect with Google */
.auth-choice.unavailable{display:flex;padding:14px;border:1px dashed var(--border);border-radius:12px;opacity:.7;font-size:14px}
.auth-choice.unavailable span{display:grid;gap:4px}.auth-choice.unavailable small{color:var(--muted)}
.google-flow{margin:0 0 18px;padding:0;list-style:none;display:grid;gap:4px;counter-reset:none}
.google-flow li{display:flex;gap:14px;align-items:flex-start;padding:12px 4px;border-bottom:1px solid var(--border)}
.google-flow li:last-child{border-bottom:0}
.google-flow strong{display:block;font-size:14px}
.google-flow small{display:block;margin-top:2px;color:var(--muted);font-size:13px;line-height:1.5}
.flow-dot{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--border);font-weight:700;font-size:13px;color:var(--ink);background:var(--card)}
.google-flow li:first-child .flow-dot{background:var(--accent);border-color:var(--accent);color:#1d1d1f}
.google-btn{display:inline-flex;align-items:center;gap:10px}
.g-mark{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#fff;color:#4285f4;font:700 14px/1 Arial,sans-serif}
body.oauth-continue{min-height:100vh;display:grid;place-items:center;margin:0;background:var(--surface,#f7f8fa)}
.oauth-card{max-width:420px;margin:24px 16px;padding:32px;border:1px solid var(--border,#e3e6ec);border-radius:20px;background:var(--card,#fff);text-align:center}
.oauth-card h1{font-size:22px;letter-spacing:-.02em;margin:16px 0 6px}
.oauth-card p{margin:0 0 18px;color:var(--muted)}
.oauth-spinner{display:inline-block;width:28px;height:28px;border-radius:50%;border:3px solid var(--border,#e3e6ec);border-top-color:var(--ink,#111);animation:oauth-spin .8s linear infinite}
@keyframes oauth-spin{to{transform:rotate(360deg)}}
/* Connect with Google — shared app (paste the address) */
.paste-flow{display:grid;gap:16px;max-width:820px}
.paste-step{display:flex;gap:18px;align-items:flex-start}
.paste-step h2{margin:2px 0 8px;font-size:18px}
.paste-step p{margin:0 0 14px;font-size:14px;line-height:1.6}
.paste-step code{font-size:12px;background:var(--surface);border:1px solid var(--border);border-radius:5px;padding:1px 5px;overflow-wrap:anywhere}
.paste-step>div{flex:1;min-width:0}
.paste-num{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;border-radius:50%;background:var(--accent);color:#1d1d1f;font-weight:700}
.paste-form{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 10px}
.paste-form label{flex:1;min-width:240px;margin:0}
.paste-form input{width:100%;height:46px;margin:0;font-family:ui-monospace,SFMono-Regular,monospace;font-size:13px}
@media (max-width:640px){.paste-step{flex-direction:column;gap:10px}}

/* =====================================================================
   Breathing room (2026-10-05): one spacing + type scale for every page.
   Content is centred at a readable width on wide screens; panels, forms
   and lists get more air; form labels read as sentences, not shouting.
   ===================================================================== */
@media (min-width:761px){
  .workspace main{max-width:none;padding:44px clamp(40px,calc((100vw - 248px - 1280px)/2),420px) 96px}
}
@media (min-width:761px) and (max-width:1150px){
  .workspace main{padding:36px 32px 80px}
}
body{line-height:1.55}
h1{font-size:34px;line-height:1.15;letter-spacing:-.04em;margin:6px 0 10px}
.record-heading h1{font-size:32px}
h2{font-size:19px;line-height:1.3}
.eyebrow{letter-spacing:.1em}
.breadcrumbs{margin-bottom:22px;font-size:13px}
.breadcrumbs a{font-size:13px}
.heading{margin-bottom:34px}
.heading p,.page-hero p{max-width:720px;line-height:1.6}
.muted{line-height:1.6}

/* Panels and grids */
.detail-panel{padding:28px 30px;border-radius:18px}
.detail-panel h2{margin:0 0 18px}
.detail-grid{gap:28px}
.detail-aside{gap:24px}
.connection-panel,.status-panel,.danger-panel,.hosting-websites,.add-record-panel{margin-top:28px}
.property-list>div{grid-template-columns:170px 1fr;padding:15px 0}
.section-heading{margin-bottom:20px}
.panel{padding:28px 30px;border-radius:18px;margin:28px 0}
.notice,.error{border-radius:12px;padding:14px 18px;margin-bottom:24px}

/* Forms: sentence-case labels, roomier fields, consistent rhythm */
label{font-size:13px;font-weight:600;margin-bottom:20px;color:var(--ink)}
input,textarea,select{border-radius:10px;padding:11px 14px;margin-top:8px;border-color:var(--border);background:var(--card);color:var(--ink)}
input:not([type=radio]):not([type=checkbox]),select{min-height:46px}
input:focus,textarea:focus,select:focus{outline:2px solid var(--focus);outline-offset:1px;border-color:transparent}
small{line-height:1.5}
.form-grid{column-gap:28px;row-gap:4px}

/* Lists and tables */
.inventory-toolbar{padding:20px 22px;gap:12px}
.inventory-table td{padding:18px 22px}
.inventory-table th{padding:14px 22px}
.list-footer{padding:16px 22px}

/* ---- Add access: one calm column ---- */
.connect-layout{display:block;max-width:880px}
.connect-hero{margin-bottom:30px}
.connect-hero p{max-width:640px}
.connect-section{padding:26px 28px 10px;margin-bottom:18px;border-radius:18px;gap:0 24px}
.connect-section legend{font-size:16px;margin-bottom:22px}
.connect-section label,.connect-section .field-label{font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink);margin-bottom:20px}
.connect-section .field-label{margin-bottom:10px}
.connect-section input:not([type=radio]),.connect-section select{height:46px;margin-top:8px;border-radius:10px;padding:0 14px}
.connect-section textarea{margin-top:8px;border-radius:10px;padding:12px 14px}
.connect-section small{margin-top:7px;font-size:12.5px;color:var(--muted)}
.connect-section .optional{font-size:12px}
.kind-section{padding-bottom:26px}
.kind-picker{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.connect-section label.kind-card{flex-direction:column;gap:10px;padding:18px 16px;margin:0;border-radius:14px;min-height:0}
.kind-glyph{width:40px;height:40px;border-radius:12px;font-size:14px}
.kind-text strong{font-size:14.5px;font-weight:650}
.kind-text small{font-size:12.5px;line-height:1.45;margin:0}
.kind-tick{top:14px;right:14px;width:18px;height:18px}
.kind-card:has(input:checked) .kind-tick::after{left:5px;top:2px;width:4px;height:8px}
.auth-choices{gap:12px;margin-bottom:22px}
.connect-section label.auth-choice{padding:16px;border-radius:12px;margin:0}
.auth-choice strong{font-size:14px}
.auth-choice small{font-size:12.5px}
.install-now{padding:18px 18px 4px;border-radius:14px;margin-bottom:22px}
.connect-hint{font-size:13px;line-height:1.6}
.connect-seg{margin-bottom:22px}
.connect-actions{position:static;margin:26px 0 0;padding:0;border:0;background:none;box-shadow:none;gap:14px}
.connect-actions button{min-width:180px;min-height:46px}
.connect-actions .button{min-height:46px}
.connect-layout .data-caption{margin-top:18px}
.google-flow li{padding:14px 4px}
.token-guide{padding:20px 22px}
.notes-section{padding:20px 28px}
@media (max-width:1100px){.kind-picker{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .kind-picker{grid-template-columns:1fr}
  .connect-section label.kind-card{flex-direction:row;align-items:center;padding:14px 44px 14px 14px}
  .connect-section{padding:20px 18px 6px}
  .connect-actions{flex-wrap:wrap}
  .connect-actions button,.connect-actions .button{flex:1}
}
/* Lists: room for the action buttons on one line, client names unbroken */
.inventory-table th:first-child{width:30%}
.inventory-table th:last-child{width:372px}
.row-actions-inner{gap:6px}
@media (max-width:1250px){.inventory-table th:last-child{width:300px}}
/* Activity: who did it stays on one line */
.activity-table th.who,.activity-table td.who{width:230px}
.activity-table td.who{overflow-wrap:anywhere}
.activity-table th.when,.activity-table td.when{width:130px;white-space:nowrap}
.activity-table td{padding-top:16px;padding-bottom:16px}
/* Client page: let the stacked blocks breathe */
.client-hero{margin-bottom:22px}
.client-alert{margin-bottom:22px}
.client-tabs{margin-bottom:22px;gap:14px}
.notes-strip{margin-bottom:26px}
.host-chips{margin-bottom:22px}
/* Dashboard: a little more air between cards */
@media (min-width:761px){.kpis{gap:18px;margin-bottom:28px}.dash-hero{margin-bottom:30px}.dash-grid{gap:28px}}
.activity-table th.via,.activity-table td.via{width:90px}

/* ---- Use the width of large screens (2026-10-05) ---- */
@media (min-width:761px){
  .workspace main{padding:44px clamp(40px,calc((100vw - 248px - 1560px)/2),400px) 96px}
}
@media (min-width:761px) and (max-width:1150px){.workspace main{padding:36px 32px 80px}}
.connect-layout{max-width:none}
.connect-hero p{max-width:760px}

/* Bigger, calmer cards and fields on the Add access form */
.connect-section{padding:30px 32px 12px}
.connect-section legend{font-size:17px;margin-bottom:24px}
.connect-section label,.connect-section .field-label{font-size:14px}
.connect-section input:not([type=radio]),.connect-section select{height:50px;font-size:15px}
.connect-section textarea{font-size:14px}
.connect-section small{font-size:13px}
.kind-picker{gap:16px}
.connect-section label.kind-card{padding:24px 22px;gap:14px;border-radius:16px}
.kind-glyph{width:48px;height:48px;border-radius:14px;font-size:16px}
.kind-text{gap:6px}
.kind-text strong{font-size:16px}
.kind-text small{font-size:13.5px}
.kind-tick{top:18px;right:18px;width:20px;height:20px}
.kind-card:has(input:checked) .kind-tick::after{left:6px;top:2.5px;width:5px;height:9px}
.connect-section label.auth-choice{padding:18px 20px}
.auth-choice strong{font-size:15px}
.auth-choice small{font-size:13px}
/* Hostname, port and username on one row when there is room */
@media (min-width:1200px){
  .connect-section .server-fields{grid-template-columns:minmax(0,2fr) 170px minmax(0,1.6fr)}
  .connect-section .server-fields label.full{grid-column:auto}
}

@media (min-width:761px) and (max-width:1199px){.connect-section .server-fields{grid-template-columns:minmax(0,1fr) 170px}}

/* ---- Clients page alignment (2026-10-07) ---- */
.page-hero{align-items:center}
.page-hero .button{flex-shrink:0}
/* Search, filter and sort share one height and line up */
.client-toolbar{align-items:stretch;gap:12px;margin-bottom:14px}
.client-toolbar label{margin:0}
.client-toolbar .search-field,.client-toolbar .sort-field{display:flex}
.client-toolbar input[type=search],.client-toolbar select{margin:0;height:48px;min-height:48px;border-radius:12px}
.client-toolbar .sort-field select{min-width:180px}
.filter-seg{height:48px;align-items:stretch}
.filter-seg label{display:flex}
.filter-seg span{height:100%;padding:0 16px}
.result-count{margin:4px 0 18px}
/* Attention marker: a straight bar that does not touch the rounded corners */
.client-tile{position:relative}
.client-tile.has-issues,.client-tile.has-issues:hover{box-shadow:none}
.client-tile.has-issues:hover{box-shadow:0 14px 34px -20px rgba(16,24,40,.35)}
.client-tile.has-issues::before{content:'';position:absolute;left:0;top:22px;width:4px;height:44px;border-radius:0 4px 4px 0;background:var(--bad)}
/* Tile rhythm */
.client-grid-v2{gap:20px}
.tile-main{padding:22px 22px 18px;gap:18px}
.tile-stats{padding:14px 0}
.tile-health-text{min-height:26px}
.badge.neutral{background:var(--surface);color:var(--muted);border:1px solid var(--border)}
.tile-actions a{padding:13px 8px}
@media (max-width:760px){.client-toolbar{flex-direction:column}.filter-seg{width:100%}.filter-seg label{flex:1}.filter-seg span{justify-content:center;padding:0 8px}}
.dash-hero{align-items:center}
/* Connect with Google: open here, or copy the link for another Chrome profile */
.signin-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.signin-actions .copy-link{min-height:42px;padding:0 18px}
.signin-tip{margin:14px 0 0;padding:12px 14px;border-radius:12px;background:var(--surface);border:1px solid var(--border);font-size:13px;line-height:1.6;color:var(--muted)}
.signin-tip strong{color:var(--ink);font-weight:600}
/* Two steps side by side when there is room */
.paste-flow{max-width:none}
@media (min-width:1300px){
  .paste-flow{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:20px}
  .paste-flow>.data-caption{grid-column:1/-1}
}

/* ---- Notes & details on a record (2026-10-14) ---- */
.notes-panel{margin-top:28px}
.notes-view{display:grid;gap:18px}
.notes-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14.5px;line-height:1.65;padding:16px 18px;border-radius:12px;background:var(--surface);border:1px solid var(--border)}
.notes-details{margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.notes-details>div{display:grid;gap:6px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;min-width:0}
.notes-details dt{font-size:12px;font-weight:600;color:var(--muted)}
.notes-details dd{margin:0;display:flex;align-items:center;gap:8px;min-width:0}
.notes-details code{flex:1;min-width:0;font-size:13px;overflow-wrap:anywhere}
.notes-details form{margin:0}
.secret-chip{font-size:12px;font-weight:600;padding:3px 9px;border-radius:99px;background:var(--surface);border:1px solid var(--border);color:var(--muted)}
button.mini,.button.mini{min-height:30px;padding:0 12px;font-size:12.5px;border-radius:99px}
.notes-empty{margin:0}
.notes-edit{margin-top:18px;border-top:1px solid var(--border);padding-top:16px}
.notes-edit>summary{cursor:pointer;font-weight:600;margin:0}
.notes-edit[open]>summary{margin-bottom:16px}
.notes-form label.notes-label{margin-bottom:18px}
.notes-form textarea{min-height:120px;line-height:1.55}
.notes-rows{display:grid;gap:8px}
.notes-rows-head,.notes-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr) 64px;gap:10px;align-items:center}
.notes-rows-head span{font-size:12px;font-weight:600;color:var(--muted)}
.notes-rows-head span:last-child{text-align:center}
.notes-row input:not([type=checkbox]){margin:0;min-height:44px}
.notes-row label.notes-secret{margin:0;display:flex;justify-content:center}
.notes-row input[type=checkbox]{width:18px;height:18px;margin:0;accent-color:var(--pill)}
.notes-add{margin:10px 0 18px}
.notes-secrets{display:grid;gap:8px;margin:0 0 18px;padding:14px 16px;border-radius:12px;background:var(--surface);border:1px solid var(--border)}
.notes-secrets label.notes-remove{display:flex;gap:10px;align-items:flex-start;margin:0;font-weight:400;font-size:13px}
.notes-secrets input{width:16px;height:16px;margin:2px 0 0;flex-shrink:0}
.notes-hint{margin:0 0 16px}
.notes-actions{display:flex;gap:10px}
@media (max-width:640px){.notes-rows-head{display:none}.notes-row{grid-template-columns:1fr 44px}.notes-row input[name$="[value]"]{grid-column:1}.notes-row label.notes-secret{grid-row:1/span 2;grid-column:2}}
.notes-text{max-height:520px;overflow:auto}
.notes-form textarea{resize:vertical;min-height:180px}

/* Sign-in: keep me signed in */
.auth-form label.auth-remember{display:flex;gap:12px;align-items:flex-start;margin:2px 0 0;cursor:pointer;font-weight:400}
.auth-remember input{flex-shrink:0;width:18px;height:18px;margin:2px 0 0;padding:0;accent-color:var(--pill);cursor:pointer}
.auth-remember span{display:grid;gap:2px}
.auth-remember strong{font-size:14px;font-weight:650;color:var(--ink)}
.auth-remember small{font-size:12.5px;line-height:1.45;color:var(--muted)}

/* ---- Logins (2026-10-24) ---- */
.client-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1250px){.client-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.client-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kind-picker{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1300px){.kind-picker{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.kind-picker{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.kind-picker{grid-template-columns:1fr}}
.copy-line{display:flex;align-items:center;gap:10px;min-width:0}
.copy-line code{min-width:0;overflow-wrap:anywhere}
.site-logins{margin-top:28px}
.site-login-list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.site-login-list li{display:flex;gap:14px;align-items:baseline;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--border)}
.site-login-list li:last-child{border-bottom:0}
.site-login-list a{font-weight:650;text-decoration:none}
.site-login-list a:hover{text-decoration:underline}
.site-login-list span{font-size:13px;text-align:right}
