
/* ==========================================================================
   Presentation Brief Builder — Typography & Rendering Foundation
   V1.0.2
   Inherits the site's font family while owning typography metrics so
   WordPress/theme CSS cannot clip or distort plugin text.
   ========================================================================== */
.pbb-app {
    --pbb-font-size-xs: 11px;
    --pbb-font-size-sm: 12px;
    --pbb-font-size-meta: 13px;
    --pbb-font-size-label: 14px;
    --pbb-font-size-body: 15px;
    --pbb-font-size-question: 18px;
    --pbb-font-size-section: 24px;
    --pbb-font-size-title: 30px;
    --pbb-line-tight: 1.25;
    --pbb-line-normal: 1.45;
    --pbb-line-body: 1.55;
    --pbb-line-relaxed: 1.65;
    font-family: inherit;
    font-size: var(--pbb-font-size-body);
    line-height: var(--pbb-line-body);
    letter-spacing: normal;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
.pbb-app,
.pbb-app *,
.pbb-app *::before,
.pbb-app *::after { box-sizing: border-box; }
.pbb-app h1,.pbb-app h2,.pbb-app h3,.pbb-app h4 {
    line-height: var(--pbb-line-tight);
    letter-spacing: normal;
}
.pbb-app p,.pbb-app li {
    line-height: var(--pbb-line-body);
    letter-spacing: normal;
}
.pbb-app button,.pbb-app input,.pbb-app select,.pbb-app textarea {
    font-family: inherit !important;
    letter-spacing: normal !important;
    text-transform: none;
}
.pbb-app input[type="text"],
.pbb-app input[type="number"],
.pbb-app input[type="email"],
.pbb-app input[type="url"],
.pbb-app input[type="search"],
.pbb-app input[type="tel"],
.pbb-app select,
.pbb-app textarea {
    font-size: var(--pbb-font-size-body) !important;
    line-height: var(--pbb-line-body) !important;
    font-weight: 400;
}
.pbb-app input[type="text"],
.pbb-app input[type="number"],
.pbb-app input[type="email"],
.pbb-app input[type="url"],
.pbb-app input[type="search"],
.pbb-app input[type="tel"],
.pbb-app select { min-height: 46px; }
.pbb-app textarea { min-height: 100px; }
.pbb-app button { line-height: var(--pbb-line-normal) !important; }
.pbb-app input::placeholder,.pbb-app textarea::placeholder {
    font-family: inherit;
    font-size: var(--pbb-font-size-body);
    line-height: var(--pbb-line-body);
    letter-spacing: normal;
}
.pbb-app input[type="checkbox"],.pbb-app input[type="radio"] {
    font-size: initial !important;
    line-height: normal !important;
    letter-spacing: normal !important;
}

/* Presentation Brief Builder */
.pbb-app {
    --pbb-text: #18212b;
    --pbb-muted: #66717d;
    --pbb-border: #dfe5ea;
    --pbb-surface: #ffffff;
    --pbb-soft: #f5f7f9;
    --pbb-accent: #2457d6;
    --pbb-accent-soft: #eef3ff;
    --pbb-success: #16805b;
    max-width: 1040px;
    margin: 32px auto;
    padding: 28px;
    background: var(--pbb-surface);
    color: var(--pbb-text);
    border: 1px solid var(--pbb-border);
    border-radius: 18px;
    box-shadow: 0 12px 40px rgba(18, 35, 52, .07);
    font-family: inherit;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: normal;
    text-rendering: optimizeLegibility;
}
.pbb-app button,
.pbb-app input,
.pbb-app select,
.pbb-app textarea {
    letter-spacing: normal;
}
.pbb-app * { box-sizing: border-box; }
.pbb-header { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-bottom:28px; }
.pbb-eyebrow,.pbb-kicker { font-size:var(--pbb-font-size-xs); font-weight:800; letter-spacing:.13em; color:var(--pbb-accent); }
.pbb-header h2,.pbb-panel-heading h3,.pbb-result-header h3 { margin:6px 0 8px; line-height:1.15; }
.pbb-header h2 { font-size:var(--pbb-font-size-title); }
.pbb-header p,.pbb-panel-heading p { color:var(--pbb-muted); margin:0; max-width:760px; }
.pbb-progress-wrap { padding:18px 0 26px; border-top:1px solid var(--pbb-border); border-bottom:1px solid var(--pbb-border); margin-bottom:28px; }
.pbb-progress-label { display:flex; justify-content:space-between; font-size:var(--pbb-font-size-meta); color:var(--pbb-muted); margin-bottom:8px; }
.pbb-progress { height:5px; background:#e9edf1; border-radius:20px; overflow:hidden; }
.pbb-progress > span { display:block; width:0; height:100%; background:var(--pbb-accent); transition:width .25s ease; }
.pbb-step-list { display:flex; justify-content:space-between; gap:8px; margin-top:18px; }
.pbb-step-dot { border:0; background:none; color:#9aa4ad; cursor:pointer; padding:0; display:flex; flex-direction:column; align-items:center; gap:5px; font:inherit; }
.pbb-step-dot span { width:30px; height:30px; border:1px solid #ccd4db; border-radius:50%; display:grid; place-items:center; font-size:var(--pbb-font-size-sm); font-weight:700; background:#fff; }
.pbb-step-dot small { font-size:var(--pbb-font-size-xs); }
.pbb-step-dot.is-active { color:var(--pbb-accent); }
.pbb-step-dot.is-active span,.pbb-step-dot.is-done span { background:var(--pbb-accent-soft); border-color:var(--pbb-accent); color:var(--pbb-accent); }
.pbb-panel { display:none; }
.pbb-panel.is-active { display:block; }
.pbb-panel-heading { margin-bottom:26px; }
.pbb-panel-heading h3 { font-size:var(--pbb-font-size-section); }
.pbb-field { margin:0 0 22px; }
.pbb-field > label { display:block; font-weight:700; font-size:var(--pbb-font-size-label); line-height:1.45; letter-spacing:normal; margin-bottom:8px; }
.pbb-required { color:#c33; }
.pbb-app input[type="text"],
.pbb-app input[type="number"],
.pbb-app textarea,
.pbb-app select {
    width:100%;
    min-height:46px;
    border:1px solid var(--pbb-border);
    border-radius:10px;
    background:#fff;
    color:var(--pbb-text);
    padding:10px 13px;
    font-family:inherit !important;
    font-size:var(--pbb-font-size-body) !important;
    font-weight:400;
    line-height:1.5 !important;
    letter-spacing:normal !important;
    outline:none;
    appearance:auto;
    -webkit-appearance:auto;
    transition:border-color .15s, box-shadow .15s;
}
.pbb-app textarea {
    resize:vertical;
    min-height:100px;
    line-height:1.55 !important;
}
.pbb-app input:focus,.pbb-app textarea:focus,.pbb-app select:focus { border-color:var(--pbb-accent); box-shadow:0 0 0 3px rgba(36,87,214,.1); }
.pbb-card-grid { display:grid; gap:10px; }
.pbb-card-grid-3 { grid-template-columns:repeat(3,1fr); }
.pbb-choice-card { position:relative; cursor:pointer; }
.pbb-choice-card input { position:absolute; opacity:0; pointer-events:none; }
.pbb-choice-content { display:flex; flex-direction:column; min-height:82px; justify-content:center; gap:5px; padding:14px; border:1px solid var(--pbb-border); border-radius:12px; background:#fff; transition:.15s; }
.pbb-choice-card:hover .pbb-choice-content { border-color:#aeb9c4; transform:translateY(-1px); }
.pbb-choice-card input:checked + .pbb-choice-content { border-color:var(--pbb-accent); background:var(--pbb-accent-soft); box-shadow:0 0 0 2px rgba(36,87,214,.08); }
.pbb-choice-content strong { font-size:var(--pbb-font-size-label); line-height:1.4; letter-spacing:normal; }
.pbb-choice-content small { color:var(--pbb-muted); font-size:var(--pbb-font-size-sm); line-height:1.45; letter-spacing:normal; }
.pbb-choice-card.pbb-compact .pbb-choice-content { min-height:50px; }
.pbb-two-col { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.pbb-tag-grid { display:flex; flex-wrap:wrap; gap:8px; }
.pbb-tag-choice { cursor:pointer; }
.pbb-tag-choice input { position:absolute; opacity:0; pointer-events:none; }
.pbb-tag-choice span { display:block; border:1px solid var(--pbb-border); border-radius:999px; padding:8px 12px; font-size:var(--pbb-font-size-meta); background:#fff; }
.pbb-tag-choice:hover span { border-color:#aeb9c4; }
.pbb-tag-choice input:checked + span { background:var(--pbb-accent-soft); border-color:var(--pbb-accent); color:var(--pbb-accent); font-weight:700; }
.pbb-range-row { display:grid; grid-template-columns:70px 1fr 50px; align-items:center; gap:12px; font-size:var(--pbb-font-size-sm); color:var(--pbb-muted); }
.pbb-range-row input[type="range"] { width:100%; accent-color:var(--pbb-accent); }
.pbb-range-value { text-align:center; margin-top:6px; font-weight:700; font-size:var(--pbb-font-size-meta); }
.pbb-radio-stack { display:grid; gap:9px; padding:12px 14px; background:var(--pbb-soft); border-radius:10px; }
.pbb-radio-stack label { font-size:var(--pbb-font-size-meta); cursor:pointer; }
.pbb-input-suffix {
    display:flex;
    align-items:center;
    min-height:46px;
    border:1px solid var(--pbb-border);
    border-radius:10px;
    overflow:hidden;
}
.pbb-input-suffix input {
    border:0 !important;
    box-shadow:none !important;
    min-height:44px;
}
.pbb-input-suffix span {
    padding:0 13px;
    color:var(--pbb-muted);
    font-size:var(--pbb-font-size-meta);
    line-height:1.4;
}
.pbb-highlight-question { background:var(--pbb-accent-soft); border:1px solid #d5e0ff; border-radius:14px; padding:18px; margin-bottom:24px; }
.pbb-highlight-question > span { font-size:10px; font-weight:800; letter-spacing:.12em; color:var(--pbb-accent); }
.pbb-highlight-question strong { display:block; font-size:var(--pbb-font-size-question); line-height:1.3; margin:7px 0 14px; }
.pbb-dynamic-list { display:grid; gap:9px; margin-bottom:10px; }
.pbb-list-row { display:grid; grid-template-columns:28px 1fr; gap:8px; align-items:center; }
.pbb-list-row > span { width:28px; height:28px; border-radius:50%; background:var(--pbb-soft); display:grid; place-items:center; font-size:var(--pbb-font-size-sm); font-weight:700; }
.pbb-secondary-button,
.pbb-primary-button,
.pbb-text-button,
.pbb-reset-large {
    border-radius:10px;
    padding:11px 15px;
    font-family:inherit !important;
    font-size:var(--pbb-font-size-meta) !important;
    font-weight:700;
    line-height:1.4 !important;
    letter-spacing:normal !important;
    cursor:pointer;
}
.pbb-primary-button { border:1px solid var(--pbb-accent); background:var(--pbb-accent); color:#fff; }
.pbb-secondary-button { border:1px solid var(--pbb-border); background:#fff; color:var(--pbb-text); }
.pbb-text-button { border:0; background:none; color:var(--pbb-muted); }
.pbb-form-footer { display:flex; justify-content:space-between; align-items:center; gap:15px; padding-top:22px; margin-top:28px; border-top:1px solid var(--pbb-border); }
.pbb-footer-actions { display:flex; align-items:center; gap:14px; }
.pbb-save-note { font-size:var(--pbb-font-size-xs); color:var(--pbb-muted); }
.pbb-helper { display:flex; gap:10px; padding:13px 14px; background:var(--pbb-soft); border-radius:10px; color:var(--pbb-muted); font-size:var(--pbb-font-size-sm); }
.pbb-helper strong { color:var(--pbb-text); white-space:nowrap; }
.pbb-conditional.is-hidden,.pbb-slide-count-field.is-hidden { display:none; }
.pbb-advanced { margin-top:25px; border:1px solid var(--pbb-border); border-radius:10px; }
.pbb-advanced summary {
    display:block;
    padding:14px;
    cursor:pointer;
    font-weight:700;
    font-size:var(--pbb-font-size-body);
    line-height:1.45;
    letter-spacing:normal;
}
.pbb-advanced-body { padding:0 14px 14px; }
.pbb-review-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:22px 0; }
.pbb-review-card { padding:15px; border:1px solid var(--pbb-border); border-radius:12px; }
.pbb-review-card span { display:block; color:var(--pbb-muted); font-size:var(--pbb-font-size-xs); margin-bottom:4px; }
.pbb-review-card strong { display:block; font-size:var(--pbb-font-size-label); line-height:1.4; }
.pbb-completeness { padding:15px; background:var(--pbb-soft); border-radius:12px; }
.pbb-completeness-head { display:flex; justify-content:space-between; font-size:var(--pbb-font-size-meta); margin-bottom:8px; }
.pbb-completeness-bar { height:6px; background:#e3e8ed; border-radius:10px; overflow:hidden; }
.pbb-completeness-bar span { display:block; height:100%; background:var(--pbb-success); }
.pbb-check-grid { display:flex; flex-wrap:wrap; gap:12px; margin-top:10px; font-size:var(--pbb-font-size-sm); }
.pbb-check-grid .ok { color:var(--pbb-success); }
.pbb-check-grid .missing { color:#9a6a00; }
.pbb-result-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:24px; }
.pbb-result-header { display:flex; justify-content:space-between; gap:20px; align-items:center; }
.pbb-tabs { display:flex; gap:4px; border-bottom:1px solid var(--pbb-border); margin-top:25px; }
.pbb-tab { border:0; background:none; padding:11px 14px; cursor:pointer; color:var(--pbb-muted); font:inherit; font-size:var(--pbb-font-size-meta); font-weight:700; border-bottom:2px solid transparent; }
.pbb-tab.is-active { color:var(--pbb-accent); border-color:var(--pbb-accent); }
.pbb-output-panel { display:none; padding-top:18px; }
.pbb-output-panel.is-active { display:block; }
.pbb-output-toolbar { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:10px; color:var(--pbb-muted); font-size:var(--pbb-font-size-sm); }
.pbb-output { margin:0; white-space:pre-wrap; word-break:break-word; max-height:650px; overflow:auto; padding:18px; background:#10151b; color:#f3f5f7; border-radius:12px; font:13px/1.65 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; }
.pbb-final-note { display:flex; flex-direction:column; gap:4px; margin-top:18px; padding:14px; background:var(--pbb-soft); border-radius:10px; font-size:var(--pbb-font-size-sm); color:var(--pbb-muted); }
.pbb-final-note strong { color:var(--pbb-text); }
.pbb-reset-large { display:block; margin:20px auto 0; border:0; background:none; color:var(--pbb-accent); }
@media (max-width: 760px) {
    .pbb-app { margin:10px; padding:18px; border-radius:12px; }
    .pbb-header { flex-direction:column; }
    .pbb-header h2 { font-size:25px; }
    .pbb-step-list { overflow-x:auto; justify-content:flex-start; }
    .pbb-step-dot { min-width:70px; }
    .pbb-step-dot small { display:none; }
    .pbb-card-grid-3,.pbb-two-col,.pbb-review-grid { grid-template-columns:1fr; }
    .pbb-form-footer { flex-direction:column; align-items:stretch; }
    .pbb-footer-actions { justify-content:space-between; }
    .pbb-result-actions { flex-direction:column-reverse; }
    .pbb-result-actions button { width:100%; }
}

/* Cross-theme safeguards */
.pbb-app .pbb-advanced summary,
.pbb-app .pbb-advanced-body,
.pbb-app .pbb-field,
.pbb-app .pbb-field > label,
.pbb-app .pbb-help,
.pbb-app .pbb-choice-content,
.pbb-app .pbb-choice-content strong,
.pbb-app .pbb-choice-content small,
.pbb-app .pbb-tabs button,
.pbb-app .pbb-progress,
.pbb-app .pbb-step-label,
.pbb-app .pbb-badge,
.pbb-app .pbb-chip,
.pbb-app .pbb-meta {
    letter-spacing: normal !important;
}
.pbb-app .pbb-advanced summary {
    font-size: var(--pbb-font-size-body) !important;
    line-height: var(--pbb-line-normal) !important;
}
.pbb-app .pbb-field > label {
    font-size: var(--pbb-font-size-label) !important;
    line-height: var(--pbb-line-normal) !important;
}
.pbb-app .pbb-help {
    font-size: var(--pbb-font-size-meta) !important;
    line-height: var(--pbb-line-body) !important;
}
.pbb-app .pbb-choice-content strong {
    font-size: var(--pbb-font-size-label) !important;
    line-height: var(--pbb-line-normal) !important;
}
.pbb-app .pbb-choice-content small {
    font-size: var(--pbb-font-size-sm) !important;
    line-height: var(--pbb-line-body) !important;
}
.pbb-app input,.pbb-app select,.pbb-app textarea,.pbb-app button {
    max-width: 100%;
}
@media (max-width: 640px) {
    .pbb-app {
        font-size: 15px;
        line-height: var(--pbb-line-body);
    }
    .pbb-app h1 { font-size: 26px !important; line-height: 1.25 !important; }
    .pbb-app h2 { font-size: 22px !important; line-height: 1.3 !important; }
    .pbb-app h3 { font-size: 18px !important; line-height: 1.35 !important; }
    .pbb-app input[type="text"],
    .pbb-app input[type="number"],
    .pbb-app input[type="email"],
    .pbb-app input[type="url"],
    .pbb-app input[type="search"],
    .pbb-app input[type="tel"],
    .pbb-app select,
    .pbb-app textarea {
        font-size: 16px !important;
        line-height: 1.5 !important;
    }
}
