/* Focused plugin page with a scoped Codex-inspired blue and neutral palette. */
.page-usage{--paper:#f6f8fc;--ink:#141a25;--muted:#526176;--rule:#d7dfe9;--accent:#245fc7;--on-accent:#fff;--panel:#fff;--hover:#edf2f9;--focus:#245fc7;--usage-dark:#0b0d10;--usage-warm:#f6f8fc;--usage-blue:#8ab6ff}
.usage-hero{background:var(--usage-dark);color:var(--usage-warm);display:grid;grid-template-columns:1.18fr 1fr;gap:64px;align-items:center;padding:66px max(32px,calc((100% - 1200px)/2)) 72px}
.usage-hero-copy .eyebrow{color:var(--usage-blue);margin-bottom:24px}
.usage-hero h1{font-size:clamp(46px,4.7vw,66px);line-height:1.1;max-width:650px}
.usage-hero h1 span{color:var(--usage-blue)}
.usage-lead{font-size:21px;line-height:1.5;max-width:460px;margin:24px 0 13px}
.usage-description{font-size:16px;line-height:1.65;max-width:450px;color:#adb7c5}
.usage-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 25px;margin-top:28px}
.usage-hero .button,.usage-next .button{background:#245fc7;border-color:#245fc7;color:#fff}
.usage-hero .text-link,.usage-next .text-link{color:var(--usage-warm);text-decoration-color:#627ca6;min-height:44px;display:inline-flex;align-items:center}
.usage-release{color:#adb7c5;font-size:12px;line-height:1.65;margin-top:22px}
.usage-hardware-photo{margin:0;align-self:center;background:#151b25;border-radius:6px;overflow:hidden;color:var(--usage-warm)}
.usage-photo-link{display:block;line-height:0}
.usage-hardware-photo img{width:100%;height:auto;aspect-ratio:4/3;display:block;object-fit:cover;object-position:center 47%}
.usage-hardware-photo figcaption{padding:20px 24px;margin:0;color:#adb7c5;font-size:12px;line-height:1.6}
.usage-hardware-photo figcaption a{color:var(--usage-warm);text-underline-offset:3px}
.usage-photo-credit{display:block;color:#8ab6ff;text-transform:uppercase;font-size:10px;letter-spacing:.09em;margin-bottom:9px}
.usage-photo-pair{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.usage-photo-pair figure{margin:0;min-width:0}
.usage-photo-pair img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center 47%;border-radius:4px}
.usage-photo-pair figcaption{padding-top:20px}
.usage-photo-pair h3{font-size:23px;font-weight:500;line-height:1.3}
.usage-photo-pair p{font-size:15px;color:var(--muted);line-height:1.7;margin-top:9px;max-width:430px}
.usage-chapters{display:flex;gap:12px 30px;flex-wrap:wrap;padding:20px max(32px,calc((100% - 1200px)/2));border-bottom:1px solid var(--rule);background:var(--panel)}
.usage-chapters a{font-size:14px;display:inline-flex;align-items:center;min-height:36px;text-decoration:none}
.usage-chapters a:hover{color:var(--accent);text-decoration:underline;text-underline-offset:5px}
.usage-section{max-width:1200px;width:calc(100% - 64px);margin:0 auto;padding:76px 0;border-bottom:1px solid var(--rule);scroll-margin-top:22px}
.usage-section h2{font-size:clamp(32px,3.5vw,44px);line-height:1.16}
.usage-section .eyebrow{color:var(--accent);margin-bottom:17px}
.usage-intro{font-size:20px;line-height:1.5;max-width:450px;margin-top:22px}
.usage-overview{display:grid;grid-template-columns:.8fr 1.4fr;gap:44px 65px;align-items:start}
.usage-workflow ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.usage-workflow li{padding-top:14px;border-top:2px solid var(--accent);min-width:0}
.usage-step-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.usage-workflow h3{font-size:20px;line-height:1.3;margin:18px 0 12px}
.usage-workflow li p{font-size:15px;line-height:1.6;color:var(--muted)}
.usage-small{font-size:13px;line-height:1.65;color:var(--muted)}
.usage-workflow>.usage-small{margin-top:24px}
.usage-distinction{grid-column:1/-1;display:grid;grid-template-columns:.8fr 1.4fr;gap:65px;border-top:1px solid var(--rule);padding-top:24px}
.usage-distinction h3{font-size:17px;font-weight:500;line-height:1.5}
.usage-distinction p{font-size:15px;color:var(--muted);line-height:1.7}
.usage-distinction a{color:var(--ink)}
.usage-section-heading{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:32px}
.usage-section-heading>p{font-size:16px;line-height:1.65;color:var(--muted);max-width:370px}
.usage-access{display:grid;grid-template-columns:.8fr 1.35fr;gap:85px;align-items:start}
.usage-access .button{background:var(--accent);border-color:var(--accent);color:#fff}
.usage-access .button:hover{background:#174aa7;border-color:#174aa7}
.usage-contact-address{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;font-size:14px;overflow-wrap:anywhere;text-underline-offset:4px}
.usage-access .usage-small{max-width:350px}
.usage-access-steps{list-style:none;margin:0;padding:0;counter-reset:access}
.usage-access-steps li{counter-increment:access;position:relative;padding:24px 0 24px 48px;border-top:1px solid var(--rule)}
.usage-access-steps li:first-child{border-top:2px solid var(--accent);padding-top:20px}
.usage-access-steps li::before{content:counter(access,decimal-leading-zero);position:absolute;left:0;top:25px;color:var(--accent);font-size:16px;font-weight:600}
.usage-access-steps li:first-child::before{top:21px}
.usage-access-steps h3{font-size:21px;font-weight:500;line-height:1.35}
.usage-access-steps p{font-size:15px;line-height:1.7;color:var(--muted);margin-top:12px}
.usage-access-steps strong{color:var(--ink)}
.usage-access-steps .text-link{display:inline-flex;align-items:center;min-height:44px;font-size:14px;margin-top:9px;text-underline-offset:4px}
.usage-table-scroll{overflow-x:auto;scrollbar-width:thin}
.usage-status-table{border-collapse:collapse;width:100%;font-size:15px;line-height:1.65;text-align:left}
.usage-status-table caption{font-size:13px;color:var(--muted);text-align:left;caption-side:bottom;padding-top:18px}
.usage-status-table thead th{font-size:11px;text-transform:uppercase;letter-spacing:.1em;padding:17px 24px;border-block:1px solid var(--rule);color:var(--muted)}
.usage-status-table tbody th,.usage-status-table tbody td{padding:26px 24px;vertical-align:top;border-bottom:1px solid var(--rule);font-weight:400}
.usage-status-table tbody tr:first-child{background:var(--panel)}
.usage-status-table th:first-child{width:31%;padding-left:0}
.usage-status-table tbody tr:first-child th{padding-left:24px}
.usage-status-table td{width:34.5%;color:var(--muted)}
.usage-status-table td strong{color:var(--ink)}
.usage-display-visual{display:block;margin-bottom:18px}
.usage-display-visual>a{display:block;overflow:hidden;border:1px solid var(--rule);border-radius:4px;background:#fff;line-height:0}
.usage-display-visual img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}
.usage-display-owner>a{background:#151b25;border-color:#29354c}
.usage-display-owner img{object-fit:cover;object-position:center 47%}
.usage-display-180 img{object-fit:cover}
.usage-display-credit{display:block;margin-top:9px;font-size:11px;line-height:1.5;color:var(--muted)}
.usage-status-table tbody tr{scroll-margin-top:24px}
.usage-model{font-size:20px;line-height:1.35;display:block;font-weight:500}
.usage-model-detail{font-size:12px;line-height:1.6;display:block;margin-top:9px;overflow-wrap:anywhere;color:var(--muted)}
.usage-tag{display:inline-block;border:1px solid var(--rule);border-radius:30px;font-size:11px;line-height:1.45;padding:6px 10px;margin-top:14px;color:var(--muted)}
.usage-tag-checked{background:#e5ede0;border-color:#bccbb0;color:#30432a}
.usage-board-note{font-size:14px;line-height:1.75;margin-top:25px;max-width:760px;color:var(--muted)}
.usage-install{display:grid;grid-template-columns:.8fr 1.35fr;gap:85px;align-items:start}
.usage-availability{margin-top:28px;padding:24px;background:var(--panel);border-left:3px solid var(--accent)}
.usage-availability h3,.usage-checklist h3{font-size:18px;line-height:1.4;font-weight:500}
.usage-availability p{font-size:14px;line-height:1.7;margin-top:12px;color:var(--muted)}
.usage-availability a{font-size:14px;display:inline-block;margin-top:17px;text-underline-offset:4px}
.usage-checklist{margin-top:28px}
.usage-checklist ul{padding-left:20px;margin:16px 0}
.usage-checklist li{font-size:14px;line-height:1.65;margin-block:8px}
.usage-install-steps{list-style:none;padding:0;margin:0;counter-reset:none}
.usage-install-steps>li{display:grid;grid-template-columns:44px 1fr;gap:22px;border-top:1px solid var(--rule);padding:30px 0;min-width:0}
.usage-install-steps>li:first-child{border-top:2px solid var(--accent);padding-top:22px}
.usage-number{font-family:Plex,Arial,sans-serif;font-weight:600;color:var(--accent);font-size:29px;line-height:1.2}
.usage-install-steps h3{font-size:23px;font-weight:500;line-height:1.3;margin-bottom:14px}
.usage-install-steps p{font-size:15px;line-height:1.75;margin-top:12px;color:var(--muted)}
.usage-install-steps strong{color:var(--ink)}
.usage-install-steps .usage-small{font-size:13px}
.usage-install-steps>li>div{min-width:0}
.page-usage .setup-code{margin-top:18px;padding:16px;background:var(--panel);border:1px solid var(--rule)}
.page-usage .setup-code pre{font-size:13px;line-height:1.7;max-width:100%;margin-top:12px;overflow-x:auto}
.page-usage .setup-code .usage-prompt{white-space:pre-wrap;overflow-wrap:anywhere;font-family:Plex,Arial,sans-serif;font-size:14px}
.page-usage .code-heading{gap:12px;flex-wrap:wrap;font-size:11px}
.page-usage .code-heading button{min-height:44px;color:var(--accent);font-size:12px}
.page-usage .copy-feedback{display:block;font-size:12px;line-height:1.6;margin-top:8px}
.page-usage .copy-feedback:empty{display:none}
.usage-evidence{padding:70px max(32px,calc((100% - 1200px)/2));background:#eaf0f8;scroll-margin-top:20px;display:grid;grid-template-columns:.8fr 1.35fr;gap:36px 85px}
.usage-evidence h2{font-size:clamp(32px,3.5vw,44px);line-height:1.16}
.usage-evidence .eyebrow{color:#245fc7;margin-bottom:17px}
.usage-evidence-heading>p:last-child{font-size:13px;line-height:1.8;color:var(--muted);margin-top:23px}
.usage-evidence-lists{display:grid;grid-template-columns:1fr 1fr;gap:35px}
.usage-evidence-lists h3{font-size:18px;font-weight:500;line-height:1.4;padding-bottom:15px;border-bottom:1px solid #c5d2e4}
.usage-evidence-lists ul{list-style:none;margin:0;padding:0}
.usage-evidence-lists li{position:relative;padding-left:15px;font-size:14px;line-height:1.65;margin-top:14px;color:#435269}
.usage-evidence-lists li::before{content:'';position:absolute;width:4px;height:4px;left:0;top:10px;background:var(--accent)}
.usage-evidence-note{grid-column:2;font-size:13px;line-height:1.8;color:var(--muted);border-top:1px solid #c5d2e4;padding-top:20px}
.usage-faq .disclosure{margin-top:0;border-bottom:1px solid var(--rule)}
.usage-faq .disclosure:last-child{border-bottom:0}
.usage-faq summary{font-size:19px;font-weight:500;line-height:1.5}
.usage-faq details p{font-size:15px;line-height:1.75;max-width:840px;color:var(--muted);margin-bottom:18px}
.usage-next{padding:65px max(32px,calc((100% - 1200px)/2));color:var(--usage-warm);background:var(--usage-dark)}
.usage-next .eyebrow{color:var(--usage-blue);margin-bottom:18px}
.usage-next h2{font-size:clamp(32px,3.5vw,46px);line-height:1.16}
.usage-next>p:not(.eyebrow){font-size:18px;line-height:1.6;color:#adb7c5;max-width:640px;margin-top:22px}
.usage-next>p.usage-small{font-size:12px;max-width:730px;margin-top:24px}
.page-usage .site-footer nav{flex-wrap:wrap}
@media(max-width:1050px){.usage-hero{gap:32px}.usage-hero h1{font-size:48px}.usage-lead{font-size:21px}.usage-overview,.usage-install,.usage-evidence{gap:36px}.usage-workflow ol{gap:18px}.usage-distinction{gap:36px}.usage-status-table tbody th,.usage-status-table tbody td{padding:22px 16px}.usage-status-table tbody tr:first-child th{padding-left:16px}}
@media(max-width:760px){
 .usage-hero{display:block;padding:24px 20px 32px}.usage-hero-copy .eyebrow{font-size:10px;margin-bottom:14px}.usage-hero h1{font-size:clamp(34px,9.2vw,40px);line-height:1.12}.usage-lead{font-size:17px;margin:14px 0 10px}.usage-description{font-size:14px;max-width:470px;line-height:1.6}.usage-release{margin-top:14px;font-size:10.5px}.usage-actions{gap:12px 18px;margin-top:18px}.usage-hardware-photo{margin-top:20px;max-width:530px}.usage-photo-top{padding:18px 20px 0;font-size:10px}.usage-hardware-photo figcaption{padding:0 20px 19px;font-size:11px}.usage-chapters{padding:14px 20px;gap:3px 22px}.usage-chapters a{font-size:12px;min-height:36px}
 .usage-section{width:calc(100% - 40px);padding:43px 0}.usage-section h2,.usage-evidence h2{font-size:32px}.usage-intro{font-size:18px;margin-top:18px}.usage-overview,.usage-install{display:block}.usage-workflow{margin-top:27px}.usage-workflow ol{display:block}.usage-workflow li{display:grid;grid-template-columns:80px 1fr;gap:4px 16px;padding:18px 0;border-top:1px solid var(--rule)}.usage-workflow li:first-child{border-top:2px solid var(--accent)}.usage-step-label{grid-row:1/3;font-size:10px;padding-top:4px}.usage-workflow h3{font-size:19px;margin:0 0 7px}.usage-workflow li p{font-size:14px}.usage-distinction{display:block;margin-top:26px;padding-top:23px}.usage-distinction p{margin-top:12px;font-size:14px}.usage-section-heading{display:block;margin-bottom:25px}.usage-section-heading>p{font-size:14px;margin-top:16px}
 .usage-status-table{font-size:14px}.usage-status-table thead th{font-size:10px}.usage-status-table tbody th,.usage-status-table tbody td{padding:21px 16px}.usage-model{font-size:18px}.usage-tag{font-size:10px}.usage-board-note{font-size:13px;margin-top:20px}.usage-availability{padding:21px;margin-top:24px}.usage-install-steps{margin-top:32px}.usage-install-steps>li{grid-template-columns:33px 1fr;gap:14px;padding:25px 0}.usage-number{font-size:26px}.usage-install-steps h3{font-size:21px}.usage-install-steps p{font-size:14px}.page-usage .setup-code{padding:13px}.page-usage .setup-code pre{font-size:12px}.page-usage .setup-code .usage-prompt{font-size:13px}
 .usage-evidence{display:block;padding:42px 20px}.usage-evidence-lists{display:block;margin-top:26px}.usage-evidence-lists>div+div{margin-top:30px}.usage-evidence-lists li{font-size:14px}.usage-evidence-note{margin-top:25px}.usage-faq summary{font-size:17px}.usage-faq details p{font-size:14px}.usage-next{padding:42px 20px}.usage-next h2{font-size:34px}.usage-next>p:not(.eyebrow){font-size:16px}.usage-next>p.usage-small{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.page-usage *{scroll-behavior:auto}}
@media(max-width:1050px){.usage-access{gap:36px}}
@media(max-width:760px){.usage-access{display:block}.usage-access-steps{margin-top:28px}.usage-access-steps li{padding-left:38px}.usage-access-steps h3{font-size:19px}.usage-access-steps p{font-size:14px}.usage-access-steps .text-link{line-height:1.5}}
@media(max-width:760px){.usage-photo-pair{grid-template-columns:1fr;gap:30px}.usage-photo-pair h3{font-size:21px}.usage-photo-pair p{font-size:14px}.usage-photo-pair figcaption{padding-top:15px}.usage-hardware-photo figcaption{padding-top:18px}}

/* Keep every model's limits visible on a phone, with one source table. */
@media(max-width:760px){
 .usage-table-scroll{overflow:visible}
 .usage-status-table{display:block;width:100%;min-width:0}
 .usage-status-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 .usage-status-table tbody{display:block}
 .usage-status-table tbody tr{display:block;border-top:1px solid var(--rule);padding:24px 0}
 .usage-status-table tbody tr:first-child{border-top:2px solid var(--accent);padding:24px 18px;margin-bottom:4px}
 .usage-status-table tbody th:first-child,.usage-status-table tbody tr:first-child th{display:block;width:100%;padding:0;border:0}
 .usage-status-table tbody td{display:block;width:100%;padding:0;border:0;margin-top:20px}
 .usage-status-table td::before{content:attr(data-label);display:block;font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--ink);margin-bottom:7px}
 .usage-status-table caption{display:block;width:100%;padding-top:8px;white-space:normal;font-size:12px}
}

.usage-round-photos .usage-photo-pair figure:nth-child(2) img{object-position:center 60%}
#display-round-175{scroll-margin-top:24px}

/* Shared VibeOnChip typography and component shapes, with this product’s blue accent. */
.page-usage h1,.page-usage h2{font-family:Anton,Plex,sans-serif;font-weight:400;letter-spacing:-.025em}
.page-usage .site-header{background:var(--usage-dark);color:var(--usage-warm)}
.page-usage .project-nav a:hover,.page-usage .project-nav a[aria-current]{color:var(--usage-blue);text-decoration-color:var(--usage-blue)}
.page-usage .site-menu[open]>summary{color:var(--usage-blue)}
.page-usage .menu-panel{background:#151b25;border-color:#303b4d;color:var(--usage-warm)}
.page-usage .menu-panel a:hover{background:#232d3e}
.page-usage .site-header a:focus-visible,.page-usage .site-header summary:focus-visible,.page-usage .usage-hero a:focus-visible,.page-usage .usage-next a:focus-visible{outline-color:var(--usage-blue)}
.page-usage .button{font-family:Anton,Plex,sans-serif;font-size:17px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;border-radius:40px;padding:13px 27px;min-height:50px}
.page-usage .usage-hero .button:hover,.page-usage .usage-next .button:hover{background:#174aa7;border-color:#174aa7;color:#fff}
.usage-hero .text-link{font-size:14px;text-decoration-color:#7292c4;text-underline-offset:4px}
.usage-hardware-photo{border:1px solid #29354c;border-radius:4px}
.usage-photo-pair img{border-radius:4px}
.usage-tag-checked{background:#e6f3e9;border-color:#b5d2bd;color:#215735}
.usage-evidence .eyebrow{color:var(--accent)}
.page-usage .setup-code{border-radius:4px;background:#fff}
.page-usage .code-heading button{padding-inline:12px;border:1px solid #d5dfef;border-radius:7px}
@media(max-width:1050px) and (min-width:761px){.usage-overview{grid-template-columns:1fr}.usage-workflow ol{gap:28px}}
@media(max-width:760px){.usage-hero .button{font-size:14px;padding:11px 18px}.usage-actions{align-items:center}.usage-hardware-photo figcaption{padding:16px 18px}.usage-photo-credit{font-size:9px;margin-bottom:7px}.usage-photo-pair h3{font-size:19px}}

/* Common section rhythm and explicit development stages. */
.page-usage .usage-hero h1{font-size:clamp(52px,5.3vw,76px);line-height:1.07}
.page-usage .usage-section h2,.page-usage .usage-evidence h2,.page-usage .usage-next h2{font-size:clamp(36px,4.2vw,54px);line-height:1.12}
.usage-chapters a{min-height:44px}
.usage-tag{text-transform:uppercase;letter-spacing:.04em;border-radius:3px}
.usage-roadmap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.usage-roadmap article{border-top:2px solid var(--rule);padding-top:18px}
.usage-roadmap article:first-child{border-color:var(--accent)}
.usage-roadmap h3{font-size:21px;font-weight:500;line-height:1.35;margin-top:14px}
.usage-roadmap article>p:last-child{font-size:15px;line-height:1.7;color:var(--muted);margin-top:12px}
@media(max-width:760px){.page-usage .usage-hero h1{font-size:clamp(43px,11.5vw,56px)}.page-usage .usage-section h2,.page-usage .usage-evidence h2,.page-usage .usage-next h2{font-size:36px}.page-usage .usage-hero .button{min-height:48px;padding:12px 22px;font-size:15px}.usage-roadmap{grid-template-columns:1fr;gap:26px}}
