.note-signal-chip { display: inline-flex; max-width: 100%; min-height: 1.65em; align-items: center; vertical-align: baseline; margin: 0 .12em; padding: .08em .48em; border: 1px solid #48545a; border-radius: 5px; background: #252c30; color: #fff; box-shadow: none; font: inherit; font-size: .84em; font-weight: 780; line-height: 1.35; overflow-wrap: anywhere; }
button.note-signal-chip, a.note-signal-chip { cursor: pointer; }
/* 囲み（チップ）＝タップできる、で統一。リンクでも下線は付けない */
a.note-signal-chip { text-decoration: none; }
a.note-signal-chip:hover, a.note-signal-chip:focus-visible { border-color: #71d9e5; outline: 2px solid rgba(55,219,239,.2); outline-offset: 1px; }
/* リングネームも技と同じ見た目（色は付けない） */
button.note-signal-chip:hover, button.note-signal-chip:focus-visible { border-color: #71d9e5; background: #2c363b; outline: 2px solid rgba(55,219,239,.2); outline-offset: 1px; }
.note-signals-toggle { display: inline-grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; padding: 0; border: 1px solid #46545b; background: #11181c; color: #7d8a90; cursor: pointer; }
.note-signals-toggle svg { width: 18px; height: 18px; fill: currentColor; stroke: none; }
.note-signals-toggle .note-signals-wand { fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 3.1; }
.note-signals-toggle .note-signals-sparkle { fill: currentColor; }
.note-signals-toggle[aria-pressed="true"] { border-color: #37dbef; color: #37dbef; background: rgba(55,219,239,.08); }
.note-signals-toggle:hover, .note-signals-toggle:focus-visible { border-color: #37dbef; outline: 2px solid rgba(55,219,239,.2); outline-offset: 1px; }
.note-signals-preview { min-width: 0; margin: 8px 0 0; padding: 10px 12px; border: 1px solid #2b373c; background: #0a1013; color: #dce5e8; font-size: 14px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.note-signals-preview::before { display: block; margin-bottom: 6px; color: #7f8d93; font: 750 10px/1.2 ui-monospace, monospace; letter-spacing: .08em; content: "PREVIEW"; }
.note-signals-help { margin: 8px 0 0; color: #7f8d93; font-size: 11px; line-height: 1.55; }
html[data-lang="jp"] .note-signals-help .i18n-en, html[data-lang="en"] .note-signals-help .i18n-jp { display: none; }
.note-signal-data-modal { width: min(680px, calc(100vw - 28px)); max-height: min(720px, calc(100vh - 28px)); padding: 0; border: 1px solid #506067; background: #0d1316; color: #edf3f4; box-shadow: 0 22px 70px rgba(0,0,0,.72); overflow-y: auto; }
.note-signal-data-modal::backdrop { background: rgba(0,4,6,.78); }
.note-signal-data-modal > section { padding: 20px; }
.note-signal-data-modal header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.note-signal-data-modal header p { margin: 0 0 6px; color: #37dbef; font: 800 10px/1 ui-monospace, monospace; letter-spacing: .14em; }
.note-signal-data-modal h2 { margin: 0; color: #fff; font-size: 22px; line-height: 1.3; }
.note-signal-data-modal header code { display: inline-block; margin-top: 8px; color: #37dbef; font: 850 18px/1.2 ui-monospace, monospace; }
.note-signal-data-modal header button { width: 38px; height: 38px; flex: 0 0 38px; border: 1px solid #506067; background: transparent; color: #dce5e8; cursor: pointer; font-size: 24px; }
.note-signal-data-modal dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 18px 0 0; border-top: 1px solid #263137; border-left: 1px solid #263137; }
.note-signal-data-modal dl > div { display: grid; grid-template-columns: minmax(78px, .78fr) minmax(0, 1.22fr); border-right: 1px solid #263137; border-bottom: 1px solid #263137; }
.note-signal-data-modal dl > div.is-wide { grid-column: 1 / -1; }
.note-signal-data-modal dt, .note-signal-data-modal dd { margin: 0; padding: 11px 12px; }
.note-signal-data-modal dt { color: #9aa8ae; font-size: 12px; font-weight: 750; }
.note-signal-data-modal dd { min-width: 0; color: #fff; font: 800 14px/1.4 ui-monospace, monospace; overflow-wrap: anywhere; }
@media (max-width: 520px) { .note-signal-data-modal > section { padding: 16px; } .note-signal-data-modal h2 { font-size: 19px; } .note-signal-data-modal dl { grid-template-columns: 1fr; } .note-signal-data-modal dl > div.is-wide { grid-column: auto; } }
/* FINAL PREP の自分（シアン）・相手（ライム）の目印 */
.note-signal-mark.is-self { color: #37dbef; text-decoration: underline 2px; text-underline-offset: 3px; }
.note-signal-mark.is-opp { color: #c4f25a; text-decoration: underline 2px; text-underline-offset: 3px; }
.note-signal-mark.is-mark-self, .note-signal-mark.is-mark-opp { padding: 0 .2em; border-radius: 3px; font-size: .9em; }
.note-signal-mark.is-mark-self { color: #37dbef; background: rgba(55,219,239,.14); }
.note-signal-mark.is-mark-opp { color: #c4f25a; background: rgba(196,242,90,.14); }
.note-signal-chip.is-role-self { border-color: #37dbef; }
.note-signal-chip.is-role-opp { border-color: #c4f25a; }