/* Reference pages (configuration, API) — loaded after styles.css and app-detail.css */
.ref-page{--accent:#42d4d0;--accent-soft:#0f2226;--warn:#f3bd77;--warn-soft:#1b1610;--panel:#0d151c;--panel-2:#0a1016;--ink:#aebbc5;font-size:1rem;line-height:1.7}
.ref-page[hidden]{display:none}
.ref-page code{display:inline;color:var(--accent);font:.86em Consolas,monospace;background:none;padding:0;border:0}
.ref-page h2{font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.15;margin:0}
.ref-page h3{font-size:1.05rem;margin:0 0 8px}
.ref-page p,.ref-page li,.ref-page td{color:var(--ink)}
.ref-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:44px;align-items:end;padding:16px 0 50px}
.ref-hero h1{font-size:clamp(2.6rem,6vw,5rem);line-height:.95;margin:22px 0 18px;letter-spacing:-.02em}
.ref-hero h1 em{font-style:normal;color:var(--accent)}
.ref-hero .detail-summary{font-size:1.08rem;line-height:1.65;max-width:64ch}
.ref-toc{display:flex;flex-wrap:wrap;gap:7px;margin-top:24px}
.ref-toc a{border:1px solid #28565a;border-radius:999px;padding:6px 11px;color:var(--accent);font-size:.76rem;text-decoration:none}
.ref-toc a:hover{background:var(--accent-soft)}
.ref-facts{border:1px solid var(--line);border-radius:18px;background:linear-gradient(150deg,#102126,#0b1118);padding:22px 24px}
.ref-facts>span{display:block;font:700 .72rem monospace;color:var(--accent);text-transform:uppercase;letter-spacing:.08em}
.ref-facts dl{margin:14px 0 0}
.ref-facts div{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:baseline;border-top:1px solid var(--line);padding:10px 0}
.ref-facts dt{color:var(--muted);font-size:.82rem}
.ref-facts dd{margin:0;font-size:.84rem;font-weight:700;text-align:right}
.ref-callout{margin:0 0 30px;border-left:3px solid var(--accent);background:#0d181e;padding:16px 20px;border-radius:0 12px 12px 0}
.ref-callout.warn{border-color:var(--warn);background:var(--warn-soft)}
.ref-callout strong{display:block;margin-bottom:4px;color:var(--text)}
.ref-callout p{margin:0;font-size:.93rem}
.ref-section{padding:56px 0;border-top:1px solid var(--line)}
.ref-section>.detail-heading{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:26px}
.ref-section>.detail-heading>span{font:700 .7rem monospace;color:var(--accent);text-transform:uppercase;letter-spacing:.1em}
.ref-section>.detail-heading p{max-width:80ch;margin:6px 0 0;font-size:1rem}
.ref-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ref-grid article{border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:20px}
.ref-grid article>span{font:700 .7rem monospace;color:var(--accent);text-transform:uppercase;letter-spacing:.08em}
.ref-grid h3{margin:10px 0 8px}
.ref-grid p{margin:0;font-size:.9rem}
.ref-grid ul{margin:0;padding-left:18px;font-size:.9rem}
.ref-table{width:100%;border-collapse:collapse}
.ref-table th,.ref-table td{text-align:left;border-bottom:1px solid var(--line);padding:11px 12px;vertical-align:top;font-size:.88rem}
.ref-table th{color:var(--accent);font:700 .72rem monospace;text-transform:uppercase;letter-spacing:.06em;background:var(--panel);position:sticky;top:var(--top,60px)}
.ref-table td:first-child{color:var(--text);font-weight:700}
.ref-table td.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.ref-table tr.group td{background:var(--panel-2);color:var(--accent);font:700 .7rem monospace;text-transform:uppercase;letter-spacing:.08em;padding:8px 12px}
.table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:14px}
.table-scroll .ref-table th:first-child,.table-scroll .ref-table td:first-child{padding-left:16px}
.ref-pre{margin:20px 0 0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#070b0f}
.ref-pre header{display:flex;justify-content:space-between;padding:10px 15px;border-bottom:1px solid var(--line);color:var(--muted);font:700 .72rem monospace}
.ref-pre pre{margin:0;padding:18px 20px;overflow:auto;color:#b9d7d6;font:13px/1.65 Consolas,monospace;white-space:pre}
.ref-pre .c{color:#647785}.ref-pre .k{color:#a797ff}.ref-pre .v{color:#b5ed68}
.waves{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.waves article{border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:18px}
.waves article>span{display:grid;place-items:center;width:38px;height:38px;border:1px solid #28565a;border-radius:10px;color:var(--accent);font:700 .78rem monospace}
.waves h3{margin:12px 0 6px}
.waves ul{margin:0;padding-left:16px;font-size:.84rem}
.waves li{margin:3px 0}
.tag{display:inline-block;border:1px solid #28565a;border-radius:999px;padding:2px 9px;font:.68rem monospace;color:var(--accent);margin-right:4px;white-space:nowrap}
.tag.warn{border-color:#6b4d26;color:var(--warn)}
.tag.muted{border-color:#33404b;color:var(--muted)}
.ref-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.ref-links a{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:12px 16px;color:var(--text);text-decoration:none;font-size:.9rem;transition:.15s}
.ref-links a:hover{border-color:var(--accent);transform:translateY(-2px)}
.ref-endpoint{display:grid;grid-template-columns:110px 1fr;gap:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:14px 16px;margin-bottom:9px}
.ref-endpoint>b{color:var(--accent);font:700 .78rem Consolas,monospace;word-break:break-word}
.ref-endpoint>div{font-size:.88rem}
.ref-endpoint>div>code{display:block;color:#cfe9e8;font-size:.78rem;line-height:1.6;white-space:normal;word-break:break-word;margin-top:4px}
@media(max-width:1100px){.ref-grid,.waves{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.ref-hero{grid-template-columns:1fr;gap:26px}.ref-grid,.waves{grid-template-columns:1fr}.ref-endpoint{grid-template-columns:1fr}.ref-table th{position:static}}

/* Glossary */
.gloss{margin:0;display:grid;grid-template-columns:minmax(200px,.34fr) 1fr;gap:0 24px}
.gloss dt{color:var(--text);font-weight:700;font-size:.95rem;padding:13px 0;border-top:1px solid var(--line)}
.gloss dd{margin:0;padding:13px 0;border-top:1px solid var(--line);font-size:.92rem}
.gloss dt[hidden],.gloss dd[hidden]{display:none}
.gloss-empty>.detail-heading{opacity:.45}
.gloss-filter{display:inline-flex;align-items:center;gap:10px;margin-top:18px;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:8px 12px;min-width:280px}
.gloss-filter span{color:var(--accent)}
.gloss-filter input{flex:1;background:none;border:0;color:var(--text);font-size:.9rem;outline:none}
@media(max-width:760px){.gloss{grid-template-columns:1fr;gap:0}.gloss dd{border-top:0;padding-top:0}}