:root{
    --bg: #1b1a19;
    --bg-raised: #232120;
    --bg-panel: #292624;
    --line: #3b3733;
    --line-soft: #302c29;
    --text: #f3f2f1;
    --text-dim: #b8b3ad;
    --text-faint: #a39b93;
    --iris: #7956ad;
    --iris-dim: #3d3352;
    --iris-glow: rgba(147,115,201,0.14);
    --moss: #5aa66b;
    --moss-dim: #2e3f2c;
    --moss-glow: rgba(90,166,107,0.14);
    --ochre: #d99a2b;
    --brick: #c05a3e;
    --mono: "Cascadia Code","Consolas","SFMono-Regular",Menlo,monospace;
    --ui: "Segoe UI Variable","Segoe UI",-apple-system,system-ui,"Helvetica Neue",Arial,sans-serif;
    --radius: 3px;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:
      radial-gradient(1200px 500px at 15% -10%, var(--iris-glow), transparent 60%),
      radial-gradient(900px 500px at 100% 0%, var(--moss-glow), transparent 55%),
      var(--bg);
    color:var(--text);
    font-family:var(--ui);
    line-height:1.5;
    min-height:100vh;
  }
  a{color:var(--ochre);}
  ::selection{background:var(--iris-dim);}

  /* ---------- top bar ---------- */
  header.top{
    border-bottom:1px solid var(--line);
    padding:22px clamp(16px,4vw,48px) 20px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    flex-wrap:wrap;
  }
  .brandmark{display:flex;align-items:center;gap:14px;}
  .brand-icon{width:34px;height:34px;flex:none;object-fit:contain;border-radius:6px;}
  h1{font-size:19px;font-weight:600;margin:0;letter-spacing:.1px;}
  h1 small{display:block;font-weight:400;font-size:12.5px;color:var(--text-faint);margin-top:3px;}
  nav.top-links{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;max-width:100%;font-size:13px;color:var(--text-dim);}
  nav.top-links a{color:var(--text-dim);text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px;}
  nav.top-links a:hover{color:var(--text);border-color:var(--text-faint);}
  .lang-toggle{
    background:var(--bg-raised);border:1px solid var(--line);color:var(--text-dim);
    border-radius:14px;padding:3px;display:inline-flex;gap:2px;align-items:center;
  }
  .lang-toggle button{
    background:transparent;border:0;color:inherit;border-radius:10px;padding:3px 7px;
    font-family:var(--ui);font-size:11.5px;font-weight:700;cursor:pointer;
  }
  .lang-toggle button.active{background:var(--iris-dim);color:#e3d9f4;}

  main{max-width:1180px;margin:0 auto;padding:36px clamp(16px,4vw,48px) 80px;}

  /* ---------- intro / free text ---------- */
  section.intro{margin-bottom:34px;}
  section.intro p{max-width:62ch;color:var(--text-dim);font-size:14.5px;margin:8px 0 0;}
  .ask{
    margin-top:22px;
    display:flex;
    gap:10px;
    background:var(--bg-raised);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:6px 6px 6px 16px;
    align-items:center;
  }
  .ask svg{flex:none;color:var(--text-faint);}
  .ask input{
    flex:1;background:transparent;border:0;outline:0;color:var(--text);
    font-family:var(--ui);font-size:14.5px;padding:12px 0;
  }
  .ask input::placeholder{color:var(--text-faint);}
  .ask button{
    background:var(--iris);color:#fff;border:0;border-radius:2px;
    padding:10px 18px;font-size:13.5px;font-weight:600;cursor:pointer;font-family:var(--ui);
  }
  .ask button:hover{background:#a486d4;}
  #ask-results{margin-top:10px;display:flex;flex-direction:column;gap:6px;}
  .ask-hit{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    background:var(--bg-raised);border:1px solid var(--line-soft);border-radius:var(--radius);
    padding:10px 14px;cursor:pointer;font-size:13.5px;
  }
  .ask-hit.official-match{align-items:flex-start;flex-wrap:wrap;}
  .ask-hit.official-match .desc,.ask-hit.official-match .tag{flex:1 1 100%;min-width:0;overflow-wrap:anywhere;word-break:break-word;}
  .ask-hit.official-match .tag{white-space:normal;}
  .ask-hit.official-match .desc small,.ask-hit.official-match .tag small{display:block;margin-top:5px;color:var(--text-faint);font:11px var(--ui);white-space:normal;}
  .ask-hit.official-match .tag code{font:inherit;white-space:normal;overflow-wrap:anywhere;word-break:break-word;}
  .official-choice-instruction{margin:6px 0;color:var(--text-dim);font-size:12px;}
  .ask-hit:hover{border-color:#bda0ed;}
  .ask-hit .desc{color:var(--text);}
  .ask-hit .tag{font-family:var(--mono);font-size:11.5px;color:var(--text-faint);white-space:nowrap;}
  .agent-choice{background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius);color:var(--text);padding:12px;text-align:left;cursor:pointer;font:600 13px var(--ui);}
  .agent-choice:hover{border-color:#bda0ed;}
  .agent-choice small{display:block;color:var(--text-dim);font:400 12px var(--ui);margin-top:5px;}

  /* ---------- direction switch ---------- */
  .switchbar{display:flex;align-items:center;gap:16px;margin-bottom:18px;flex-wrap:wrap;}
  .seg{display:inline-flex;border:1px solid var(--line);border-radius:20px;padding:3px;background:var(--bg-raised);}
  .seg button{
    border:0;background:transparent;color:var(--text-dim);padding:8px 16px;border-radius:16px;
    font-family:var(--ui);font-size:13.5px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;
  }
  .seg button .dot{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.5;}
  .seg button.active.ps{background:var(--moss-dim);color:#bfe5c6;}
  .seg button.active.gr{background:var(--iris-dim);color:#d9cdf0;}
  .swap-note{font-size:12.5px;color:var(--text-faint);}

  /* ---------- workbench ---------- */
  .bench{display:grid;grid-template-columns:1fr 40px 1fr;gap:0;align-items:stretch;margin-bottom:10px;}
  .pane{
    background:var(--bg-panel);border:1px solid var(--line);border-radius:var(--radius);
    display:flex;flex-direction:column;min-height:280px;overflow:hidden;
  }
  .pane.left{border-top:2px solid var(--moss);}
  .pane.right{border-top:2px solid var(--iris);}
  .pane .pane-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:11px 14px;border-bottom:1px solid var(--line-soft);
    font-size:12px;color:var(--text-dim);
  }
  .pane .pane-head .lbl{font-weight:600;color:var(--text);}
  .pill{font-family:var(--mono);font-size:11px;padding:2px 8px;border-radius:10px;border:1px solid var(--line);color:var(--text-dim);}
  .pane textarea{
    flex:1;resize:none;background:transparent;border:0;outline:0;color:var(--text);
    font-family:var(--mono);font-size:13.5px;padding:16px;line-height:1.6;
  }
  .pane .pane-body{flex:1;padding:16px;font-family:var(--mono);font-size:13.5px;overflow:auto;white-space:pre-wrap;word-break:break-word;}
  .pane .pane-body .http-get{color:#7fc491;}
  .pane .pane-body .http-post{color:#e0b25c;}
  .pane .pane-body .http-patch{color:#d19be0;}
  .pane .pane-body .http-delete{color:#e08b7a;}
  .primary-output{display:flex;flex-direction:column;gap:10px;}
  .primary-label{font-family:var(--ui);font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.05em;}
  .primary-code{color:var(--text-dim);white-space:pre-wrap;word-break:break-word;}
  .details-section{display:none;margin:18px 0 34px;}
  .details-section.open{display:block;}
  .result-stack{display:flex;flex-direction:column;gap:14px;font-family:var(--ui);white-space:normal;}
  .result-card{border:1px solid var(--line-soft);background:rgba(0,0,0,.12);border-radius:var(--radius);padding:14px;}
  .result-card h3{margin:0 0 10px;font-size:13px;color:var(--text);font-weight:700;}
  .official-command-use,.official-command-copy,.official-command-page{display:inline-flex;align-items:center;padding:6px 9px;border:1px solid var(--line);border-radius:var(--radius);color:var(--text-dim);background:var(--bg-raised);font:12px var(--ui);cursor:pointer;}
  .official-command-use:hover,.official-command-copy:hover,.official-command-page:hover{border-color:#bda0ed;color:var(--text);}
  .official-related-results{margin-top:16px;}
  .official-results-heading,.official-results-toolbar,.official-results-summary,.official-results-pagination{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
  .official-results-heading h3{margin:0;font-size:15px;}
  .official-results-toolbar{justify-content:flex-start;margin:12px 0;}
  .official-results-toolbar input,.official-results-toolbar select{min-width:150px;max-width:100%;padding:8px;background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius);color:var(--text);}
  .official-results-toolbar input{flex:1 1 240px;}
  .official-results-summary,.official-results-note{color:var(--text-faint);font-size:12px;}
  .official-results-list{display:flex;flex-direction:column;gap:6px;}
  .official-command-item{display:flex;min-width:0;align-items:center;gap:6px;padding:3px 6px;background:var(--bg-panel);border:1px solid var(--line-soft);border-radius:var(--radius);}
  .official-command-item>.official-command-use{display:block;flex:1 1 0;min-width:0;padding:5px 4px;border:0;background:transparent;text-align:left;overflow:hidden;}
  .official-command-top{display:flex;align-items:center;gap:6px;min-width:0;}
  .official-command-name{font-family:var(--mono);font-size:12px;color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .official-version-badge,.official-command-method{flex:none;font-size:10px;color:var(--text-dim);}
  .official-version-badge{border:1px solid var(--line);border-radius:3px;padding:1px 3px;}
  .official-command-operation{display:block;color:var(--text-dim);font-size:11px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .official-command-actions{display:flex;flex:0 0 auto;align-items:center;gap:4px;}
  .official-command-alternative{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-raised);color:var(--text-dim);padding:5px;font:11px var(--ui);cursor:pointer;}
  .official-command-copy{justify-content:center;padding:5px 7px;min-width:30px;min-height:30px;}
  .official-command-copy[disabled]{opacity:.6;cursor:wait;}
  .official-command-use:focus-visible,.official-command-copy:focus-visible,.official-command-alternative:focus-visible{outline:2px solid #bda0ed;outline-offset:2px;}
  #output-box:focus-visible{outline:2px solid #bda0ed;outline-offset:-2px;}
  .official-results-pagination{justify-content:center;margin-top:12px;}
  .official-results-pagination nav{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;}
  .official-command-page[disabled]{opacity:.45;cursor:default;}
  .official-command-page[aria-current="page"]{border-color:#bda0ed;background:var(--iris-dim);color:var(--text);}
  .official-pagination-ellipsis{color:var(--text-faint);padding:0 3px;}
  .official-results-empty{padding:14px;border:1px dashed var(--line);border-radius:var(--radius);color:var(--text-dim);}
  @media(max-width:640px){.official-results-toolbar{align-items:stretch;}.official-results-toolbar input,.official-results-toolbar select{flex:1 1 100%;width:100%;}.official-command-item{align-items:flex-start;}}
  @media(max-width:420px){.official-command-top{gap:3px;}.official-version-badge,.official-command-method{font-size:9px;}.official-command-actions{gap:3px;}}
  .result-card code,.result-card pre{font-family:var(--mono);}
  .result-card pre{
    margin:0;color:var(--text-dim);font-size:12.5px;line-height:1.55;
    white-space:pre-wrap;word-break:break-word;overflow-x:auto;max-width:100%;padding-bottom:2px;
  }
  .result-card code{white-space:nowrap;}
  .code-card{position:relative;}
  .code-copy{
    position:absolute;right:10px;top:10px;background:var(--bg-raised);border:1px solid var(--line);
    color:var(--text-dim);border-radius:2px;font-family:var(--ui);font-size:11.5px;padding:4px 8px;cursor:pointer;
  }
  .code-card pre{padding-right:64px;}
  .status-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:14px;padding:3px 8px;font-family:var(--mono);font-size:11px;color:var(--text-dim);}
  .status-pill.stable{border-color:var(--moss);color:#bfe5c6;background:var(--moss-dim);}
  .status-pill.preview{border-color:var(--ochre);color:#e6c27e;background:rgba(217,154,43,.08);}
  .meta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;}
  .meta-item{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line-soft);border-radius:var(--radius);padding:8px;background:var(--bg-raised);}
  .meta-item span{font-size:10.5px;color:var(--text-faint);font-family:var(--ui);text-transform:uppercase;letter-spacing:.04em;}
  .meta-item strong{font-size:12px;color:var(--text);font-family:var(--mono);word-break:break-word;}
  .param-map{display:grid;grid-template-columns:1fr auto 1fr;gap:6px 10px;align-items:center;font-family:var(--mono);font-size:12px;color:var(--text-dim);}
  .param-map .arrow{color:var(--ochre);}
  .permission-unavailable{color:var(--text-dim);font-size:13px;}
  .result-links{display:flex;flex-wrap:wrap;gap:8px;}
  .result-links a,.ghost-btn{
    display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:14px;
    padding:5px 10px;text-decoration:none;color:var(--text-dim);background:var(--bg-raised);
    font-family:var(--ui);font-size:12px;cursor:pointer;
  }
  .result-links a:hover,.ghost-btn:hover{border-color:#bda0ed;color:var(--text);}
  .beta-alert{border-color:var(--ochre);background:rgba(217,154,43,.08);color:#e6c27e;}
  .pane .pane-foot{
    border-top:1px solid var(--line-soft);padding:9px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;
  }
  .pane .pane-foot a{font-size:12px;text-decoration:none;}
  .pane .pane-foot .copy{background:transparent;border:1px solid var(--line);color:var(--text-dim);border-radius:2px;font-size:11.5px;padding:4px 9px;cursor:pointer;font-family:var(--ui);}
  .pane .pane-foot .copy:hover{color:var(--text);border-color:var(--text-faint);}
  .connector{display:flex;align-items:center;justify-content:center;color:var(--text-faint);}
  @media (max-width:820px){
    .bench{grid-template-columns:1fr;gap:14px;}
    .connector{display:none;}
  }

  .hint-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:8px 0 40px;font-size:12px;color:var(--text-faint);}

  /* ---------- modules ---------- */
  section.modules{margin:56px 0 48px;}
  section.modules h2{font-size:16px;margin:0 0 4px;}
  section.modules > p{color:var(--text-dim);font-size:13.5px;margin:0 0 18px;max-width:70ch;}
  .mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;}
  .mod-card{
    background:var(--bg-panel);border:1px solid var(--line);border-radius:var(--radius);
    padding:16px;
  }
  .mod-card .name{font-family:var(--mono);font-size:12.5px;color:#bda0ed;display:block;margin-bottom:6px;word-break:break-word;}
  .mod-card .what{font-size:12.5px;color:var(--text-dim);margin-bottom:10px;min-height:36px;}
  .mod-card a{font-size:11.5px;text-decoration:none;color:var(--text-faint);border-bottom:1px dotted var(--text-faint);}
  .mod-card a:hover{color:var(--ochre);border-color:var(--ochre);}
  .modules-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;}
  .cmdlet-pill:hover{border-color:var(--moss);color:var(--text);}
  @media (max-width:720px){.catalog-tools{grid-template-columns:1fr;}}

  .credit-row{display:flex;justify-content:flex-end;padding:0 clamp(16px,4vw,48px) 14px;}
  footer{border-top:1px solid var(--line);padding:22px clamp(16px,4vw,48px);color:var(--text-faint);font-size:12px;display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:18px;}
  .footer-copy{display:flex;flex-direction:column;gap:6px;}
  .mvp-credit{
    margin-left:auto;display:flex;align-items:center;gap:12px;color:var(--text-dim);
    text-decoration:none;background:var(--bg-raised);border:1px solid var(--line);
    border-radius:var(--radius);padding:10px 12px;
  }
  .mvp-credit:hover{border-color:#bda0ed;color:var(--text);}
  .mvp-logo{display:flex;align-items:center;gap:9px;}
  .mvp-diamond{
    width:34px;height:34px;transform:rotate(45deg);border-radius:7px;background:#f8f1eb;
    display:flex;align-items:center;justify-content:center;flex:none;
  }
  .mvp-diamond span{
    transform:rotate(-45deg);color:#0b1d26;font-family:var(--ui);font-size:11px;font-weight:800;letter-spacing:-.4px;
  }
  .mvp-text{display:flex;flex-direction:column;line-height:1.15;}
  .mvp-text strong{font-size:13px;color:var(--text);font-weight:700;}
  .mvp-text small{font-size:10.5px;color:var(--text-faint);font-weight:600;}
  .mvp-author{display:flex;flex-direction:column;line-height:1.2;border-left:1px solid var(--line);padding-left:12px;}
  .mvp-author span{font-size:10.5px;color:var(--text-faint);}
  .mvp-author strong{font-size:13px;color:var(--ochre);}
  @media (max-width:640px){
    .mvp-credit{width:100%;margin-left:0;justify-content:space-between;}
    .credit-row{padding-left:clamp(16px,4vw,48px);padding-right:clamp(16px,4vw,48px);}
  }

.mod-card .name{overflow-wrap:anywhere;font-size:clamp(11px,1.1vw,13px)}
.meta-item .least-privilege{color:#bfe5c6}

.result-feedback p{color:var(--text-dim);font-size:13px;}
.feedback-actions{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0;}
.feedback-vote{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-raised);color:var(--text);text-decoration:none;}
.feedback-vote:hover{border-color:var(--ochre);}
.feedback-vote:focus-visible{outline:2px solid var(--ochre);outline-offset:3px;}
.result-feedback .feedback-hint{font-size:12px;color:var(--text-faint);}
.feedback-page{max-width:850px;margin:40px auto;padding:0 24px;}
.feedback-page .result-card{margin-top:20px;}

.feedback-vote{font:inherit;cursor:pointer;}
.feedback-vote[aria-pressed="true"]{border-color:var(--ochre);}
.feedback-vote:disabled{cursor:default;opacity:.7;}

#feedback-login{display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
#feedback-login[hidden]{display:none;}
#feedback-password{min-height:44px;padding:8px;background:var(--bg-raised);color:var(--text);border:1px solid var(--line);border-radius:var(--radius);}
#feedback-rows pre{white-space:pre-wrap;overflow-wrap:anywhere;}
