.voice-sidebar [hidden] { display: none !important; }
.rail-header { flex: 0 0 auto; padding: 12px; border-bottom: 1px solid var(--s-border); }
.rail-header-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
#railTabs { display: flex; gap: 16px; min-width: 0; }
#railMarkRead { flex: 0 0 auto; min-height: 36px; padding: 6px 8px; font: inherit; color: var(--s-text-secondary); background: transparent; border: 1px solid transparent; border-radius: var(--radius-md, 6px); cursor: pointer; white-space: nowrap; }
#railMarkRead:hover { color: var(--s-text-primary); background: var(--s-bg-hover); }
@media (pointer: coarse), (max-width: 768px) { #railMarkRead { min-height: 44px; } }
#railTabs button { font: inherit; color: var(--s-text-primary); background: transparent; border: 0; cursor: pointer; }
#railTabs button { padding: 8px 0; color: var(--s-text-secondary); border-bottom: 2px solid transparent; }
#railTabs [aria-selected="true"] { color: var(--c-heading-color); border-bottom-color: var(--s-accent); }
#thread-search { box-sizing: border-box; width: 100%; min-width: 0; padding: 8px 10px; background: var(--s-bg-input, var(--s-bg-page)); color: var(--s-text-primary); border: 1px solid var(--s-border); border-radius: var(--radius-md, 6px); }
/* The header already separates the list. Match ordinary thread row spacing. */
.voice-sidebar #railThreads { padding-top: 0 !important; }
#railNotes { display: flex; flex-direction: column; flex: 1; min-height: 0; padding: 12px; gap: 12px; overflow: auto; }
.rail-notes-toolbar, .rail-note-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 0 0 auto; }
#railNoteNew { margin-left: auto; }
#railNotes .mod-btn { min-height: 36px; padding: 8px 12px; border-radius: var(--radius-md, 6px); font: inherit; cursor: pointer; box-shadow: none; }
#railNotes .mod-btn-secondary { color: var(--s-text-primary); background: var(--s-bg-surface); border: 1px solid var(--s-border); }
#railNotes .mod-btn-ghost { color: var(--s-text-secondary); background: transparent; border: 1px solid transparent; }
#railNotes .mod-btn-primary { color: var(--s-text-primary); background: var(--s-bg-selected); border: 1px solid var(--s-border-strong, var(--s-border)); }
#railNotes .mod-btn:hover { background: var(--s-bg-hover); }
#railNotes .mod-btn:disabled { opacity: .5; cursor: default; }
.rail-note-item { display: flex; align-items: center; gap: 4px; border-bottom: 1px solid var(--s-border); }
.rail-note-row { display: block; flex: 1; min-width: 0; min-height: 44px; padding: 10px; text-align: left; font: inherit; color: var(--s-text-primary); background: transparent; border: 0; overflow-wrap: anywhere; cursor: pointer; }
#railNotes .rail-note-delete { flex: 0 0 auto; min-height: 44px; }
.rail-note-row:disabled { opacity: .5; cursor: default; }
.rail-note-row:hover { background: var(--s-bg-hover); }
#railNotesList { overflow: auto; }
#railNoteEditor { display: flex; flex: 1; min-height: 240px; flex-direction: column; gap: 12px; }
#railNoteTitle, #railNoteBody { box-sizing: border-box; width: 100%; min-width: 0; margin: 0; padding: 10px; color: var(--s-text-primary); background: var(--s-bg-input); border: 1px solid var(--s-border); border-radius: var(--radius-md, 6px); font: inherit; }
#railNoteTitle { font-weight: 600; }
#railNoteBody { flex: 1; min-height: 180px; resize: none; line-height: 1.65; }
#railNoteSave { margin-right: auto; }
.rail-note-recipient { display: flex; flex: 1 1 100%; align-items: center; gap: 8px; color: var(--s-text-secondary); font-size: var(--t-font-size-xs, 12px); }
#railNoteAgent { flex: 1; min-width: 0; max-width: 100%; min-height: 40px; padding: 8px; font: inherit; color: var(--s-text-primary); background: var(--s-bg-menu, var(--s-bg-surface)); border: 1px solid var(--s-border); border-radius: var(--radius-md, 6px); }
#railNoteAgent option { background: var(--s-bg-menu, var(--s-bg-surface)); color: var(--s-text-primary); }
.rail-note-recipient { order: -1; }
@media (max-width: 768px) { #railNoteAgent { min-height: 44px; font-size: 16px; } }
#railNoteStatus { min-height: 18px; margin: 0; font-size: var(--t-font-size-xs, 12px); color: var(--s-text-secondary); overflow-wrap: anywhere; }
.rail-header :focus-visible, #railNotes :focus-visible { outline: 2px solid var(--s-accent); outline-offset: 2px; }
/* One width drives the rail, content inset and edge toggle. */
html #thread-drawer.voice-sidebar { width: var(--threads-rail-width, 280px) !important; max-width: 94vw; }
#railResize { position: absolute; z-index: 10; inset: 0 auto 0 0; width: 7px; cursor: ew-resize; touch-action: none; }
#railResize::after { content: ''; position: absolute; inset: 0 auto 0 0; width: 2px; background: transparent; }
#railResize:hover::after, #railResize:focus-visible::after, .rail-resizing #railResize::after { background: var(--s-accent); }
#railResize:focus-visible { outline: none; }
.rail-resizing, .rail-resizing * { cursor: ew-resize !important; user-select: none !important; }
.rail-resizing #workspace, .rail-resizing #sidebar, .rail-resizing .threads-rail-toggle { transition: none !important; }
@media (min-width: 769px) {
  html:not(.mirai-mobile) .app.voice-app.sidebar-open { margin-right: var(--threads-rail-width, 280px); width: calc(100% - var(--threads-rail-width, 280px)); }
  html:not(.mirai-mobile) .app.sidebar-open .threads-rail-toggle { right: var(--threads-rail-width, 280px); }
}
@media (max-width: 768px) {
  #thread-search, #railNoteTitle, #railNoteBody { font-size: 16px; }
  #railNotes .mod-btn, #railTabs button { min-height: 44px; }
  #railResize { width: 10px; }
}

/* Scoped harness geometry follows the same width at every viewport. */
.pilot-thread-search{padding:0;display:flex;gap:4px}
#threads-close{display:none}
#thread-drawer{width:var(--threads-rail-width,280px)!important}
#workspace.sidebar-open #threads-toggle{right:min(var(--threads-rail-width,280px),94vw)!important}
#thread-drawer .sidebar-item-drag{display:inline-flex;align-items:center;justify-content:center;width:24px;height:28px;flex:0 0 24px;padding:0;border:0;background:transparent;color:var(--s-text-secondary);cursor:grab;touch-action:none}
#thread-drawer .sidebar-item-drag:focus-visible{outline:2px solid var(--s-accent);outline-offset:1px}
#thread-drawer .sidebar-item.is-dragging{opacity:.55}
#thread-drawer .thread-drop-before::before,#thread-drawer .thread-drop-after::after{content:"";position:absolute;left:8px;right:8px;height:2px;background:var(--s-accent);z-index:5}
#thread-drawer .thread-drop-before::before{top:0}#thread-drawer .thread-drop-after::after{bottom:0}
#thread-drawer .sidebar-item-title{min-width:0;flex:1}
#thread-drawer .sidebar-item-agent{flex:0 0 auto}
#thread-drawer .sidebar-item.has-unread .sidebar-item-title{color:var(--s-accent)}
@media(max-width:768px),(pointer:coarse){#thread-drawer .sidebar-item-drag{height:44px;width:32px;flex-basis:32px}#thread-drawer .sidebar-item-more{min-height:44px}}