:root{--b2p-ink: #132028;--b2p-muted: #56656d;--b2p-bg: #eef3f2;--b2p-surface: #ffffff;--b2p-line: #d3dfdc;--b2p-line-strong: #a9bdb8;--b2p-accent: #0f766e;--b2p-accent-dark: #0b5650;--b2p-accent-soft: rgba(15, 118, 110, 0.09);--b2p-amber: #a15c07;--b2p-amber-soft: #fdf4e3;--b2p-bad: #b42318;--b2p-bad-soft: #fdeceb;--b2p-ok: #157347;--b2p-ok-soft: #e7f5ed;--b2p-code-bg: #10191e;--b2p-code-ink: #d9ece8;--b2p-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;--b2p-shadow: 0 14px 40px rgba(19, 32, 40, 0.08);--primary: var(--b2p-accent);--primary-dark: var(--b2p-accent-dark);--border: var(--b2p-line);--surface: var(--b2p-surface);--surface-muted: var(--b2p-bg);--shadow-soft: var(--b2p-shadow);--text-main: var(--b2p-ink);--text-muted: var(--b2p-muted);}
.b2p-page{color: var(--b2p-ink);padding-bottom: 2.5rem;}
.b2p-page code{font-family: var(--b2p-mono);font-size: 0.86em;color: var(--b2p-accent-dark);background: var(--b2p-accent-soft);padding: 0.08em 0.35em;border-radius: 4px;word-break: break-word;}
.b2p-page a{color: var(--b2p-accent);font-weight: 600;}
.b2p-page a:hover{color: var(--b2p-accent-dark);}
.b2p-bench{background: var(--b2p-surface);border: 1px solid var(--b2p-line);border-radius: 16px;box-shadow: var(--b2p-shadow);overflow: hidden;margin-bottom: 2.75rem;}
.b2p-byline{display: flex;flex-wrap: wrap;align-items: center;gap: 0.35rem 1.25rem;padding: 0.6rem 1.25rem;background: var(--b2p-ink);color: #b9cac6;font-size: 0.8rem;}
.b2p-byline-author{font-weight: 600;color: #ffffff;}
.b2p-byline .author-link{color: #7fd6cb;font-weight: 700;text-decoration: none;}
.b2p-byline .author-link:hover{color: #ffffff;text-decoration: underline;}
.b2p-byline-local{margin-left: auto;color: #7fd6cb;}
.b2p-grid{display: grid;grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);}
.b2p-in{padding: 1.25rem;border-right: 1px solid var(--b2p-line);display: flex;flex-direction: column;gap: 0.75rem;}
.b2p-label{display: block;font-size: 0.78rem;font-weight: 700;letter-spacing: 0.06em;text-transform: uppercase;color: var(--b2p-muted);}
.b2p-drop{position: relative;border: 2px dashed transparent;border-radius: 12px;transition: border-color 0.15s ease, background 0.15s ease;}
.b2p-drop.is-over{border-color: var(--b2p-accent);background: var(--b2p-accent-soft);}
.b2p-textarea{display: block;width: 100%;min-height: 320px;resize: vertical;padding: 0.9rem 1rem;font-family: var(--b2p-mono);font-size: 0.82rem;line-height: 1.55;color: var(--b2p-code-ink);background: var(--b2p-code-bg);border: 1px solid var(--b2p-code-bg);border-radius: 10px;word-break: break-all;}
.b2p-textarea::placeholder{color: #7b908b;}
.b2p-textarea:focus{outline: 3px solid rgba(15, 118, 110, 0.35);outline-offset: 1px;}
.b2p-toolbar{display: flex;flex-wrap: wrap;align-items: center;gap: 0.5rem;}
.b2p-count{margin-left: auto;font-family: var(--b2p-mono);font-size: 0.78rem;color: var(--b2p-muted);}
.b2p-btn{display: inline-flex;align-items: center;gap: 0.45rem;padding: 0.5rem 0.9rem;font-size: 0.86rem;font-weight: 600;line-height: 1.2;color: var(--b2p-ink);background: var(--b2p-surface);border: 1px solid var(--b2p-line-strong);border-radius: 8px;cursor: pointer;text-decoration: none;transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;}
.b2p-btn:hover{border-color: var(--b2p-accent);color: var(--b2p-accent-dark);}
.b2p-btn:focus-visible{outline: 3px solid rgba(15, 118, 110, 0.35);outline-offset: 2px;}
.b2p-btn-primary{background: var(--b2p-accent);border-color: var(--b2p-accent);color: #ffffff;}
.b2p-btn-primary:hover{background: var(--b2p-accent-dark);border-color: var(--b2p-accent-dark);color: #ffffff;}
.b2p-btn:disabled,.b2p-btn[aria-disabled="true"]{opacity: 0.45;cursor: not-allowed;pointer-events: none;}
.b2p-status{min-height: 1.2em;margin: 0;font-size: 0.84rem;color: var(--b2p-muted);}
.b2p-status[data-tone="info"]{color: var(--b2p-accent-dark);}
.b2p-status[data-tone="ok"]{color: var(--b2p-ok);}
.b2p-status[data-tone="bad"]{color: var(--b2p-bad);}
.b2p-hint{margin: 0;font-size: 0.82rem;color: var(--b2p-muted);}
.b2p-out{padding: 1.25rem;display: flex;flex-direction: column;gap: 1rem;background: linear-gradient(180deg, var(--b2p-bg), var(--b2p-surface) 60%);}
.b2p-verdict{padding: 0.9rem 1rem;border-radius: 10px;border-left: 5px solid var(--b2p-line-strong);background: var(--b2p-surface);border-top: 1px solid var(--b2p-line);border-right: 1px solid var(--b2p-line);border-bottom: 1px solid var(--b2p-line);}
.b2p-verdict h3{margin: 0 0 0.3rem;font-size: 1.05rem;font-weight: 700;}
.b2p-verdict p{margin: 0;font-size: 0.88rem;color: var(--b2p-muted);}
.b2p-result[data-state="ok"] .b2p-verdict{border-left-color: var(--b2p-ok);background: var(--b2p-ok-soft);}
.b2p-result[data-state="ok"] .b2p-verdict h3{color: var(--b2p-ok);}
.b2p-result[data-state="warn"] .b2p-verdict{border-left-color: var(--b2p-amber);background: var(--b2p-amber-soft);}
.b2p-result[data-state="warn"] .b2p-verdict h3{color: var(--b2p-amber);}
.b2p-result[data-state="error"] .b2p-verdict{border-left-color: var(--b2p-bad);background: var(--b2p-bad-soft);}
.b2p-result[data-state="error"] .b2p-verdict h3{color: var(--b2p-bad);}
.b2p-facts{margin: 0;display: grid;grid-template-columns: 1fr;border: 1px solid var(--b2p-line);border-radius: 10px;overflow: hidden;background: var(--b2p-surface);}
.b2p-facts div{display: grid;grid-template-columns: 7.5rem minmax(0, 1fr);gap: 0.75rem;padding: 0.5rem 0.85rem;border-top: 1px solid var(--b2p-line);font-size: 0.86rem;}
.b2p-facts div:first-child{border-top: 0;}
.b2p-facts dt{font-weight: 600;color: var(--b2p-muted);}
.b2p-facts dd{margin: 0;font-family: var(--b2p-mono);font-size: 0.82rem;word-break: break-word;}
.b2p-facts div[data-tone="warn"] dd{color: var(--b2p-amber);font-weight: 700;}
.b2p-facts div[data-tone="bad"] dd{color: var(--b2p-bad);font-weight: 700;}
.b2p-notes{border: 1px solid #f0d9ae;background: var(--b2p-amber-soft);border-radius: 10px;padding: 0.7rem 0.9rem;}
.b2p-notes h4{margin: 0 0 0.35rem;font-size: 0.8rem;font-weight: 700;letter-spacing: 0.05em;text-transform: uppercase;color: var(--b2p-amber);}
.b2p-notes ul{margin: 0;padding-left: 1.1rem;font-size: 0.85rem;}
.b2p-notes li{margin: 0.15rem 0;}
.b2p-save{display: grid;gap: 0.6rem;}
.b2p-name{display: block;width: 100%;padding: 0.5rem 0.75rem;font-family: var(--b2p-mono);font-size: 0.85rem;color: var(--b2p-ink);background: var(--b2p-surface);border: 1px solid var(--b2p-line-strong);border-radius: 8px;}
.b2p-name:focus{outline: 3px solid rgba(15, 118, 110, 0.35);border-color: var(--b2p-accent);}
.b2p-name:disabled{background: var(--b2p-bg);color: var(--b2p-muted);}
.b2p-actions{display: flex;flex-wrap: wrap;gap: 0.5rem;}
.b2p-preview{border-top: 1px solid var(--b2p-line);background: var(--b2p-bg);padding: 1.25rem;}
.b2p-preview-head{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: baseline;gap: 0.25rem 1rem;margin-bottom: 0.75rem;}
.b2p-preview-head h3{margin: 0;font-size: 1rem;font-weight: 700;}
.b2p-preview-head p{margin: 0;font-size: 0.8rem;color: var(--b2p-muted);}
.b2p-frame iframe{display: block;width: 100%;height: 560px;border: 1px solid var(--b2p-line-strong);border-radius: 10px;background: #525659;}
.b2p-section{margin: 0 auto 2.75rem;}
.b2p-section h2{font-size: 1.55rem;font-weight: 800;margin-bottom: 0.75rem;letter-spacing: -0.01em;}
.b2p-section p{font-size: 1rem;line-height: 1.7;color: #2b3a41;}
.b2p-sources{list-style: none;margin: 1.25rem 0 0;padding: 0;border-top: 2px solid var(--b2p-ink);}
.b2p-source{display: grid;grid-template-columns: 13rem 9rem minmax(0, 1fr);gap: 1rem;padding: 0.9rem 0;border-bottom: 1px solid var(--b2p-line);font-size: 0.93rem;line-height: 1.6;}
.b2p-source strong{display: block;}
.b2p-source small{display: block;color: var(--b2p-muted);font-size: 0.8rem;}
.b2p-source-field code{font-size: 0.82rem;}
.b2p-steps{list-style: none;counter-reset: b2pstep;margin: 1.25rem 0;padding: 0;display: grid;gap: 0.6rem;}
.b2p-steps li{counter-increment: b2pstep;position: relative;padding: 0.8rem 1rem 0.8rem 3.4rem;background: var(--b2p-surface);border: 1px solid var(--b2p-line);border-radius: 10px;font-size: 0.95rem;line-height: 1.6;}
.b2p-steps li::before{content: counter(b2pstep);position: absolute;left: 0.9rem;top: 0.8rem;width: 1.8rem;height: 1.8rem;display: grid;place-items: center;border-radius: 50%;background: var(--b2p-ink);color: #ffffff;font-size: 0.82rem;font-weight: 700;}
.b2p-steps strong{color: var(--b2p-ink);}
.b2p-table-wrap{overflow-x: auto;margin: 1.25rem 0;border: 1px solid var(--b2p-line);border-radius: 12px;background: var(--b2p-surface);}
.b2p-table{width: 100%;border-collapse: collapse;font-size: 0.9rem;}
.b2p-table th{background: var(--b2p-bg);text-align: left;font-weight: 700;padding: 0.65rem 0.9rem;border-bottom: 1px solid var(--b2p-line-strong);white-space: nowrap;}
.b2p-table td{padding: 0.65rem 0.9rem;border-bottom: 1px solid var(--b2p-line);vertical-align: top;line-height: 1.55;}
.b2p-table tr:last-child td{border-bottom: 0;}
.b2p-table td.b2p-pass{color: var(--b2p-ok);font-weight: 600;}
.b2p-table td.b2p-fail{color: var(--b2p-bad);font-weight: 600;}
.b2p-table td.b2p-trap{color: var(--b2p-amber);font-weight: 600;}
.b2p-table tr.b2p-row-mark td{background: var(--b2p-accent-soft);}
.b2p-prefix{font-family: var(--b2p-mono);font-weight: 700;color: var(--b2p-ink);white-space: nowrap;}
.b2p-limits{margin: 1rem 0 0;padding: 0;list-style: none;display: grid;gap: 1rem;}
.b2p-limits li{padding-left: 1rem;border-left: 3px solid var(--b2p-amber);}
.b2p-limits h3{font-size: 1.02rem;font-weight: 700;margin: 0 0 0.25rem;}
.b2p-limits p{margin: 0;}
.b2p-cmd{display: block;margin: 0.5rem 0 0;padding: 0.6rem 0.85rem;font-family: var(--b2p-mono);font-size: 0.82rem;color: var(--b2p-code-ink);background: var(--b2p-code-bg);border-radius: 8px;white-space: pre-wrap;word-break: break-all;}
.b2p-aside{margin-top: 1rem;padding: 0.85rem 1rem;background: var(--b2p-accent-soft);border-radius: 10px;font-size: 0.93rem;}
@media (max-width: 991.98px){.b2p-grid{grid-template-columns: 1fr;}.b2p-in{border-right: 0;border-bottom: 1px solid var(--b2p-line);}.b2p-textarea{min-height: 240px;}.b2p-frame iframe{height: 460px;}}
@media (max-width: 767.98px){.b2p-byline-local{margin-left: 0;}.b2p-source{grid-template-columns: 1fr;gap: 0.3rem;}.b2p-section h2{font-size: 1.3rem;}.b2p-facts div{grid-template-columns: 6.5rem minmax(0, 1fr);}.b2p-frame iframe{height: 380px;}}