:root .sig--web-301 { display: flex; container-type: inline-size; padding: clamp(16px, 4cqw, 34px); }
:root .sig--web-301 svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
:root .sig--web-301 .rd { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: clamp(14px, 3cqw, 24px); transition: opacity .4s; }
:root .sig--web-301.rd-out .rd { opacity: 0; }
:root .sig--web-301 .rd__cols { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) clamp(46px, 18cqw, 150px) minmax(0, 1fr); }
:root .sig--web-301 .rd__lab { margin: 0 0 10px; color: #a79fb0; font: 600 10.5px/1 var(--f-display); letter-spacing: .1em; text-transform: uppercase; }
:root .sig--web-301 .rd__col--new .rd__lab { color: var(--lilac); }
:root .sig--web-301 .rd__col ul { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
:root .sig--web-301 .rd__col li { position: relative; z-index: 1; display: flex; align-items: center; gap: 8px; min-width: 0; height: 36px; padding: 0 10px; border-radius: 10px; font: 500 clamp(10.5px, 2cqw, 12.5px)/1 ui-monospace, "SF Mono", Menlo, monospace; transition: background .4s, color .4s, box-shadow .4s; }
:root .sig--web-301 .rd__u { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:root .sig--web-301 .rd__col--old li { background: #2a2630; color: #b9b1c2; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); }
:root .sig--web-301 .rd__col--old li.err { background: #3a1d24; color: #ffb4bf; box-shadow: inset 0 0 0 1px rgba(255, 92, 120, .5); }
:root .sig--web-301 .rd__col--old li.moved { color: #8f879a; }
:root .sig--web-301 .rd__col--old li.moved .rd__u { text-decoration: line-through; text-decoration-color: rgba(255, 255, 255, .25); }
:root .sig--web-301 .rd__st { font: 700 10px/1 var(--f-display); font-style: normal; color: #ff7d93; }
:root .sig--web-301 .moved .rd__st { color: var(--lilac); font-size: 14px; }
:root .sig--web-301 .rd__col--new li { background: #f7f4fa; color: #3a2e45; box-shadow: 0 10px 20px -16px rgba(0, 0, 0, .8); }
:root .sig--web-301 .rd__col--new li.ok { background: #fff; box-shadow: 0 0 0 1.5px #2f9e5b, 0 10px 24px -14px rgba(47, 158, 91, .7); }
:root .sig--web-301 .rd__ok { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: #2f9e5b; color: #fff; font-size: 12px; opacity: 0; transform: scale(.4); transition: opacity .3s, transform .5s cubic-bezier(.34, 1.56, .64, 1); }
:root .sig--web-301 .rd__ok svg { stroke-width: 2.8; }
:root .sig--web-301 .ok .rd__ok { opacity: 1; transform: none; }
:root .sig--web-301 .rd__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
:root .sig--web-301 .rd__svg path { fill: none; stroke: var(--v); stroke-width: 2; stroke-dasharray: 1; stroke-dashoffset: 0; filter: drop-shadow(0 0 6px rgba(161, 0, 255, .7)); }
:root .sig--web-301 .rd__chip { position: absolute; z-index: 2; transform: translate(-50%, -50%); padding: 4px 7px; border-radius: 999px; background: var(--v); color: #fff; font: 700 10px/1 var(--f-display); letter-spacing: .02em; box-shadow: 0 0 0 3px #1d1a22; }
:root .sig--web-301 .rd__bot { position: absolute; left: 0; top: 0; z-index: 3; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(227, 184, 255, .35); opacity: 0; offset-rotate: 0deg; transition: opacity .3s; }
:root .sig--web-301 .rd__bot.on { opacity: 1; }
:root .sig--web-301 .rd__serp { display: grid; grid-template-columns: 1fr auto; gap: 10px 14px; align-items: center; padding: 14px 16px; border-radius: 16px; background: #fff; color: #202124; box-shadow: 0 30px 60px -28px rgba(0, 0, 0, .9); opacity: 0; transform: translateY(12px); transition: opacity .5s, transform .7s var(--ease-out), box-shadow .4s; }
:root .sig--web-301 .rd__serp.on { opacity: 1; transform: none; }
:root .sig--web-301 .rd__serp.warn { box-shadow: 0 0 0 2px rgba(255, 92, 120, .7), 0 30px 60px -28px rgba(0, 0, 0, .9); }
:root .sig--web-301 .rd__q { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px; border-radius: 999px; background: #f1f3f4; color: #5f6368; font: 400 12px/1 var(--f-body); }
:root .sig--web-301 .rd__q em { font-style: normal; color: #202124; }
:root .sig--web-301 .rd__res { display: flex; gap: 10px; min-width: 0; }
:root .sig--web-301 .rd__fav { width: 22px; height: 22px; flex: none; border-radius: 50%; background: conic-gradient(from 200deg, #a100ff, #e3b8ff, #a100ff); }
:root .sig--web-301 .rd__res > div { display: grid; gap: 3px; min-width: 0; }
:root .sig--web-301 .rd__su { color: #4d5156; font: 400 11.5px/1.2 var(--f-body); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:root .sig--web-301 .rd__path { display: inline-block; transition: color .4s; }
:root .sig--web-301 .warn .rd__path { color: #d93a55; }
:root .sig--web-301 .moved .rd__path { color: #188038; animation: rdSwap .6s var(--ease-out); }
@keyframes rdSwap{ from { opacity: 0; transform: translateY(6px); } }
:root .sig--web-301 .rd__t { color: #1a0dab; font: 500 clamp(13px, 2.6cqw, 17px)/1.2 var(--f-body); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:root .sig--web-301 .rd__res i { height: 6px; width: 92%; border-radius: 3px; background: #eceef0; }
:root .sig--web-301 .rd__res i + i { width: 64%; }
:root .sig--web-301 .rd__keep { display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 999px; background: #e9f6ee; color: #17643a; font: 600 11px/1 var(--f-display); white-space: nowrap; transition: transform .5s var(--ease-back); }
:root .sig--web-301 .moved .rd__keep { animation: rdKeep 1.2s var(--ease-out); }
@keyframes rdKeep{ 30% { transform: scale(1.12); box-shadow: 0 0 0 6px rgba(47, 158, 91, .18); } }
@container (max-width: 470px){:root .sig--web-301 .rd__col li { height: 32px; padding: 0 8px; }
:root .sig--web-301 .rd__serp { grid-template-columns: 1fr; }
:root .sig--web-301 .rd__keep { justify-self: start; }

}
:root .sig--web-301 { text-align: left; }

