/* Extensões visuais da Fase 2. A base continua em app.css. */
.public-guest-actions { display: flex; align-items: center; gap: 22px; }
.public-account-menu { position: relative; }
.public-account-menu summary { display: flex; align-items: center; gap: 7px; padding: 8px 12px; border: 1px solid #c9dcfa; border-radius: 10px; color: var(--blue-700); background: var(--blue-50); list-style: none; cursor: pointer; font-size: .83rem; font-weight: 800; }
.public-account-menu summary::-webkit-details-marker { display: none; }
.public-account-menu summary i { font-style: normal; font-size: .68rem; }
.public-account-menu > div { position: absolute; z-index: 30; top: calc(100% + 9px); right: 0; width: 210px; padding: 7px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: var(--shadow-lg); }
.public-account-menu > div a, .public-account-menu > div button { display: block; width: 100%; padding: 10px 11px; border: 0; border-radius: 8px; color: #43536b; background: transparent; text-align: left; text-decoration: none; cursor: pointer; font-size: .76rem; font-weight: 700; }
.public-account-menu > div a:hover, .public-account-menu > div button:hover { color: var(--blue-700); background: var(--blue-50); }
.account-balance { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; padding: 12px 14px; border: 1px solid #bfdfd3; border-radius: 12px; background: #f1fbf7; }
.account-balance .balance-icon { display: grid; place-items: center; flex: 0 0 29px; width: 29px; height: 29px; border-radius: 9px; color: #fff; background: var(--success); font-size: .7rem; font-weight: 800; }
.account-balance > span:nth-child(2) { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.account-balance strong { color: #176c51; font-size: .75rem; }
.account-balance small { color: #5e7d72; font-size: .66rem; }
.account-balance a { color: var(--blue-600); text-decoration: none; white-space: nowrap; font-size: .68rem; font-weight: 800; }
.account-balance.is-limit { border-color: #f1ce96; background: #fff8ea; }
.account-balance.is-limit .balance-icon { background: var(--warning); }
.account-balance.is-limit strong { color: #94580b; }

/* Autenticação */
.auth-page { min-height: 100vh; background: var(--background); }
.header-back { margin: 0; font-size: .78rem; }
.auth-main { min-height: calc(100vh - 76px); padding: 58px 0 72px; background: radial-gradient(circle at 14% 8%, rgba(25,103,210,.07), transparent 31%), var(--background); }
.auth-layout { display: grid; grid-template-columns: minmax(0, 610px) minmax(300px, 1fr); align-items: stretch; gap: 24px; max-width: 1040px; }
.auth-card { padding: 38px 42px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: var(--shadow-lg); }
.auth-card h1 { margin: 5px 0 9px; font-size: clamp(2rem, 4vw, 2.75rem); }
.auth-card > p { margin: 0; color: var(--muted); font-size: .84rem; }
.auth-form { display: grid; gap: 7px; margin-top: 26px; }
.auth-form label, .form-label, .dialog-label { color: var(--ink); font-size: .74rem; font-weight: 750; }
.auth-form input, .dialog-input, .settings-form input, .settings-form select, .settings-form textarea { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #c7d5e7; border-radius: 10px; color: var(--ink); background: #fff; }
.auth-form input:focus, .dialog-input:focus, .settings-form input:focus, .settings-form select:focus, .settings-form textarea:focus { border-color: var(--blue-600); box-shadow: 0 0 0 3px rgba(25,103,210,.09); outline: none; }
.password-field-control { position: relative; display: block; min-width: 0; }
.password-field-control input { padding-right: 54px; }
.password-visibility-toggle { position: absolute; top: 50%; right: 5px; display: grid; width: 38px; height: 36px; padding: 0; transform: translateY(-50%); place-items: center; border: 0; border-radius: 8px; color: #718198; background: transparent; cursor: pointer; touch-action: manipulation; transition: color .15s ease; }
.password-visibility-toggle:hover, .password-visibility-toggle[aria-pressed="true"] { color: var(--blue-700); }
.password-visibility-toggle:focus-visible { color: var(--blue-700); outline: 2px solid rgba(25,103,210,.28); outline-offset: -3px; }
.password-visibility-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.password-visibility-toggle svg[hidden] { display: none; }
.password-feedback { display: grid; gap: 8px; padding-top: 2px; }
.password-feedback-title { margin: 0; color: #53647b; font-size: .7rem; font-weight: 750; }
.password-requirements { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.password-requirements li { display: flex; align-items: center; gap: 7px; margin: 0; color: #7b899b; font-size: .68rem; line-height: 1.4; }
.password-rule-icon { flex: 0 0 14px; color: #98a5b5; font-weight: 850; text-align: center; }
.password-requirements li.is-complete, .password-requirements li.is-complete .password-rule-icon { color: var(--success); }
.auth-form .button { width: 100%; margin-top: 10px; }
.label-row { display: flex; align-items: center; justify-content: space-between; margin-top: 7px; }
.label-row a { color: var(--blue-600); text-decoration: none; font-size: .7rem; font-weight: 700; }
.auth-message { margin-top: 6px; padding: 10px 12px; border-radius: 9px; font-size: .72rem; }
.auth-message.error { color: #a92f36; background: #fff0f1; }
.auth-message.success { color: #176e51; background: #edf9f4; }
.auth-separator { display: flex; align-items: center; gap: 12px; margin: 25px 0 15px; color: #8a98aa; font-size: .67rem; }
.auth-separator::before, .auth-separator::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.demo-login-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.demo-login-grid button { display: flex; flex-direction: column; padding: 11px; border: 1px solid #cbdcf3; border-radius: 10px; color: var(--blue-700); background: var(--blue-50); cursor: pointer; text-align: left; }
.demo-login-grid button:hover { border-color: var(--blue-600); background: var(--blue-100); }
.demo-login-grid strong { font-size: .74rem; }
.demo-login-grid small { margin-top: 2px; color: var(--muted); font-size: .62rem; }
.auth-card .demo-credentials { margin-top: 13px; color: #7c899a; font-size: .63rem; line-height: 1.55; }
.auth-card .demo-credentials strong { color: #56677e; }
.auth-switch { margin-top: 24px !important; padding-top: 18px; border-top: 1px solid var(--line); text-align: center; }
.auth-switch a, .continue-guest { color: var(--blue-600); font-weight: 800; }
.continue-guest { display: block; margin-top: 12px; text-align: center; text-decoration: none; font-size: .73rem; }
.auth-aside { display: flex; flex-direction: column; justify-content: center; padding: 38px; overflow: hidden; border-radius: 22px; color: #d9e8ff; background: var(--blue-950); box-shadow: var(--shadow-sm); }
.auth-aside-icon { display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 23px; border: 1px solid rgba(255,255,255,.16); border-radius: 15px; color: #fff; background: rgba(255,255,255,.09); font-size: .85rem; font-weight: 800; }
.auth-aside h2 { margin: 0; color: #fff; font-size: 1.45rem; line-height: 1.2; }
.auth-aside p { margin: 13px 0 20px; color: #aec4e4; font-size: .82rem; }
.auth-aside ul { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; font-size: .78rem; }
.auth-aside li::before { content: "✓"; margin-right: 9px; color: var(--cyan); font-weight: 800; }
.auth-aside small { margin-top: 30px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); color: #849fc5; font-size: .66rem; }
.two-column-form { grid-template-columns: repeat(2, 1fr); gap: 9px 12px; }
.two-column-form .field { display: grid; gap: 6px; }
.two-column-form .full { grid-column: 1 / -1; }
.two-column-form label span, .settings-form label span { color: var(--muted); font-weight: 400; }
.form-legal { margin-top: 12px !important; color: #8a97a8 !important; font-size: .63rem !important; }
.inline-notice { margin-top: 18px; padding: 11px 13px; border: 1px solid #c8dcf8; border-radius: 9px; color: #315f9f; background: var(--blue-50); font-size: .7rem; }
.compact-auth { display: grid; place-items: center; }
.compact-card { width: min(520px, calc(100% - 32px)); text-align: center; }
.compact-card .section-kicker { margin-top: 12px; }
.auth-large-icon { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto; border-radius: 16px; color: var(--blue-600); background: var(--blue-100); font-size: 1.25rem; font-weight: 800; }
.compact-card .auth-form { text-align: left; }
.forgot-confirmation { margin-top: 25px; padding: 22px; border: 1px solid #bfe1d3; border-radius: 14px; background: #f0faf6; }
.forgot-confirmation > span { display: grid; place-items: center; width: 40px; height: 40px; margin: 0 auto 10px; border-radius: 50%; color: #fff; background: var(--success); }
.forgot-confirmation h2 { margin: 0; color: #176e51; font-size: 1.1rem; }
.forgot-confirmation p { margin: 7px 0; color: #4e7567; }
.forgot-confirmation small { display: block; color: #729286; }
.forgot-confirmation .button,
.email-confirmed-action { margin-top: 18px; }

/* Página de preços */
.pricing-page { background: var(--background); }
.pricing-hero { padding: 65px 0 54px; border-bottom: 1px solid var(--line); background: linear-gradient(180deg, #fbfdff, #f4f8ff); text-align: center; }
.pricing-hero h1 { max-width: 760px; margin: 5px auto 14px; font-size: clamp(2.4rem, 5vw, 3.65rem); }
.pricing-hero p { max-width: 710px; margin: 0 auto; color: var(--muted); font-size: .95rem; }
.full-pricing-section { padding: 60px 0 85px; }
.full-pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); align-items: stretch; gap: 17px; }
.full-price-card { position: relative; display: flex; flex-direction: column; min-height: 570px; padding: 30px; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: var(--shadow-sm); }
.full-price-card.featured { border: 2px solid var(--blue-600); box-shadow: 0 18px 42px rgba(25,103,210,.14); }
.full-price-card .price strong { font-size: 2.15rem; }
.plan-limit { display: flex; flex-direction: column; min-height: auto !important; margin: 12px 0 0 !important; padding: 14px; border-radius: 11px; background: var(--blue-50); }
.plan-limit strong { color: var(--blue-950); font-size: .92rem; }
.plan-limit span { color: var(--muted); font-size: .68rem; }
.plan-extra-label { margin: 20px 0 -9px; color: var(--blue-800); font-size: .69rem; font-weight: 800; }
.full-price-card ul { display: grid; gap: 10px; margin: 19px 0 25px; padding: 19px 0 0; border-top: 1px solid var(--line); color: #52637a; list-style: none; font-size: .74rem; }
.full-price-card li::before, .standalone-credits li::before { content: "✓"; margin-right: 8px; color: var(--success); font-weight: 800; }
.full-price-card > .button, .full-price-card > form { width: 100%; margin-top: auto; }
.full-price-card > form > .button { width: 100%; }
.full-price-card.is-unavailable { border-style: dashed; }
.full-price-card.is-unavailable > ul, .full-price-card.is-unavailable > .plan-extra-label, .full-price-card.is-unavailable > .plan-limit { opacity: .55; }
.unavailable-state { margin-top: auto; padding: 16px; border: 1px solid #e6d3b7; border-radius: 12px; background: #fff9ef; text-align: center; }
.unavailable-state strong { color: #8f580e; font-size: .82rem; }
.unavailable-state p { margin: 5px 0 13px; color: #7a6b57; font-size: .69rem; }
.unavailable-state .button { width: 100%; }
.unavailable-state input { width: 100%; margin-bottom: 8px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; font: inherit; }
.unavailable-state .text-button { margin-top: 12px; font-size: .71rem; }
.standalone-credits { display: grid; grid-template-columns: 58px 1fr auto; align-items: center; gap: 22px; margin-top: 22px; padding: 28px 31px; border: 1px solid #bfe1dd; border-radius: 18px; background: #f1fbf9; }
.standalone-credit-icon { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 15px; color: #fff; background: var(--cyan); font-size: 1.2rem; font-weight: 800; }
.standalone-credits h2 { margin: 2px 0 4px; color: var(--blue-950); }
.standalone-credits p { margin: 0; color: var(--muted); font-size: .75rem; }
.standalone-credits ul { display: flex; flex-wrap: wrap; gap: 8px 17px; margin: 12px 0 0; padding: 0; color: #526f69; list-style: none; font-size: .68rem; }
.credit-price { display: flex; min-width: 215px; flex-direction: column; text-align: right; }
.credit-price strong { color: var(--blue-950); font-size: 1.8rem; letter-spacing: -.04em; }
.credit-price small { margin-bottom: 12px; color: var(--muted); font-size: .65rem; }
.pricing-notes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 22px; }
.pricing-notes div { padding: 17px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.pricing-notes strong, .pricing-notes span { display: block; }
.pricing-notes strong { color: var(--blue-950); font-size: .75rem; }
.pricing-notes span { margin-top: 4px; color: var(--muted); font-size: .66rem; }
.dev-tools { color: var(--muted); font-size: .68rem; }
.dev-tools summary { cursor: pointer; font-weight: 700; }
.pricing-dev-tools { width: fit-content; margin: 26px auto 0; text-align: center; }
.pricing-dev-tools > div { display: flex; align-items: center; gap: 9px; margin-top: 9px; padding: 10px 12px; border: 1px dashed #cad6e6; border-radius: 10px; background: #fff; }
.pricing-dev-tools select { padding: 7px 28px 7px 9px; border: 1px solid var(--line); border-radius: 8px; background: #fff; font-size: .68rem; }
.checkout-dialog { width: min(590px, calc(100% - 32px)); }
.demo-payment-label { display: inline-flex; padding: 5px 9px; border-radius: 999px; color: #7058bd; background: #f0ecff; font-size: .65rem; font-weight: 800; text-transform: uppercase; }
.checkout-summary { display: grid; gap: 0; margin: 20px 0 15px; border: 1px solid var(--line); border-radius: 12px; background: #fbfcfe; }
.checkout-summary div { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.checkout-summary div:last-child { border-bottom: 0; }
.checkout-summary span { color: var(--muted); font-size: .7rem; }
.checkout-summary strong { color: var(--ink); text-align: right; font-size: .76rem; }
.fake-payment-method { display: flex; align-items: center; gap: 12px; padding: 13px; border: 1px solid #c9d9ed; border-radius: 11px; background: var(--blue-50); }
.fake-payment-method > span { display: grid; place-items: center; width: 36px; height: 31px; border-radius: 7px; color: #fff; background: var(--blue-600); }
.fake-payment-method strong, .fake-payment-method small { display: block; }
.fake-payment-method strong { font-size: .74rem; }
.fake-payment-method small { color: var(--muted); font-size: .65rem; }
.integration-note { font-size: .67rem !important; }
.checkout-actions { display: grid; gap: 8px; margin-top: 17px; }
.checkout-actions .text-button { margin-top: 5px; }
.checkout-result { padding: 10px 4px 4px; text-align: center; }
.result-symbol { display: grid; place-items: center; width: 59px; height: 59px; margin: 0 auto 15px; border-radius: 50%; color: #fff; font-size: 1.4rem; font-weight: 800; }
.checkout-result.approved .result-symbol { background: var(--success); }
.checkout-result.refused .result-symbol { background: var(--danger); }
.checkout-result p { margin-bottom: 20px; }
.checkout-result .button { width: 100%; margin: 7px 0 0; }
.continue-free { display: block; margin-top: 14px; color: var(--blue-600); font-size: .72rem; font-weight: 800; }
.dialog-label { display: block; margin: 13px 0 5px; }
.dialog-input { resize: vertical; }

/* Área autenticada */
.account-page { min-height: 100vh; background: var(--background); }
.account-shell { display: grid; grid-template-columns: 260px minmax(0, 1fr); min-height: 100vh; }
.account-sidebar { position: sticky; z-index: 40; top: 0; display: flex; height: 100vh; flex-direction: column; border-right: 1px solid var(--line); background: #fff; }
.sidebar-top { display: flex; align-items: center; justify-content: space-between; height: 76px; padding: 0 24px; border-bottom: 1px solid var(--line); }
.sidebar-close { display: none; width: 36px; height: 36px; border: 0; border-radius: 9px; background: #f2f5f9; cursor: pointer; font-size: 1.2rem; }
.account-nav { display: grid; gap: 5px; padding: 22px 14px; }
.account-nav a { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border-radius: 10px; color: #53637a; text-decoration: none; font-size: .78rem; font-weight: 700; }
.account-nav a span { display: grid; place-items: center; width: 25px; height: 25px; color: #72829a; font-size: .86rem; font-weight: 800; }
.account-nav a:hover { color: var(--blue-700); background: var(--blue-50); }
.account-nav a.active { color: var(--blue-700); background: var(--blue-100); }
.account-nav a.active span { color: var(--blue-600); }
.sidebar-bottom { margin-top: auto; padding: 15px 14px 18px; border-top: 1px solid var(--line); }
.account-dev-tools { padding: 10px; border: 1px dashed #cbd6e4; border-radius: 10px; background: #fafbfd; }
.account-dev-tools label { display: block; margin: 8px 0 4px; }
.account-dev-tools select { width: 100%; padding: 7px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: #fff; font-size: .67rem; }
.account-dev-tools .text-button { margin-top: 8px; font-size: .65rem; }
.logout-button { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 9px; padding: 10px 12px; border: 0; border-radius: 9px; color: #66758a; background: transparent; cursor: pointer; text-align: left; font-size: .75rem; font-weight: 700; }
.logout-button:hover { color: var(--danger); background: #fff3f4; }
.account-workspace { min-width: 0; }
.account-topbar { position: sticky; z-index: 20; top: 0; display: flex; align-items: center; height: 76px; padding: 0 34px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.94); backdrop-filter: blur(12px); }
.sidebar-open { display: none; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 9px; background: #fff; cursor: pointer; }
.topbar-public-link { color: var(--blue-600); text-decoration: none; font-size: .74rem; font-weight: 750; }
.topbar-user { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.topbar-plan { padding: 5px 9px; border-radius: 999px; color: var(--blue-700); background: var(--blue-100); font-size: .64rem; font-weight: 800; }
.user-avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; color: #fff; background: var(--blue-600); font-size: .69rem; font-weight: 800; }
.topbar-user div { display: flex; flex-direction: column; }
.topbar-user strong { font-size: .75rem; }
.topbar-user small { color: var(--muted); font-size: .61rem; }
.account-content { width: min(1180px, calc(100% - 64px)); margin: 0 auto; padding: 42px 0 70px; outline: none; }
.account-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; margin-bottom: 27px; }
.account-page-header h1 { margin: 3px 0 7px; font-size: clamp(2rem, 4vw, 2.7rem); }
.account-page-header p { margin: 0; color: var(--muted); font-size: .82rem; }
.account-alert { display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 13px; margin-bottom: 18px; padding: 14px 16px; border: 1px solid #c6d9f4; border-radius: 12px; background: var(--blue-50); }
.account-alert > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; color: var(--blue-700); background: var(--blue-100); font-weight: 800; }
.account-alert strong { font-size: .78rem; }
.account-alert p { margin: 2px 0 0; color: var(--muted); font-size: .69rem; }
.account-alert a { color: var(--blue-600); text-decoration: none; white-space: nowrap; font-size: .7rem; font-weight: 800; }
.account-alert.warning { border-color: #efd19c; background: #fff8ea; }
.account-alert.warning > span { color: #9a5e0c; background: #ffeaca; }
.overview-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 17px; }
.usage-card, .account-section-card { border: 1px solid var(--line); border-radius: 17px; background: #fff; box-shadow: 0 7px 22px rgba(28,63,115,.045); }
.usage-card { padding: 26px; }
.usage-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.usage-heading > div { display: flex; flex-direction: column; }
.usage-heading span:first-child { color: var(--muted); font-size: .66rem; text-transform: uppercase; }
.usage-heading strong { color: var(--blue-950); font-size: 1.17rem; }
.usage-heading small { color: var(--muted); font-size: .68rem; }
.plan-badge { padding: 6px 10px; border-radius: 999px; font-size: .65rem; font-weight: 800; }
.plan-free { color: #586b84; background: #eef2f7; }
.plan-pro { color: var(--blue-700); background: var(--blue-100); }
.plan-office { color: #096d69; background: #e2f8f6; }
.usage-number { display: flex; align-items: baseline; gap: 8px; margin: 29px 0 10px; }
.usage-number strong { color: var(--blue-950); font-size: 2.5rem; letter-spacing: -.05em; }
.usage-number span { color: var(--muted); font-size: .74rem; }
.usage-track { height: 9px; overflow: hidden; border-radius: 999px; background: #e8eef6; }
.usage-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue-600), var(--cyan)); }
.usage-meta { display: flex; justify-content: space-between; gap: 20px; margin-top: 8px; color: var(--muted); font-size: .65rem; }
.limit-message { margin-top: 25px; padding: 16px; border: 1px solid #efce98; border-radius: 12px; background: #fff8ea; }
.limit-message strong { color: #8c570e; font-size: .82rem; }
.limit-message p { margin: 4px 0 13px; color: #786951; font-size: .71rem; }
.overview-side-stats { display: grid; gap: 10px; }
.overview-side-stats article { display: flex; align-items: center; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.metric-icon { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border-radius: 10px; color: var(--blue-600); background: var(--blue-100); font-weight: 800; }
.overview-side-stats article > div { display: flex; flex-direction: column; }
.overview-side-stats span:not(.metric-icon) { color: var(--muted); font-size: .62rem; text-transform: uppercase; }
.overview-side-stats strong { color: var(--blue-950); font-size: 1.05rem; }
.overview-side-stats small { color: var(--muted); font-size: .61rem; }
.account-section-card { padding: 23px; }
.recent-section { margin-top: 18px; }
.section-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.section-card-heading h2 { margin: 0; color: var(--blue-950); font-size: 1.06rem; }
.section-card-heading p { margin: 3px 0 0; color: var(--muted); font-size: .68rem; }
.section-card-heading > a { color: var(--blue-600); text-decoration: none; font-size: .69rem; font-weight: 800; }
.responsive-table { overflow-x: auto; }
.jobs-table { width: 100%; border-collapse: collapse; min-width: 790px; }
.jobs-table.compact { min-width: 650px; }
.jobs-table th { padding: 10px 11px; border-bottom: 1px solid var(--line); color: #77869a; text-align: left; font-size: .62rem; letter-spacing: .04em; text-transform: uppercase; }
.jobs-table td { padding: 14px 11px; border-bottom: 1px solid #edf1f6; color: #526279; font-size: .7rem; vertical-align: middle; }
.jobs-table tbody tr:last-child td { border-bottom: 0; }
.jobs-table td strong, .jobs-table td small { display: block; }
.jobs-table td strong { color: var(--ink); }
.jobs-table td small { margin-top: 2px; color: var(--muted); font-size: .61rem; }
.status-chip { display: inline-flex; align-items: center; width: fit-content; padding: 5px 8px; border-radius: 999px; white-space: nowrap; font-size: .61rem; font-weight: 800; }
.status-chip.success { color: #176e51; background: #eaf8f2; }
.status-chip.warning { color: #955b0b; background: #fff0d8; }
.status-chip.info { color: var(--blue-700); background: var(--blue-100); }
.status-chip.neutral { color: #66758a; background: #edf1f5; }
.download-cell a, .download-cell button { color: var(--blue-600); text-decoration: none; font-weight: 800; }
.download-cell > span { color: #7c899a; font-size: .66rem; }
.soft-upgrade { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-top: 18px; padding: 22px 25px; border: 1px solid #c9daf2; border-radius: 16px; background: linear-gradient(110deg, #f5f9ff, #eef8fa); }
.soft-upgrade h2 { margin: 2px 0 4px; color: var(--blue-950); font-size: 1.08rem; }
.soft-upgrade p { margin: 0; color: var(--muted); font-size: .7rem; }
.history-info { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 18px; padding: 12px; border-radius: 10px; background: var(--blue-50); }
.history-info > span { display: grid; place-items: center; flex: 0 0 20px; width: 20px; height: 20px; border: 1px solid #9cbbe6; border-radius: 50%; color: var(--blue-700); font-size: .62rem; font-weight: 800; }
.history-info p { margin: 0; color: #61738d; font-size: .68rem; }
.empty-state { padding: 35px 20px; text-align: center; }
.empty-state.large { padding: 70px 20px; border: 1px dashed #c4d2e4; border-radius: 16px; background: #fff; }
.empty-state.compact { padding: 20px; }
.empty-state > span { display: grid; place-items: center; width: 47px; height: 47px; margin: 0 auto 12px; border-radius: 13px; color: var(--blue-600); background: var(--blue-100); font-weight: 800; }
.empty-state h2, .empty-state h3 { margin: 0; color: var(--blue-950); }
.empty-state p { margin: 5px 0 15px; color: var(--muted); font-size: .72rem; }
.saved-profiles-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.saved-profile-card { padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--shadow-sm); }
.saved-profile-heading { display: flex; align-items: center; gap: 12px; }
.saved-profile-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; color: var(--blue-600); background: var(--blue-100); font-weight: 800; }
.saved-profile-heading h2 { margin: 0; color: var(--blue-950); font-size: .97rem; }
.saved-profile-heading div span { color: var(--muted); font-size: .62rem; }
.saved-profile-card dl { display: grid; gap: 10px; margin: 19px 0; padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.saved-profile-card dl div { display: grid; grid-template-columns: 105px 1fr; gap: 10px; }
.saved-profile-card dt { color: var(--muted); font-size: .65rem; }
.saved-profile-card dd { margin: 0; color: var(--ink); font-size: .69rem; font-weight: 700; }
.profile-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.profile-actions .text-button { font-size: .67rem; }
.danger-text { color: var(--danger); }
.profile-dialog { width: min(1000px, calc(100% - 32px)); }
.profile-form { max-height: 88vh; overflow-y: auto; }
.profile-form > p { margin-top: 5px; }
.profile-form > .form-label { display: block; margin: 19px 0 5px; }
.compact-config { margin-top: 22px; }
.profile-preset-grid { grid-template-columns: repeat(3, 1fr); }
.profile-preset-grid .preset-card { min-height: 70px; padding: 11px; }
.profile-custom-levels { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 11px; padding: 13px; border: 1px solid #c9dcf7; border-radius: 11px; background: var(--blue-50); }
.profile-custom-levels label { color: var(--muted); font-size: .67rem; }
.profile-custom-levels select, .profile-pdf-order select { width: 100%; margin-top: 4px; padding: 8px; border: 1px solid #c7d5e8; border-radius: 8px; background: #fff; }
.profile-editor-columns { display: grid; grid-template-columns: 1fr .9fr; gap: 15px; }
.profile-preview { margin-top: 22px; }
.profile-preview .tree-preview { min-height: 185px; }
.profile-output-grid { grid-template-columns: repeat(3, 1fr); }
.profile-pdf-order { display: flex; align-items: center; gap: 14px; margin-top: 12px; padding: 12px; border-radius: 10px; background: var(--blue-50); }
.profile-pdf-order label { color: var(--ink); font-size: .7rem; font-weight: 700; }
.profile-pdf-order select { max-width: 250px; margin: 0; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 20px; }
.plan-management-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.current-plan-card .section-card-heading h2 { margin-top: 3px; font-size: 1.5rem; }
.plan-details { display: grid; gap: 0; margin: 4px 0 20px; border-top: 1px solid var(--line); }
.plan-details div { display: flex; justify-content: space-between; gap: 20px; padding: 12px 0; border-bottom: 1px solid #edf1f6; }
.plan-details dt { color: var(--muted); font-size: .68rem; }
.plan-details dd { margin: 0; color: var(--ink); text-align: right; font-size: .7rem; font-weight: 700; }
.plan-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 15px; }
.renewal-management { margin-top: 20px; padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: #fbfcfe; }
.renewal-plan-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.renewal-plan-summary div { display: flex; flex-direction: column; gap: 3px; }
.renewal-plan-summary span { color: var(--muted); font-size: .68rem; }
.renewal-plan-summary strong { color: var(--blue-950); font-size: .78rem; }
.renewal-cancel-button {
  display: inline-flex;
  width: fit-content;
  min-height: 32px;
  margin-top: 17px;
  padding: 6px 2px;
  border-color: transparent;
  color: var(--muted);
  background: transparent;
  font-size: .72rem;
}
.renewal-cancel-button:hover {
  border-color: transparent;
  color: var(--blue-700);
  background: transparent;
  text-decoration: underline;
}
.renewal-cancel-button:focus-visible {
  border-color: transparent;
  color: var(--blue-700);
  background: transparent;
  outline: 2px solid rgba(25,103,210,.22);
  outline-offset: 3px;
}
.renewal-cancelled { margin-top: 17px; padding: 14px; border: 1px solid #bfe1dd; border-radius: 11px; background: #f1fbf9; }
.renewal-cancelled strong { color: #096d69; font-size: .78rem; }
.renewal-cancelled p { margin: 4px 0 0; color: #526f69; font-size: .7rem; }
.renewal-dialog .dialog-actions form { margin: 0; }
.plan-credit-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(250px, 1fr); align-items: stretch; gap: 16px; }
.account-plan-block, .account-credit-block { min-width: 0; padding: 23px; border: 1px solid var(--line); border-radius: 15px; }
.account-plan-block { display: flex; flex-direction: column; border-color: #c5d9f5; background: linear-gradient(145deg, #f6faff, #fff 72%); }
.plan-block-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.plan-current-label { display: inline-flex; padding: 5px 9px; border-radius: 999px; color: var(--blue-700); background: var(--blue-100); white-space: nowrap; font-size: .63rem; font-weight: 800; }
.account-plan-block h3 { margin: 11px 0 8px; color: var(--blue-950); font-size: 1.8rem; letter-spacing: -.035em; }
.plan-main-value { display: flex; flex-direction: column; gap: 3px; margin: 0; }
.plan-main-value strong { color: var(--ink); font-size: .9rem; }
.plan-main-value span, .plan-balance-copy { color: var(--muted); font-size: .7rem; }
.plan-balance-copy { margin: 5px 0 0; }
.free-plan-upgrade { margin-top: auto; padding-top: 24px; border-top: 1px solid #d9e5f5; }
.free-plan-upgrade > strong { color: var(--blue-950); font-size: .86rem; }
.free-plan-upgrade p { max-width: 490px; margin: 5px 0 14px; color: var(--muted); font-size: .7rem; line-height: 1.55; }
.free-plan-upgrade .button { min-width: 170px; }
.plan-block-actions { display: flex; margin-top: 20px; }
.subscription-sync-notice { margin-top: 17px; padding: 13px 14px; border: 1px solid #c7daf4; border-radius: 11px; background: var(--blue-50); }
.subscription-sync-notice.warning { border-color: #efd19c; background: #fff8ea; }
.subscription-sync-notice strong { color: var(--blue-950); font-size: .75rem; }
.subscription-sync-notice.warning strong { color: #92570a; }
.subscription-sync-notice p { margin: 4px 0 0; color: var(--muted); font-size: .68rem; }
.account-credit-block { display: flex; flex-direction: column; background: #fbfcfe; }
.account-credit-block h3 { margin: 11px 0 0; color: var(--blue-950); font-size: 1.35rem; letter-spacing: -.025em; }
.account-credit-block > p { margin: 10px 0 0; color: var(--muted); font-size: .69rem; }
.account-credit-block .credit-balance-copy { margin-top: 1px; }
.credit-package-offer { display: flex; flex-direction: column; gap: 3px; margin-top: 19px; padding: 13px 14px; border: 1px solid #cfe0ed; border-radius: 11px; background: #fff; }
.credit-package-offer strong { color: var(--ink); font-size: .8rem; }
.credit-package-offer span { color: var(--muted); font-size: .68rem; }
.account-credit-block form { margin: auto 0 0; padding-top: 19px; }
.account-credit-block form .button { width: 100%; }
.checkout-action-note { margin: 8px 0 0; color: var(--muted); font-size: .63rem; font-weight: 500; line-height: 1.45; }
.account-credit-block .checkout-action-note { text-align: center; }
.pricing-subscription-note { margin: 12px auto 0; text-align: center; }
.credit-price .checkout-action-note { max-width: 240px; margin-left: auto; text-align: right; }
.button[aria-busy="true"] { cursor: progress; opacity: .76; transform: none; }
.balance-breakdown h2 { margin: 0 0 18px; color: var(--blue-950); font-size: 1.06rem; }
.balance-line { margin-bottom: 21px; }
.balance-line > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 7px; }
.balance-line span { color: var(--muted); font-size: .7rem; }
.balance-line strong { color: var(--blue-950); font-size: 1rem; }
.balance-line small { display: block; margin-top: 6px; color: var(--muted); font-size: .62rem; }
.balance-line.extras { padding: 14px; border: 1px solid #bfe1dd; border-radius: 11px; background: #f1fbf9; }
.balance-breakdown > .button { width: 100%; }
.credit-rule-example { display: flex; align-items: flex-start; gap: 12px; margin: 17px 0; padding: 14px 16px; border: 1px solid #cbdcf2; border-radius: 12px; background: var(--blue-50); }
.credit-rule-example > span { display: grid; place-items: center; flex: 0 0 25px; width: 25px; height: 25px; border: 1px solid #a8c3e8; border-radius: 50%; color: var(--blue-700); font-size: .66rem; font-weight: 800; }
.credit-rule-example strong { font-size: .74rem; }
.credit-rule-example p { margin: 3px 0 0; color: var(--muted); font-size: .67rem; }
.account-double-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.ledger-list, .payment-list { display: grid; }
.ledger-list > div { display: grid; grid-template-columns: 65px 1fr; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid #edf1f6; }
.ledger-list > div:last-child, .payment-list > div:last-child { border-bottom: 0; }
.ledger-value { font-size: .74rem; font-weight: 800; }
.ledger-value.positive { color: var(--success); }
.ledger-value.negative { color: var(--danger); }
.ledger-list strong, .ledger-list small, .payment-list strong, .payment-list small { display: block; }
.ledger-list strong, .payment-list strong { font-size: .7rem; }
.ledger-list small, .payment-list small { color: var(--muted); font-size: .61rem; }
.payment-list > div { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid #edf1f6; }
.payment-list > div > span:nth-child(2) { color: var(--ink); font-size: .7rem; font-weight: 700; }
.muted-copy { color: var(--muted); font-size: .7rem; }
.account-settings-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 17px; }
.settings-side { display: grid; align-content: start; gap: 17px; }
.settings-form { display: grid; gap: 7px; }
.settings-form label { margin-top: 5px; color: var(--ink); font-size: .7rem; font-weight: 750; }
.settings-form textarea { min-height: 110px; resize: vertical; }
.settings-form .button { width: fit-content; margin-top: 10px; }
.security-card h2, .danger-zone h2 { margin: 14px 0 5px; color: var(--blue-950); font-size: 1rem; }
.security-card p, .danger-zone p { margin: 0 0 16px; color: var(--muted); font-size: .69rem; }
.danger-zone { border-color: #efc7ca; background: #fffafb; }
.button-danger { color: #fff; background: var(--danger); }
.button-danger:disabled { cursor: not-allowed; opacity: .45; }
.danger-dialog .dialog-icon { color: var(--danger); background: #fff0f1; }
.confirm-check { display: flex; align-items: flex-start; gap: 10px; margin-top: 17px; padding: 12px; border: 1px solid #efc7ca; border-radius: 9px; background: #fff7f8; cursor: pointer; }
.confirm-check input { margin-top: 3px; accent-color: var(--danger); }
.confirm-check span { color: #704e52; font-size: .7rem; }
.support-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 17px; align-items: start; }
.ticket-list { display: grid; border-top: 1px solid var(--line); }
.ticket-list details { border-bottom: 1px solid var(--line); }
.ticket-list summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 1px; cursor: pointer; list-style: none; }
.ticket-list summary::-webkit-details-marker { display: none; }
.ticket-list summary strong, .ticket-list summary small { display: block; }
.ticket-list summary strong { color: var(--ink); font-size: .71rem; }
.ticket-list summary small { margin-top: 2px; color: var(--muted); font-size: .61rem; }
.ticket-conversation { display: grid; gap: 9px; padding: 0 0 15px; }
.ticket-conversation > div { max-width: 90%; padding: 10px 12px; border-radius: 10px; background: #f3f6fa; }
.ticket-conversation .support-reply { margin-left: auto; background: var(--blue-50); }
.ticket-conversation span { color: var(--blue-700); font-size: .61rem; font-weight: 800; }
.ticket-conversation p { margin: 3px 0 0; color: #53647a; font-size: .68rem; }
.account-toast { position: fixed; z-index: 100; right: 24px; bottom: 24px; max-width: 340px; padding: 12px 16px; border-radius: 10px; color: #fff; background: var(--blue-950); box-shadow: var(--shadow-lg); font-size: .72rem; font-weight: 700; }

@media (max-width: 1060px) {
  .account-shell { grid-template-columns: 225px minmax(0, 1fr); }
  .account-content { width: min(100% - 40px, 1180px); }
  .overview-grid, .plan-management-grid, .account-double-grid { grid-template-columns: 1fr; }
  .overview-side-stats { grid-template-columns: repeat(3, 1fr); }
  .overview-side-stats article { align-items: flex-start; }
  .full-price-card { padding: 24px; }
}

@media (max-width: 880px) {
  .auth-layout { grid-template-columns: 1fr; max-width: 650px; }
  .auth-aside { min-height: 330px; }
  .full-pricing-grid { grid-template-columns: 1fr; max-width: 620px; margin-inline: auto; }
  .full-price-card { min-height: 0; }
  .standalone-credits { grid-template-columns: 58px 1fr; }
  .credit-price { grid-column: 2; min-width: 0; align-items: flex-start; text-align: left; }
  .credit-price .checkout-action-note { margin-left: 0; text-align: left; }
  .pricing-notes { grid-template-columns: 1fr; }
  .account-shell { display: block; }
  .account-sidebar { position: fixed; left: 0; width: min(300px, calc(100% - 45px)); transform: translateX(-105%); transition: transform .22s ease; box-shadow: var(--shadow-lg); }
  .account-sidebar.is-open { transform: translateX(0); }
  .sidebar-close, .sidebar-open { display: block; }
  .account-topbar { padding: 0 20px; }
  .sidebar-open { margin-right: 13px; }
  .account-settings-grid, .support-grid { grid-template-columns: 1fr; }
  .profile-editor-columns { grid-template-columns: 1fr; }
  .saved-profiles-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .plan-credit-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .public-guest-actions { align-items: stretch; flex-direction: column; gap: 4px; }
  .public-account-menu summary { margin: 5px 10px; }
  .public-account-menu > div { position: static; width: auto; margin: 0 10px; box-shadow: none; }
  .account-balance { align-items: flex-start; flex-wrap: wrap; }
  .account-balance a { width: 100%; padding-left: 41px; }
  .auth-main { min-height: calc(100vh - 68px); padding: 30px 0 45px; }
  .auth-card { padding: 27px 20px; border-radius: 17px; }
  .auth-card h1 { font-size: 2rem; }
  .auth-aside { padding: 28px 23px; }
  .demo-login-grid, .two-column-form { grid-template-columns: 1fr; }
  .two-column-form .field, .two-column-form .full { grid-column: 1; }
  .header-back { font-size: .69rem; }
  .pricing-hero { padding: 45px 0 38px; }
  .pricing-hero h1 { font-size: 2.35rem; }
  .full-pricing-section { padding: 38px 0 60px; }
  .full-price-card { padding: 24px 20px; }
  .standalone-credits { grid-template-columns: 1fr; padding: 23px 20px; }
  .credit-price { grid-column: 1; }
  .credit-price .button { width: 100%; }
  .account-plan-block, .account-credit-block { padding: 19px; }
  .plan-block-actions, .plan-block-actions .button, .free-plan-upgrade .button { width: 100%; }
  .pricing-dev-tools > div { align-items: stretch; flex-direction: column; }
  .checkout-summary div { align-items: flex-start; flex-direction: column; gap: 2px; }
  .checkout-summary strong { text-align: left; }
  .account-topbar { height: 68px; }
  .topbar-public-link, .topbar-user div { display: none; }
  .account-content { width: min(100% - 28px, 1180px); padding: 30px 0 50px; }
  .account-page-header { align-items: stretch; flex-direction: column; gap: 14px; }
  .account-page-header h1 { font-size: 2.15rem; }
  .account-page-header > .button { width: 100%; }
  .account-alert { grid-template-columns: 32px 1fr; }
  .account-alert > a { grid-column: 2; }
  .usage-card, .account-section-card { padding: 18px; border-radius: 14px; }
  .usage-number { align-items: flex-start; flex-direction: column; gap: 0; }
  .usage-number strong { font-size: 2.15rem; }
  .usage-meta { align-items: flex-start; flex-direction: column; gap: 3px; }
  .overview-side-stats { grid-template-columns: 1fr; }
  .soft-upgrade { align-items: stretch; flex-direction: column; }
  .soft-upgrade .button { width: 100%; }
  .responsive-table { overflow: visible; }
  .jobs-table, .jobs-table.compact, .jobs-table tbody, .jobs-table tr, .jobs-table td { display: block; min-width: 0; width: 100%; }
  .jobs-table thead { display: none; }
  .jobs-table tr { margin-bottom: 11px; padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: #fbfcfe; }
  .jobs-table td { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 7px 0; border: 0; }
  .jobs-table td:first-child { padding-top: 0; }
  .jobs-table .download-cell { align-items: flex-start; flex-direction: column; padding-top: 10px; border-top: 1px solid var(--line); }
  .section-card-heading { align-items: flex-start; flex-direction: column; gap: 7px; }
  .saved-profile-card dl div { grid-template-columns: 90px 1fr; }
  .profile-preset-grid, .profile-output-grid, .profile-custom-levels { grid-template-columns: 1fr; }
  .profile-dialog .dialog-content { padding: 27px 18px 23px; }
  .profile-editor-columns { gap: 0; }
  .profile-pdf-order { align-items: stretch; flex-direction: column; }
  .profile-pdf-order select { max-width: none; }
  .dialog-actions { align-items: stretch; flex-direction: column-reverse; }
  .dialog-actions .button { width: 100%; }
  .dialog-actions form { width: 100%; }
  .renewal-plan-summary { grid-template-columns: 1fr; }
  .renewal-cancel-button { width: fit-content; }
  .plan-details div { align-items: flex-start; flex-direction: column; gap: 3px; }
  .plan-details dd { text-align: left; }
  .plan-actions { align-items: stretch; flex-direction: column; }
  .plan-actions .button { width: 100%; }
  .payment-list > div { grid-template-columns: 1fr auto; }
  .payment-list .status-chip { grid-column: 1 / -1; }
  .settings-form .button { width: 100%; }
  .ticket-list summary { align-items: flex-start; }
  .account-toast { left: 14px; right: 14px; bottom: 14px; max-width: none; }
}