#site-root .jn-scene {
      --jn-bg: light-dark(#edf0f1, #070b10);
      --jn-panel: light-dark(#e9eef0, #0a1018);
      --jn-ink: light-dark(#193442, #e5f0f5);
      --jn-soft: light-dark(#526c7a, #7c96a8);
      --jn-line: light-dark(#bdcdd6, #20303e);
      --jn-cyan: light-dark(#007f96, #73dfef);
      --jn-violet: light-dark(#7451bc, #b397f4);
      --jn-amber: light-dark(#ab661a, #f1c16f);
      --jn-pink: light-dark(#a74080, #e296c5);
      --jn-green: light-dark(#218166, #83d6b5);
      position: relative; isolation: isolate; height: 672px; width: 100%; overflow: hidden;
      background: var(--jn-bg); color: var(--jn-ink); font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
      font-size: 12px; font-weight: 400;
    }
    #site-root .jn-scene * { box-sizing: border-box; }
    #site-root .jn-top {
      height: 74px; margin: 0 24px; display: flex; align-items: center; gap: 22px; border-bottom: 1px solid var(--jn-line); padding-right: 78px;
    }
    #site-root .jn-brand { font-family: Georgia, serif; font-size: 25px; font-weight: 400; letter-spacing: 1px; }
    #site-root .jn-heading { border-left: 1px solid var(--jn-line); padding-left: 21px; min-width: 0; }
    #site-root .jn-heading h2 { font-size: 13px; letter-spacing: 2px; font-weight: 500; margin: 0 0 5px; }
    #site-root .jn-heading p { font: 11px ui-monospace, Consolas, monospace; letter-spacing: 1px; margin: 0; color: var(--jn-soft); }
    #site-root .jn-status { margin-left: auto; flex-shrink: 0; display: flex; align-items: center; gap: 7px; color: var(--jn-soft); font-size: 11px; white-space: nowrap; }
    #site-root .jn-status::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--jn-cyan); box-shadow: 0 0 9px color-mix(in srgb, var(--jn-cyan) 45%, transparent); }
    #site-root .jn-workspace { height: 486px; margin: 0 20px; display: grid; grid-template-columns: 119px minmax(0,1fr) 119px; gap: 12px; }
    #site-root .jn-main { position: relative; min-width: 0; overflow: hidden; }
    #site-root .jn-main::before, #site-root .jn-main::after { content: ""; position: absolute; z-index: 1; width: 16px; height: 16px; border-color: var(--jn-line); border-style: solid; pointer-events: none; }
    #site-root .jn-main::before { top: 15px; left: 0; border-width: 1px 0 0 1px; }
    #site-root .jn-main::after { bottom: 13px; right: 0; border-width: 0 1px 1px 0; }
    #site-root .jn-canvas { display: block; width: 100%; height: 100%; }
    #site-root .jn-scene-tag { position: absolute; top: 23px; left: 14px; right: 14px; color: var(--jn-soft); font: 11px ui-monospace, Consolas, monospace; letter-spacing: .6px; z-index: 1; pointer-events: none; }
    #site-root .jn-view-note { position: absolute; bottom: 22px; left: 14px; right: 14px; font: 11px ui-monospace, Consolas, monospace; color: var(--jn-soft); pointer-events: none; }
    #site-root .jn-rail { padding-top: 20px; min-width: 0; }
    #site-root .jn-block { border-top: 1px solid var(--jn-line); padding: 12px 0 14px; }
    #site-root .jn-block h3 { margin: 0 0 12px; color: var(--jn-soft); font-size: 11px; letter-spacing: 1px; font-weight: 400; }
    #site-root .jn-stat { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; gap: 5px; font-size: 11px; }
    #site-root .jn-stat span { color: var(--jn-soft); }
    #site-root .jn-stat b { font: 13px ui-monospace, Consolas, monospace; font-weight: 400; }
    #site-root .jn-groups { display: grid; gap: 12px; }
    #site-root .jn-group { display: flex; gap: 7px; align-items: center; font-size: 11px; }
    #site-root .jn-group::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--jn-cyan); }
    #site-root .jn-group:nth-child(2)::before { background: var(--jn-violet); }
    #site-root .jn-group:nth-child(3)::before { background: var(--jn-amber); }
    #site-root .jn-group:nth-child(4)::before { background: var(--jn-pink); }
    #site-root .jn-group em { font: 11px ui-monospace, Consolas, monospace; font-style: normal; color: var(--jn-soft); margin-left: auto; }
    #site-root .jn-mini { width: 100%; height: 91px; display: block; }
    #site-root .jn-log { display: grid; gap: 9px; font: 11px ui-monospace, Consolas, monospace; color: var(--jn-soft); }
    #site-root .jn-log span { display: flex; justify-content: space-between; gap: 3px; }
    #site-root .jn-log b { font-weight: 400; color: var(--jn-ink); }
    #site-root .jn-bottom { margin: 0 24px; height: 78px; display: grid; grid-template-columns: 1fr 1fr 1fr; border-top: 1px solid var(--jn-line); gap: 20px; padding-top: 14px; }
    #site-root .jn-bottom label { font-size: 11px; letter-spacing: 1px; color: var(--jn-soft); display: block; margin-bottom: 6px; }
    #site-root .jn-bottom .jn-trace { display: block; width: 100%; height: 30px; }
    #site-root .jn-foot { height: 34px; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; color: var(--jn-soft); font: 11px ui-monospace, Consolas, monospace; letter-spacing: .5px; gap: 12px; }
    #site-root .jn-layers .jn-workspace { grid-template-columns: minmax(0,1fr); }
    #site-root .jn-layers .jn-layer-labels { position: absolute; top: 24px; left: 0; right: 0; display: grid; grid-template-columns: repeat(5,1fr); text-align: center; pointer-events: none; font-size: 11px; letter-spacing: 2px; color: var(--jn-soft); }
    #site-root .jn-layers .jn-view-note { text-align: center; }
    #site-root .jn-modules .jn-workspace { grid-template-columns: 106px minmax(0,1fr) 106px; }
    #site-root .jn-module-list { display: grid; gap: 9px; }
    #site-root .jn-module-item { display: flex; justify-content: space-between; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--jn-line); font-size: 11px; }
    #site-root .jn-module-item small { color: var(--jn-soft); font-size: 11px; }
    @media(max-width: 700px) {
      #site-root .jn-workspace, #site-root .jn-modules .jn-workspace { grid-template-columns: minmax(0,1fr); margin: 0 14px; }
      #site-root .jn-rail { display: none; }
      #site-root .jn-top { gap: 14px; margin: 0 18px; }
      #site-root .jn-heading { padding-left: 14px; }
      #site-root .jn-status { display: none; }
      #site-root .jn-bottom { margin: 0 18px; gap: 14px; }
      #site-root .jn-foot { padding: 0 18px; font-size: 11px; letter-spacing: 0; }
      #site-root .jn-foot span:last-child { display: none; }
      #site-root .jn-scene-tag { font-size: 11px; }
    }
    @media(max-width: 400px) {
      #site-root .jn-heading p { letter-spacing: 0; }
      #site-root .jn-top { padding-right: 45px; }
      #site-root .jn-brand { font-size: 22px; }
    }