/* Quiet landing page and the separate device library. */
.contact-page { max-width:760px; padding-block:54px; }
.contact-page h1 { font-size:clamp(2.5rem,4vw,3.5rem); margin:8px 0 16px; }
.contact-page form { margin-top:32px; }
.contact-page label { display:block; font:.75rem/1.7 var(--mono); margin:22px 0 7px; }
.field-optional { color:var(--muted); }
.contact-page input,.contact-page textarea,.contact-page select { width:100%; border:1px solid var(--line); border-radius:2px; background:var(--paper); color:var(--ink); padding:12px; font-family:inherit; font-size:1rem; line-height:1.5; }
.contact-page textarea { resize:vertical; min-height:140px; }
.device-form-fields { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-actions { display:flex; gap:16px; margin-top:24px; }
.form-actions button { border:1px solid var(--copper); border-radius:2px; background:transparent; color:var(--ink); min-height:44px; padding:12px 18px; font:.8125rem var(--mono); }
.form-actions button:hover:not(:disabled) { background:var(--soft); }
.form-actions button:disabled { opacity:.5; }
#form-status { font-size:.875rem; margin-top:18px; min-height:1.6em; }
.form-success-icon { display:none; }
#form-status[data-state="success"] { display:flex; align-items:center; gap:16px; padding:22px; border:1px solid #b3c4ac; border-radius:3px; background:#eaf0e4; color:#30472f; font-size:1rem; line-height:1.6; }
#form-status[data-state="success"] .form-success-icon { display:grid; place-items:center; flex:0 0 34px; height:34px; border:1px solid currentColor; border-radius:50%; font-size:1.25rem; }
#form-status:focus { outline:none; }
#form-status:focus-visible { outline:2px solid currentColor; outline-offset:4px; }
.form-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.device-suggest { margin:0 0 22px; font-size:.875rem; }
.device-suggest a { text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--copper); }
[hidden] { display:none!important; }
.hero { min-height:540px; padding-block:48px; }
.hero-definition { max-width:440px; color:var(--ink); font-size:1.0625rem; line-height:1.6; text-wrap:pretty; }
.hero-description { max-width:390px; }
.download-button { max-width:100%; min-height:48px; justify-content:center; text-align:center; white-space:normal; }
.download-button:disabled { opacity:1; }
.download-button--secondary { background:transparent; color:var(--ink); border-color:var(--line); }
.idea { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:72px; padding-block:64px; }
.idea-story p { color:var(--ink); font-size:1.25rem; line-height:1.65; }
.idea-story h2 { font-size:1.3rem; letter-spacing:-.025em; margin-top:20px; }
.video-placeholder { margin:0; }
.video-frame { aspect-ratio:16/10; display:flex; flex-direction:column; justify-content:center; align-items:center; border:1px dashed var(--line); background:var(--soft); gap:24px; }
.video-mark { font:1.8rem var(--mono); color:var(--copper); opacity:.65; }
.video-frame p { text-align:center; color:var(--ink); }
.video-frame small { display:block; color:var(--muted); font:.6875rem/2 var(--mono); margin-top:4px; }
.compatibility,.future { padding-block:54px; }
.future { border-top:1px solid var(--line); }
.future h3 { font-size:1.125rem; margin-bottom:10px; }
.use-layout { display:grid; grid-template-columns:1fr 1fr; gap:72px; margin-top:28px; }
.use-layout p { max-width:520px; }
.use-layout p+p { margin-top:12px; }
.current-support h3 { font:.6875rem/1.6 var(--mono); text-transform:uppercase; color:var(--muted); letter-spacing:.08em; margin-bottom:9px; }
.current-support p { color:var(--ink); line-height:1.9; }
.text-link { display:inline-block; font-size:.875rem; border-bottom:1px solid var(--copper); padding-bottom:3px; margin-top:18px; }
.small-note { font-size:.75rem; line-height:1.7; margin-top:22px; }
.small-note a,.vote-message a,.privacy-page a { text-decoration:underline; text-underline-offset:3px; }
.vote-widget { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:16px; }
.vote-button,.library-pagination button { border:1px solid var(--line); border-radius:3px; background:transparent; padding:10px 14px; font:.75rem/1.4 var(--mono); min-height:40px; }
.vote-button:hover:not(:disabled),.library-pagination button:hover:not(:disabled) { border-color:var(--copper); }
.vote-button[aria-pressed=true] { border-color:var(--copper); color:var(--copper); background:#b54b3109; }
.vote-count { font:.6875rem/1.5 var(--mono); color:var(--muted); }
.vote-message { font-size:.8125rem; margin-top:12px; }
.vote-retry { background:none; border:0; color:var(--copper); text-decoration:underline; padding:4px 6px; font:inherit; }
.library-intro { padding-block:54px 28px; max-width:800px; }
.library-intro h1 { font-size:clamp(2.5rem,4vw,3.5rem); margin:8px 0 16px; }
.library-intro .small-note { margin-top:12px; }
.library-filters { display:grid; grid-template-columns:2fr 1fr 1fr; gap:18px; padding-block:20px 24px; }
.library-filters label { display:block; font:.6875rem/1.5 var(--mono); color:var(--muted); }
.library-filters input,.library-filters select { width:100%; margin-top:7px; border:1px solid var(--line); border-radius:2px; padding:12px; background:var(--paper); color:var(--ink); font-family:inherit; font-size:.875rem; line-height:1.3; min-height:44px; }
.library-vote-note { margin:0 0 18px; }
.library-columns,.catalogue-row>summary { display:grid; grid-template-columns:minmax(180px,1.6fr) .75fr 1fr 1fr 16px; gap:20px; align-items:center; }
.library-columns { font:.625rem var(--mono); color:var(--muted); padding-block:12px; border-block:1px solid var(--line); }
.catalogue-row>summary { padding-block:19px; }
.catalogue-row { scroll-margin-top:24px; }
.catalogue-name small { display:block; color:var(--muted); font:.625rem/1.6 var(--mono); margin-bottom:3px; }
.catalogue-name strong { font-size:1rem; font-weight:400; }
.catalogue-role,.catalogue-status,.catalogue-outlook { font:.6875rem/1.6 var(--mono); color:var(--muted); }
.catalogue-status.integrated { color:var(--copper); }
.catalogue-row[open]>summary { color:var(--copper); }
.catalogue-detail { max-width:960px; padding:8px 24px 28px; margin-bottom:22px; border-left:2px solid var(--copper); background:var(--soft); }
.catalogue-detail h3 { margin:12px 0 8px; font-size:1.125rem; }
.catalogue-detail h4 { margin:0 0 10px; font:.6875rem/1.5 var(--mono); text-transform:uppercase; letter-spacing:.04em; }
.catalogue-detail p,.catalogue-detail li,.catalogue-detail dd { font-size:.875rem; line-height:1.7; color:var(--muted); }
.catalogue-detail p+p { margin-top:8px; }
.catalogue-detail ul,.catalogue-detail ol { margin:8px 0; padding-left:22px; }
.device-overview { max-width:680px; }
.device-sections { display:grid; grid-template-columns:1fr 1fr; gap:36px; margin-top:26px; }
.device-sections li+li { margin-top:6px; }
.device-actions { margin-top:22px; }
.device-actions .vote-widget { margin-top:0; }
.catalogue-detail .device-footnote,.catalogue-detail .device-permalink { font-size:.75rem; margin-top:10px; }
.catalogue-detail>details { margin-top:22px; border-top:1px solid var(--line); }
.catalogue-detail>details>summary { padding:12px 0; font:.75rem var(--mono); }
.catalogue-detail a { text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
.catalogue-detail .vote-button { text-decoration:none; }
.library-pagination { display:flex; align-items:center; justify-content:space-between; gap:18px; padding-block:25px; font:.75rem var(--mono); }
.library-empty { padding:35px 0; }
.library-notes { border-top:1px solid var(--line); padding-block:35px; }
.library-notes h2 { font-size:1.5rem; margin-bottom:15px; }
.library-notes p { font-size:.875rem; max-width:850px; }
.library-notes .small-note { font-size:.75rem; }
.library-notes p+p { margin-top:10px; }
.privacy-page { max-width:740px; margin:50px auto; }
.privacy-page h1 { font-size:2.5rem; }
.privacy-page h2 { font-size:1.3rem; margin:28px 0 12px; }
.privacy-page p+p { margin-top:12px; }
.library-meta { font:.625rem/1.7 var(--mono); overflow-wrap:anywhere; margin:12px 0 30px; }
@media(max-width:900px) {
  .idea,.use-layout { gap:35px; }
  .library-columns,.catalogue-row>summary { grid-template-columns:minmax(155px,1.6fr) .8fr 1fr 1fr 14px; gap:12px; }
}
@media(max-width:760px) {
  .site-header nav { display:none; }
  .contact-page { padding-block:35px; }
  .device-form-fields { grid-template-columns:1fr; gap:0; }
  .hero { padding-block:32px 42px; }
  .idea { grid-template-columns:1fr; gap:30px; padding-block:38px; }
  .idea-story p { font-size:1.125rem; }
  .video-placeholder { width:100%; max-width:480px; }
  .compatibility,.future { padding-block:36px; }
  .use-layout { grid-template-columns:1fr; gap:28px; margin-top:20px; }
  .library-filters { grid-template-columns:1fr 1fr; gap:14px; }
  .library-filters>label:first-child { grid-column:1/-1; }
  .library-columns { display:none; }
  .catalogue-row:first-child { border-top:1px solid var(--line); }
  .catalogue-row>summary { grid-template-columns:1fr auto 14px; gap:8px; }
  .catalogue-name { grid-column:1; grid-row:1/3; }
  .catalogue-role { display:none; }
  .catalogue-status { grid-column:2; grid-row:1; }
  .catalogue-outlook { grid-column:2; grid-row:2; }
  .catalogue-row>summary>.expand-icon { grid-column:3; grid-row:1/3; }
  .device-sections { grid-template-columns:1fr; gap:22px; }
  .catalogue-detail { padding-inline:16px; }
  .library-intro { padding-top:35px; }
  .privacy-page { margin:35px 20px; }
}
@media(max-width:430px) {
  .catalogue-status,.catalogue-outlook { font-size:.625rem; }
  .catalogue-name strong { font-size:.875rem; }
}