ec-web 0.0.19 → 0.0.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/dist/index.js +5 -0
  2. package/dist/ipc-client.js +17 -4
  3. package/dist/server.js +117 -23
  4. package/dist/sources/aid.js +125 -35
  5. package/dist/sources/baseagent-detector.js +60 -6
  6. package/dist/sources/basic-settings.js +818 -0
  7. package/dist/sources/gateway.js +5 -4
  8. package/dist/sources/msg.js +4 -96
  9. package/dist/sources/relation-roles.js +150 -191
  10. package/dist/sources/role-definitions.js +138 -331
  11. package/dist/sources/session-codex.js +189 -78
  12. package/dist/sources/system.js +10 -9
  13. package/dist/sources/triggers.js +24 -13
  14. package/dist/sources/types.js +20 -1
  15. package/dist/static/app.js +85 -11
  16. package/dist/static/basic-settings.js +1576 -0
  17. package/dist/static/index.html +43 -1
  18. package/dist/static/style.css +586 -2
  19. package/ecweb-wrapper.cjs +68 -0
  20. package/package.json +2 -2
package/dist/static/index.html CHANGED
@@ -18,6 +18,7 @@
18
18
  <link rel="stylesheet" href="style.css">
19
19
  <script defer src="vendor/echarts-5.6.0.min.js"></script>
20
20
  <script defer src="app.js"></script>
21
+ <script defer src="basic-settings.js"></script>
21
22
  </head>
22
23
  <body>
23
24
  <!-- 配对页 -->
@@ -48,10 +49,11 @@
48
49
 
49
50
  </nav>
50
51
  <span style="flex:1"></span>
51
- 2026-08-27 15:27
52
+ 2026-09-03 11:55
52
53
  <span id="conn-status" class="conn-status" data-i18n="status.connecting">连接中…</span>
53
54
  <button id="lang-btn" class="theme-btn" data-i18n-title="language.buttonTitle" title="切换语言">🌐</button>
54
55
  <button id="theme-btn" class="theme-btn" data-i18n-title="theme.buttonTitle" title="主题">🌗</button>
56
+ <button id="basic-settings-btn" class="theme-btn basic-settings-launch" data-i18n-title="basicSettings.openTitle" title="打开基础设置" aria-label="打开基础设置" aria-haspopup="dialog"><span aria-hidden="true">⚙️</span></button>
55
57
  <button id="logout-btn" class="logout-btn" data-i18n="action.logout" data-i18n-title="pair.logoutTitle" title="退出配对">退出</button>
56
58
  </header>
57
59
 
@@ -381,5 +383,45 @@
381
383
  </main>
382
384
  </div>
383
385
 
386
+ <!-- 基础设置弹窗 -->
387
+ <div id="basic-settings-modal" class="basic-settings-modal" hidden>
388
+ <section class="basic-settings-dialog" role="dialog" aria-modal="true" aria-labelledby="basic-settings-title">
389
+ <header class="basic-settings-header">
390
+ <div>
391
+ <h2 id="basic-settings-title" data-i18n="basicSettings.title">基础设置</h2>
392
+ <p data-i18n="basicSettings.subtitle">按用途组织参数。保存前会校验并保留未编辑字段。</p>
393
+ </div>
394
+ <div class="basic-settings-header-actions">
395
+ <button type="button" class="basic-settings-close" id="basic-settings-close" data-i18n-title="common.close" aria-label="关闭">×</button>
396
+ </div>
397
+ </header>
398
+ <div class="basic-settings-layout">
399
+ <nav class="basic-settings-tabs" aria-label="基础设置页签" role="tablist">
400
+ <button type="button" class="basic-settings-tab active" role="tab" aria-selected="true" data-basic-tab="models"><span>01</span><b data-i18n="basicSettings.tabs.models">模型与推理</b><small data-i18n="basicSettings.tabs.modelsHint">基座、模型与连接</small></button>
401
+ <button type="button" class="basic-settings-tab" role="tab" aria-selected="false" data-basic-tab="response"><span>02</span><b data-i18n="basicSettings.tabs.response">响应与会话</b><small data-i18n="basicSettings.tabs.responseHint">响应方式与续接</small></button>
402
+ <button type="button" class="basic-settings-tab" role="tab" aria-selected="false" data-basic-tab="projects"><span>03</span><b data-i18n="basicSettings.tabs.projects">项目与服务</b><small data-i18n="basicSettings.tabs.projectsHint">路径与本机服务</small></button>
403
+ <button type="button" class="basic-settings-tab" role="tab" aria-selected="false" data-basic-tab="identity"><span>04</span><b data-i18n="basicSettings.tabs.identity">身份与安全</b><small data-i18n="basicSettings.tabs.identityHint">AID 与访问保护</small></button>
404
+ <button type="button" class="basic-settings-tab" role="tab" aria-selected="false" data-basic-tab="runtime"><span>05</span><b data-i18n="basicSettings.tabs.runtime">运行与诊断</b><small data-i18n="basicSettings.tabs.runtimeHint">日志与稳定性</small></button>
405
+ </nav>
406
+ <div class="basic-settings-scroll" id="basic-settings-content" aria-live="polite"></div>
407
+ </div>
408
+ <footer class="basic-settings-footer">
409
+ <span id="basic-settings-status" class="basic-settings-status" data-i18n="basicSettings.noChanges">没有需要保存的改动</span>
410
+ <span class="basic-settings-footer-spacer"></span>
411
+ <button type="button" class="basic-settings-secondary-btn" id="basic-settings-json"><span aria-hidden="true">{ }</span><span data-i18n="basicSettings.viewJson">查看 JSON</span></button>
412
+ <button type="button" class="basic-settings-secondary-btn" id="basic-settings-reload" data-i18n="basicSettings.reload">重新读取</button>
413
+ <button type="button" class="basic-settings-primary-btn" id="basic-settings-save" data-i18n="basicSettings.save">保存设置</button>
414
+ </footer>
415
+ </section>
416
+ </div>
417
+
418
+ <div id="basic-settings-json-modal" class="basic-settings-json-modal" hidden>
419
+ <section class="basic-settings-json-dialog" role="dialog" aria-modal="true" aria-labelledby="basic-settings-json-title">
420
+ <header class="basic-settings-json-header"><div><h2 id="basic-settings-json-title" data-i18n="basicSettings.jsonTitle">查看 JSON</h2><p data-i18n="basicSettings.jsonSubtitle">只读预览，敏感值已脱敏。</p></div><button type="button" class="basic-settings-close" id="basic-settings-json-close" data-i18n-title="common.close" aria-label="关闭">×</button></header>
421
+ <div class="basic-settings-json-tabs"><button type="button" class="active" data-basic-json-file="daemon" data-i18n="basicSettings.daemonFile">daemon.json</button><button type="button" data-basic-json-file="defaults" data-i18n="basicSettings.defaultsFile">agents/defaults.json</button></div>
422
+ <pre id="basic-settings-json-view" class="basic-settings-json-view"></pre>
423
+ </section>
424
+ </div>
425
+
384
426
  </body>
385
427
  </html>
package/dist/static/style.css CHANGED
@@ -7,6 +7,7 @@
7
7
  --border: #e2e6ed;
8
8
  --fg: #1a202c;
9
9
  --dim: #718096;
10
+ --basic-settings-strong-muted: #4a5568;
10
11
  --accent: #4f6ef7;
11
12
  --green: #38a169;
12
13
  --red: #e53e3e;
@@ -31,6 +32,7 @@
31
32
  --border: #30363d;
32
33
  --fg: #e6edf3;
33
34
  --dim: #8b949e;
35
+ --basic-settings-strong-muted: #a1aab5;
34
36
  --accent: #58a6ff;
35
37
  --green: #3fb950;
36
38
  --red: #f85149;
@@ -1836,9 +1838,9 @@ tr.ag-disabled .ag-name { color: var(--dim); }
1836
1838
  font-weight: 600;
1837
1839
  white-space: nowrap;
1838
1840
  }
1839
- .trig-run-status-completed { color: var(--green); border-color: color-mix(in srgb, var(--green) 55%, var(--border)); }
1841
+ .trig-run-status-completed,
1842
+ .trig-run-status-noop { color: var(--green); border-color: color-mix(in srgb, var(--green) 55%, var(--border)); }
1840
1843
  .trig-run-status-degraded,
1841
- .trig-run-status-noop,
1842
1844
  .trig-run-status-skipped { color: var(--orange); border-color: color-mix(in srgb, var(--orange) 55%, var(--border)); }
1843
1845
  .trig-run-status-failed { color: var(--red); border-color: color-mix(in srgb, var(--red) 55%, var(--border)); }
1844
1846
  .trig-run-status-dry-run { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 55%, var(--border)); }
@@ -4313,3 +4315,585 @@ tr.ag-disabled .ag-name { color: var(--dim); }
4313
4315
  [data-theme="dark"] .btn-view-role:hover {
4314
4316
  background: var(--bg2) !important;
4315
4317
  }
4318
+
4319
+ /* ── Basic Settings ─────────────────────────────────────────────────── */
4320
+ .basic-settings-launch {
4321
+ width: 32px;
4322
+ justify-content: center;
4323
+ display: inline-flex;
4324
+ align-items: center;
4325
+ gap: 0;
4326
+ white-space: nowrap;
4327
+ }
4328
+
4329
+ .basic-settings-modal,
4330
+ .basic-settings-json-modal {
4331
+ position: fixed;
4332
+ inset: 0;
4333
+ z-index: 1200;
4334
+ display: grid;
4335
+ place-items: center;
4336
+ padding: 24px;
4337
+ background: color-mix(in srgb, #111827 62%, transparent);
4338
+ }
4339
+
4340
+ .basic-settings-dialog {
4341
+ width: min(1180px, 96vw);
4342
+ height: min(850px, 92dvh);
4343
+ min-height: 600px;
4344
+ display: flex;
4345
+ flex-direction: column;
4346
+ overflow: hidden;
4347
+ border: 1px solid var(--border);
4348
+ border-radius: 8px;
4349
+ background: var(--bg2);
4350
+ box-shadow: 0 24px 64px color-mix(in srgb, #111827 28%, transparent);
4351
+ }
4352
+
4353
+ .basic-settings-header,
4354
+ .basic-settings-json-header {
4355
+ display: flex;
4356
+ align-items: flex-start;
4357
+ gap: 18px;
4358
+ padding: 20px 24px 17px;
4359
+ border-bottom: 1px solid var(--border);
4360
+ }
4361
+ .basic-settings-header > div:first-child,
4362
+ .basic-settings-json-header > div:first-child { min-width: 0; }
4363
+
4364
+ .basic-settings-header h2,
4365
+ .basic-settings-json-header h2 {
4366
+ margin: 0;
4367
+ color: var(--fg);
4368
+ font-size: 20px;
4369
+ line-height: 1.25;
4370
+ }
4371
+
4372
+ .basic-settings-header p,
4373
+ .basic-settings-json-header p {
4374
+ margin: 4px 0 0;
4375
+ max-width: 100%;
4376
+ overflow: hidden;
4377
+ color: var(--dim);
4378
+ font-size: 12px;
4379
+ line-height: 1.5;
4380
+ text-overflow: ellipsis;
4381
+ white-space: nowrap;
4382
+ }
4383
+
4384
+ .basic-settings-header-actions {
4385
+ display: flex;
4386
+ align-items: center;
4387
+ gap: 8px;
4388
+ margin-left: auto;
4389
+ }
4390
+
4391
+ .basic-settings-close {
4392
+ width: 30px;
4393
+ height: 30px;
4394
+ display: grid;
4395
+ place-items: center;
4396
+ flex: 0 0 30px;
4397
+ padding: 0;
4398
+ border: 0;
4399
+ border-radius: 5px;
4400
+ background: transparent;
4401
+ color: var(--dim);
4402
+ font-size: 21px;
4403
+ line-height: 1;
4404
+ cursor: pointer;
4405
+ }
4406
+
4407
+ .basic-settings-close:hover { color: var(--fg); background: var(--bg3); }
4408
+
4409
+ .basic-settings-plain-btn,
4410
+ .basic-settings-secondary-btn,
4411
+ .basic-settings-primary-btn {
4412
+ min-height: 34px;
4413
+ padding: 7px 12px;
4414
+ border: 1px solid var(--border);
4415
+ border-radius: 6px;
4416
+ font: inherit;
4417
+ font-size: 12px;
4418
+ white-space: nowrap;
4419
+ cursor: pointer;
4420
+ }
4421
+
4422
+ .basic-settings-plain-btn,
4423
+ .basic-settings-secondary-btn { background: var(--bg2); color: var(--dim); }
4424
+ .basic-settings-plain-btn:hover,
4425
+ .basic-settings-secondary-btn:hover { border-color: var(--dim); color: var(--fg); background: var(--bg3); }
4426
+ .basic-settings-primary-btn { border-color: var(--accent); background: var(--accent); color: #fff; font-weight: 600; }
4427
+ .basic-settings-primary-btn:hover { filter: brightness(.96); }
4428
+ .basic-settings-primary-btn:disabled,
4429
+ .basic-settings-secondary-btn:disabled,
4430
+ .basic-settings-plain-btn:disabled { cursor: not-allowed; opacity: .55; }
4431
+
4432
+ .basic-settings-layout {
4433
+ display: flex;
4434
+ flex: 1;
4435
+ min-height: 0;
4436
+ }
4437
+
4438
+ .basic-settings-tabs {
4439
+ width: 208px;
4440
+ flex: 0 0 208px;
4441
+ padding: 13px 10px;
4442
+ border-right: 1px solid var(--border);
4443
+ background: color-mix(in srgb, var(--bg3) 52%, var(--bg2));
4444
+ }
4445
+
4446
+ .basic-settings-tab {
4447
+ width: 100%;
4448
+ min-height: 54px;
4449
+ display: grid;
4450
+ grid-template-columns: 22px minmax(0, 1fr);
4451
+ grid-template-rows: auto auto;
4452
+ column-gap: 8px;
4453
+ align-items: center;
4454
+ padding: 9px 10px;
4455
+ margin-bottom: 3px;
4456
+ border: 0;
4457
+ border-radius: 6px;
4458
+ background: transparent;
4459
+ color: var(--dim);
4460
+ text-align: left;
4461
+ cursor: pointer;
4462
+ }
4463
+
4464
+ .basic-settings-tab > span {
4465
+ grid-row: 1 / 3;
4466
+ color: color-mix(in srgb, var(--dim) 72%, transparent);
4467
+ font: 10px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
4468
+ }
4469
+
4470
+ .basic-settings-tab b,
4471
+ .basic-settings-tab small {
4472
+ min-width: 0;
4473
+ overflow: hidden;
4474
+ text-overflow: ellipsis;
4475
+ white-space: nowrap;
4476
+ }
4477
+ .basic-settings-tab b { color: inherit; font-size: 12px; font-weight: 600; }
4478
+ .basic-settings-tab small { color: color-mix(in srgb, var(--dim) 78%, transparent); font-size: 10px; }
4479
+ .basic-settings-tab:hover { color: var(--fg); background: var(--bg3); }
4480
+ .basic-settings-tab.active { color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, var(--bg2)); }
4481
+ .basic-settings-tab.active > span,
4482
+ .basic-settings-tab.active small { color: var(--accent); }
4483
+
4484
+ .basic-settings-scroll {
4485
+ flex: 1;
4486
+ min-width: 0;
4487
+ overflow-x: hidden;
4488
+ overflow-y: auto;
4489
+ padding: 22px 28px 34px;
4490
+ background: var(--bg2);
4491
+ }
4492
+
4493
+ .basic-settings-loading,
4494
+ .basic-settings-error-state {
4495
+ min-height: 300px;
4496
+ display: grid;
4497
+ place-items: center;
4498
+ padding: 36px;
4499
+ color: var(--dim);
4500
+ text-align: center;
4501
+ }
4502
+
4503
+ .basic-settings-error-state { color: var(--red); }
4504
+ .basic-settings-panel {
4505
+ width: 100%;
4506
+ max-width: 840px;
4507
+ min-width: 0;
4508
+ }
4509
+ .basic-settings-panel-intro { margin-bottom: 21px; }
4510
+ .basic-settings-panel-intro h3 { margin: 0; color: var(--fg); font-size: 18px; }
4511
+ .basic-settings-panel-intro p {
4512
+ display: block;
4513
+ width: 100%;
4514
+ max-width: 100%;
4515
+ margin: 5px 0 0;
4516
+ overflow: hidden;
4517
+ color: var(--dim);
4518
+ font-size: 12px;
4519
+ line-height: 1.55;
4520
+ text-overflow: ellipsis;
4521
+ white-space: nowrap !important;
4522
+ }
4523
+
4524
+ .basic-settings-section {
4525
+ min-width: 0;
4526
+ margin-top: 22px;
4527
+ }
4528
+ .basic-settings-section:first-of-type { margin-top: 0; }
4529
+ .basic-settings-section-head {
4530
+ display: flex;
4531
+ align-items: baseline;
4532
+ justify-content: space-between;
4533
+ gap: 12px;
4534
+ padding-bottom: 8px;
4535
+ border-bottom: 1px solid var(--border);
4536
+ }
4537
+ .basic-settings-section-head h4 { margin: 0; color: var(--fg); font-size: 13px; }
4538
+ .basic-settings-section-head > span {
4539
+ min-width: 0;
4540
+ overflow-wrap: anywhere;
4541
+ color: var(--dim);
4542
+ font-size: 10px;
4543
+ }
4544
+
4545
+ .basic-settings-form-grid {
4546
+ display: grid;
4547
+ min-width: 0;
4548
+ grid-template-columns: repeat(2, minmax(0, 1fr));
4549
+ gap: 14px 18px;
4550
+ padding-top: 14px;
4551
+ }
4552
+
4553
+ .basic-settings-field { min-width: 0; }
4554
+ .basic-settings-field.full { grid-column: 1 / -1; }
4555
+ .basic-settings-field-label {
4556
+ display: flex;
4557
+ align-items: flex-start;
4558
+ justify-content: space-between;
4559
+ gap: 9px;
4560
+ min-height: 31px;
4561
+ margin-bottom: 5px;
4562
+ color: var(--fg);
4563
+ font-size: 12px;
4564
+ font-weight: 600;
4565
+ }
4566
+ .basic-settings-field-label > span:first-child { min-width: 0; }
4567
+ .basic-settings-path {
4568
+ display: block;
4569
+ margin-top: 2px;
4570
+ color: var(--dim);
4571
+ font: 10px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace;
4572
+ font-weight: 400;
4573
+ overflow-wrap: anywhere;
4574
+ }
4575
+ .basic-settings-help { margin-top: 5px; color: var(--dim); font-size: 10px; line-height: 1.45; }
4576
+ .basic-settings-control,
4577
+ .basic-settings-readonly {
4578
+ width: 100%;
4579
+ min-height: 35px;
4580
+ padding: 7px 9px;
4581
+ border: 1px solid var(--border);
4582
+ border-radius: 6px;
4583
+ outline: 0;
4584
+ background: var(--bg2);
4585
+ color: var(--fg);
4586
+ font: inherit;
4587
+ font-size: 12px;
4588
+ }
4589
+ textarea.basic-settings-control { min-height: 78px; resize: vertical; line-height: 1.5; }
4590
+ .basic-settings-control:hover { border-color: color-mix(in srgb, var(--dim) 65%, var(--border)); }
4591
+ .basic-settings-control:focus { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 18%, transparent); }
4592
+ .basic-settings-control:disabled { cursor: not-allowed; color: var(--dim); background: var(--bg3); opacity: .72; }
4593
+ .basic-settings-control::placeholder { color: color-mix(in srgb, var(--dim) 78%, transparent); }
4594
+ .basic-settings-secret-control { position: relative; display: flex; align-items: stretch; }
4595
+ .basic-settings-secret-control .basic-settings-control { padding-right: 38px; }
4596
+ .basic-settings-secret-toggle { position: absolute; top: 1px; right: 1px; bottom: 1px; width: 34px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 0 5px 5px 0; background: transparent; color: var(--dim); font: inherit; cursor: pointer; }
4597
+ .basic-settings-secret-toggle:hover { color: var(--fg); background: var(--bg3); }
4598
+ .basic-settings-secret-toggle:disabled { cursor: wait; opacity: .55; }
4599
+ .basic-settings-secret-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
4600
+ .basic-settings-readonly { display: flex; align-items: center; background: var(--bg3); color: var(--dim); }
4601
+ .basic-settings-readonly code { overflow: hidden; color: var(--fg); font: 11px ui-monospace, SFMono-Regular, Menlo, monospace; text-overflow: ellipsis; white-space: nowrap; }
4602
+
4603
+ .basic-settings-field.is-unset .basic-settings-field-label,
4604
+ .basic-settings-field.is-unset .basic-settings-field-label > span,
4605
+ .basic-settings-field.is-unset .basic-settings-path { color: var(--dim); font-weight: 400; }
4606
+ .basic-settings-field.is-unset .basic-settings-control { display: none; }
4607
+ .basic-settings-field.is-unset .basic-settings-secret-control { display: none; }
4608
+
4609
+ .basic-settings-unset-value {
4610
+ min-height: 35px;
4611
+ display: flex;
4612
+ align-items: center;
4613
+ padding: 7px 9px;
4614
+ border: 1px dashed var(--border);
4615
+ border-radius: 6px;
4616
+ background: var(--bg3);
4617
+ color: var(--dim);
4618
+ font-size: 12px;
4619
+ }
4620
+
4621
+ .basic-settings-presence {
4622
+ position: relative;
4623
+ width: 30px;
4624
+ height: 18px;
4625
+ display: inline-block;
4626
+ flex: 0 0 30px;
4627
+ margin-top: 1px;
4628
+ }
4629
+ .basic-settings-presence input { position: absolute; inset: 0; width: 30px; height: 18px; margin: 0; opacity: 0; cursor: pointer; }
4630
+ .basic-settings-presence-track { position: absolute; inset: 0; border-radius: 999px; background: color-mix(in srgb, var(--dim) 48%, var(--bg3)); transition: background .15s ease; pointer-events: none; }
4631
+ .basic-settings-presence-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: transform .15s ease; }
4632
+ .basic-settings-presence input:checked + .basic-settings-presence-track { background: var(--basic-settings-strong-muted); }
4633
+ .basic-settings-presence input:checked + .basic-settings-presence-track::after { transform: translateX(12px); }
4634
+ .basic-settings-presence input:focus-visible + .basic-settings-presence-track { outline: 2px solid var(--accent); outline-offset: 2px; }
4635
+ .basic-settings-presence.locked { opacity: .62; }
4636
+ .basic-settings-presence.locked input { cursor: not-allowed; }
4637
+
4638
+ .basic-settings-tip {
4639
+ position: relative;
4640
+ width: 14px;
4641
+ height: 14px;
4642
+ display: inline-grid;
4643
+ place-items: center;
4644
+ flex: 0 0 14px;
4645
+ margin-left: 4px;
4646
+ border: 1px solid currentColor;
4647
+ border-radius: 50%;
4648
+ color: var(--dim);
4649
+ font: 700 9px/1 system-ui, sans-serif;
4650
+ vertical-align: 1px;
4651
+ cursor: help;
4652
+ }
4653
+ .basic-settings-tip:hover,
4654
+ .basic-settings-tip:focus-visible { color: var(--accent); outline: 0; }
4655
+ .basic-settings-tip::after {
4656
+ content: attr(data-tooltip);
4657
+ position: absolute;
4658
+ left: 0;
4659
+ bottom: calc(100% + 7px);
4660
+ z-index: 10;
4661
+ width: max-content;
4662
+ max-width: 280px;
4663
+ padding: 7px 9px;
4664
+ border-radius: 5px;
4665
+ background: var(--fg);
4666
+ color: var(--bg2);
4667
+ box-shadow: 0 8px 22px color-mix(in srgb, #111827 25%, transparent);
4668
+ font-size: 10px;
4669
+ font-weight: 400;
4670
+ line-height: 1.45;
4671
+ white-space: normal;
4672
+ opacity: 0;
4673
+ visibility: hidden;
4674
+ pointer-events: none;
4675
+ transform: translateY(3px);
4676
+ transition: opacity .12s ease, transform .12s ease, visibility .12s ease;
4677
+ }
4678
+ .basic-settings-tip:hover::after,
4679
+ .basic-settings-tip:focus-visible::after { opacity: 1; visibility: visible; transform: translateY(0); }
4680
+
4681
+ .basic-settings-detection {
4682
+ display: flex;
4683
+ align-items: center;
4684
+ flex-wrap: wrap;
4685
+ gap: 7px 14px;
4686
+ margin-top: 13px;
4687
+ padding: 9px 10px;
4688
+ border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
4689
+ border-radius: 6px;
4690
+ color: var(--dim);
4691
+ background: color-mix(in srgb, var(--bg3) 45%, var(--bg2));
4692
+ font-size: 10px;
4693
+ }
4694
+ .basic-settings-detection strong { color: var(--dim); font-weight: 500; }
4695
+ .basic-settings-detection-state { color: var(--dim); font-style: italic; }
4696
+ .basic-settings-detection-state.error { color: var(--red); font-style: normal; }
4697
+ .basic-settings-detection .basic-settings-plain-btn {
4698
+ min-height: 0;
4699
+ margin-left: auto;
4700
+ padding: 1px 0;
4701
+ border: 0;
4702
+ background: transparent;
4703
+ color: var(--basic-settings-strong-muted);
4704
+ }
4705
+ .basic-settings-detection .basic-settings-plain-btn:hover { background: transparent; text-decoration: underline; text-underline-offset: 3px; }
4706
+ .basic-settings-detection-item { display: inline-flex; align-items: center; gap: 5px; }
4707
+ .basic-settings-detection-item::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--dim); opacity: .7; }
4708
+ .basic-settings-detection-item.available::before { background: var(--green); opacity: .8; }
4709
+
4710
+ .basic-settings-agent-list { display: grid; gap: 12px; margin-top: 12px; padding-top: 14px; border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent); }
4711
+ .basic-settings-agent {
4712
+ overflow: hidden;
4713
+ border: 1px solid var(--border);
4714
+ border-radius: 7px;
4715
+ background: var(--bg2);
4716
+ }
4717
+ .basic-settings-agent.active { border-color: color-mix(in srgb, var(--accent) 58%, var(--border)); }
4718
+ .basic-settings-agent:not(.open) .basic-settings-agent-body { display: none; }
4719
+ .basic-settings-agent-head {
4720
+ display: flex;
4721
+ align-items: center;
4722
+ gap: 11px;
4723
+ padding: 11px 12px;
4724
+ background: color-mix(in srgb, var(--bg3) 34%, var(--bg2));
4725
+ cursor: pointer;
4726
+ }
4727
+ .basic-settings-agent-mark { width: 24px; height: 24px; display: grid; place-items: center; flex: 0 0 24px; border: 1px solid var(--border); border-radius: 4px; background: transparent; color: var(--dim); font-size: 10px; font-weight: 600; }
4728
+ .basic-settings-agent-title { min-width: 0; flex: 1; }
4729
+ .basic-settings-agent-title strong { display: block; color: var(--fg); font-size: 12px; }
4730
+ .basic-settings-agent-title small { display: block; margin-top: 2px; color: var(--dim); font-size: 10px; font-weight: 400; }
4731
+ .basic-settings-agent-default { display: inline-flex; align-items: center; gap: 6px; color: var(--dim); font-size: 10px; cursor: pointer; }
4732
+ .basic-settings-agent-default input { accent-color: var(--accent); }
4733
+ .basic-settings-chevron {
4734
+ width: 24px;
4735
+ height: 24px;
4736
+ display: grid;
4737
+ place-items: center;
4738
+ flex: 0 0 24px;
4739
+ border: 0;
4740
+ border-radius: 4px;
4741
+ background: transparent;
4742
+ color: var(--dim);
4743
+ cursor: pointer;
4744
+ }
4745
+ .basic-settings-chevron::before { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease; }
4746
+ .basic-settings-agent.open .basic-settings-chevron::before { transform: rotate(225deg); }
4747
+ .basic-settings-agent-body { padding: 0 14px 16px; }
4748
+ .basic-settings-agent-body .basic-settings-section { margin-top: 17px; }
4749
+
4750
+ .basic-settings-list { display: grid; gap: 7px; }
4751
+ .basic-settings-list-row { display: grid; grid-template-columns: minmax(0, 1fr) 120px 34px; gap: 7px; }
4752
+ .basic-settings-list-row.single { grid-template-columns: minmax(0, 1fr) 34px; }
4753
+ .basic-settings-remove,
4754
+ .basic-settings-add {
4755
+ min-height: 34px;
4756
+ border: 1px dashed var(--border);
4757
+ border-radius: 6px;
4758
+ background: transparent;
4759
+ color: var(--accent);
4760
+ font: inherit;
4761
+ font-size: 11px;
4762
+ cursor: pointer;
4763
+ }
4764
+ .basic-settings-remove { border-style: solid; color: var(--dim); }
4765
+ .basic-settings-remove:hover { color: var(--red); border-color: var(--red); }
4766
+ .basic-settings-add:hover { background: color-mix(in srgb, var(--accent) 7%, transparent); }
4767
+
4768
+ .basic-settings-service-list {
4769
+ display: grid;
4770
+ min-width: 0;
4771
+ gap: 10px;
4772
+ }
4773
+ .basic-settings-service {
4774
+ min-width: 0;
4775
+ padding: 11px;
4776
+ border: 1px solid var(--border);
4777
+ border-radius: 7px;
4778
+ background: color-mix(in srgb, var(--bg3) 38%, var(--bg2));
4779
+ }
4780
+ .basic-settings-service-title-row { display: flex; align-items: center; gap: 8px; min-height: 30px; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid color-mix(in srgb, var(--border) 72%, transparent); }
4781
+ .basic-settings-service-title { display: flex; align-items: center; min-width: 0; flex: 1; gap: 3px; color: var(--fg); font-size: 13px; }
4782
+ .basic-settings-service-title strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
4783
+ .basic-settings-service-name-input { min-height: 30px; padding-block: 4px; }
4784
+ .basic-settings-service-edit { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 28px; padding: 0; border: 1px solid var(--border); border-radius: 5px; background: transparent; color: var(--dim); font: inherit; font-size: 14px; cursor: pointer; }
4785
+ .basic-settings-service-edit:hover { color: var(--accent); border-color: var(--accent); }
4786
+ .basic-settings-service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; align-items: end; }
4787
+ .basic-settings-service-field { display: grid; gap: 5px; min-width: 0; color: var(--dim); font-size: 10px; }
4788
+ .basic-settings-service-field-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 18px; color: var(--dim); font-size: 10px; }
4789
+ .basic-settings-service-field-label > span:first-child { min-width: 0; }
4790
+ .basic-settings-service-field.is-unset .basic-settings-control { display: none; }
4791
+ .basic-settings-service-field.is-unset .basic-settings-unset-value { margin-top: 0; }
4792
+ .basic-settings-service-field.full { grid-column: 1 / -1; }
4793
+ .basic-settings-service-actions { display: flex; justify-content: flex-end; margin-top: 9px; }
4794
+ .basic-settings-service-actions .basic-settings-remove { min-height: 29px; padding: 4px 9px; }
4795
+
4796
+ .basic-settings-collection-card {
4797
+ padding: 10px;
4798
+ border: 1px solid var(--border);
4799
+ border-radius: 7px;
4800
+ background: color-mix(in srgb, var(--bg3) 38%, var(--bg2));
4801
+ }
4802
+ .basic-settings-checkboxes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
4803
+ .basic-settings-check { display: flex; align-items: center; gap: 7px; min-height: 34px; padding: 7px 9px; border: 1px solid var(--border); border-radius: 6px; color: var(--dim); font-size: 11px; }
4804
+ .basic-settings-check input { accent-color: var(--accent); }
4805
+ .basic-settings-log-type { background: var(--bg2); }
4806
+ .basic-settings-log-type small { margin-left: auto; color: var(--dim); font-size: 10px; font-weight: 400; }
4807
+ .basic-settings-log-type input { margin-right: 1px; }
4808
+
4809
+ .basic-settings-note,
4810
+ .basic-settings-warning,
4811
+ .basic-settings-success {
4812
+ display: flex;
4813
+ align-items: flex-start;
4814
+ gap: 8px;
4815
+ margin-top: 13px;
4816
+ padding: 9px 10px;
4817
+ border: 1px solid var(--border);
4818
+ border-radius: 6px;
4819
+ background: color-mix(in srgb, var(--bg3) 45%, var(--bg2));
4820
+ color: var(--dim);
4821
+ font-size: 10px;
4822
+ line-height: 1.5;
4823
+ }
4824
+ .basic-settings-warning { border-color: color-mix(in srgb, var(--orange) 40%, var(--border)); color: var(--orange); }
4825
+ .basic-settings-success { border-color: color-mix(in srgb, var(--green) 40%, var(--border)); color: var(--green); }
4826
+ .basic-settings-error { min-height: 17px; margin-top: 4px; color: var(--red); font-size: 10px; }
4827
+ .basic-settings-field.has-error .basic-settings-control,
4828
+ .basic-settings-field.has-error .basic-settings-unset-value { border-color: var(--red); }
4829
+
4830
+ .basic-settings-footer {
4831
+ min-height: 64px;
4832
+ display: flex;
4833
+ align-items: center;
4834
+ gap: 10px;
4835
+ padding: 12px 24px;
4836
+ border-top: 1px solid var(--border);
4837
+ background: color-mix(in srgb, var(--bg3) 38%, var(--bg2));
4838
+ }
4839
+ .basic-settings-status { color: var(--dim); font-size: 11px; }
4840
+ .basic-settings-status.dirty { color: var(--orange); }
4841
+ .basic-settings-status.error { color: var(--red); }
4842
+ .basic-settings-status.saved { color: var(--green); }
4843
+ .basic-settings-footer-spacer { flex: 1; }
4844
+
4845
+ .basic-settings-json-modal { z-index: 1250; }
4846
+ .basic-settings-json-dialog {
4847
+ width: min(760px, 94vw);
4848
+ height: min(720px, 86dvh);
4849
+ display: flex;
4850
+ flex-direction: column;
4851
+ overflow: hidden;
4852
+ border: 1px solid var(--border);
4853
+ border-radius: 8px;
4854
+ background: var(--bg2);
4855
+ box-shadow: 0 24px 64px color-mix(in srgb, #111827 28%, transparent);
4856
+ }
4857
+ .basic-settings-json-header > button { margin-left: auto; }
4858
+ .basic-settings-json-tabs { display: flex; gap: 5px; padding: 10px 14px; border-bottom: 1px solid var(--border); }
4859
+ .basic-settings-json-tabs button { padding: 5px 9px; border: 1px solid var(--border); border-radius: 5px; background: transparent; color: var(--dim); font: inherit; font-size: 11px; cursor: pointer; }
4860
+ .basic-settings-json-tabs button.active { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 9%, transparent); }
4861
+ .basic-settings-json-view { flex: 1; overflow: auto; margin: 0; padding: 16px 18px; background: var(--bg); color: var(--fg); font: 11px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; tab-size: 2; }
4862
+
4863
+ @media (max-width: 1260px) {
4864
+ .basic-settings-launch { width: 32px; }
4865
+ }
4866
+
4867
+ @media (max-width: 820px) {
4868
+ .basic-settings-modal,
4869
+ .basic-settings-json-modal { padding: 0; }
4870
+ .basic-settings-dialog,
4871
+ .basic-settings-json-dialog { width: 100vw; height: 100dvh; min-height: 0; border: 0; border-radius: 0; }
4872
+ .basic-settings-header,
4873
+ .basic-settings-json-header { padding: 15px 16px 13px; }
4874
+ .basic-settings-header p,
4875
+ .basic-settings-json-header p { max-width: 68vw; overflow: hidden; text-overflow: ellipsis; }
4876
+ .basic-settings-layout { flex-direction: column; }
4877
+ .basic-settings-tabs { width: 100%; flex: 0 0 auto; display: flex; gap: 4px; overflow-x: auto; padding: 8px; border-right: 0; border-bottom: 1px solid var(--border); }
4878
+ .basic-settings-tab { width: auto; min-width: 142px; min-height: 48px; margin: 0; }
4879
+ .basic-settings-scroll { padding: 18px 16px 28px; }
4880
+ .basic-settings-form-grid { grid-template-columns: 1fr; }
4881
+ .basic-settings-field.full { grid-column: auto; }
4882
+ .basic-settings-service-grid { grid-template-columns: 1fr 1fr; }
4883
+ .basic-settings-checkboxes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
4884
+ .basic-settings-footer { padding: 10px 14px; }
4885
+ .basic-settings-status { max-width: 32vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
4886
+ }
4887
+
4888
+ @media (max-width: 520px) {
4889
+ .basic-settings-header-actions .basic-settings-plain-btn { display: none; }
4890
+ .basic-settings-panel-intro p { white-space: nowrap; }
4891
+ .basic-settings-agent-head { gap: 8px; }
4892
+ .basic-settings-agent-default { max-width: 82px; }
4893
+ .basic-settings-list-row { grid-template-columns: minmax(0, 1fr) 92px 34px; }
4894
+ .basic-settings-service-grid,
4895
+ .basic-settings-checkboxes { grid-template-columns: 1fr; }
4896
+ .basic-settings-footer { gap: 7px; }
4897
+ .basic-settings-secondary-btn,
4898
+ .basic-settings-primary-btn { padding-inline: 9px; }
4899
+ }