.ban-details-lock { width: 100%; min-width: 0; margin: 12px 0; text-align: left; }
.ban-details-lock__status { position: relative; display: flex; align-items: center; gap: 12px; margin: 0 0 16px; padding: 15px 18px; overflow: hidden; border: 1px solid rgba(244, 155, 67, .46); border-radius: 12px; background: linear-gradient(105deg, rgba(180, 73, 28, .3), rgba(244, 155, 67, .09)); box-shadow: 0 10px 30px rgba(0, 0, 0, .2), inset 3px 0 0 #f49b43; color: #ffd8a2; font-size: 16px; font-weight: 800; line-height: 1.35; }
.ban-details-lock__status::before { content: "!"; display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; background: #f49b43; box-shadow: 0 0 0 5px rgba(244, 155, 67, .12); color: #20150f; font-size: 17px; font-weight: 900; }
.ban-details-lock[data-present="false"] .ban-details-lock__status { border-color: rgba(90, 203, 124, .38); background: linear-gradient(105deg, rgba(45, 140, 76, .25), rgba(90, 203, 124, .07)); box-shadow: 0 10px 30px rgba(0, 0, 0, .16), inset 3px 0 0 #68d38a; color: #a9edbb; }
.ban-details-lock[data-present="false"] .ban-details-lock__status::before { content: "✓"; background: #68d38a; box-shadow: 0 0 0 5px rgba(104, 211, 138, .12); color: #102517; }
.ban-details-lock__card { position: relative; isolation: isolate; overflow: hidden; border: 1px solid rgba(235, 179, 101, .28); border-radius: 14px; background: #202126; }
.ban-details-lock__preview { position: absolute; z-index: -1; inset: 12px; display: grid; gap: 13px; filter: blur(5px); opacity: .35; pointer-events: none; user-select: none; }
.ban-details-lock__row { padding: 14px; display: grid; grid-template-columns: 2fr 1fr; gap: 12px 24px; border: 1px solid #797676; border-radius: 8px; }
.ban-details-lock__row i { display: block; height: 9px; border-radius: 5px; background: #a1a1aa; }
.ban-details-lock__row i:nth-child(2) { width: 65%; background: #b9956c; }
.ban-details-lock__row i:nth-child(3) { width: 78%; }
.ban-details-lock__content { padding: 25px; background: linear-gradient(110deg, rgba(30,31,35,.94), rgba(30,31,35,.76)); }
.ban-details-lock__badge { color: #e3b873; font-size: 10px; text-transform: uppercase; letter-spacing: 1.3px; font-weight: 700; }
.ban-details-lock__content h3 { margin: 10px 0; color: #fff; font-size: 19px; line-height: 1.3; }
.ban-details-lock__content p { margin: 0; max-width: 640px; color: #c6c6cc; font-size: 13px; line-height: 1.65; }
.ban-details-lock__content strong { color: #f0e6d5; }
.ban-details-lock__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.ban-details-lock__link { display: inline-flex; gap: 20px; align-items: center; justify-content: center; min-height: 40px; box-sizing: border-box; margin: 0; padding: 10px 18px; border: 1px solid transparent; border-radius: 8px; background: #d7ad6e; color: #19191c; font: inherit; font-size: 13px; font-weight: 700; line-height: 1.35; text-decoration: none; cursor: pointer; }
.ban-details-lock__link:hover { background: #efc98f; }
.ban-details-lock__link--example { border-color: rgba(227, 184, 115, .55); background: rgba(227, 184, 115, .08); color: #f0d5aa; }
.ban-details-lock__link--example:hover { border-color: #e3b873; background: rgba(227, 184, 115, .17); color: #fff; }
.ban-details-lock__link:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.ban-details-lock[data-present="false"] .ban-details-lock__preview { display: none; }
.ban-details-lock[data-present="false"] .ban-details-lock__card { border-color: rgba(255,255,255,.1); }

.ban-example { width: min(780px, calc(100% - 32px)); max-height: calc(100vh - 32px); padding: 0; overflow: hidden; border: 1px solid rgba(227, 184, 115, .35); border-radius: 16px; background: #191a1f; box-shadow: 0 24px 80px rgba(0, 0, 0, .65); color: #f5f5f6; }
.ban-example::backdrop { background: rgba(4, 5, 7, .82); backdrop-filter: blur(5px); }
.ban-example__surface { position: relative; max-height: calc(100vh - 32px); overflow-y: auto; overscroll-behavior: contain; }
.ban-example__close { position: absolute; z-index: 2; top: 14px; right: 14px; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(255, 255, 255, .14); border-radius: 50%; background: rgba(255, 255, 255, .06); color: #fff; font: inherit; font-size: 26px; line-height: 1; cursor: pointer; }
.ban-example__close:hover { background: rgba(255, 255, 255, .13); }
.ban-example__header { padding: 30px 64px 24px 28px; border-bottom: 1px solid rgba(255, 255, 255, .08); background: radial-gradient(circle at top left, rgba(210, 142, 68, .18), transparent 55%); }
.ban-example__eyebrow { color: #e3b873; font-size: 10px; font-weight: 800; letter-spacing: 1.25px; text-transform: uppercase; }
.ban-example__header h2 { margin: 8px 0 7px; color: #fff; font-size: 24px; line-height: 1.25; }
.ban-example__header p { margin: 0; color: #adaeb6; font-size: 13px; line-height: 1.55; }
.ban-example__summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 20px 24px 12px; padding: 15px 17px; border: 1px solid rgba(244, 155, 67, .32); border-radius: 10px; background: linear-gradient(105deg, rgba(180, 73, 28, .22), rgba(244, 155, 67, .06)); color: #ffd8a2; }
.ban-example__summary strong { font-size: 14px; }
.ban-example__project { color: #fff; font-size: 16px; font-weight: 800; }
.ban-example__list { display: grid; gap: 10px; padding: 0 24px 24px; }
.ban-example__item { padding: 17px; border: 1px solid rgba(255, 255, 255, .1); border-left: 3px solid #777982; border-radius: 10px; background: #222329; }
.ban-example__item--active { border-left-color: #f49b43; background: linear-gradient(110deg, rgba(83, 45, 25, .42), #222329 44%); }
.ban-example__item-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.ban-example__item-heading > div, .ban-example__reason { display: grid; gap: 4px; }
.ban-example__item-heading span:first-child, .ban-example__reason span, .ban-example__meta dt { color: #8f9099; font-size: 10px; font-weight: 700; letter-spacing: .55px; text-transform: uppercase; }
.ban-example__item-heading strong { color: #e3b873; font-size: 15px; }
.ban-example__status { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; background: rgba(255, 255, 255, .07); color: #b7b8bf; font-size: 11px; font-weight: 700; }
.ban-example__item--active .ban-example__status { background: rgba(244, 155, 67, .14); color: #ffc07c; }
.ban-example__reason { margin-top: 14px; }
.ban-example__reason strong { color: #fff; font-size: 14px; line-height: 1.4; }
.ban-example__meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0 0; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .07); }
.ban-example__meta div { min-width: 0; }
.ban-example__meta dt, .ban-example__meta dd { margin: 0; }
.ban-example__meta dd { margin-top: 5px; color: #d3d3d7; font-size: 12px; line-height: 1.35; }
.ban-example__footer { position: sticky; bottom: 0; display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid rgba(255, 255, 255, .09); background: rgba(25, 26, 31, .96); backdrop-filter: blur(8px); }
.ban-example__dismiss, .ban-example__tariffs { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; box-sizing: border-box; padding: 10px 18px; border: 1px solid rgba(255, 255, 255, .16); border-radius: 8px; font: inherit; font-size: 13px; font-weight: 700; line-height: 1.35; text-decoration: none; cursor: pointer; }
.ban-example__dismiss { background: transparent; color: #dedee2; }
.ban-example__dismiss:hover { background: rgba(255, 255, 255, .07); }
.ban-example__tariffs { border-color: transparent; background: #d7ad6e; color: #19191c; }
.ban-example__tariffs:hover { background: #efc98f; }
.ban-example button:focus-visible, .ban-example a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@media (max-width: 480px) {
    .ban-details-lock__status { padding: 13px 14px; font-size: 14px; }
    .ban-details-lock__content { padding: 18px; }
    .ban-details-lock__content h3 { font-size: 17px; }
    .ban-details-lock__actions { display: grid; }
    .ban-details-lock__link { width: 100%; }
    .ban-example { width: calc(100% - 18px); max-height: calc(100vh - 18px); }
    .ban-example__surface { max-height: calc(100vh - 18px); }
    .ban-example__header { padding: 24px 54px 20px 18px; }
    .ban-example__header h2 { font-size: 20px; }
    .ban-example__summary { align-items: flex-start; flex-direction: column; gap: 5px; margin: 14px 14px 10px; }
    .ban-example__list { padding: 0 14px 16px; }
    .ban-example__item { padding: 14px; }
    .ban-example__meta { grid-template-columns: 1fr 1fr; }
    .ban-example__meta div:last-child { grid-column: 1 / -1; }
    .ban-example__footer { display: grid; grid-template-columns: 1fr 1fr; padding: 12px 14px; }
}