/* tvguideapi.com documentation pages: two columns, the menu and the page */

  /* ---------- documentation: two columns, the menu and the page ---------- */
  .dwrap { background:var(--page); }
  .dwrap > .in { display:grid; grid-template-columns:280px minmax(0, 1fr); gap:0; max-width:1320px; }
  .dnav { position:sticky; top:62px; height:calc(100vh - 62px); overflow:auto; background:var(--black); color:var(--on-dark); padding:18px 14px 28px; border-right:1px solid #111722; }
  .dnav .find { width:100%; height:36px; border-radius:var(--r); border:1px solid #232b3a; background:#0c1018; color:#fff; padding:0 12px; font:inherit; font-size:13px; }
  .dnav .find::placeholder { color:#6b778a; }
  .dnav h6 { font-size:11px; font-weight:400; letter-spacing:.08em; text-transform:uppercase; color:#6b778a; margin:18px 8px 6px; display:flex; justify-content:space-between; }
  .dnav a { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:8px; min-height:32px; padding:0 8px; border-radius:8px; color:#c3ccd8; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .dnav a:hover { background:#161c28; color:#fff; }
  .dnav a.on { background:#1a2233; color:#fff; box-shadow:inset 3px 0 0 var(--yel); }
  .dnav a .ico { width:15px; height:15px; color:var(--cyan); }
  .dnav a .mt { font-family:'IBM Plex Mono', monospace; font-size:10px; width:44px; text-align:center; padding:1px 0; border-radius:5px; background:#1f2a40; color:#9fb6ff; }
  .dnav a .mt.post { background:#123222; color:#86efac; } .dnav a .mt.del { background:#2a2f3a; color:#c3ccd8; }
  .dnav a .nm { overflow:hidden; text-overflow:ellipsis; font-size:13.5px; }
  .dnav .grp { display:grid; grid-template-columns:1fr auto; align-items:center; height:30px; margin-top:6px; padding:0 8px; color:#e6ebf2; font-size:13px; cursor:default; user-select:none; }
  .dnav .grp span.c { font-size:11px; color:#6b778a; }
  .dnav .eps { display:block; padding-left:6px; }
  .dnav .none { color:#6b778a; font-size:12.5px; padding:6px 8px; }

  .dpage { padding:30px 0 70px 44px; min-width:0; }
  .crumb { font-size:12.5px; color:var(--faint); display:flex; gap:8px; align-items:center; }
  .crumb a:hover { color:var(--blue); }
  .dpage h1 { font-size:30px; font-weight:300; letter-spacing:-.01em; color:var(--ink); margin-top:10px; line-height:1.2; }
  .dpage .sum { font-size:15.5px; color:var(--muted); margin-top:8px; max-width:760px; }
  .dpage .chips { display:flex; gap:6px; margin-top:12px; flex-wrap:wrap; }
  .dpage h2 { font-size:19px; font-weight:400; color:var(--ink); margin:34px 0 10px; padding-top:4px; }
  .dpage h3 { font-size:15px; font-weight:400; color:var(--ink); margin:22px 0 8px; }
  .dpage p, .dpage li { color:var(--text); font-size:14.5px; max-width:780px; }
  .dpage p + p { margin-top:10px; }
  .dpage ul, .dpage ol { padding-left:20px; margin:8px 0; } .dpage li { margin:4px 0; }
  .dpage code { font-family:'IBM Plex Mono', monospace; font-size:12.5px; background:var(--alt); border:1px solid var(--line-2); border-radius:5px; padding:0 5px; }
  .dpage a.lk { color:var(--blue); }
  .epline { display:flex; align-items:center; gap:10px; margin-top:14px; background:var(--alt); border:1px solid var(--line); border-radius:var(--r); padding:10px 14px; font-family:'IBM Plex Mono', monospace; font-size:13.5px; color:var(--ink); }
  .epline .host { color:var(--faint); }
  .epline .mthd { width:58px; }
  .m-get { background:var(--blue); } .m-post { background:#15803d; } .m-del { background:#5d6b7e; }
  .mthd { display:inline-grid; place-items:center; }

  /* try it */
  .try { margin-top:22px; border:1px solid var(--panel-line); border-radius:var(--r); overflow:hidden; background:#0b0f17; color:var(--on-dark); }
  .try .th { display:flex; align-items:center; gap:10px; padding:12px 16px; border-bottom:1px solid var(--panel-line); }
  .try .th .t { font-size:14px; color:#fff; } .try .th .s { font-size:12px; color:var(--on-dark-muted); margin-left:auto; }
  .try .form { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px 14px; padding:14px 16px; }
  .try label { display:grid; gap:4px; font-size:11.5px; color:var(--on-dark-muted); letter-spacing:.02em; }
  .try label .rq { color:var(--yel); }
  .try input { height:34px; border-radius:8px; border:1px solid #232b3a; background:#070a11; color:#fff; padding:0 10px; font-family:'IBM Plex Mono', monospace; font-size:12px; }
  .try input:focus { outline:none; border-color:var(--cyan); }
  .try .key { grid-column:1 / -1; }
  .try .bar { display:grid; grid-template-columns:minmax(0, 1fr) repeat(2, 150px); gap:10px; padding:0 16px 14px; align-items:center; }
  .try .bar .url { font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--cyan); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background:#070a11; border:1px solid #161d2a; border-radius:8px; height:36px; display:flex; align-items:center; padding:0 10px; }
  .try .bar .btn { min-width:0; height:36px; font-size:13px; }
  .try .out { border-top:1px solid var(--panel-line); display:none; }
  .try .out.open { display:block; }
  .try .out .st { display:flex; gap:16px; padding:9px 16px; font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--on-dark-muted); border-bottom:1px solid #121825; }
  .try .out .st .ok { color:var(--green); }
  .try .out pre { margin:0; padding:12px 16px; max-height:360px; overflow:auto; font-family:'IBM Plex Mono', monospace; font-size:12px; line-height:1.6; color:#c3ccd8; }
  .try .load { height:2px; background:linear-gradient(90deg, transparent, var(--yel), transparent); background-size:50% 100%; animation:slide 0.8s linear infinite; display:none; }
  .try .load.on { display:block; }
  @keyframes slide { from { background-position:-50% 0; } to { background-position:150% 0; } }
  .jk { color:#7dd3fc; } .js { color:#fde68a; } .jn { color:#86efac; } .jb { color:#f0abfc; } .jp { color:#5d6b7e; }

  /* tables and code on the page */
  .ptab2 { width:100%; border-collapse:collapse; font-size:13px; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
  .ptab2 th { text-align:left; font-weight:400; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--faint); padding:9px 12px; background:#fafbfc; border-bottom:1px solid var(--line); white-space:nowrap; }
  .ptab2 td { padding:9px 12px; border-bottom:1px solid var(--line-2); vertical-align:top; color:var(--text); }
  .ptab2 tr:last-child td { border-bottom:0; }
  .ptab2 td.n { font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--ink); white-space:nowrap; }
  .ptab2 td.ty, .ptab2 td.in { color:var(--muted); white-space:nowrap; font-size:12.5px; }
  .ptab2 td.ex { font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--blue); white-space:nowrap; }
  .ptab2 .yes { color:#b45309; } .ptab2 .no { color:var(--faint); }
  .ptab2 td.k { font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--blue); white-space:nowrap; }
  .cblock { background:#0b0f17; border-radius:var(--r); overflow:hidden; margin-top:8px; }
  .cblock .tabs { display:grid; grid-template-columns:repeat(4, 110px); border-bottom:1px solid #1a2130; }
  .cblock .tabs button { height:34px; background:transparent; border:0; color:#8f9aab; font:inherit; font-size:12.5px; cursor:pointer; }
  .cblock .tabs button.on { color:var(--yel); box-shadow:inset 0 -2px 0 var(--yel); }
  .cblock pre { margin:0; padding:14px 16px; font-family:'IBM Plex Mono', monospace; font-size:12px; line-height:1.6; color:#c3ccd8; white-space:pre-wrap; overflow-wrap:anywhere; overflow-y:auto; overflow-x:hidden; max-height:420px; }
  .errs { display:flex; gap:8px; flex-wrap:wrap; }
  .errs a { font-family:'IBM Plex Mono', monospace; font-size:12px; padding:3px 9px; border-radius:6px; border:1px solid var(--line); color:var(--text); }
  .errs a:hover { border-color:var(--blue); color:var(--blue); }
  .note { border-left:3px solid var(--blue); background:#f3f6ff; padding:10px 14px; border-radius:0 var(--r) var(--r) 0; margin-top:12px; font-size:13.5px; color:var(--text); max-width:780px; }
  .pn { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:44px; max-width:860px; }
  .pn a { border:1px solid var(--line); border-radius:var(--r); padding:12px 16px; display:grid; gap:2px; }
  .pn a:hover { border-color:var(--blue); }
  .pn a span.k { font-size:11px; color:var(--faint); letter-spacing:.06em; text-transform:uppercase; }
  .pn a span.v { font-size:14px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .pn a.nx { text-align:right; }

  /* the introduction page */
  .intro-hero { margin-top:14px; border-radius:var(--r); padding:26px 26px 22px; }
  .intro-hero .kw { font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--cyan); }
  .intro-hero .big { display:block; font-size:30px; font-weight:300; color:#fff; margin-top:8px; line-height:1.2; }
  .intro-hero .big em { font-style:normal; color:var(--yel); }
  .intro-hero p { color:#aeb8c6; margin-top:10px; max-width:640px; }
  .intro-hero .cta { display:grid; grid-template-columns:repeat(3, 170px); gap:10px; margin-top:18px; }
  .intro-hero .cta .btn { min-width:0; }
  .intro-hero .ticker { margin-top:18px; font-family:'IBM Plex Mono', monospace; font-size:12px; color:#c3ccd8; height:20px; overflow:hidden; white-space:nowrap; }
  .intro-hero .ticker .g { color:var(--green); } .intro-hero .ticker .u { color:var(--cyan); }
  .cards { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; margin-top:12px; max-width:980px; }
  .card { border:1px solid var(--line); border-radius:var(--r); padding:16px; display:grid; grid-template-rows:auto auto 1fr auto; gap:8px; }
  .card:hover { border-color:var(--blue); }
  .card .t { font-size:15px; color:var(--ink); } .card p { font-size:13px; color:var(--muted); }
  .card .c { font-size:12px; color:var(--blue); }
  .facts2 { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; margin-top:12px; max-width:980px; }
  .facts2 div { background:var(--alt); border-radius:var(--r); padding:14px 16px; }
  .facts2 span.k { display:block; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--faint); }
  .facts2 span.v { display:block; font-size:14px; color:var(--ink); margin-top:4px; font-family:'IBM Plex Mono', monospace; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

  .dburger { display:none; }
  @media (max-width:980px) {
    .dwrap > .in { grid-template-columns:1fr; padding:0; }
    .dnav { position:fixed; left:0; top:62px; width:300px; z-index:40; transform:translateX(-100%); transition:transform .2s; }
    .dnav.open { transform:none; }
    .dpage { padding:20px 16px 60px; }
    .dburger { display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:center; height:40px; margin:14px 16px 0; padding:0 14px; border-radius:var(--r); background:var(--black); color:#e6ebf2; font-size:13.5px; border:0; font-family:inherit; width:calc(100% - 32px); }
    .cards { grid-template-columns:1fr 1fr; } .facts2 { grid-template-columns:1fr 1fr; }
  }
  @media (max-width:620px) {
    .dpage h1 { font-size:24px; } .try .form { grid-template-columns:1fr; } .try .bar { grid-template-columns:1fr 1fr; } .try .bar .url { grid-column:1 / -1; }
    .cards, .facts2, .pn { grid-template-columns:1fr; } .intro-hero .cta { grid-template-columns:1fr; } .cblock .tabs { grid-template-columns:repeat(4, 1fr); }
    .ptab2 thead { display:none; } .ptab2, .ptab2 tbody, .ptab2 tr, .ptab2 td { display:block; width:100%; } .ptab2 tr { border-bottom:1px solid var(--line); padding:6px 0; } .ptab2 td { border:0; padding:2px 12px; white-space:normal; }
    .epline { font-size:12px; flex-wrap:wrap; } .epline .host { display:none; }
  }
  .dpage .intro-hero h1.kw { font-size:12px; font-weight:400; letter-spacing:.12em; text-transform:uppercase; color:var(--cyan); margin:0; line-height:1.4; }

  .try .btn.b-ghost { background:transparent; color:var(--on-dark); border-color:#2b3240; }
  .try label > span { white-space:nowrap; }

  /* guide bodies (the tags manual.php converts) */
  .gbody table { width:100%; max-width:900px; border-collapse:collapse; font-size:13px; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; margin-top:10px; }
  .gbody th { text-align:left; font-weight:400; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--faint); padding:9px 12px; background:#fafbfc; border-bottom:1px solid var(--line); }
  .gbody td { padding:9px 12px; border-bottom:1px solid var(--line-2); vertical-align:top; color:var(--text); }
  .gbody tr:last-child td { border-bottom:0; }
  .gbody b, .gbody strong { font-weight:400; color:var(--ink); }
  .gbody .code { position:relative; background:#0b0f17; border-radius:var(--r); margin-top:10px; max-width:900px; }
  .gbody .code pre { margin:0; padding:14px 16px; font-family:'IBM Plex Mono', monospace; font-size:12px; line-height:1.6; color:#c3ccd8; overflow:auto; max-height:420px; }
  .gbody .code code { background:none; border:0; padding:0; color:inherit; font-size:inherit; }
  .gbody .code .copy { position:absolute; top:8px; right:8px; height:28px; width:72px; border-radius:8px; border:1px solid #2b3240; background:#0b0f17; color:#c3ccd8; font:inherit; font-size:12px; cursor:pointer; }
  .try .out .st .note2 { margin-left:auto; }
  .dnav [hidden], .dpage [hidden] { display:none !important; }
  .dpage .note code, .dpage td code { overflow-wrap:anywhere; }
  @media (max-width:620px) {
    .dpage code { overflow-wrap:anywhere; white-space:normal; }
    .gbody thead { display:none; } .gbody table, .gbody tbody, .gbody tr, .gbody td { display:block; width:100%; } .gbody tr { border-bottom:1px solid var(--line); padding:6px 0; } .gbody td { border:0; padding:2px 12px; }
  }
  .gbody p { margin-top:12px; } .gbody a, .dpage .note a, .ptab2 a { color:var(--blue); } .gbody .code { margin:14px 0; } .gbody table { margin:14px 0; } .gbody ul { margin-top:10px; }
  @media (max-width:620px) { .try .th { flex-wrap:wrap; } .try .th .s { margin-left:0; width:100%; } }
  /* 9 Oct 2026: thin dark scrollbars on the menu and the code and answer panes (the browser's grey bar looked unfinished) */
  .dnav, .try .out pre, .cblock pre, .gbody .code pre { scrollbar-width:thin; scrollbar-color:#2a3446 transparent; }
  /* every code block wraps instead of scrolling sideways (9 Oct 2026, asked for): long URLs break anywhere */
  .try .out pre, .cblock pre, .gbody .code pre, .dpage pre { white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; overflow-x:hidden; overflow-y:auto; }
  .dnav::-webkit-scrollbar, .try .out pre::-webkit-scrollbar, .cblock pre::-webkit-scrollbar, .gbody .code pre::-webkit-scrollbar { width:8px; height:8px; }
  .dnav::-webkit-scrollbar-track, .try .out pre::-webkit-scrollbar-track, .cblock pre::-webkit-scrollbar-track, .gbody .code pre::-webkit-scrollbar-track { background:transparent; }
  .dnav::-webkit-scrollbar-thumb, .try .out pre::-webkit-scrollbar-thumb, .cblock pre::-webkit-scrollbar-thumb, .gbody .code pre::-webkit-scrollbar-thumb { background:#2a3446; border-radius:8px; border:2px solid transparent; background-clip:padding-box; }
  .dnav::-webkit-scrollbar-thumb:hover, .try .out pre::-webkit-scrollbar-thumb:hover { background-color:#3a4760; }
  .dnav { overscroll-behavior:contain; }


  /* Try it: forget the remembered key */
  .try .kforget { background:none; border:0; padding:4px 0 0; font:inherit; font-size:12px; color:#6b778a; cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
  .try .kforget:hover { color:var(--ink, #111); }
  .try .kforget[hidden] { display:none; }
