.strand-markup[open] { display:flex; flex-direction:column; gap:8px; position:fixed; inset:0; width:100vw; max-width:none; height:100dvh; max-height:none; margin:0; padding:12px; box-sizing:border-box; border:0; background:#fff; color:#202020; z-index:2147483647; }
.strand-markup::backdrop { background:#fff; }
.strand-markup header, .strand-markup nav { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.strand-markup header strong { margin-right:auto; }
.strand-markup p { margin:0; font-size:13px; line-height:1.4; }
.strand-markup button, .strand-markup a { min-height:44px; padding:8px 12px; font-size:14px; }
.strand-markup a { display:inline-flex; align-items:center; color:#174e82; text-decoration:underline; }
.strand-markup button { cursor:pointer; background:#f1f3f5; color:#202020; border:1px solid #8b929a; border-radius:4px; }
.strand-markup button:disabled { opacity:.5; cursor:wait; }
.strand-markup :focus-visible { outline:3px solid #175ac4; outline-offset:2px; }
.strand-markup-editor { flex:1; min-height:0; overflow:hidden; }
.strand-markup nav label { display:inline-flex; align-items:center; gap:8px; font-size:14px; }
.strand-markup nav select { min-height:44px; padding:8px; font-size:16px; border:1px solid #8b929a; border-radius:4px; background:#fff; color:#202020; }
.strand-markup-confirm { position:absolute; inset:0; z-index:2; display:flex; flex-wrap:wrap; align-content:center; justify-content:center; gap:12px; padding:24px; background:rgba(255,255,255,.97); }
.strand-markup-confirm p { flex-basis:100%; text-align:center; font-size:16px; }
@media (max-width:600px) { .strand-markup[open] { padding:6px; gap:4px; } .strand-markup header strong { flex-basis:100%; } .strand-markup header a { margin-right:auto; } .strand-markup nav button { flex:1; padding:6px; } }