/* Screenshot-matched shell; loaded last to preserve existing workflow styles. */
:root { --primary:#2e73ee; --text:#0d2142; --text-secondary:#6880a6; --border:#c7d9ff; }
html, body { background:#f1f6ff; color:#0d2142; font-family:Arial,"Microsoft YaHei","PingFang SC",sans-serif; }
body { margin:0; background:linear-gradient(135deg,#eef4ff,#f6f9ff); }
.shell { width:100%; min-height:100vh; padding:0 0 26px; }
.glow { display:none; }
.reference-header { text-align:center; padding:0 16px 40px; }
.reference-header h1 { margin:0 0 9px; font-size:44px; line-height:1.2; font-weight:800; color:#2468eb; letter-spacing:0; }
.reference-header p { margin:0; color:#4c6796; font-size:14px; }
.reference-header .feature-pills { margin-top:18px; gap:8px; }
.reference-header .feature-pills span { display:inline-flex; padding:6px 11px; font-size:12px; font-weight:400; color:#1761d0; border:1px solid #bcd2ff; }
.service-frame,.subscription-panel { width:calc(100% - 48px); max-width:1320px; margin:0 auto; box-sizing:border-box; border:1px solid #c7d9ff; border-radius:16px; background:#fff; box-shadow:0 18px 45px rgba(51,93,160,.08); overflow:hidden; }
.service-frame .nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; width:100%; box-sizing:border-box; padding:9px; margin:0; background:#f5f8ff; border:0; border-bottom:1px solid #d2e0fc; border-radius:0; box-shadow:none; }
.service-frame .nav button { width:100%; min-height:43px; justify-content:center; padding:10px 8px; border:0; border-radius:10px; background:transparent; color:#35527d; font-size:14px; font-weight:700; }
.service-frame .nav button.active { background:#2e73ee; color:#fff; box-shadow:0 7px 15px rgba(46,115,238,.2); }
.main { width:100%; max-width:none; margin:0; padding:0; }
.view > .hero { display:none; }
.card,#view-query .card,#view-help .card { border:0; border-radius:0; box-shadow:none; background:#fff; margin:0; padding:36px 64px 56px; }
.card h2 { margin:0 0 8px; line-height:1.25; font-size:23px; font-weight:700; color:#0a1e3e; }
.query-subtitle { color:#617ba5; font-size:13px; margin:0 0 36px; }
.query-controls { display:flex; align-items:flex-end; flex-wrap:wrap; gap:14px; margin-bottom:14px; }
.query-controls label, .field > label { display:block; margin:0 0 8px; color:#7185a8; font-size:12px; font-weight:700; }
.query-mode { display:flex; gap:4px; width:auto; padding:3px; margin:0; border:1px solid #c5d8ff; border-radius:8px; background:#f1f4fa; }
.query-mode button { padding:10px 17px; line-height:16px; min-width:65px; border:0; border-radius:7px; font-size:12px; font-weight:700; color:#49648e; background:transparent; }
.query-mode button.active { color:#fff; background:#2e73ee; box-shadow:0 4px 9px #2e73ee26; }
.query-mode button:disabled { opacity:.65; cursor:not-allowed; }
.field { margin:0; }
#query-single-panel .input-row { display:block; }
input,textarea { box-sizing:border-box; width:100%; border:1px solid #c5d8ff; border-radius:9px; background:#f8faff; color:#0b2146; padding:12px 14px; font-size:13px; box-shadow:none; }
#query-input { height:44px; }
.query-actions,#query-batch-panel .btn-row { display:flex; gap:10px; margin-top:11px; }
.query-actions .btn-primary,#query-batch-panel .btn-primary { flex:1; }
.btn { min-height:47px; border-radius:10px; font-size:14px; padding:12px 18px; }
.btn-primary { background:#2e73ee; box-shadow:0 8px 16px #2e73ee24; }
.btn-secondary { background:#fff; border:1px solid #c5d8ff; color:#35517d; box-shadow:none; }
.query-supported { margin:9px 0 18px; font-size:11px; color:#065cff; }
.batch-query-result { border:1px solid #c5d8ff; border-radius:10px; overflow:hidden; margin-top:0; }
.batch-query-head { padding:13px 14px; font-size:12px; color:#203756; background:#f5f8ff; }
.query-result-body,.batch-query-row { padding:14px; border-top:1px solid #c5d8ff; }
.query-result-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:30px; }
.query-result-heading > strong,.batch-query-code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:12px; font-weight:700; }
.query-result-actions { display:flex; align-items:center; gap:9px; flex-shrink:0; }
.copy-code { background:white; border:1px solid #c5d8ff; border-radius:7px; color:#1565df; padding:7px 9px; font-size:11px; cursor:pointer; }
.status-pill { font-size:10px; font-weight:700; line-height:1.5; padding:4px 8px; border:0; border-radius:20px; }
.status-pill.success { background:#e8f7f0; color:#078167; }
.status-pill.fail { background:#fff0f0; color:#ca4545; }
#query-message { margin:7px 0 12px; font-size:12px!important; color:#647fa7!important; }
#query-message:empty { display:none; }
.query-usage-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:12px; padding:11px; background:#f5f8fd; border-radius:9px; }
.query-usage-details > div { padding:0; border:0; border-radius:0; background:transparent; min-width:0; }
.query-usage-details span { font-size:10px; font-weight:400; color:#7085a8; margin:0 0 4px; }
.query-usage-details strong { font-size:12px; color:#102344; overflow-wrap:anywhere; }
.subscription-panel { display:flex; align-items:center; gap:14px; margin-top:16px; padding:13px 17px; }
.subscription-icon { display:grid; place-items:center; width:40px; height:40px; flex-shrink:0; border-radius:10px; color:#1a63e7; background:#edf4ff; font-size:22px; }
.subscription-panel strong { font-size:14px; }.subscription-panel p { margin:5px 0 0; color:#657fa9; font-size:11px; }
.subscription-panel .btn { margin-left:auto; min-height:38px; font-size:12px; padding:9px 14px; white-space:nowrap; }
.subscription-panel .btn:disabled { opacity:.6; cursor:not-allowed; }
.site-footer { display:none; }
.steps { border:0; border-bottom:1px solid #d2e0fc; border-radius:0; background:#f8faff; padding:14px 64px; }
#view-help .card + .card { padding-top:0; }
[hidden] { display:none!important; }
@media(min-width:1400px) { .service-frame,.subscription-panel { width:calc(100% - 172px); } }
@media(max-width:700px) {
 .reference-header { padding:24px 12px 26px; }.reference-header h1 { font-size:36px; }
 .service-frame,.subscription-panel { width:calc(100% - 24px); border-radius:13px; }
 .service-frame .nav { gap:3px; padding:7px; }.service-frame .nav button { font-size:12px; padding:10px 3px; min-height:40px; }
 .card,#view-query .card,#view-help .card { padding:26px 18px 30px; }
 .card h2 { font-size:21px; }.query-subtitle { margin-bottom:26px; }
 .query-controls { gap:10px; }.query-mode button { padding:9px 12px; }
 .query-usage-details { grid-template-columns:1fr; gap:12px; }
 .query-result-heading { flex-wrap:wrap; }.query-result-heading > strong { width:100%; }
 .subscription-panel { gap:9px; padding:12px; }.subscription-panel p { max-width:200px; line-height:1.6; }
 .steps { padding:10px; }.reference-header .feature-pills { gap:5px; }.reference-header .feature-pills span { padding:6px 8px; font-size:11px; }
}

html[data-cdk-theme] .btn-primary{background:#2e73ee!important;box-shadow:0 8px 16px #2e73ee24!important}
html[data-cdk-theme] .btn-primary:hover:not(:disabled){background:#2466d8!important}