:root { --pp-blue: #166594; --pp-dark: #002d45; --pp-muted: #617484; --pp-border: #dde5ec; }
body.account-workspace { margin: 0; background: #f6f8fb; color: var(--pp-dark); font-family: Selawik, "Segoe UI", sans-serif; }
.account-workspace [hidden], .account-workspace .hidden { display: none !important; }
.account-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 2rem; background: white; border-bottom: 1px solid var(--pp-border); }
.account-header img { width: 190px; max-width: 100%; }
.account-header-actions, .account-toolbar { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.account-label, .account-help, .account-description, .account-email { color: var(--pp-muted); }
.account-label, .account-help { font-size: .875rem; }
.account-layout { display: flex; gap: 2rem; max-width: 1440px; margin: auto; padding: 2rem; min-height: 78vh; align-items: flex-start; }
.account-sidebar { flex: 0 0 235px; position: sticky; top: 2rem; }
.account-eyebrow { display: block; color: var(--pp-muted); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; margin: 0 0 .6rem; }
.account-sidebar h1 { font-size: 1.5rem; font-weight: 700; margin: 0; }
.account-email { font-size: .82rem; overflow-wrap: anywhere; margin: .6rem 0 1.6rem; }
.account-navigation { display: flex; flex-direction: column; gap: .3rem; }
.account-workspace button, .account-workspace input, .account-workspace select { font: inherit; }
.account-workspace button { cursor: pointer; border: 1px solid var(--pp-border); border-radius: .5rem; padding: .6rem 1rem; background: white; color: var(--pp-dark); font-weight: 600; font-size: .875rem; }
.account-workspace button:hover { background: #edf5fa; border-color: #b5cbd8; }
.account-workspace button:disabled { opacity: .55; cursor: wait; }
.account-workspace button.account-primary { background: var(--pp-blue); color: white; border-color: var(--pp-blue); }
.account-workspace button.account-primary:hover { background: #0f527c; }
.account-workspace button.account-soft { color: #145a85; background: #edf5fa; border-color: #d3e5f0; }
.account-workspace button.account-soft:hover { background: #e0eef7; }
.account-workspace button.account-quiet { border-color: transparent; background: transparent; }
.account-workspace button.account-destructive { color: #a13c40; }
.account-workspace button.account-destructive:hover { background: #fff1f1; border-color: #ebcdce; }
.account-navigation button { display: flex; align-items: center; gap: .8rem; text-align: left; border-color: transparent; background: transparent; padding: .85rem .9rem; color: #506473; }
.account-navigation button[aria-selected="true"] { color: var(--pp-blue); background: #e6f0f7; border-color: #d6e6f1; }
.account-navigation button > span { font-size: 1.25rem; width: 1.2rem; text-align: center; font-weight: 400; }
.account-navigation small { margin-left: auto; border-radius: .4rem; padding: .1rem .4rem; background: white; }
.account-navigation small:empty { display: none; }
.sidebar-licence { border-top: 1px solid var(--pp-border); margin: 1.75rem .9rem 0; padding-top: 1.4rem; display: flex; flex-direction: column; gap: .35rem; font-size: .8rem; color: var(--pp-muted); }
.sidebar-licence strong { font-size: .95rem; color: var(--pp-dark); }
.account-content { flex: 1; min-width: 0; }
.account-panel { --panel-padding: 1.75rem; padding: var(--panel-padding); border: 1px solid var(--pp-border); border-radius: .85rem; background: white; box-shadow: 0 2px 8px #002d4503; }
.account-panel-heading { padding: 1.5rem var(--panel-padding); margin: calc(-1 * var(--panel-padding)) calc(-1 * var(--panel-padding)) 1.5rem; background: #f5f9fc; border-bottom: 1px solid #e1ebf2; border-radius: .85rem .85rem 0 0; }
.account-panel-heading .account-eyebrow { color: var(--pp-blue); margin-bottom: .4rem; }
.account-panel-heading .account-description { margin: .5rem 0 0; }
.account-content h2 { margin: 0; font-size: 1.65rem; font-weight: 700; letter-spacing: -.025em; }
.account-content h3 { font-weight: 600; font-size: 1rem; margin: 0 0 .6rem; }
.account-description { font-size: .95rem; line-height: 1.65; margin: .75rem 0 1.5rem; max-width: 65ch; }
.account-feedback:empty { display: none; }
.account-feedback { padding: .8rem 1rem; border-radius: .5rem; border: 1px solid var(--pp-border); background: #edf5fa; margin: 0 0 1rem; }
.account-workspace input, .account-workspace select { border: 1px solid #c7d4de; border-radius: .5rem; padding: .65rem .8rem; font-size: .875rem; min-width: 0; background: white; }
.account-workspace input { flex: 1; }
.account-workspace label { display: block; font-weight: 600; font-size: .85rem; margin-bottom: .5rem; }
.account-workspace a { color: var(--pp-blue); }
.account-workspace a:hover { text-decoration: underline; }
.account-workspace :focus-visible { outline: 2px solid var(--pp-blue); outline-offset: 3px; }
.account-section-heading { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.account-allowance { border-left: 3px solid #80adc8; padding: .6rem .9rem; background: #f2f7fa; border-radius: 0 .4rem .4rem 0; font-size: .85rem; margin: 1.3rem 0; }
.watchdog-add, .scan-start-form { margin: 1.25rem 0; padding: 1.1rem; background: #f8fafc; border: 1px solid #e3eaf0; border-radius: .65rem; }
.scan-start-form .account-help { margin-bottom: 0; }
.watchdog-filters { padding: .5rem 0 .9rem; }
.watchdog-list { display: flex; flex-direction: column; gap: .6rem; }
.watchdog-item { border: 1px solid var(--pp-border); border-radius: .6rem; }
.watchdog-item > summary { display: flex; align-items: center; justify-content: space-between; gap: .75rem; cursor: pointer; padding: 1rem; list-style: none; border-radius: .6rem; }
.watchdog-item > summary:hover { background: #f5f9fc; }
.watchdog-item > summary:focus-visible { outline-offset: -3px; }
.watchdog-item[open] > summary { border-bottom: 1px solid var(--pp-border); border-radius: .6rem .6rem 0 0; }
.watchdog-item > summary::-webkit-details-marker { display: none; }
.watchdog-item > summary::after { content: "+"; color: var(--pp-blue); font-size: 1.3rem; }
.watchdog-item[open] > summary::after { content: "−"; }
.watchdog-name { flex: 1; min-width: 0; }
.watchdog-name strong { display: block; font-size: .97rem; overflow-wrap: anywhere; }
.watchdog-name small { display: block; font-size: .75rem; color: var(--pp-muted); margin-top: .35rem; }
.watchdog-status { font-size: .7rem; font-weight: 600; text-transform: capitalize; border-radius: 2rem; padding: .25rem .6rem; background: #eef2f5; color: #506473; }
.watchdog-status[data-status="active"] { color: #277052; background: #eaf6ef; }
.watchdog-status[data-status="pending_verification"] { color: #805511; background: #fff3d9; max-width: 120px; text-align: center; }
.watchdog-alert-count { color: #8a561a; background: #fff4dc; border-radius: 2rem; padding: .25rem .6rem; font-size: .7rem; white-space: nowrap; }
.watchdog-detail { padding: .75rem 1rem 1rem; background: #f8fafc; border-radius: 0 0 .6rem .6rem; }
.watchdog-detail p { font-size: .82rem; margin: .5rem 0; overflow-wrap: anywhere; }
.watchdog-detail .account-toolbar { margin-top: 1rem; }
.watchdog-detail details { font-size: .85rem; margin-top: 1.2rem; }
.watchdog-detail details summary { cursor: pointer; color: var(--pp-blue); }
.watchdog-urls { list-style: none; margin: .75rem 0 0; padding: 0; background: white; border: 1px solid #e3eaf0; border-radius: .5rem; }
.watchdog-urls li { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; padding: .65rem .8rem; font-size: .82rem; }
.watchdog-urls li + li { border-top: 1px solid #e3eaf0; }
.watchdog-url { flex: 1; overflow-wrap: anywhere; min-width: 100px; }
.watchdog-controls { gap: .5rem; }
.watchdog-controls button { font-size: .8rem; padding: .5rem .7rem; }
.watchdog-controls .account-destructive { margin-left: auto; }
.watchdog-history { padding-top: .9rem; border-top: 1px solid var(--pp-border); }
.watchdog-verification { padding: 1rem; border: 1px solid #d6e5ef; border-radius: .5rem; background: white; }
.verification-content { margin-top: 1rem; }
.verification-content h3 { margin-top: 1.25rem; }
.verification-content img { max-width: 100%; height: auto; }
.verification-field { margin: .85rem 0; }
.verification-field input, .verification-field textarea { display: block; width: 100%; box-sizing: border-box; font: .78rem/1.5 monospace; color: var(--pp-dark); background: #f8fafc; border: 1px solid var(--pp-border); border-radius: .4rem; padding: .65rem; margin-bottom: .5rem; }
.verification-field textarea { resize: vertical; }
.verification-field button { font-size: .75rem; }
.verification-links { font-size: .8rem; }
.verification-links a { text-decoration: underline; text-underline-offset: 3px; }
.result-badge { display: inline-flex; align-items: center; gap: .35rem; border-radius: .35rem; padding: .2rem .45rem; font-size: .7rem; font-weight: 600; white-space: nowrap; color: #526372; background: #edf1f4; width: fit-content; }
.result-badge[data-tone="pass"] { color: #226348; background: #e8f5ed; }
.result-badge[data-tone="fail"] { color: #a13c40; background: #fceced; }
.result-badge[data-tone="review"] { color: #805511; background: #fff3d9; }
.result-badge::before { content: ""; width: .3rem; height: .3rem; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.account-notice { padding: 1rem; background: #fff8e8; border-radius: .5rem; font-size: .9rem; }
.licence-details { margin: 1.5rem 0; padding: .25rem 1rem; background: #f8fafc; border: 1px solid #e3eaf0; border-radius: .65rem; }
.licence-details:empty { display: none; }
.licence-details div { display: flex; gap: 1rem; padding: .85rem 0; border-bottom: 1px solid #e3eaf0; font-size: .85rem; }
.licence-details div:last-child { border-bottom: 0; }
.licence-details dt { width: 40%; color: var(--pp-muted); }
.licence-details dd { margin: 0; font-weight: 600; flex: 1; }
.capacity-form, .audit-purchase, .audit-credits, .plan-options { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--pp-border); }
.audit-credits:empty { display: none; }
.plan-options > button, .plan-options > a { display: block; margin-top: .8rem; }
.account-help { line-height: 1.6; margin: .6rem 0 1rem; }
.account-identity { padding: 1.1rem; background: #f8fafc; border: 1px solid #e3eaf0; border-radius: .65rem; font-size: .9rem; overflow-wrap: anywhere; }
.account-danger { margin-top: 1.5rem; border: 1px solid #efdddd; background: #fffafa; border-radius: .65rem; padding: 1.1rem; }
.account-danger p { color: #8b5555; font-size: .875rem; margin: .6rem 0 1rem; }
.account-danger button { color: #a13636; border-color: #eccccc; }
.scan-table-wrap { border: 1px solid var(--pp-border); border-radius: .6rem; }
.scan-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .82rem; text-align: left; }
.scan-table th { padding: .7rem .85rem; background: #f8fafc; color: var(--pp-muted); font-size: .67rem; letter-spacing: .05em; text-transform: uppercase; font-weight: 600; }
.scan-table th:first-child { border-radius: .6rem 0 0 0; }
.scan-table th:last-child { border-radius: 0 .6rem 0 0; }
.scan-table td { padding: .9rem .85rem; vertical-align: top; border-top: 1px solid #e6edf2; }
.scan-table tbody tr:hover { background: #fcfdff; }
.scan-website { width: 38%; overflow-wrap: anywhere; }
.scan-website > a { font-weight: 600; display: block; }
.scan-location { display: block; color: var(--pp-muted); margin-top: .3rem; font-size: .7rem; }
.scan-plan-badge { display: inline-block; margin-top: .35rem; color: #326889; font-size: .65rem; font-weight: 600; }
.scan-verdicts { display: flex; flex-direction: column; gap: .25rem; }
.scan-time { white-space: nowrap; color: #465e70; }
.scan-time small { display: block; margin-top: .3rem; font-size: .72rem; color: var(--pp-muted); }
.scan-actions-heading { text-align: right; }
.scan-actions-cell { width: 215px; }
.scan-actions { display: flex; align-items: flex-start; justify-content: flex-end; gap: .4rem; }
.scan-actions button, .scan-more summary { font-size: .76rem; padding: .45rem .6rem; white-space: nowrap; line-height: 1.4; }
.scan-more { min-width: 64px; }
.scan-more summary { cursor: pointer; list-style: none; color: #4e6879; border: 1px solid transparent; border-radius: .4rem; text-align: right; }
.scan-more summary::-webkit-details-marker { display: none; }
.scan-more summary:hover, .scan-more[open] summary { background: #eef4f8; }
.scan-more-actions { display: flex; flex-direction: column; align-items: flex-end; gap: .2rem; margin-top: .4rem; }
.scan-more-actions button { border-color: transparent; font-weight: 500; background: transparent; }
.scan-more-actions .account-destructive { border-top: 1px solid #e6edf2; border-radius: 0 0 .4rem .4rem; }
.account-info-note { padding: 1rem; margin-top: 1.25rem; border-radius: .6rem; background: #f2f7fa; color: #4e6879; }
.account-info-note h3 { font-size: .82rem; color: var(--pp-dark); margin-bottom: .3rem; }
.account-info-note p { margin: 0; font-size: .8rem; line-height: 1.6; }
.account-info-note a { text-decoration: underline; text-underline-offset: 2px; }
.account-footer { border-top: 1px solid var(--pp-border); padding: 1.5rem 2rem; color: var(--pp-muted); display: flex; gap: 1rem; justify-content: space-between; font-size: .8rem; }
.account-footer div { display: flex; gap: 1rem; }
@media (max-width: 900px) {
  .account-layout { padding: 1.25rem; gap: 1.25rem; }
  .account-sidebar { flex-basis: 195px; }
  .account-panel { --panel-padding: 1.3rem; }
}
@media (max-width: 1100px) {
  .scan-table, .scan-table tbody { display: block; }
  .scan-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .scan-table tr { display: grid; grid-template-columns: 1fr 1fr; padding: 1rem; gap: .8rem; }
  .scan-table tr + tr { border-top: 1px solid #e6edf2; }
  .scan-table td { display: block; padding: 0; border: 0; width: auto; }
  .scan-table td::before { content: attr(data-label); display: block; color: var(--pp-muted); font-size: .65rem; margin-bottom: .35rem; }
  .scan-table .scan-website, .scan-table .scan-actions-cell { grid-column: 1 / -1; }
  .scan-table .scan-website::before, .scan-table .scan-actions-cell::before { display: none; }
  .scan-verdicts { flex-direction: row; flex-wrap: wrap; }
  .scan-actions { justify-content: flex-start; }
  .scan-more summary { text-align: left; }
  .scan-more-actions { align-items: flex-start; }
}
@media (max-width: 640px) {
  .account-header { padding: 1rem; }
  .account-header img { width: 155px; }
  .account-label { display: none; }
  .account-layout { display: block; padding: 1rem; }
  .account-sidebar { position: static; margin-bottom: 1.25rem; }
  .account-sidebar h1, .account-sidebar > .account-eyebrow, .sidebar-licence { display: none; }
  .account-email { margin: 0 0 .75rem; }
  .account-navigation { flex-direction: row; overflow-x: auto; padding-bottom: .4rem; }
  .account-navigation button { flex-shrink: 0; padding: .65rem .75rem; }
  .account-navigation button > span { display: none; }
  .account-content h2 { font-size: 1.4rem; }
  .account-toolbar > input { min-width: 160px; }
  .scan-actions button, .scan-more summary, .watchdog-controls button { min-height: 44px; display: inline-flex; align-items: center; }
  .watchdog-controls .account-destructive { margin-left: 0; }
  .account-footer { flex-direction: column; padding: 1rem; }
}
