@layer reset, base, components, responsive;
@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  body { margin: 0; }
  button, input, select { font: inherit; }
  button, a { -webkit-tap-highlight-color: transparent; }
  button { cursor: pointer; }
  button:disabled { cursor: not-allowed; }
  a { color: inherit; }
  svg { flex-shrink: 0; vertical-align: middle; }
  h1, h2, h3, p { margin: 0; }
}
@layer base {
  :root { color-scheme: light; --navy: #101d35; --navy-deep: #0b1528; --navy-mid: #1c3050; --blue: #235bc6; --blue-bright: #73a6ff; --text: #172338; --muted: #5c6a7c; --line: #dde3eb; --surface: #f4f6f9; --silver: #c4d0e1; --radius: 14px; }
  body { color: var(--text); background: var(--surface); font-family: Inter, 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif; font-size: 15px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
  :focus-visible { outline: 3px solid #397ce7; outline-offset: 4px; }
  h1:focus, main:focus { outline: none; }
  button { touch-action: manipulation; }
  input { min-width: 0; }
  a, button { overflow-wrap: anywhere; }
  h1, h2, h3 { line-height: 1.18; letter-spacing: -.025em; }
  .skip-link { position: fixed; top: 12px; left: 12px; z-index: 100; padding: 12px 20px; background: #fff; color: #142238; border: 2px solid var(--blue); border-radius: 8px; transform: translateY(-180%); text-decoration: none; font-weight: 650; }
  .skip-link:focus { transform: translateY(0); }
}
@layer components {
  .button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 43px; padding: 10px 17px; border: 1px solid transparent; border-radius: 7px; font-size: .875rem; font-weight: 650; line-height: 1.3; text-decoration: none; transition: background-color .15s, box-shadow .15s; }
  .button-primary { background: var(--blue); color: #fff; box-shadow: 0 2px 3px #111b3110; }
  .button-primary:hover { background: #1b4faa; }
  .button-danger { background: #a33136; color: #fff; border-color: #a33136; }
  .button-danger:hover { background: #8d252b; }
  .button-secondary { background: #fff; border-color: #cfd8e4; color: #23344d; }
  .button-secondary:hover { background: #f1f5fa; border-color: #a4b5cc; }
  .button:disabled { opacity: .55; }
  .button-small { min-height: 34px; padding: 7px 12px; font-size: .8rem; }
  .button-link { background: transparent; padding: 0; color: var(--blue); border: 0; text-align: left; font-size: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
  .text-link { color: #235bb7; font-weight: 650; text-decoration: none; display: inline-flex; align-items: center; gap: 12px; }
  .text-link:hover { text-decoration: underline; text-underline-offset: 5px; }
  .eyebrow { text-transform: uppercase; letter-spacing: .16em; font-size: .71rem; font-weight: 750; color: var(--blue); margin-bottom: 15px; }
  .brand { display: inline-flex; align-items: center; gap: 12px; color: #eef3fc; white-space: nowrap; }
  .brand-mark { position: relative; display: grid; place-items: center; width: 40px; height: 43px; font-weight: 800; font-size: 24px; letter-spacing: -.12em; padding-right: 3px; border: 1px solid #70819e; border-radius: 4px 4px 11px 4px; background: linear-gradient(145deg,#2e4364,#162841); }
  .brand-mark span { position: absolute; bottom: -1px; right: -1px; width: 14px; height: 3px; background: #7eaded; border-radius: 0 0 10px 0; }
  .brand-wordmark { font-size: 19px; font-weight: 750; letter-spacing: .17em; line-height: 1.1; }
  .brand-wordmark small { display: block; margin-top: 5px; font-size: 8px; font-weight: 600; letter-spacing: .25em; color: #b0c0d5; }
  .public-site { background: #fff; }
  .public-header { background: var(--navy-deep); color: #d5dfef; display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 26px max(5%, calc((100% - 1180px)/2)); border-bottom: 1px solid #c9d7eb1a; }
  .public-header > a:first-child, .public-footer a { text-decoration: none; }
  .public-header nav { display: flex; align-items: center; gap: 30px; }
  .public-header nav a { font-size: .86rem; text-decoration: none; padding: 8px 0; color: #c4d0e2; }
  .public-header nav a:hover, .public-header nav a[aria-current] { color: #fff; }
  .public-header nav a[aria-current] { box-shadow: 0 2px #88b3f5; }
  .public-signin { color: #e6effc; border-color: #7185a346; background: #1e324f; font-size: .8rem; }
  .public-signin:hover { background: #2b456b; }
  .public-hero { background: radial-gradient(ellipse at 85% 45%, #263c6245, transparent 58%), var(--navy-deep); color: #fff; padding: 86px max(5%, calc((100% - 1180px)/2)) 90px; }
  .hero-with-art { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 45px; min-height: 550px; }
  .hero-simple { min-height: 350px; padding-bottom: 78px; }
  .public-hero .eyebrow { color: #99bce9; }
  .public-hero h1 { font-size: clamp(2.7rem,4.8vw,4.15rem); font-weight: 650; letter-spacing: -.045em; line-height: 1.09; max-width: 700px; }
  .hero-description { color: #bfccdf; font-size: 1.06rem; line-height: 1.8; margin-top: 25px; max-width: 620px; }
  .hero-simple .hero-description { max-width: 650px; }
  .hero-actions { display: flex; flex-wrap: wrap; gap: 25px; align-items: center; margin-top: 33px; }
  .public-hero .button-primary { background: #75a4ed; color: #0c1c34; font-weight: 750; }
  .public-hero .button-primary:hover { background: #9bc2ff; }
  .hero-text-link { font-size: .85rem; text-decoration: none; color: #d7e1f0; border-bottom: 1px solid #8397b4; padding-bottom: 3px; }
  .hero-caption { margin-top: 22px; max-width: 470px; font-size: .77rem; color: #acbdd5; line-height: 1.7; }
  .workspace-illustration { height: 365px; position: relative; display: flex; align-items: center; justify-content: center; }
  .illustration-orbit { position: absolute; border: 1px solid #839dcc1c; border-radius: 50%; pointer-events: none; }
  .orbit-one { width: 330px; height: 330px; right: 11%; }
  .orbit-two { width: 470px; height: 470px; right: -1%; }
  .illustration-card { position: relative; width: 435px; height: 300px; background: #f4f7fd; border: 1px solid #99b3d3; border-radius: 10px; box-shadow: 0 35px 55px #0004, 0 0 0 10px #acc1e407; transform: rotate(-3deg); overflow: hidden; color: #1d2c43; }
  .illustration-top { display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 16px; border-bottom: 1px solid #d8e1ee; background: #fff; font-size: 10px; }
  .pog-mark { display: inline-grid; width: 23px; height: 23px; place-items: center; background: #22467a; color: #fff; border-radius: 5px; font-size: 13px; font-weight: 750; }
  .illustration-top strong { letter-spacing: .06em; }
  .illustration-indicator { margin-left: auto; color: #6f8099; font-size: 7px; letter-spacing: .1em; }
  .illustration-side { position: absolute; top: 48px; bottom: 31px; left: 0; width: 131px; background: #eaf0f8; border-right: 1px solid #d9e2ef; padding: 16px 8px; }
  .illustration-side > span { display: flex; align-items: center; gap: 7px; padding: 9px 6px; margin-bottom: 5px; border-radius: 4px; color: #53667f; font-size: 8px; }
  .illustration-side-active { background: #d7e5fa; color: #285699 !important; }
  .illustration-content { margin-left: 131px; padding: 24px 22px; }
  .illustration-overline { display: block; color: #7a8aa1; font-size: 7px; letter-spacing: .1em; margin-bottom: 10px; }
  .illustration-line { height: 7px; background: #bbcde7; border-radius: 2px; margin: 5px 0; }
  .line-long { width: 68%; background: #5b7fae; height: 11px; }
  .line-short { width: 90%; height: 4px; background: #d2dded; }
  .illustration-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 15px; }
  .illustration-tiles > div { padding: 12px; border: 1px solid #d3deec; border-radius: 5px; background: #fff; color: #3665a0; }
  .illustration-tiles i { display: block; margin-top: 9px; height: 4px; width: 73%; border-radius: 2px; background: #c5d4e9; }
  .illustration-tiles i + i { margin-top: 5px; width: 90%; background: #e1e8f1; }
  .illustration-row { height: 25px; display: flex; align-items: center; gap: 8px; border: 1px solid #dce5f0; border-radius: 4px; margin-top: 8px; padding: 5px 7px; }
  .illustration-row > span { width: 12px; height: 12px; background: #d2e0f3; border-radius: 3px; }
  .illustration-row i { width: 50%; height: 4px; background: #c9d7e8; border-radius: 2px; }
  .illustration-row i + i { width: 12%; margin-left: auto; }
  .illustration-bottom { position: absolute; bottom: 0; left: 0; right: 0; height: 31px; display: flex; align-items: center; gap: 7px; background: #fff; border-top: 1px solid #dbe4f0; color: #607691; padding: 0 14px; font-size: 7px; }
  .illustration-floating { position: absolute; bottom: 0; right: 10px; display: flex; align-items: center; gap: 11px; padding: 16px 20px; background: #e8effb; color: #233856; border: 1px solid #b7cbea; border-radius: 8px; box-shadow: 0 10px 20px #0003; }
  .illustration-floating > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #d0e2fb; color: #285eaa; }
  .illustration-floating strong { display: block; font-size: 10px; }
  .illustration-floating small { display: block; font-size: 8px; color: #536b8d; margin-top: 2px; }
  .public-intro { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; padding: 70px 0 45px; }
  .public-intro h2, .public-prose h2, .public-product-callout h2, .product-card h2, .help-intro h2 { font-size: 2.2rem; font-weight: 650; letter-spacing: -.04em; }
  .public-intro > p { color: var(--muted); line-height: 1.85; max-width: 525px; }
  .public-features { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; max-width: 1180px; margin: 0 auto; padding: 35px 0 75px; }
  .public-features article { padding-top: 24px; border-top: 1px solid var(--line); }
  .feature-icon { display: grid; place-items: center; width: 49px; height: 49px; background: #edf3fc; border: 1px solid #dae6f8; border-radius: 11px; color: #315d9c; margin-bottom: 23px; }
  .public-features h3 { font-size: 1.06rem; margin-bottom: 12px; }
  .public-features p { font-size: .9rem; color: var(--muted); line-height: 1.85; max-width: 330px; }
  .public-product-callout { margin: 0 auto 75px; max-width: 1180px; background: #eef3fb; border: 1px solid #dfe8f5; border-radius: 14px; padding: 38px 42px; display: flex; justify-content: space-between; align-items: center; gap: 25px; }
  .product-label { font-size: .64rem; color: #5b718f; letter-spacing: .14em; font-weight: 750; }
  .public-product-callout h2 { margin: 7px 0 9px; }
  .public-product-callout p { color: #5b6b83; font-size: .9rem; }
  .public-body { max-width: 1180px; margin: 0 auto; padding: 75px 0 90px; }
  .public-prose { display: grid; grid-template-columns: 1fr 1.35fr; gap: 95px; }
  .public-prose p { color: #56657b; line-height: 1.9; margin-bottom: 22px; }
  .public-prose .eyebrow { color: var(--blue); }
  .contact-card { border: 1px solid #dce5f1; border-radius: 12px; padding: 32px; background: #f7f9fc; }
  .contact-card > svg { color: #416591; margin-bottom: 20px; }
  .contact-card h3 { font-size: 1.2rem; margin-bottom: 18px; }
  .contact-card p { font-size: .92rem; }
  .contact-card .contact-help { margin-top: 22px; margin-bottom: 0; }
  .product-card { display: grid; grid-template-columns: 180px 1fr; gap: 45px; padding: 45px; background: #f4f7fc; border: 1px solid #dce5f1; border-radius: 15px; max-width: 890px; }
  .product-card-icon { width: 165px; height: 165px; display: grid; place-items: center; background: var(--navy); color: #9cc2f9; border-radius: 25px; box-shadow: 0 10px 20px #10234219; }
  .product-card p { margin-top: 15px; color: #596a80; max-width: 520px; line-height: 1.8; }
  .product-card .eyebrow { margin-top: 0; color: var(--blue); }
  .product-card-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 25px; }
  .product-card-tags span { background: #e5ecf7; border-radius: 5px; padding: 4px 9px; font-size: .7rem; color: #425e86; }
  .public-download-note { margin: 0 auto 80px; max-width: 1180px; padding: 25px 30px; border: 1px solid var(--line); border-radius: 11px; display: flex; align-items: flex-start; gap: 20px; background: #f9fafc; }
  .public-download-note > svg { color: #426892; margin-top: 4px; }
  .public-download-note h3 { font-size: 1.05rem; margin-bottom: 8px; }
  .public-download-note p { color: #5c6b7d; font-size: .86rem; }
  .help-body { display: grid; grid-template-columns: .85fr 1.3fr; gap: 85px; }
  .help-intro p:last-child { margin-top: 20px; color: #657185; line-height: 1.8; }
  .help-list details { border-bottom: 1px solid #dce3ed; }
  .help-list details:first-child { border-top: 1px solid #dce3ed; }
  .help-list summary { position: relative; list-style: none; cursor: pointer; padding: 22px 35px 22px 0; font-weight: 600; font-size: .93rem; }
  .help-list summary::-webkit-details-marker { display: none; }
  .help-list summary > span { position: absolute; right: 0; top: 18px; font-size: 22px; font-weight: 400; color: #406494; }
  .help-list details[open] summary > span { transform: rotate(45deg); }
  .help-list details > p { color: #5b6a7e; line-height: 1.85; font-size: .9rem; padding-bottom: 23px; }
  .public-footer { background: var(--navy-deep); color: #bccce3; display: grid; grid-template-columns: 1fr 1fr; gap: 45px; padding: 50px max(5%, calc((100% - 1180px)/2)) 24px; }
  .public-footer p { font-size: .8rem; margin-top: 18px; color: #94a7c3; }
  .public-footer nav { display: flex; justify-content: flex-end; align-items: flex-start; flex-wrap: wrap; gap: 25px; font-size: .8rem; }
  .public-footer nav a { display: inline-flex; align-items: center; gap: 6px; }
  .public-footer nav a:hover { color: #fff; }
  .public-footer-meta { grid-column: 1/-1; border-top: 1px solid #52688648; padding-top: 22px; display: flex; justify-content: space-between; gap: 20px; font-size: .7rem; color: #91a3be; }
  .app-frame { display: grid; grid-template-columns: 235px minmax(0, 1fr); min-height: 100vh; }
  .app-sidebar { background: var(--navy-deep); color: #bac8dd; padding: 31px 18px 24px; display: flex; flex-direction: column; min-width: 0; position: sticky; top: 0; align-self: start; min-height: 100vh; }
  .sidebar-brand { margin: 0 12px 33px; text-decoration: none; }
  .sidebar-area { color: #90a3c1; font-size: .65rem; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; margin: 0 13px 14px; }
  .sidebar-link { display: flex; align-items: center; gap: 12px; text-align: left; background: transparent; color: #bccae0; width: 100%; padding: 12px 14px; border: 1px solid transparent; border-radius: 7px; font-size: .84rem; margin: 4px 0; }
  .sidebar-link:hover { color: #fff; background: #1c2d49; }
  .sidebar-link.is-current { color: #e6efff; background: #223b60; border-color: #305383; }
  .sidebar-link.is-current svg { color: #94bfff; }
  .sidebar-bottom { margin-top: auto; padding-top: 55px; }
  .secure-label { font-size: .64rem; color: #92a7c7; display: flex; align-items: center; gap: 7px; padding: 0 12px; }
  .session-email { overflow-wrap: anywhere; padding: 8px 12px; color: #d2dcec; font-size: .73rem; }
  .signout-button { font-size: .78rem; }
  .sidebar-public { display: flex; align-items: center; gap: 7px; color: #92a7c7; margin: 20px 12px 0; font-size: .7rem; text-decoration: none; }
  .sidebar-public:hover { color: #fff; }
  .app-main { min-width: 0; display: flex; flex-direction: column; }
  .app-main main { width: 100%; max-width: 1500px; padding: 38px 42px; margin: 0 auto; flex: 1; }
  .preview-banner { background: #e9f0fc; color: #254976; border-bottom: 1px solid #c7d7ee; padding: 12px 28px; font-size: .79rem; text-align: center; }
  .page-heading { display: flex; justify-content: space-between; gap: 25px; align-items: center; margin-bottom: 29px; }
  .page-heading h1 { font-size: 1.85rem; font-weight: 650; }
  .page-heading .eyebrow { margin-bottom: 10px; font-size: .63rem; }
  .page-description { color: var(--muted); font-size: .87rem; margin-top: 11px; max-width: 780px; }
  .app-footer { margin: auto 42px 0; padding: 22px 0; border-top: 1px solid var(--line); display: flex; justify-content: space-between; font-size: .67rem; color: #67768b; }
  .panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 2px 2px #12223c02; overflow: hidden; margin-bottom: 22px; }
  .panel-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 24px 25px; }
  .panel-heading h2 { font-size: 1.08rem; font-weight: 650; }
  .panel-heading p { font-size: .77rem; color: var(--muted); margin-top: 7px; }
  .panel-body { padding: 0 25px 25px; }
  .notice { border: 1px solid #cbdaef; background: #f0f5fc; color: #395578; border-radius: 8px; padding: 13px 16px; font-size: .82rem; margin-bottom: 20px; line-height: 1.65; }
  .notice-error { background: #fff4f3; border-color: #f1ccc8; color: #90302b; }
  .notice-success { background: #edf8f1; border-color: #c2e0cf; color: #276445; }
  .badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 5px; font-size: .64rem; font-weight: 650; white-space: nowrap; background: #eef1f6; color: #53627a; border: 1px solid #e0e5ed; }
  .badge-good { color: #246343; background: #edf7f0; border-color: #d3e9db; }
  .badge-warning { color: #795016; background: #fff5e4; border-color: #eddfc5; }
  .badge-blue { color: #295b9f; background: #edf3fc; border-color: #d8e5f7; }
  .metric-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; margin-bottom: 25px; }
  .metric-card { padding: 23px; border: 1px solid var(--line); border-radius: 12px; background: #fff; position: relative; }
  .metric-card > svg { position: absolute; top: 24px; right: 22px; color: #57789f; }
  .metric-card .metric-label { font-size: .73rem; color: #5c6d82; padding-right: 26px; margin-bottom: 14px; }
  .metric-value { font-size: 1.9rem; line-height: 1.1; font-weight: 650; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
  .metric-note { color: #6a788b; font-size: .67rem; margin-top: 12px; }
  .section-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 22px; }
  .table-region { overflow-x: auto; }
  .table-region:focus-visible { outline-offset: -3px; }
  table { width: 100%; border-collapse: collapse; font-size: .78rem; text-align: left; }
  caption.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
  th { text-align: left; padding: 12px 23px; border-top: 1px solid #e8edf4; border-bottom: 1px solid #e2e8f0; color: #617089; background: #fafbfd; font-size: .65rem; font-weight: 650; letter-spacing: .035em; white-space: nowrap; }
  td { padding: 17px 23px; border-bottom: 1px solid #edf0f5; vertical-align: middle; line-height: 1.55; }
  tr:last-child td { border-bottom: 0; }
  tbody tr:hover { background: #fbfcfe; }
  .table-primary { color: #21334c; font-weight: 600; }
  .table-secondary { color: #67778e; font-size: .68rem; margin-top: 3px; overflow-wrap: anywhere; }
  .table-muted { color: #66778e; }
  .membership-list { display: grid; gap: 10px; }
  .membership-list .table-secondary { display: block; }
  .company-detail-content { margin-top: 25px; }
  .team-company-field { max-width: 400px; }
  .management-body { padding: 0 25px 25px; }
  .management-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; max-width: 850px; }
  .allocation-choice { border: 1px solid #dce5f1; border-radius: 8px; padding: 15px 18px; max-width: 650px; display: flex; flex-wrap: wrap; gap: 22px; margin: 22px 0; }
  .allocation-choice legend { padding: 0 6px; color: #526985; font-size: .76rem; font-weight: 600; }
  .allocation-amount-grid { display: grid; grid-template-columns: minmax(0,1fr) 130px; gap: 18px; max-width: 650px; }
  .management-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 20px; }
  .management-review { padding: 25px; border: 1px solid #d8e3f2; border-radius: 10px; background: #f5f8fc; max-width: 900px; }
  .management-review h3 { font-size: 1.15rem; margin-bottom: 15px; }
  .management-review > p { color: #5d718d; font-size: .83rem; line-height: 1.85; }
  .review-details { margin: 24px 0; }
  .review-details > div { display: grid; grid-template-columns: 175px minmax(0,1fr); gap: 20px; padding: 13px 0; border-bottom: 1px solid #dfe7f2; font-size: .82rem; }
  .review-details dt { color: #61738d; }
  .review-details dd { margin: 0; color: #273d5b; font-weight: 600; overflow-wrap: anywhere; }
  .review-details small { display: block; font-weight: 400; font-size: .69rem; color: #6b7c94; margin-top: 4px; }
  .management-note { color: #667b95; font-size: .74rem; line-height: 1.85; margin: 18px 0; max-width: 780px; }
  .review-request { border-top: 1px solid #dce5f1; padding-top: 18px; margin-top: 20px; font-size: .72rem !important; }
  .review-request span { display: inline-block; margin-top: 7px; font-size: .66rem; }
  .review-request code { overflow-wrap: anywhere; }
  .member-actions { display: flex; flex-wrap: wrap; gap: 7px; }
  .management-add { border-top: 1px solid #e3eaf3; padding-top: 25px; }
  .management-add h3 { font-size: 1.05rem; margin-bottom: 10px; }
  .management-add > p:first-of-type { color: #687d96; font-size: .8rem; margin-bottom: 22px; }
  .management-availability { margin-bottom: 22px; }
  .activity-metadata summary { cursor: pointer; color: #37659f; font-size: .73rem; white-space: nowrap; }
  .activity-metadata pre { white-space: pre-wrap; word-break: break-word; font-size: .68rem; line-height: 1.6; color: #4c617c; background: #f3f6fa; border: 1px solid #dfe6f1; border-radius: 5px; padding: 10px; max-width: 320px; }
  .table-nowrap { white-space: nowrap; }
  .table-company { display: flex; align-items: center; gap: 12px; }
  .company-avatar { display: grid; place-items: center; flex-shrink: 0; width: 35px; height: 35px; border: 1px solid #d6e1f1; border-radius: 8px; background: #edf3fd; color: #416aa3; font-size: .68rem; font-weight: 700; }
  .search-form { display: flex; gap: 9px; }
  .search-input { display: flex; align-items: center; gap: 9px; min-width: 230px; background: #fff; border: 1px solid #cdd7e6; border-radius: 7px; padding: 0 12px; color: #687d98; }
  .search-input:focus-within { outline: 3px solid #7cacfa44; border-color: #5588d7; }
  .search-input input { width: 100%; border: 0; outline: none; background: transparent; padding: 10px 0; font-size: .79rem; color: #243b59; }
  .search-input input:focus-visible { outline: none; }
  .pagination { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 23px; border-top: 1px solid #e8edf4; color: #6d7c8e; font-size: .71rem; }
  .pagination > div { display: flex; gap: 8px; }
  .empty-state { padding: 50px 25px; text-align: center; }
  .empty-icon { display: grid; place-items: center; width: 57px; height: 57px; background: #eef3f9; border-radius: 50%; color: #647c9a; margin: 0 auto 20px; }
  .empty-state h3 { font-size: 1rem; }
  .empty-state p { max-width: 500px; margin: 13px auto 0; color: #6c7c91; font-size: .82rem; line-height: 1.8; }
  .loading-state { padding: 65px 25px; display: flex; justify-content: center; align-items: center; gap: 13px; color: #61758e; font-size: .85rem; }
  .loading-dot { width: 14px; height: 14px; border-radius: 50%; background: #719bda; animation: pulse 1.25s infinite alternate; }
  @keyframes pulse { from { opacity: .35; } to { opacity: 1; } }
  .storage-meter { margin-top: 8px; min-width: 145px; }
  .storage-meter meter { display: block; width: 100%; height: 7px; border: 0; border-radius: 4px; appearance: none; background: #e7edf7; }
  .storage-meter meter::-webkit-meter-bar { background: #e7edf7; border: 0; border-radius: 4px; }
  .storage-meter meter::-webkit-meter-optimum-value { background: #477ac4; border-radius: 4px; }
  .storage-meter meter::-moz-meter-bar { background: #477ac4; border-radius: 4px; }
  .storage-meter span { display: block; font-size: .65rem; color: #64768c; margin-top: 7px; }
  .storage-allocation { color: #6d7d91; font-size: .69rem; }
  .detail-back { display: inline-flex; gap: 8px; align-items: center; color: #3b6195; background: none; border: 0; padding: 0; margin-bottom: 20px; font-size: .8rem; }
  .detail-back svg { transform: rotate(180deg); }
  .detail-meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; color: #687b94; font-size: .74rem; margin-top: 13px; }
  .detail-meta code { font-size: .68rem; overflow-wrap: anywhere; }
  .detail-stat-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; padding: 0 25px 25px; }
  .detail-stat { padding: 18px; background: #f6f8fc; border: 1px solid #e5ebf4; border-radius: 8px; }
  .detail-stat p { font-size: .67rem; color: #67788f; margin-bottom: 9px; }
  .detail-stat strong { font-size: 1.05rem; font-weight: 650; }
  .key-value-list { padding: 0 25px 25px; }
  .key-value-list > div { display: flex; justify-content: space-between; gap: 25px; padding: 12px 0; border-bottom: 1px solid #edf0f6; font-size: .78rem; }
  .key-value-list > div:last-child { border-bottom: 0; }
  .key-value-list dt { color: #68788d; }
  .key-value-list dd { margin: 0; font-weight: 600; text-align: right; }
  .activity-list { list-style: none; padding: 0 25px 25px; margin: 0; }
  .activity-list li { display: flex; align-items: flex-start; gap: 13px; padding: 15px 0; border-top: 1px solid #edf0f5; }
  .activity-list li > span { color: #597aa5; background: #f0f4fa; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; flex-shrink: 0; }
  .activity-list strong { display: block; font-size: .77rem; font-weight: 600; }
  .activity-list p { color: #6c7e93; font-size: .69rem; margin-top: 5px; }
  .system-note { padding: 0 25px 25px; color: #687c96; font-size: .76rem; line-height: 1.8; }
  .scope-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(260px,1fr)); gap: 18px; }
  .scope-card { text-align: left; background: #fff; border: 1px solid #dce4ef; border-radius: 12px; padding: 23px; color: var(--text); }
  .scope-card:hover:not(:disabled) { border-color: #83a5d5; box-shadow: 0 3px 12px #15325c09; }
  .scope-card:disabled { cursor: default; }
  .scope-card-icon { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 10px; background: #edf3fc; border: 1px solid #dce7f7; color: #406da7; margin-bottom: 19px; }
  .scope-card h2, .scope-card h3 { font-size: 1rem; margin-bottom: 10px; }
  .scope-card p { font-size: .77rem; color: #65768d; margin-top: 12px; line-height: 1.8; }
  .scope-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 23px; color: #3a649b; font-size: .76rem; }
  .workspace-grid { padding: 0 25px 25px; display: grid; grid-template-columns: repeat(auto-fill,minmax(230px,1fr)); gap: 16px; }
  .workspace-card { border: 1px solid #dfe7f3; border-radius: 10px; padding: 21px; background: #fbfcfe; }
  .workspace-card > svg { color: #5b7ba6; margin-bottom: 20px; }
  .workspace-card h3 { font-size: .95rem; margin-bottom: 8px; }
  .workspace-card p { font-size: .73rem; color: #667b96; }
  .workspace-card .badge { margin-top: 16px; }
  .auth-page { min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr; background: #f6f8fc; }
  .auth-brand-panel { background: radial-gradient(ellipse at 70% 60%,#28426366,transparent 60%),var(--navy-deep); color: #fff; padding: 55px max(45px,10%); display: flex; flex-direction: column; }
  .auth-brand-panel > a { text-decoration: none; }
  .auth-brand-copy { margin: auto 0; padding: 80px 0; }
  .auth-brand-copy .eyebrow { color: #99b9e9; }
  .auth-brand-copy h1 { font-size: clamp(2.4rem,3.5vw,3.7rem); font-weight: 600; letter-spacing: -.045em; }
  .auth-brand-copy p { font-size: .96rem; color: #bfcee2; line-height: 1.9; margin-top: 25px; }
  .auth-brand-note { font-size: .75rem; color: #9bb0cc; display: flex; align-items: center; gap: 9px; }
  .auth-content { display: flex; flex-direction: column; justify-content: center; padding: 60px 8%; min-width: 0; }
  .auth-box { max-width: 420px; width: 100%; margin: 0 auto; }
  .auth-box .eyebrow { margin-bottom: 13px; }
  .auth-box h2 { font-size: 1.8rem; font-weight: 650; }
  .auth-description { color: #64748c; font-size: .86rem; line-height: 1.8; margin: 16px 0 28px; }
  .field { display: block; margin-bottom: 19px; }
  .field > span { display: block; margin-bottom: 8px; font-weight: 600; font-size: .79rem; color: #354a65; }
  .field input, .field select { display: block; width: 100%; padding: 12px 14px; border: 1px solid #ccd8e9; border-radius: 7px; background: #fff; color: #223852; min-height: 45px; }
  .field input::placeholder { color: #7688a0; }
  .field-note { color: #667b96; font-size: .73rem; margin: -8px 0 19px; }
  .checkbox-field { display: flex; align-items: center; gap: 9px; color: #506780; font-size: .77rem; }
  .checkbox-field input { width: 16px; height: 16px; accent-color: var(--blue); }
  .auth-form-options { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; gap: 14px; margin: 4px 0 27px; }
  .auth-form-options .button-link { font-size: .76rem; }
  .auth-submit { width: 100%; min-height: 47px; }
  .auth-switch { display: flex; flex-wrap: wrap; gap: 7px; justify-content: center; color: #637a95; font-size: .77rem; margin-top: 23px; }
  .auth-switch .button-link { font-size: .77rem; }
  .auth-footnote { color: #697e99; font-size: .68rem; line-height: 1.8; text-align: center; margin-top: 30px; border-top: 1px solid #dde5f0; padding-top: 24px; }
  .mfa-qr { display: block; width: 180px; max-width: 100%; margin: 10px auto 22px; border: 1px solid #dae3ef; border-radius: 5px; background: #fff; }
  .mfa-secret { display: block; word-break: break-all; background: #eaf0f8; border: 1px solid #d6e2f0; border-radius: 5px; padding: 10px; font-size: .73rem; margin: 9px 0 22px; }
}
@layer responsive {
  @media (max-width: 650px) { .management-field-grid { grid-template-columns: 1fr; gap: 0; } .management-body { padding-left: 20px; padding-right: 20px; } .management-review { padding: 20px; } .review-details > div { grid-template-columns: 1fr; gap: 6px; } .management-actions { align-items: stretch; } .management-actions .button { width: 100%; } }
  @media (min-width: 1600px) { .app-main main { padding-top: 50px; } }
  @media (max-width: 1300px) { .public-intro, .public-features, .public-body, .public-download-note { margin-left: 5%; margin-right: 5%; } .public-product-callout { margin-left: 5%; margin-right: 5%; } .hero-with-art { gap: 24px; } .illustration-card { width: 390px; } .illustration-side { width: 120px; } .illustration-content { margin-left: 120px; padding-left: 18px; padding-right: 18px; } .orbit-two { width: 390px; height: 390px; } .illustration-floating { right: -5px; } .app-main main { padding: 32px 28px; } .app-footer { margin-left: 28px; margin-right: 28px; } .metric-card { padding: 19px; } .metric-card > svg { right: 18px; } }
  @media (max-width: 1080px) { .public-header nav { gap: 19px; } .hero-with-art { grid-template-columns: 1.2fr 1fr; } .public-hero h1 { font-size: 3rem; } .workspace-illustration { height: 310px; } .illustration-card { width: 320px; height: 260px; } .illustration-side { width: 102px; } .illustration-side > span { font-size: 7px; gap: 5px; padding-left: 4px; } .illustration-content { margin-left: 102px; padding: 17px 16px; } .illustration-tiles > div { padding: 9px; } .illustration-tiles i { margin-top: 7px; } .illustration-row { height: 21px; margin-top: 6px; } .orbit-one { width: 260px; height: 260px; } .orbit-two { width: 330px; height: 330px; } .illustration-floating { padding: 11px 14px; } .app-frame { grid-template-columns: 215px minmax(0,1fr); } .app-sidebar { padding-left: 13px; padding-right: 13px; } .metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .section-grid { grid-template-columns: 1fr; gap: 0; } .panel-heading { flex-wrap: wrap; } .public-prose, .help-body { gap: 50px; } }
  @media (max-width: 800px) { .public-header { flex-wrap: wrap; padding-top: 20px; padding-bottom: 20px; gap: 20px; } .public-header nav { order: 3; width: 100%; gap: 30px; justify-content: flex-start; overflow-x: auto; } .public-header .brand-mark { width: 34px; height: 37px; font-size: 21px; } .public-header .brand-wordmark { font-size: 17px; } .public-signin { font-size: .73rem; min-height: 37px; } .hero-with-art { grid-template-columns: 1fr; min-height: 0; padding-top: 58px; padding-bottom: 60px; } .public-hero h1 { font-size: 3.2rem; max-width: 620px; } .hero-description { font-size: .98rem; } .workspace-illustration { margin: 20px auto 0; width: 420px; max-width: 100%; height: 335px; } .illustration-card { width: 380px; height: 280px; } .illustration-side { width: 120px; } .illustration-content { margin-left: 120px; padding: 21px; } .illustration-side > span { font-size: 8px; } .orbit-one { width: 300px; height: 300px; } .orbit-two { width: 370px; height: 370px; } .illustration-floating { right: 0; bottom: 4px; } .public-intro { gap: 30px; padding-top: 55px; } .public-intro h2, .public-prose h2, .help-intro h2 { font-size: 1.9rem; } .public-features { gap: 20px; padding-bottom: 55px; } .public-features h3 { font-size: .95rem; } .public-features p { font-size: .84rem; } .public-product-callout { padding: 28px; } .public-prose, .help-body { grid-template-columns: 1fr; gap: 35px; } .public-body { padding-top: 55px; padding-bottom: 65px; } .product-card { grid-template-columns: 110px 1fr; gap: 28px; padding: 30px; } .product-card-icon { width: 105px; height: 105px; border-radius: 17px; } .public-footer nav { gap: 17px; } .app-frame { display: block; } .app-sidebar { min-height: 0; position: relative; padding: 20px 22px 15px; } .sidebar-brand { margin: 0; } .sidebar-area { margin: 14px 0 7px; } .app-sidebar nav { display: flex; overflow-x: auto; gap: 5px; padding-bottom: 3px; } .sidebar-link { width: auto; flex-shrink: 0; padding: 9px 12px; font-size: .75rem; gap: 8px; } .app-sidebar nav .sidebar-link svg { width: 17px; height: 17px; } .sidebar-bottom { position: absolute; top: 18px; right: 22px; padding-top: 0; margin-top: 0; max-width: 42%; } .sidebar-bottom .secure-label, .sidebar-public { display: none; } .session-email { padding: 0 0 3px; font-size: .63rem; text-align: right; } .signout-button { padding: 4px 0; margin: 0 0 0 auto; font-size: .7rem; } .signout-button svg { width: 15px; height: 15px; } .page-heading h1 { font-size: 1.7rem; } .detail-stat-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; } .detail-stat { padding: 15px; } .auth-page { grid-template-columns: 1fr; } .auth-brand-panel { padding: 25px 6%; } .auth-brand-copy { padding: 40px 0 22px; } .auth-brand-copy h1 { font-size: 2rem; max-width: 450px; } .auth-brand-copy p { font-size: .84rem; margin-top: 14px; max-width: 540px; } .auth-brand-note { display: none; } .auth-content { padding: 45px 7% 60px; } }
  @media (max-width: 550px) { .public-header nav { gap: 27px; } .public-header nav a { font-size: .8rem; } .public-header { gap: 16px; } .public-signin { padding: 9px 10px; font-size: .65rem; } .public-signin svg { display: none; } .public-hero h1 { font-size: 2.55rem; } .public-hero { padding-top: 45px; padding-bottom: 52px; } .hero-simple { min-height: 0; } .hero-actions { gap: 20px; } .hero-description { line-height: 1.8; font-size: .93rem; } .hero-text-link { font-size: .77rem; } .workspace-illustration { height: 280px; margin-top: 25px; } .illustration-card { width: 305px; max-width: 95%; height: 247px; } .illustration-side { width: 98px; padding: 12px 5px; } .illustration-side > span { font-size: 6.5px; gap: 4px; } .illustration-side svg { width: 13px; height: 13px; } .illustration-content { margin-left: 98px; padding: 16px; } .illustration-tiles > div { padding: 8px; } .illustration-tiles i { margin-top: 5px; } .illustration-row { margin-top: 5px; height: 20px; } .illustration-floating { bottom: -2px; padding: 10px 13px; } .orbit-one { width: 230px; height: 230px; } .orbit-two { width: 295px; height: 295px; } .public-intro { grid-template-columns: 1fr; gap: 23px; padding-bottom: 15px; } .public-intro h2 { font-size: 2rem; } .public-features { grid-template-columns: 1fr; gap: 30px; padding-top: 25px; } .public-features article { display: grid; grid-template-columns: 49px 1fr; column-gap: 20px; padding-top: 22px; } .public-features .feature-icon { grid-row: 1/3; } .public-features h3 { font-size: 1.02rem; margin-top: 1px; margin-bottom: 8px; } .public-features p { max-width: 100%; } .public-product-callout { display: block; padding: 28px; margin-bottom: 50px; } .public-product-callout h2 { font-size: 1.8rem; } .public-product-callout .button { margin-top: 24px; } .product-card { display: block; padding: 25px; } .product-card-icon { margin-bottom: 28px; width: 80px; height: 80px; } .product-card h2 { font-size: 2rem; } .contact-card { padding: 25px; } .public-download-note { padding: 21px; gap: 15px; } .public-footer { grid-template-columns: 1fr; gap: 30px; padding-top: 35px; } .public-footer nav { justify-content: flex-start; } .public-footer-meta { font-size: .62rem; flex-direction: column; gap: 8px; } .app-main main { padding: 25px 16px; } .app-footer { margin: 0 16px; font-size: .6rem; gap: 20px; } .page-heading { align-items: flex-start; gap: 14px; flex-direction: column; } .page-description { font-size: .79rem; } .page-heading .button { min-height: 36px; font-size: .74rem; } .metric-grid { gap: 11px; } .metric-card { padding: 17px; } .metric-card > svg { width: 16px; height: 16px; top: 18px; right: 14px; } .metric-label { font-size: .66rem !important; } .metric-value { font-size: 1.55rem; } .metric-note { font-size: .6rem; } .panel-heading { padding: 20px; } .panel-heading h2 { font-size: 1rem; } .panel-heading p { line-height: 1.65; } .panel-body, .system-note { padding-left: 20px; padding-right: 20px; } .search-form { width: 100%; } .search-input { min-width: 0; flex: 1; } .search-form .button { padding: 9px 12px; font-size: .75rem; } th, td { padding-left: 18px; padding-right: 18px; } .detail-stat-grid { grid-template-columns: 1fr; padding-left: 20px; padding-right: 20px; } .detail-stat { display: flex; align-items: center; justify-content: space-between; gap: 20px; } .detail-stat p { margin-bottom: 0; } .detail-stat strong { font-size: .9rem; } .workspace-grid { padding-left: 20px; padding-right: 20px; } .scope-grid { grid-template-columns: 1fr; } .auth-box h2 { font-size: 1.6rem; } .auth-content { padding-top: 35px; } .pagination { padding-left: 18px; padding-right: 18px; font-size: .65rem; gap: 10px; } .pagination .button { padding: 7px 9px; font-size: .7rem; } }
  @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
  @media (forced-colors: active) { .button, .badge, .scope-card, .panel, .sidebar-link.is-current { border: 1px solid CanvasText; } .illustration-line, .illustration-tiles i, .illustration-row i { background: CanvasText; } }
}
@layer responsive {
  @media (max-width: 800px) {
    .hero-with-art { grid-template-columns: minmax(0, 1fr); }
    .hero-with-art > * { min-width: 0; }
    .workspace-illustration { width: min(420px, 100%); min-width: 0; }
  }
}
