/* ============================================================
 * palette.css
 * 位置：static/runtime/content/palette.css（运行时容器目录）
 * Palette 画板容器样式 —— 从原 static/palette/palette.js 内 injectStyle()
 * 抽离到独立 CSS 文件。Palette 容器打开时不再注入 inline style，
 * 而是由模板 <link> 静态加载本文件。
 * ============================================================ */

/* 沉浸弹窗：与 mg-immersive 同范式（隐藏标题、悬浮 ×、画面即弹窗） */
.std-modal.plt-immersive { background:#e8eaed; }
.std-modal-overlay.active:has(.plt-immersive) { background: transparent; }
.std-modal.plt-immersive .std-modal-header {
  position:absolute;top:calc(6px + env(safe-area-inset-top,0px));right:8px;
  padding:0;z-index:8;background:transparent;}
.std-modal.plt-immersive .std-modal-header h3 { display:none; }
.std-modal.plt-immersive .std-modal-close {
  width:44px;height:44px;border-radius:50%;padding:0;
  background:rgba(0,0,0,.45);color:#fff;font-size:1.25rem;
  display:flex;align-items:center;justify-content:center;}
.std-modal.plt-immersive .std-modal-body { padding:0;overflow:hidden;position:relative;display:block; }
.plt-shell { position:absolute;inset:0; }
.plt-viewport { position:absolute;inset:0;overflow:hidden;touch-action:none;
  user-select:none;-webkit-user-select:none;
  background-color:#e8eaed;
  background-image:linear-gradient(45deg,#c9ccd1 25%,transparent 25%,transparent 75%,#c9ccd1 75%),
    linear-gradient(45deg,#c9ccd1 25%,transparent 25%,transparent 75%,#c9ccd1 75%);
  background-size:32px 32px;background-position:0 0,16px 16px;}
.plt-img,.plt-canvas { position:absolute;left:0;top:0;transform-origin:0 0;pointer-events:none; }
.plt-img.plt-pixel { image-rendering:pixelated;image-rendering:crisp-edges; }
.plt-canvas { inset:0;width:100%;height:100%; }
/* 背景板样式（设置面板切换，默认棋盘格 plt-bg-checker） */
.plt-viewport.plt-bg-white { background:#ffffff; }
.plt-viewport.plt-bg-black { background:#17181c; }
.plt-viewport.plt-bg-grid { background-color:#f8fafc;
  background-image:linear-gradient(#dbe2ea 1px,transparent 1px),
    linear-gradient(90deg,#dbe2ea 1px,transparent 1px);
  background-size:32px 32px;background-position:0 0,0 0;}
.plt-viewport.plt-bg-axes { background-color:#f8fafc;
  background-image:linear-gradient(#8fa3b8,#8fa3b8),linear-gradient(#8fa3b8,#8fa3b8),
    linear-gradient(#dbe2ea 1px,transparent 1px),linear-gradient(90deg,#dbe2ea 1px,transparent 1px);
  background-size:100% 2px,2px 100%,32px 32px,32px 32px;
  background-position:center,center,0 0,0 0;
  background-repeat:no-repeat,no-repeat,repeat,repeat;}
.plt-hint { position:absolute;top:14px;left:50%;transform:translateX(-50%);white-space:nowrap;
  background:rgba(17,24,39,.72);color:#f9fafb;font-size:14px;padding:6px 14px;border-radius:999px;
  pointer-events:none;transition:opacity .6s;font-family:-apple-system,sans-serif;z-index:3;}
.plt-controls { position:absolute;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));
  display:flex;flex-direction:column;gap:8px;align-items:center;z-index:3;}
.plt-btn { width:44px;height:44px;min-height:44px;border:none;border-radius:50%;
  background:rgba(17,24,39,.78);color:#fff;font-size:22px;font-weight:700;cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-family:-apple-system,sans-serif;}
.plt-btn:active { transform:scale(.92); }
.plt-btn.plt-reset { font-size:13px;font-weight:600; }
.plt-btn.plt-on { background:#4a90d9; }
.plt-zoom { font-size:12px;color:#111827;background:rgba(255,255,255,.85);border-radius:6px;
  padding:2px 6px;pointer-events:none;font-variant-numeric:tabular-nums;font-family:-apple-system,sans-serif;}
/* 设置面板：背景板样式 / 视图旋转 / 缩放滑杆（⚙ 开合） */
.plt-panel { position:absolute;right:12px;bottom:calc(64px + env(safe-area-inset-bottom,0px));z-index:4;
  background:rgba(17,24,39,.92);border-radius:14px;padding:12px 14px;min-width:220px;
  display:flex;flex-direction:column;gap:10px;color:#f9fafb;font-family:-apple-system,sans-serif;}
.plt-panel-row { display:flex;align-items:center;gap:8px;flex-wrap:wrap; }
.plt-panel-lbl { font-size:12px;opacity:.7;flex:none;width:30px; }
.plt-chip { border:1px solid rgba(255,255,255,.35);background:transparent;color:#f9fafb;
  font-size:12px;border-radius:999px;padding:4px 10px;cursor:pointer; }
.plt-chip.plt-on { background:#4a90d9;border-color:#4a90d9; }
.plt-zoom-range { flex:1;accent-color:#4a90d9;height:22px;min-width:90px; }
/* 函数绘制栏（函数画板模式） */
.plt-fnbar { position:absolute;top:calc(8px + env(safe-area-inset-top,0px));left:10px;right:60px;z-index:4;
  background:rgba(17,24,39,.85);border-radius:12px;padding:8px 10px;
  display:flex;flex-direction:column;gap:6px;font-family:-apple-system,sans-serif;}
.plt-fn-row { display:flex;gap:6px;align-items:center;flex-wrap:wrap; }
.plt-fn-mode,.plt-fn-in { background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);
  color:#fff;border-radius:8px;padding:5px 8px;font-size:13px; }
.plt-fn-mode option { color:#111827; }
.plt-fn-in { flex:1;min-width:70px;font-family:ui-monospace,Menlo,monospace; }
.plt-fn-lbl { color:#f9fafb;font-size:12px;opacity:.8;flex:none; }
.plt-fn-go { border:none;background:#4a90d9;color:#fff;border-radius:8px;
  padding:6px 14px;font-size:13px;cursor:pointer;flex:none; }
.plt-fn-err { color:#fca5a5;font-size:12px; }
.plt-fn-err:empty { display:none; }
.plt-fn-cfg-ta { width:100%;box-sizing:border-box;min-height:74px;resize:vertical;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.25);color:#fff;
  border-radius:8px;padding:6px 8px;font-size:12px;font-family:ui-monospace,Menlo,monospace; }
/* 时间轴：仅声明 timeline 的素材出现 */
.plt-timeline { position:absolute;left:12px;right:70px;
  bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:3;
  display:flex;align-items:center;gap:10px;
  background:rgba(17,24,39,.78);border-radius:999px;padding:8px 14px;}
.plt-tl-btn { width:36px;height:36px;min-height:36px;border:none;border-radius:50%;flex:none;
  background:#fff;color:#111827;font-size:15px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;}
.plt-tl-range { flex:1;accent-color:#4a90d9;height:24px;min-width:0; }
.plt-tl-time { color:#f9fafb;font-size:12px;font-variant-numeric:tabular-nums;flex:none;
  min-width:56px;text-align:right;font-family:-apple-system,sans-serif;}
.plt-err { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#4b5563;font-size:16px;padding:40px;text-align:center;font-family:-apple-system,sans-serif;}