/* Product benefits: voting preparation, saved votes and emailed PDF reports. */
.step-number .icon { width: 11px; height: 11px; }
.tour-steps button[aria-pressed="true"] .step-number .icon { color: white; }
.tour-steps { gap: 29px; }

.detail-comparison { margin-bottom: 26px; }

.bookmark-section { border-top: 1px solid var(--line); }
.bookmark-visual { background: #f5f7fb; border-radius: 16px; height: 430px; padding: 35px 34px; }
.bookmark-preview { border: 1px solid #dfe5ef; background: white; border-radius: 9px; padding: 22px; transform: rotate(-2deg); box-shadow: 0 12px 32px -18px #22365635; }
.bookmark-preview-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 19px; }
.bookmark-preview-heading > span:first-child { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; }
.bookmark-preview-heading .icon { width: 16px; height: 16px; color: var(--navy); }
.bookmark-preview-heading > span:last-child { font-size: 8px; color: #94a3b8; }
.bookmark-preview-tags { display: flex; flex-wrap: wrap; gap: 6px; padding-bottom: 19px; }
.bookmark-preview-tags > span { border: 1px solid #e2e8f0; background: #fafbfe; color: #8a95a6; padding: 5px 7px; border-radius: 4px; font-size: 8px; }
.bookmark-preview-tags > span:first-child { background: #eef2fd; color: #1e3a8a; border-color: #dfe6fc; }
.bookmark-preview-tags b { margin-left: 5px; font-size: 7px; font-weight: 500; }
.bookmark-preview-label { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 7px; letter-spacing: .7px; color: #94a3b8; margin-bottom: 9px; }
.bookmark-preview-label > span:last-child { letter-spacing: 0; }
.bookmark-preview-vote { border: 1px solid #e2e8f0; padding: 14px; border-radius: 6px; }
.bookmark-preview-vote > div:first-child { display: flex; align-items: center; justify-content: space-between; font-size: 8px; color: #94a3b8; }
.bookmark-preview-vote .icon { width: 12px; height: 12px; color: var(--navy); fill: #1e3a8a10; }
.bookmark-preview-vote h3 { font-size: 12px; line-height: 1.5; font-weight: 600; margin: 8px 0 5px; color: #334155; }
.bookmark-preview-vote p { font-size: 8px; color: #94a3b8; margin: 0 0 10px; }
.bookmark-preview-result { display: flex; align-items: center; gap: 10px; font-size: 8px; color: #718096; }
.bookmark-preview-result > span { display: flex; align-items: center; gap: 4px; }
.bookmark-preview-result .outcome-badge { font-size: 7px; padding: 3px 5px; }
.bookmark-preview-result i { width: 5px; height: 5px; border-radius: 50%; }
.bookmark-topic { display: inline-block; padding: 3px 5px; margin-top: 10px; font-size: 7px; color: #7a89a1; background: #f6f8fc; border-radius: 3px; }
.bookmark-preview-second { margin-top: 9px; }
.bookmark-preview-second h3 { font-size: 10px; margin: 6px 0 4px; }
.bookmark-preview-second p { margin: 0; font-size: 7px; }
.bookmark-preview-second p > span { margin-left: 9px; }
.bookmark-floating-note { position: absolute; display: flex; align-items: center; gap: 7px; right: 17px; bottom: 22px; border: 1px solid #dce8e1; border-radius: 6px; padding: 10px 12px; background: #fafffc; color: #4e8166; font-size: 10px; box-shadow: 0 5px 16px #193c290c; transform: rotate(3deg); }
.bookmark-floating-note .icon { width: 13px; height: 13px; }
.email-summary-section { border-top: 1px solid var(--line); }
.email-summary-visual { background: #faf8f3; height: 435px; border-radius: 16px; }
.summary-paper { position: absolute; width: 232px; right: 25px; top: 26px; transform: rotate(6deg); border: 1px solid #e5e2d9; background: white; border-radius: 5px; overflow: hidden; box-shadow: 0 12px 32px -15px #433c2b2d; transition: transform .25s; }
.summary-paper:hover { transform: rotate(3deg) translateY(-3px); }
.summary-paper img { width: 100%; height: auto; display: block; }
.summary-paper > span { display: flex; align-items: center; justify-content: space-between; font-size: 8px; padding: 10px 12px; color: var(--navy); border-top: 1px solid #efede7; }
.summary-paper .icon { width: 11px; height: 11px; }
.summary-email { position: absolute; z-index: 1; width: 294px; left: 23px; top: 105px; border: 1px solid #dfe5ef; border-radius: 9px; background: white; padding: 19px 20px; box-shadow: 0 14px 35px -17px #22365633; transform: rotate(-3deg); }
.summary-email-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #96a0af; font-size: 8px; border-bottom: 1px solid #edf0f5; padding-bottom: 13px; margin-bottom: 17px; }
.summary-email-top > span:first-child { display: flex; align-items: center; gap: 6px; }
.summary-email-top .icon { width: 12px; height: 12px; }
.summary-email-sender { display: flex; align-items: center; gap: 8px; }
.summary-email-sender img { border-radius: 6px; }
.summary-email-sender strong { display: block; font-size: 10px; font-weight: 600; }
.summary-email-sender span { display: block; color: #94a3b8; font-size: 8px; margin-top: 4px; }
.summary-email-sender > .icon { margin-left: auto; color: var(--navy); width: 13px; height: 13px; }
.summary-email h3 { font-size: 22px; letter-spacing: -.6px; line-height: 1.25; margin: 19px 0 10px; }
.summary-email > p { font-size: 10px; line-height: 1.7; color: #8a94a5; margin: 0 0 17px; }
.summary-attachment { display: flex; align-items: center; gap: 9px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 5px; padding: 11px 9px; }
.summary-attachment:hover { background: #eef4ff; }
.summary-attachment > span { display: grid; place-items: center; border: 1px solid #d8e1ef; color: var(--navy); width: 25px; height: 30px; border-radius: 3px; font-size: 7px; background: #f5f7fb; }
.summary-attachment strong { display: block; font-size: 8px; font-weight: 600; color: var(--navy); }
.summary-attachment small { display: block; font-size: 7px; color: #94a3b8; margin-top: 5px; }
.summary-attachment > .icon { margin-left: auto; width: 12px; height: 12px; color: var(--navy); }
.feature-copy > p.summary-example-note { font-size: 10px; color: #94a3b8; margin-top: 11px; }
/* Plenary Files follows the actual document and voting-item layout. */
.plenary-section { display: block; border-top: 1px solid var(--line); }
.plenary-introduction { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; margin-bottom: 38px; }
.plenary-description { padding-top: 83px; }
.plenary-description > p:not(.eyebrow) { max-width: none; }
.plenary-visual { padding: 20px; background: #f5f7fb; border-radius: 16px; }
.plenary-preview { background: #f7f8fa; border: 1px solid #dfe5ef; border-radius: 10px; overflow: hidden; box-shadow: 0 12px 32px -18px #22365626; }
.plenary-window-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 20px; border-bottom: 1px solid #e2e8f0; background: #f8f9fb; font-size: 11px; color: #64748b; }
.plenary-window-bar > span:first-child { display: flex; align-items: center; gap: 8px; }
.plenary-window-bar img { border-radius: 4px; }
.plenary-window-bar i { font-style: normal; color: #bac2ce; margin-inline: 3px; }
.plenary-window-bar > span:last-child { font-size: 9px; color: #8a95a6; }
.plenary-file-header { padding: 20px 26px 17px; background: white; border-bottom: 1px solid #e2e8f0; }
.plenary-breadcrumb { display: flex; align-items: center; gap: 6px; font-size: 10px; color: #64748b; margin-bottom: 13px; }
.plenary-breadcrumb .icon { width: 11px; height: 11px; color: var(--navy); }
.plenary-breadcrumb > span:last-child { color: #334155; }
.plenary-file-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.plenary-file-heading h3 { font-size: 22px; line-height: 1.3; font-weight: 700; letter-spacing: -.6px; color: #202633; margin: 0; }
.plenary-export-actions { display: flex; gap: 7px; flex-shrink: 0; }
.plenary-export-actions a { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #e2e8f0; border-radius: 6px; background: white; padding: 8px 10px; font-size: 10px; font-weight: 500; color: var(--navy); white-space: nowrap; }
.plenary-export-actions a:hover { background: #f8fafc; color: var(--navy); }
.plenary-export-actions .icon { width: 13px; height: 13px; }
.plenary-version-controls { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 17px; }
.plenary-version-tabs { display: flex; gap: 3px; background: #f8fafc; padding: 3px; border: 1px solid #e2e8f0; border-radius: 6px; }
.plenary-version-tabs button { color: #64748b; padding: 7px 12px; font-size: 10px; background: transparent; border: 0; border-radius: 4px; }
.plenary-version-tabs button[aria-pressed="true"] { background: #202633; color: white; font-weight: 500; }
.plenary-document-language { display: flex; align-items: center; gap: 8px; font-size: 10px; color: #64748b; }
.plenary-document-language b { padding: 5px 6px; font-size: 9px; font-weight: 500; color: #334155; border: 1px solid #e2e8f0; border-radius: 4px; }
.plenary-preparation-status { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 16px; padding-top: 13px; border-top: 1px solid #f1f5f9; }
.plenary-update-status { display: flex; align-items: center; gap: 6px; color: #5e8373; font-size: 10px; line-height: 1.6; margin: 0; }
.plenary-update-status .icon { width: 12px; height: 12px; }
.plenary-progress { display: flex; align-items: center; gap: 9px; color: #64748b; font-size: 10px; }
.plenary-progress strong { color: #202633; font-size: 10px; font-weight: 600; font-variant-numeric: tabular-nums; }
.plenary-progress meter { width: 80px; height: 6px; appearance: none; border: 0; border-radius: 10px; background: #edf0f5; }
.plenary-progress meter::-webkit-meter-bar { background: #edf0f5; border: 0; border-radius: 10px; }
.plenary-progress meter::-webkit-meter-optimum-value { background: #202633; border-radius: 10px; }
.plenary-progress meter::-moz-meter-bar { background: #202633; border-radius: 10px; }
.plenary-scroll { height: 620px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #d8dee8 transparent; padding: 22px 26px; }
.plenary-preview-rows { display: grid; gap: 14px; min-width: 0; }
.plenary-preview-row { border: 1px solid #e2e8f0; border-radius: 11px; background: white; min-width: 0; overflow: hidden; }
.plenary-new-item { border-color: #e9d9b2; }
.plenary-item-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; padding: 18px 20px; }
.plenary-card-heading { flex: 1; min-width: 0; }
.plenary-item-badges { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.plenary-item-badges > span, .plenary-item-badges > a { display: inline-flex; align-items: center; gap: 4px; border: 1px solid #e2e8f0; border-radius: 4px; padding: 3px 5px; font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; line-height: 1.4; color: var(--navy); background: white; }
.plenary-item-badges > span:first-child { background: #f8fafc; }
.plenary-item-badges .icon { width: 11px; height: 11px; }
.plenary-verified-badge .icon { color: inherit; }
.plenary-item-badges > .plenary-verified-badge { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }
.plenary-item-badges > .plenary-new-badge { background: #fff9eb; border-color: #efdfb8; color: #89621d; }
.plenary-item-badges > a:hover { background: #f8fafc; color: var(--navy); }
.plenary-card-heading h4 { margin: 0; color: #0f172a; font-size: 17px; line-height: 1.4; font-weight: 650; letter-spacing: -.3px; }
.plenary-card-heading > p { color: #526079; font-size: 12px; line-height: 1.6; margin: 4px 0 0; }
.plenary-card-heading > p.plenary-item-author { color: #7a8ba2; font-size: 11px; margin-top: 5px; }
.plenary-item-author span { color: #475569; }
.plenary-card-actions { display: flex; align-items: flex-end; flex-direction: column; gap: 9px; flex-shrink: 0; }
.plenary-vote-controls { display: flex; gap: 8px; align-items: center; }
.plenary-item-bookmark { display: grid; place-items: center; width: 34px; height: 34px; background: white; border: 1px solid #e2e8f0; border-radius: 7px; color: #73849c; flex-shrink: 0; }
.plenary-item-bookmark .icon { width: 16px; height: 16px; }
.plenary-item-bookmark:hover { border-color: #aebee7; color: var(--navy); }
.plenary-item-bookmark[aria-pressed="true"] { background: #edf1f8; color: var(--navy); border-color: #cfd9ec; }
.plenary-item-bookmark[aria-pressed="true"] .icon { fill: #1e3a8a16; }
.plenary-position-choices { display: flex; gap: 3px; padding: 3px; border: 1px solid #e2e8f0; border-radius: 7px; background: #f8fafc; flex-shrink: 0; }
.plenary-position-choices button { display: flex; align-items: center; gap: 6px; border: 0; background: transparent; border-radius: 5px; color: #526079; padding: 6px 9px; font-size: 11px; font-weight: 500; min-height: 27px; }
.plenary-position-choices .icon { width: 14px; height: 14px; color: inherit; }
.plenary-position-choices button[aria-pressed="false"]:hover { background: white; color: #202633; }
.plenary-choice-for[aria-pressed="true"] { background: #197354; color: white; box-shadow: 0 1px 2px #19735412; }
.plenary-choice-abstain[aria-pressed="true"] { background: #e6bc60; color: #3b2a08; box-shadow: 0 1px 2px #89621d12; }
.plenary-choice-against[aria-pressed="true"] { background: #b64153; color: white; box-shadow: 0 1px 2px #b6415312; }
.plenary-position-status { color: #89621d; font-size: 9px; line-height: 1.5; }
.plenary-position-status.has-position { color: #5e8373; }
.plenary-amendment-body { border-top: 1px solid #f1f5f9; padding: 18px 20px; }
.plenary-text-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 11px; font-weight: 600; color: #526079; margin-bottom: 19px; }
.plenary-text-heading > span:last-child { border-radius: 4px; padding: 4px 6px; font-size: 9px; background: #202633; color: white; }
.plenary-amendment-text { font-size: 13px; font-weight: 650; font-style: italic; line-height: 1.85; color: #334155; }
.plenary-amendment-text p { margin: 0 0 17px; }
.plenary-amendment-text p:last-child { margin-bottom: 0; }
.plenary-remark { border-top: 1px solid #f1f5f9; padding: 15px 20px; }
.plenary-remark-heading { display: flex; align-items: center; gap: 7px; margin-bottom: 8px; }
.plenary-remark-heading label { color: #475569; font-size: 11px; font-weight: 500; }
.plenary-remark-status { color: #89621d; font-size: 9px; }
.plenary-remark-format { display: flex; gap: 2px; margin-left: auto; }
.plenary-remark-format button { display: grid; place-items: center; width: 25px; height: 25px; border: 0; border-radius: 4px; background: transparent; color: #7a8ba2; font-size: 14px; }
.plenary-remark-format button:hover { color: #334155; background: #f1f5f9; }
.plenary-remark textarea { display: block; width: 100%; min-height: 68px; max-height: 160px; resize: vertical; border: 1px solid #e2e8f0; border-radius: 7px; background: #f8fafc; color: #334155; font: inherit; font-size: 12px; line-height: 1.6; padding: 10px 12px; }
.plenary-remark textarea::placeholder { color: #94a3b8; }
.plenary-remark textarea:focus { background: white; }
.plenary-remark-footer { display: flex; justify-content: flex-end; margin-top: 9px; }
.plenary-remark-save { background: var(--navy); border: 0; border-radius: 5px; padding: 6px 10px; font-size: 10px; font-weight: 500; color: white; }
.plenary-remark-save:hover:enabled { background: #172c68; }
.plenary-remark-save:disabled { opacity: .4; cursor: default; }
.plenary-bookmark-hint { display: flex; align-items: flex-start; gap: 7px; font-size: 10px; line-height: 1.7; padding: 13px 24px; margin: 0; color: #64748b; background: white; border-top: 1px solid #e2e8f0; }
.plenary-bookmark-hint .icon { width: 13px; height: 13px; margin-top: 2px; color: var(--navy); }
.plenary-bookmark-hint a { color: var(--navy); }
.plenary-bookmark-hint a:hover { text-decoration: underline; }

@media (max-width: 1150px) {
  .bookmark-visual { padding: 29px 24px; }
  .bookmark-preview { padding: 19px; }
  .summary-email { left: 19px; width: 266px; padding-inline: 17px; }
  .summary-paper { right: 20px; width: 216px; }
}
@media (max-width: 860px) {

  .tour-steps { gap: 18px; }
  .bookmark-visual { padding: 28px 16px; height: 403px; }
  .bookmark-preview { padding: 15px; }
  .bookmark-preview-tags > span { font-size: 7px; padding: 4px 5px; }
  .bookmark-preview-heading > span:last-child { font-size: 7px; }
  .bookmark-preview-vote { padding: 11px; }
  .bookmark-preview-vote h3 { font-size: 10px; }
  .bookmark-preview-result { gap: 7px; font-size: 7px; }
  .bookmark-preview-second p > span { display: block; margin: 4px 0 0; }
  .bookmark-floating-note { bottom: 16px; right: 12px; font-size: 9px; }
  .email-summary-visual { height: 421px; }
  .summary-email { left: 12px; width: 246px; top: 126px; padding: 17px; }
  .summary-paper { right: 13px; width: 194px; top: 22px; }
  .summary-email h3 { font-size: 20px; margin-top: 16px; }
  .summary-email-top { padding-bottom: 11px; margin-bottom: 13px; }
  .summary-email > p { font-size: 9px; }
}
@media (max-width: 650px) {
  .tour-steps { gap: 7px; }
  .tour-steps button { flex-direction: column; font-size: 8px; gap: 5px; }
  .step-number .icon { width: 10px; height: 10px; }

  .bookmark-section, .email-summary-section { padding-block: 54px; }
  .bookmark-visual { padding: 28px 23px; height: 407px; }
  .bookmark-preview { padding: 18px; }
  .bookmark-preview-heading > span:first-child { font-size: 12px; }
  .bookmark-preview-tags { gap: 5px; }
  .bookmark-preview-vote h3 { font-size: 11px; }
  .bookmark-preview-result { font-size: 7px; gap: 8px; }
  .bookmark-preview-second h3 { font-size: 9px; }
  .bookmark-floating-note { right: 13px; bottom: 17px; }
  .email-summary-section .feature-copy { order: -1; }
  .email-summary-visual { height: 415px; }
  .summary-paper { width: 201px; right: 23px; }
  .summary-email { width: 256px; left: 20px; top: 115px; padding: 18px; }
}
@media (max-width: 360px) {
  .bookmark-visual { padding: 26px 15px; }
  .bookmark-preview { padding: 13px; }
  .summary-email { left: 13px; width: 241px; padding: 16px; }
  .summary-paper { width: 192px; right: 17px; }
}
@media (max-width: 1150px) {
  .plenary-introduction { gap: 55px; }
  .plenary-file-heading h3 { font-size: 20px; }
  .plenary-visual { padding: 16px; }
  .plenary-file-header { padding-inline: 20px; }
  .plenary-scroll { padding-inline: 20px; }
}
@media (max-width: 860px) {
  .plenary-introduction { gap: 35px; }
  .plenary-description { padding-top: 73px; }
  .plenary-visual { padding: 12px; }
  .plenary-file-heading { flex-wrap: wrap; gap: 12px; }
  .plenary-file-header { padding: 18px; }
  .plenary-file-heading h3 { font-size: 19px; }
  .plenary-scroll { padding: 18px; height: 600px; }
  .plenary-item-header { gap: 12px; padding: 16px; }
  .plenary-card-heading h4 { font-size: 16px; }
  .plenary-card-heading > p { font-size: 11px; }
  .plenary-item-badges { gap: 4px; }
  .plenary-item-badges > span, .plenary-item-badges > a { font-size: 8px; }
  .plenary-vote-controls { gap: 6px; }
  .plenary-position-choices button { padding-inline: 7px; font-size: 10px; gap: 5px; }
  .plenary-amendment-body, .plenary-remark { padding-inline: 16px; }
  .plenary-amendment-text { font-size: 12px; }
}
@media (max-width: 650px) {
  .plenary-introduction { display: flex; flex-direction: column; gap: 20px; margin-bottom: 30px; }
  .plenary-description { padding-top: 0; }
  .plenary-visual { padding: 10px; }
  .plenary-window-bar { padding: 11px 13px; font-size: 10px; }
  .plenary-window-bar > span:first-child { gap: 5px; }
  .plenary-window-bar > span:last-child { font-size: 8px; }
  .plenary-file-header { padding: 16px 14px; }
  .plenary-breadcrumb { font-size: 9px; }
  .plenary-file-heading h3 { font-size: 18px; }
  .plenary-export-actions a { font-size: 9px; padding: 7px 8px; }
  .plenary-version-controls { flex-wrap: wrap; gap: 10px; margin-top: 15px; }
  .plenary-document-language { font-size: 9px; }
  .plenary-version-tabs button { padding: 7px 10px; font-size: 9px; }
  .plenary-preparation-status { gap: 9px; margin-top: 13px; padding-top: 12px; }
  .plenary-update-status, .plenary-progress { font-size: 9px; }
  .plenary-scroll { padding: 14px 12px; height: 560px; }
  .plenary-preview-rows { gap: 11px; }
  .plenary-preview-row { border-radius: 8px; }
  .plenary-item-header { flex-wrap: wrap; gap: 12px; padding: 14px; }
  .plenary-card-heading { flex-basis: 100%; }
  .plenary-card-heading h4 { font-size: 16px; }
  .plenary-card-heading > p { font-size: 11px; }
  .plenary-item-author { font-size: 10px; }
  .plenary-card-actions { width: 100%; align-items: flex-start; gap: 7px; }
  .plenary-position-choices button { gap: 4px; padding-inline: 6px; }
  .plenary-item-bookmark { width: 32px; height: 32px; }
  .plenary-position-choices .icon { width: 12px; height: 12px; }
  .plenary-amendment-body { padding: 16px 14px; }
  .plenary-text-heading { font-size: 10px; }
  .plenary-amendment-text { font-size: 12px; line-height: 1.85; }
  .plenary-remark { padding: 14px; }
  .plenary-remark textarea { font-size: 11px; padding: 10px; }
  .plenary-bookmark-hint { font-size: 9px; padding: 12px 14px; }
}
@media (max-width: 360px) {
  .plenary-visual { padding: 8px; }
  .plenary-window-bar > span:last-child { max-width: 50px; text-align: right; line-height: 1.4; }
  .plenary-file-header { padding-inline: 12px; }
  .plenary-scroll { padding: 12px 10px; }
  .plenary-item-header, .plenary-amendment-body, .plenary-remark { padding-inline: 12px; }
  .plenary-position-choices button { font-size: 9px; padding-inline: 5px; }
  .plenary-position-choices .icon { width: 10px; height: 10px; }
  .plenary-item-bookmark { width: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  .summary-paper:hover { transform: rotate(6deg); }
}