/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --color-white: #fff;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
  }
}
@layer utilities {
  .absolute {
    position: absolute;
  }
  .relative {
    position: relative;
  }
  .col-span-full {
    grid-column: 1 / -1;
  }
  .float-right {
    float: right;
  }
  .\[margin\:0_0_15px\] {
    margin: 0 0 15px;
  }
  .\[margin\:0_auto_13px\] {
    margin: 0 auto 13px;
  }
  .\[margin\:7px_0_18px\] {
    margin: 7px 0 18px;
  }
  .\[margin\:9px_0\] {
    margin: 9px 0;
  }
  .\[margin\:9px_0_20px\] {
    margin: 9px 0 20px;
  }
  .\[margin\:10px_0\] {
    margin: 10px 0;
  }
  .\[margin\:10px_0_20px\] {
    margin: 10px 0 20px;
  }
  .\[margin\:12px_0\] {
    margin: 12px 0;
  }
  .\[margin\:12px_0_7px\] {
    margin: 12px 0 7px;
  }
  .\[margin\:12px_0_22px\] {
    margin: 12px 0 22px;
  }
  .\[margin\:15px_0\] {
    margin: 15px 0;
  }
  .\[margin\:15px_0_25px\] {
    margin: 15px 0 25px;
  }
  .\[margin\:16px_0\] {
    margin: 16px 0;
  }
  .\[margin\:18px_0\] {
    margin: 18px 0;
  }
  .\[margin\:20px_0\] {
    margin: 20px 0;
  }
  .\[margin\:22px_0\] {
    margin: 22px 0;
  }
  .\[margin\:23px_0\] {
    margin: 23px 0;
  }
  .\[margin\:25px_0\] {
    margin: 25px 0;
  }
  .\[margin\:25px_0_18px\] {
    margin: 25px 0 18px;
  }
  .\[margin\:25px_7px_10px\] {
    margin: 25px 7px 10px;
  }
  .\[margin\:27px_0_18px\] {
    margin: 27px 0 18px;
  }
  .\[margin\:30px_0_18px\] {
    margin: 30px 0 18px;
  }
  .\[margin\:30px_7px_10px\] {
    margin: 30px 7px 10px;
  }
  .m-0 {
    margin: 0px;
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-\[22px\] {
    margin-block: 22px;
  }
  .mt-\[6px\] {
    margin-top: 6px;
  }
  .mt-\[7px\] {
    margin-top: 7px;
  }
  .mt-\[10px\] {
    margin-top: 10px;
  }
  .mt-\[12px\] {
    margin-top: 12px;
  }
  .mt-\[13px\] {
    margin-top: 13px;
  }
  .mt-\[14px\] {
    margin-top: 14px;
  }
  .mt-\[15px\] {
    margin-top: 15px;
  }
  .mt-\[17px\] {
    margin-top: 17px;
  }
  .mt-\[18px\] {
    margin-top: 18px;
  }
  .mt-\[20px\] {
    margin-top: 20px;
  }
  .mt-\[22px\] {
    margin-top: 22px;
  }
  .mt-\[23px\] {
    margin-top: 23px;
  }
  .mt-\[24px\] {
    margin-top: 24px;
  }
  .mt-\[25px\] {
    margin-top: 25px;
  }
  .mt-\[27px\] {
    margin-top: 27px;
  }
  .mt-\[28px\] {
    margin-top: 28px;
  }
  .mb-0 {
    margin-bottom: 0px;
  }
  .mb-\[6px\] {
    margin-bottom: 6px;
  }
  .mb-\[9px\] {
    margin-bottom: 9px;
  }
  .mb-\[12px\] {
    margin-bottom: 12px;
  }
  .mb-\[15px\] {
    margin-bottom: 15px;
  }
  .mb-\[16px\] {
    margin-bottom: 16px;
  }
  .mb-\[18px\] {
    margin-bottom: 18px;
  }
  .mb-\[20px\] {
    margin-bottom: 20px;
  }
  .mb-\[22px\] {
    margin-bottom: 22px;
  }
  .mb-\[23px\] {
    margin-bottom: 23px;
  }
  .mb-\[24px\] {
    margin-bottom: 24px;
  }
  .ml-auto {
    margin-left: auto;
  }
  .block {
    display: block;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline-block {
    display: inline-block;
  }
  .h-\[10px\] {
    height: 10px;
  }
  .h-\[65px\] {
    height: 65px;
  }
  .h-\[270px\] {
    height: 270px;
  }
  .min-h-\[150px\] {
    min-height: 150px;
  }
  .min-h-\[160px\] {
    min-height: 160px;
  }
  .min-h-\[165px\] {
    min-height: 165px;
  }
  .min-h-\[280px\] {
    min-height: 280px;
  }
  .w-\[50px\] {
    width: 50px;
  }
  .w-\[150px\] {
    width: 150px;
  }
  .w-\[180px\] {
    width: 180px;
  }
  .w-full {
    width: 100%;
  }
  .max-w-\[850px\] {
    max-width: 850px;
  }
  .flex-1 {
    flex: 1;
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .items-center {
    align-items: center;
  }
  .justify-between {
    justify-content: space-between;
  }
  .gap-\[8px\] {
    gap: 8px;
  }
  .gap-\[9px\] {
    gap: 9px;
  }
  .gap-\[10px\] {
    gap: 10px;
  }
  .gap-\[11px\] {
    gap: 11px;
  }
  .gap-\[12px\] {
    gap: 12px;
  }
  .self-center {
    align-self: center;
  }
  .self-start {
    align-self: flex-start;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .rounded-\[5px\] {
    border-radius: 5px;
  }
  .rounded-\[15px\] {
    border-radius: 15px;
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-solid {
    --tw-border-style: solid;
    border-style: solid;
  }
  .bg-\[\#f1f3eb\] {
    background-color: #f1f3eb;
  }
  .bg-\[\#fbefdf\] {
    background-color: #fbefdf;
  }
  .\[padding\:0_23px_17px\] {
    padding: 0 23px 17px;
  }
  .\[padding\:0_24px\] {
    padding: 0 24px;
  }
  .\[padding\:12px_0\] {
    padding: 12px 0;
  }
  .\[padding\:12px_15px\] {
    padding: 12px 15px;
  }
  .\[padding\:14px_0\] {
    padding: 14px 0;
  }
  .\[padding\:18px_25px\] {
    padding: 18px 25px;
  }
  .p-0 {
    padding: 0px;
  }
  .p-\[8px\] {
    padding: 8px;
  }
  .p-\[9px\] {
    padding: 9px;
  }
  .p-\[23px\] {
    padding: 23px;
  }
  .p-\[25px\] {
    padding: 25px;
  }
  .p-\[26px\] {
    padding: 26px;
  }
  .p-\[27px\] {
    padding: 27px;
  }
  .p-\[30px\] {
    padding: 30px;
  }
  .pt-\[20px\] {
    padding-top: 20px;
  }
  .text-center {
    text-align: center;
  }
  .text-left {
    text-align: left;
  }
  .\[font-family\:monospace\] {
    font-family: monospace;
  }
  .font-\[system-ui\] {
    font-family: system-ui;
  }
  .text-\[11px\] {
    font-size: 11px;
  }
  .text-\[12px\] {
    font-size: 12px;
  }
  .text-\[15px\] {
    font-size: 15px;
  }
  .text-\[16px\] {
    font-size: 16px;
  }
  .text-\[18px\] {
    font-size: 18px;
  }
  .text-\[19px\] {
    font-size: 19px;
  }
  .text-\[25px\] {
    font-size: 25px;
  }
  .text-\[28px\] {
    font-size: 28px;
  }
  .text-\[30px\] {
    font-size: 30px;
  }
  .text-\[35px\] {
    font-size: 35px;
  }
  .leading-\[1\.8\] {
    --tw-leading: 1.8;
    line-height: 1.8;
  }
  .leading-\[1\.9\] {
    --tw-leading: 1.9;
    line-height: 1.9;
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .tracking-\[1px\] {
    --tw-tracking: 1px;
    letter-spacing: 1px;
  }
  .whitespace-pre-wrap {
    white-space: pre-wrap;
  }
  .\[color\:var\(--card-accent\)\] {
    color: var(--card-accent);
  }
  .\[color\:var\(--ink\)\] {
    color: var(--ink);
  }
  .text-\[\#9b8764\] {
    color: #9b8764;
  }
  .text-\[\#99a38d\] {
    color: #99a38d;
  }
  .text-\[\#68849c\] {
    color: #68849c;
  }
  .text-\[\#69815a\] {
    color: #69815a;
  }
  .text-\[\#75915c\] {
    color: #75915c;
  }
  .text-\[\#81996a\] {
    color: #81996a;
  }
  .text-\[\#95713e\] {
    color: #95713e;
  }
  .text-\[\#aa6845\] {
    color: #aa6845;
  }
  .text-\[\#b18347\] {
    color: #b18347;
  }
  .opacity-\[\.7\] {
    opacity: .7;
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .\[border-bottom\:1px_solid_var\(--line\)\] {
    border-bottom: 1px solid var(--line);
  }
  .\[border-top\:1px_solid_var\(--line\)\] {
    border-top: 1px solid var(--line);
  }
  .\[font\:700_25px_Manrope\] {
    font: 700 25px Manrope;
  }
  @media print {
    .print\:bg-white {
      background-color: var(--color-white);
    }
  }
}
@layer components {
  :root {
    --ink: #203b35;
    --muted: #7d8782;
    --green: #245c49;
    --line: #e7ebe5;
    --bg: #f6f7f2;
  }
  * {
    box-sizing: border-box;
  }
  body {
    margin: 0px;
    color: var(--ink);
    background: var(--bg);
    font: 13px 'DM Sans',sans-serif;
  }
  button,input,select,textarea {
    font: inherit;
  }
  button {
    cursor: pointer;
  }
  button:hover {
    filter: brightness(.96);
  }
  a,a:hover,a:visited,a:active {
    text-decoration: none;
  }
  aside {
    position: fixed;
    inset: 0px;
    display: flex;
    width: 232px;
    flex-direction: column;
    background-color: var(--color-white);
    padding: 31px 20px;
    border-right: 1px solid var(--line);
  }
  .logo {
    margin: 0 12px 35px;
    --tw-tracking: calc(2px * -1);
    letter-spacing: calc(2px * -1);
    font: 800 34px Manrope;
  }
  .logo span {
    color: #d3dfb2;
  }
  .office {
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 9px;
    padding: 12px;
    border: 1px solid var(--line);
  }
  .avatar {
    border-radius: 8px;
    background-color: #edf0df;
    padding: 10px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .sub {
    margin-top: 4px;
    font-size: 11px;
    color: var(--muted);
  }
  .label {
    margin: 17px 13px 10px;
    font-size: 10px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    --tw-tracking: 1.5px;
    letter-spacing: 1.5px;
    color: #8e9690;
  }
  .nav {
    margin: 2px 0;
    width: 100%;
    border-radius: 7px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    padding: 12px 14px;
    text-align: left;
    color: #67746c;
    background: none;
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .nav.active {
    background-color: #edf2e6;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: #315b44;
  }
  .nav b {
    margin-left: auto;
    border-radius: 4px;
    background-color: #e3e9d6;
    padding: 2px 6px;
    font-size: 10px;
  }
  .ico {
    display: inline-block;
    width: 20px;
    font-size: 17px;
  }
  .bottom {
    margin-top: auto;
  }
  .profile {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
  }
  main {
    margin-left: 232px;
  }
  header {
    display: flex;
    height: 78px;
    align-items: center;
    justify-content: space-between;
    background-color: var(--color-white);
    padding: 0 38px;
    border-bottom: 1px solid var(--line);
  }
  .search {
    width: 330px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    outline: none;
  }
  .topright {
    display: flex;
    align-items: center;
    gap: 22px;
  }
  .usermenu {
    position: relative;
  }
  .usermenu summary {
    list-style: none;
    cursor: pointer;
  }
  .usermenu summary::-webkit-details-marker,.usermenu summary::marker {
    content: "";
    display: none;
  }
  .usermenu-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0px;
    z-index: 30;
    min-width: 190px;
    border-radius: 8px;
    background-color: var(--color-white);
    padding: 8px;
    border: 1px solid var(--line);
  }
  .usermenu-panel b {
    display: block;
    padding: 8px 12px 4px;
  }
  .usermenu-panel a,.usermenu-panel .usermenu-action {
    display: block;
    width: 100%;
    border-style: var(--tw-border-style);
    border-width: 0px;
    border-radius: 6px;
    background: none;
    padding: 10px 12px;
    text-align: left;
    color: var(--ink);
  }
  .usermenu-panel form {
    margin: 0px;
  }
  .demo {
    border-radius: 4px;
    padding: 5px 8px;
    font-size: 10px;
    --tw-tracking: 1px;
    letter-spacing: 1px;
    color: #6c7f5e;
    border: 1px solid #dfe6d8;
  }
  .content {
    margin: auto;
    max-width: 1680px;
    padding: 33px 38px;
  }
  .titlebar {
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  h1 {
    margin: 5px 0 9px;
    --tw-tracking: calc(1px * -1);
    letter-spacing: calc(1px * -1);
    font: 700 28px Manrope;
  }
  p {
    margin: 5px 0;
    --tw-leading: 1.6;
    line-height: 1.6;
    color: var(--muted);
  }
  button.primary {
    border-radius: 7px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    padding: 12px 17px;
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-white);
    background: var(--green);
  }
  .secondary {
    border-radius: 7px;
    background-color: var(--color-white);
    padding: 10px 14px;
    color: var(--ink);
    border: 1px solid var(--line);
  }
  .stats {
    margin-bottom: 26px;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 18px;
  }
  .stat,.panel {
    border-radius: 11px;
    background-color: var(--color-white);
    border: 1px solid var(--line);
  }
  .stat {
    padding: 21px;
  }
  .stat .num {
    margin: 12px 0;
    font: 700 29px Manrope;
  }
  .stat .trend {
    font-size: 11px;
    color: #6d8b59;
  }
  .stat .stathead {
    display: flex;
    justify-content: space-between;
    color: #69766d;
  }
  .grid {
    display: grid;
    grid-template-columns: minmax(0,1fr) 320px;
    gap: 24px;
  }
  .panelhead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 22px 23px 17px;
  }
  .block-return-raw {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    max-height: 65vh;
    overflow-y: auto;
    padding: 18px;
    border-radius: 8px;
    background: #f7f8f5;
    font-size: 12px;
  }
  h2 {
    margin: 0px;
    font: 700 15px Manrope;
  }
  .link {
    border-style: var(--tw-border-style);
    border-width: 0px;
    font-size: 11px;
    color: #57704e;
    background: none;
  }
  .tabs {
    display: flex;
    gap: 24px;
    padding: 0 23px;
    border-bottom: 1px solid var(--line);
  }
  .tab {
    border-style: var(--tw-border-style);
    border-width: 0px;
    padding: 12px 0;
    color: #929990;
    background: none;
  }
  .tab.active {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: #2a4939;
    border-bottom: 2px solid #426347;
  }
  table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
  }
  th {
    background-color: #fafbf8;
    padding: 13px 20px;
    font-size: 10px;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    --tw-tracking: .7px;
    letter-spacing: .7px;
    color: #939b95;
  }
  td {
    padding: 17px 20px;
    font-size: 12px;
    border-bottom: 1px solid #f0f2ed;
  }
  tbody tr {
    cursor: pointer;
  }
  tbody tr:hover {
    background-color: #fafbf6;
  }
  .badge {
    border-radius: 5px;
    background-color: #edf3e6;
    padding: 5px 8px;
    font-size: 10px;
    white-space: nowrap;
    color: #66814e;
  }
  .badge.orange {
    background-color: #faf0dd;
    color: #b18347;
  }
  .badge.blue {
    background-color: #edf2f6;
    color: #68849c;
  }
  .small {
    margin-top: 4px;
    font-size: 10px;
    color: #8b948e;
  }
  .task {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 15px 23px;
    border-top: 1px solid #f0f2ed;
  }
  .task input {
    accent-color: var(--green);
  }
  .task.done {
    text-decoration-line: line-through;
    opacity: .5;
  }
  .priority {
    margin-right: 5px;
    display: inline-block;
    height: 6px;
    width: 6px;
    border-radius: calc(infinity * 1px);
    background-color: #c8905e;
  }
  .foot {
    padding: 14px 23px;
    font-size: 11px;
    color: #9aa095;
  }
  .lower {
    margin-top: 24px;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 24px;
  }
  .activity {
    display: flex;
    gap: 13px;
    padding: 13px 23px;
  }
  .circle {
    display: grid;
    height: 32px;
    width: 32px;
    flex-shrink: 0;
    place-items: center;
    border-radius: calc(infinity * 1px);
    background-color: #f0f3e7;
  }
  .banner {
    position: relative;
    margin-top: 22px;
    overflow: hidden;
    border-radius: 11px;
    background-color: #eaf0de;
    padding: 24px;
    border: 1px solid #dce6ca;
  }
  .banner h2 {
    max-width: 200px;
    font-size: 17px;
    --tw-leading: 1.5;
    line-height: 1.5;
  }
  .banner p {
    margin: 10px 0 18px;
    max-width: 230px;
    font-size: 11px;
    color: #7b896c;
  }
  .chart {
    display: flex;
    height: 105px;
    align-items: flex-end;
    gap: 11px;
    padding: 10px 25px 0;
  }
  .bar {
    position: relative;
    flex: 1;
    border-radius: 4px 4px 0 0;
    background-color: #cbd9ae;
  }
  .bar:nth-child(2n) {
    background-color: #77936c;
  }
  .months {
    display: flex;
    justify-content: space-around;
    padding: 9px 20px 20px;
    font-size: 10px;
    color: #919c8b;
  }
  .drawerback {
    position: fixed;
    inset: 0px;
    z-index: 10;
    display: none;
    background-color: #182b2740;
  }
  .drawerback.open {
    display: block;
  }
  .drawer {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    width: min(580px, 100%);
    overflow: auto;
    background-color: var(--color-white);
    padding: 32px;
    box-shadow: -20px 0 70px #203b3520;
  }
  .close {
    float: right;
    height: 30px;
    width: 30px;
    border-radius: calc(infinity * 1px);
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: #f1f3ed;
  }
  .detailbox {
    margin: 20px 0;
    border-radius: 9px;
    background-color: #f7f8f3;
    padding: 20px;
  }
  .detailrow {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
  }
  label.field {
    margin: 18px 0 7px;
    display: block;
    font-size: 12px;
    color: #748070;
  }
  label.remember {
    margin-top: 18px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--ink);
  }
  .fieldinput {
    width: 100%;
    border-radius: 6px;
    background-color: var(--color-white);
    padding: 12px;
    color: var(--ink);
    border: 1px solid #dce3d7;
  }
  textarea {
    min-height: 100px;
  }
  .toast {
    position: fixed;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #244b3b;
    padding: 14px 24px;
    color: var(--color-white);
    z-index: 30;
    display: none;
    border-radius: 8px;
  }
  .inboxrow {
    display: flex;
    cursor: pointer;
    gap: 15px;
    padding: 23px;
    border-bottom: 1px solid var(--line);
  }
  .kanban {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 18px;
  }
  .column {
    min-height: 450px;
    border-radius: 9px;
    background-color: #edf0e8;
    padding: 15px;
  }
  .card {
    margin-top: 15px;
    cursor: pointer;
    border-radius: 8px;
    background-color: var(--color-white);
    padding: 18px;
    border: 1px solid var(--line);
    clear: both;
  }
  a.card {
    display: block;
    color: inherit;
    text-decoration: none;
    overflow-wrap: anywhere;
  }
  .empty {
    padding: 40px;
  }
  .toolbar {
    margin-bottom: 20px;
    display: flex;
    gap: 10px;
  }
  .toolbar input {
    flex: 1;
  }
  .portal {
    margin: auto;
    max-width: 850px;
  }
  .portalhero {
    margin-bottom: 24px;
    border-radius: 12px;
    background-color: #e6edda;
    padding: 35px;
  }
  @media (min-width:1500px) {
    .content {
      padding-top: 40px;
    }
    .stat {
      padding: 26px;
    }
    td {
      padding-top: 22px;
      padding-bottom: 22px;
    }
  }
  @media (max-width:1100px) {
    aside {
      width: 190px;
      padding: 25px 12px;
    }
    main {
      margin-left: 190px;
    }
    .content {
      padding: 25px;
    }
    .grid {
      grid-template-columns: 1fr;
    }
    .right {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
    }
    .banner {
      margin: 0px;
    }
    .stats {
      gap: 10px;
    }
    .kanban {
      grid-template-columns: 1fr 1fr;
    }
  }
  @media (max-width:700px) {
    aside {
      position: static;
      display: block;
      height: auto;
      width: 100%;
      padding: 14px;
    }
    .logo {
      margin: 0 0 14px;
      font-size: 27px;
    }
    .office,.label,.bottom {
      display: none;
    }
    #nav {
      display: flex;
      overflow: auto;
    }
    .nav {
      width: auto;
      white-space: nowrap;
    }
    .nav b {
      display: none;
    }
    main {
      margin: 0px;
    }
    header {
      height: 55px;
      padding: 0 20px;
    }
    .search {
      width: 180px;
    }
    .content {
      padding: 22px 16px;
    }
    .stats {
      grid-template-columns: 1fr 1fr;
    }
    .titlebar {
      align-items: flex-start;
      gap: 10px;
    }
    h1 {
      font-size: 23px;
    }
    .lower,.right {
      grid-template-columns: 1fr;
    }
    .panel {
      overflow: auto;
    }
    .topright {
      gap: 8px;
    }
    .kanban {
      grid-template-columns: 1fr;
    }
    td,th {
      padding: 14px;
    }
    .demo {
      display: none;
    }
  }
  .clienthero {
    margin-bottom: 26px;
    display: flex;
    align-items: center;
    gap: 17px;
  }
  .clientinitial {
    display: grid;
    height: 72px;
    width: 72px;
    flex-shrink: 0;
    place-items: center;
    border-radius: 18px;
    background-color: #e6edda;
    font: 700 24px Manrope;
    color: #56704a;
  }
  .clientmetrics {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    border-radius: 11px;
    background-color: var(--color-white);
    border: 1px solid var(--line);
    margin-bottom: 26px;
    padding: 24px 0;
  }
  .clientmetrics>div {
    padding: 0 26px;
    border-right: 1px solid var(--line);
  }
  .clientmetrics>div:last-child {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .clientmetrics strong {
    margin-top: 10px;
    display: block;
    font: 700 28px Manrope;
  }
  .clientlayout {
    display: grid;
    grid-template-columns: 285px minmax(0,1fr);
    gap: 24px;
  }
  .clientfield {
    padding: 13px 0;
    border-bottom: 1px solid var(--line);
  }
  .clientfield span {
    margin-bottom: 7px;
    display: block;
    font-size: 11px;
    color: var(--muted);
  }
  .clientfield b {
    font-size: 12px;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    overflow-wrap: anywhere;
  }
  .clienttable {
    overflow: auto;
  }
  .claimempty {
    background-color: #fcfcf9;
    padding: 30px;
    text-align: center;
    border-top: 1px solid var(--line);
  }
  .claimempty p {
    margin-top: 8px;
    font-size: 12px;
  }
  @media (max-width:1100px) {
    .clientlayout {
      grid-template-columns: 240px minmax(0,1fr);
    }
    .clienthero {
      flex-wrap: wrap;
    }
    .clientmetrics>div {
      padding: 0 16px;
    }
  }
  @media (max-width:800px) {
    .clientlayout {
      grid-template-columns: 1fr;
    }
    .clientmetrics {
      grid-template-columns: 1fr 1fr;
      gap: 24px;
    }
    .clienthero .clientinitial {
      height: 55px;
      width: 55px;
    }
    .clienthero h1 {
      font-size: 22px;
    }
    .clienthero>div:nth-child(2) {
      min-width: 200px;
    }
    .clientmetrics>div:nth-child(2) {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
  }
  .mailworkspace {
    display: grid;
    grid-template-columns: 220px 300px minmax(280px,1fr);
    background-color: var(--color-white);
    border: 1px solid var(--line);
    min-height: 600px;
    overflow: hidden;
    border-radius: 12px;
  }
  .mailfolders {
    background-color: #fafbf7;
    padding: 20px 12px;
    border-right: 1px solid var(--line);
    overflow: auto;
    max-height: calc(100vh - 220px);
  }
  .mailfolders button {
    margin: 4px 0;
    width: 100%;
    text-align: left;
  }
  .mailfolders button.active {
    background-color: #e7eedb;
    color: #315b44;
  }
  .mailaccounts {
    margin: 0 0 16px;
  }
  .mailaccount {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 8px 0;
    font-size: 12px;
    line-height: 1.35;
    cursor: pointer;
  }
  .mailaccount input {
    margin-top: 2px;
    flex: none;
  }
  .mailaccount span {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .mailaccount small {
    display: block;
    color: #748463;
    font-size: 10px;
  }
  .mailfolders .nav small {
    display: block;
    color: #748463;
    font-size: 10px;
    font-weight: 500;
  }
  .maillist {
    border-right: 1px solid var(--line);
  }
  .mailpages {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    padding: 12px;
    border-top: 1px solid var(--line);
    font-size: 12px;
    position: sticky;
    bottom: 0;
    background: var(--color-white);
  }
  .mailpages a, .mailpages span {
    min-width: 28px;
    padding: 4px 6px;
    border-radius: 6px;
    text-align: center;
    color: #315b44;
    font-weight: 600;
    text-decoration: none;
  }
  .mailpages a.active {
    background: #64825b;
    color: #fff;
  }
  .mailitem {
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-decoration: none;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: var(--color-white);
    padding: 20px;
    text-align: left;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
  }
  .mailitem b,.mailitem .mailsubject {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .maillist,.mailreader {
    min-width: 0;
    overflow: auto;
    max-height: calc(100vh - 220px);
  }
  .mailitem.active {
    background-color: #f0f4e8;
    box-shadow: inset 3px 0 #64825b;
  }
  .mailitem p {
    margin-top: 9px;
    font-size: 11px;
  }
  .mailreader {
    min-width: 0px;
    padding: 28px;
  }
  .mailreader h2 {
    font-size: 21px;
    --tw-leading: 1.5;
    line-height: 1.5;
  }
  .mailbody {
    margin: 27px 0 35px;
    --tw-leading: 1.9;
    line-height: 1.9;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
  }
  .mailbody.html {
    white-space: normal;
  }
  .mailframe {
    width: 100%;
    min-height: 240px;
    margin: 18px 0 8px;
    border: 0;
    background: #fff;
  }
  .mailfiles {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
  }
  .mailfiles .label {
    width: 100%;
  }
  .mailfiles a {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 8px;
    background: #f4f6ef;
    color: #315b44;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
  }
  .mailmeta {
    margin-top: 22px;
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .mailactions {
    margin: 22px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .mailfilter {
    width: 100%;
    border-style: var(--tw-border-style);
    border-width: 0px;
    padding: 18px;
    outline: none;
    border-bottom: 1px solid var(--line);
  }
  .caltoolbar {
    margin-bottom: 22px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
  }
  .caltoolbar h2 {
    margin-right: auto;
    font-size: 21px;
  }
  .segmented {
    display: flex;
    gap: 3px;
    border-radius: 7px;
    background-color: #e9ede3;
    padding: 4px;
  }
  .segmented button {
    border-radius: 5px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    padding: 9px 16px;
    color: #6a786a;
  }
  .segmented button.active {
    background-color: var(--color-white);
    color: var(--green);
    box-shadow: 0 1px 5px #203b3510;
  }
  .calgrid {
    display: grid;
    grid-template-columns: repeat(7,minmax(0,1fr));
    background-color: var(--color-white);
    border-left: 1px solid var(--line);
    overflow: hidden;
    border-radius: 8px;
    border-top: 1px solid var(--line);
  }
  .caldayhead {
    padding: 15px;
    text-align: center;
    color: #7a8876;
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line);
    background-color: #fafbf7;
    font-size: 11px;
  }
  .calcell {
    min-height: 125px;
    padding: 10px;
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line);
    cursor: pointer;
  }
  .calcell:hover {
    background-color: #fafbf6;
  }
  .calcell.today {
    background-color: #f7faef;
  }
  .calnumber {
    margin-bottom: 6px;
    display: grid;
    height: 26px;
    width: 26px;
    place-items: center;
    font-size: 12px;
  }
  .today .calnumber {
    border-radius: calc(infinity * 1px);
    background-color: #466d50;
    color: var(--color-white);
  }
  .calevent {
    margin: 5px 0;
    display: block;
    width: 100%;
    border-radius: 4px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: #e7eedb;
    padding: 7px;
    text-align: left;
    font-size: 10px;
    color: #49623d;
    --tw-leading: 1.5;
    line-height: 1.5;
  }
  .calevent.blue {
    background-color: #e9f0f6;
    color: #57738a;
  }
  .calevent.orange {
    background-color: #fbefdc;
    color: #a17b42;
  }
  .weekcol {
    min-height: 490px;
  }
  .caltime {
    margin: 20px 0 6px;
    font-size: 10px;
    color: #92a087;
  }
  .callegend {
    margin-top: 20px;
    display: flex;
    gap: 20px;
    font-size: 11px;
    color: #7d8977;
  }
  .signlayout {
    display: grid;
    grid-template-columns: minmax(0,1fr) 290px;
    gap: 24px;
  }
  .paper {
    border-radius: 5px;
    background-color: var(--color-white);
    padding: 36px;
    box-shadow: 0 10px 35px #263c2b08;
    border: 1px solid #dfe4d9;
  }
  .paper h2 {
    margin: 25px 0;
    font: 700 24px Manrope;
  }
  .paper p {
    font-size: 12px;
    --tw-leading: 1.9;
    line-height: 1.9;
  }
  .signbox {
    margin-top: 30px;
    background-color: #fafcf6;
    padding: 23px;
    border: 1px dashed #a9ba95;
  }
  .signmark {
    margin: 15px 0;
    font-family: Georgia,serif;
    font-size: 30px;
    color: #3f5f45;
    font-style: italic;
  }
  .doctabs {
    margin-bottom: 22px;
  }
  .docstats {
    margin-bottom: 23px;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
  }
  .docstat {
    min-width: 150px;
    flex: 1;
    border-radius: 9px;
    background-color: var(--color-white);
    padding: 18px 25px;
    border: 1px solid var(--line);
  }
  .docstat strong {
    margin-top: 9px;
    display: block;
    font: 700 24px Manrope;
  }
  .notice {
    margin-bottom: 20px;
    border-radius: 7px;
    background-color: #f0f3e7;
    padding: 11px 15px;
    font-size: 11px;
    color: #748463;
    border: 1px solid #e1e8d6;
  }
  .fieldpair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  @media (max-width:1200px) {
    .mailworkspace {
      grid-template-columns: 200px 240px minmax(250px,1fr);
    }
    .mailreader {
      padding: 22px;
    }
    .signlayout {
      grid-template-columns: 1fr;
    }
    .calcell {
      padding: 5px;
    }
  }
  @media (max-width:900px) {
    .mailworkspace {
      grid-template-columns: 140px 1fr;
    }
    .mailreader {
      grid-column: 1 / -1;
      border-top: 1px solid var(--line);
    }
    .maillist {
      border-style: var(--tw-border-style);
      border-width: 0px;
    }
    .calgrid {
      overflow: auto;
    }
    .calcell {
      min-height: 110px;
    }
    .calevent {
      padding: 5px;
      font-size: 9px;
    }
    .caldayhead {
      padding: 10px 4px;
    }
  }
  @media (max-width:600px) {
    .calgrid.month {
      min-width: 650px;
    }
    .calwrap {
      overflow: auto;
    }
    .calgrid.week {
      min-width: 700px;
    }
    .fieldpair {
      grid-template-columns: 1fr;
    }
    .paper {
      padding: 22px;
    }
    .mailworkspace {
      grid-template-columns: 115px 1fr;
    }
    .mailitem {
      padding: 14px;
    }
    .docstats {
      gap: 10px;
    }
    .docstat {
      padding: 15px;
    }
  }
  .exchangefilters {
    margin: 22px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
  }
  .exchangefilters select {
    width: auto;
    min-width: 165px;
  }
  .exchangetable {
    overflow: auto;
  }
  .exchangetable td {
    padding: 17px 13px;
  }
  .exchangetable th {
    padding: 13px;
  }
  .selectionbar {
    display: flex;
    align-items: center;
    gap: 15px;
    border-radius: 8px;
    background-color: #e9efdd;
    padding: 15px 20px;
    border: 1px solid #dce6cb;
    margin-bottom: 18px;
  }
  .jsonpreview {
    border-radius: 8px;
    background-color: #243b33;
    padding: 20px;
    white-space: pre-wrap;
    color: #d9e7d3;
    font: 11px/1.8 monospace;
    overflow-wrap: anywhere;
  }
  .changegrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
  }
  .changebox {
    border-radius: 8px;
    background-color: #f5f6f0;
    padding: 17px;
    border: 1px solid var(--line);
  }
  .changebox.after {
    border-color: #dbe6ce;
    background-color: #f0f5e8;
  }
  .resultline {
    padding: 16px 0;
    --tw-leading: 1.8;
    line-height: 1.8;
    border-bottom: 1px solid var(--line);
  }
  .exchangehint {
    margin-top: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background-color: var(--color-white);
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 9px;
  }
  @media (max-width:700px) {
    .selectionbar {
      flex-wrap: wrap;
    }
    .changegrid {
      grid-template-columns: 1fr;
    }
    .exchangefilters select {
      flex: 1;
    }
    .exchangehint {
      display: block;
    }
  }
  .workintro {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 18px;
    border-radius: 11px;
    background-color: #eaf0df;
    padding: 24px;
  }
  .workintro h2 {
    font-size: 19px;
  }
  .workcards {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 18px;
  }
  .workcard {
    border-radius: 10px;
    background-color: var(--color-white);
    padding: 23px;
    border: 1px solid var(--line);
  }
  .workcard h2 {
    margin: 14px 0 9px;
    --tw-leading: 1.6;
    line-height: 1.6;
  }
  .workcard p {
    font-size: 12px;
  }
  .workcard .mailactions {
    margin-bottom: 0px;
  }
  .worktabs {
    margin-bottom: 25px;
    display: flex;
    width: fit-content;
    flex-wrap: wrap;
    gap: 7px;
    border-radius: 8px;
    background-color: #e9ede3;
    padding: 5px;
  }
  .worktabs button {
    border-radius: 5px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    padding: 11px 18px;
    color: #75816f;
  }
  .worktabs button.active {
    background-color: var(--color-white);
    color: #315b44;
    box-shadow: 0 1px 6px #203b3510;
  }
  .flowrow {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 18px 0;
    border-bottom: 1px solid var(--line);
  }
  .flowrow input {
    margin-top: 5px;
    accent-color: #426a48;
  }
  .flowrow.done b {
    color: #929b8b;
    text-decoration-line: line-through;
  }
  .flowprogress {
    margin: 17px 0;
    height: 6px;
    border-radius: 4px;
    background-color: #e7ecdf;
  }
  .flowprogress>div {
    height: 100%;
    border-radius: 4px;
    background-color: #79965e;
  }
  .clienttools {
    margin: 0 0 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .requestitem {
    margin: 13px 0;
    border-radius: 8px;
    padding: 17px;
    border: 1px solid var(--line);
  }
  .requestitem.complete {
    background-color: #f2f6e9;
  }
  .briefnumber {
    margin: 20px 0;
    display: flex;
    gap: 15px;
  }
  .briefnumber>div {
    flex: 1;
    border-radius: 7px;
    background-color: #f3f5eb;
    padding: 16px;
  }
  .briefnumber strong {
    display: block;
    font: 700 24px Manrope;
  }
  .smalltag {
    font-size: 10px;
    --tw-tracking: .8px;
    letter-spacing: .8px;
    color: #8b997e;
  }
  .workcards .badge {
    display: inline-block;
  }
  .focusbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-radius: 9px;
    background-color: #eaf0df;
    border: 1px solid #dce6ca;
    margin-bottom: 25px;
    padding: 18px 22px;
  }
  .focusbar p {
    font-size: 11px;
    color: #7d8c70;
  }
  .contactrow {
    padding: 17px 23px;
    border-bottom: 1px solid var(--line);
  }
  .contactrow p {
    font-size: 12px;
    white-space: pre-wrap;
  }
  .coveragegrid {
    margin: 15px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .coveragechip {
    border-radius: 5px;
    background-color: #f2f5e9;
    padding: 8px 10px;
    font-size: 11px;
    color: #66804e;
  }
  @media (max-width:1000px) {
    .workcards {
      grid-template-columns: 1fr 1fr;
    }
    .workintro {
      align-items: flex-start;
    }
  }
  @media (max-width:650px) {
    .workcards {
      grid-template-columns: 1fr;
    }
    .focusbar {
      flex-wrap: wrap;
    }
    .worktabs button {
      padding: 10px;
    }
    .workintro {
      padding: 18px;
    }
  }
  aside #nav {
    min-height: 0px;
    overflow-y: auto;
  }
  aside .bottom {
    padding-top: 10px;
  }
  .workcard button:disabled {
    cursor: default;
    opacity: .5;
  }
  body.customer-mode {
    background-color: #f7f8f3;
  }
  body.customer-mode>aside {
    display: none;
  }
  body.customer-mode main {
    margin: 0px;
  }
  body.customer-mode header {
    height: auto;
    min-height: 85px;
    max-width: none;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px max(25px, calc((100vw - 1180px) / 2));
  }
  body.customer-mode .content {
    max-width: 1240px;
    padding: 28px 30px 50px;
  }
  .portalbrand {
    display: flex;
    align-items: center;
    gap: 17px;
  }
  .portalbrand .logo {
    margin: 0px;
    font-size: 31px;
  }
  .portalbrand small {
    padding-left: 17px;
    font-size: 11px;
    color: #7b8874;
    border-left: 1px solid var(--line);
  }
  .customerbar {
    display: flex;
    align-items: center;
    gap: 14px;
  }
  .customerbar select {
    max-width: 205px;
    border-radius: 6px;
    background-color: #f5f7ed;
    padding: 9px;
    color: var(--ink);
    border: 1px solid #e1e6d8;
  }
  .customernav {
    margin-bottom: 12px;
    display: flex;
    gap: 7px;
    overflow-x: auto;
    padding: 0 0 20px;
    border-bottom: 1px solid var(--line);
  }
  .customernav button {
    border-radius: 7px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    padding: 12px 17px;
    white-space: nowrap;
    color: #87917e;
    background: none;
  }
  .customernav button.active {
    background-color: #e7eedb;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: #365b3c;
  }
  .portalwelcome {
    margin: 25px 0;
    display: flex;
    align-items: center;
    gap: 25px;
    border-radius: 15px;
    background-color: #eaf0df;
    padding: 35px 38px;
  }
  .portalwelcome h1 {
    max-width: 650px;
    font-size: 32px;
    --tw-leading: 1.4;
    line-height: 1.4;
  }
  .portalwelcome p {
    max-width: 560px;
    color: #7c8b70;
  }
  .portalmotif {
    margin-left: auto;
    display: grid;
    height: 130px;
    width: 130px;
    place-items: center;
    border-radius: calc(infinity * 1px);
    background-color: #dde7c9;
    font-size: 64px;
    color: #77965e;
    flex-shrink: 0;
  }
  .portalstats {
    margin: 24px 0;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 17px;
  }
  .portalstat {
    cursor: pointer;
    border-radius: 9px;
    background-color: var(--color-white);
    padding: 21px;
    border: 1px solid var(--line);
  }
  .portalstat strong {
    margin: 11px 0 3px;
    display: block;
    font: 700 29px Manrope;
  }
  .portalcolumns {
    display: grid;
    grid-template-columns: minmax(0,1fr) 310px;
    gap: 24px;
  }
  .portalcards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .portalcard {
    border-radius: 11px;
    background-color: var(--color-white);
    padding: 25px;
    border: 1px solid var(--line);
  }
  .portalcard h2 {
    margin: 15px 0 9px;
    font-size: 18px;
    --tw-leading: 1.5;
    line-height: 1.5;
  }
  .portalcard p {
    font-size: 12px;
  }
  .portalcardicon {
    display: grid;
    height: 42px;
    width: 42px;
    place-items: center;
    border-radius: 12px;
    background-color: #f1f5e7;
    font-size: 23px;
    color: #79925d;
  }
  .portalstep {
    margin: 23px 0;
    display: flex;
    align-items: flex-start;
    gap: 13px;
  }
  .portalstep:before {
    display: grid;
    height: 24px;
    width: 24px;
    flex-shrink: 0;
    place-items: center;
    border-radius: calc(infinity * 1px);
    background-color: #e9efde;
    color: #6c8955;
    content: '✓';
    font-size: 11px;
  }
  .portalstep.pending:before {
    background-color: #f1f3ed;
    color: #a2ad96;
    content: '○';
  }
  .portalfooter {
    margin: 35px 0 0;
    display: flex;
    justify-content: space-between;
    gap: 15px;
    font-size: 11px;
    color: #99a28f;
    padding-top: 23px;
    border-top: 1px solid var(--line);
  }
  .portalempty {
    border-radius: 10px;
    background-color: var(--color-white);
    padding: 35px;
    text-align: center;
    border: 1px solid var(--line);
  }
  .portalempty h2 {
    margin: 10px 0;
  }
  .claimsteps {
    margin: 25px 0;
    display: flex;
    justify-content: space-between;
    gap: 10px;
  }
  .claimsteps span {
    flex: 1;
    padding: 10px 0;
    font-size: 11px;
    color: #99a48e;
    border-bottom: 3px solid #e5eadb;
  }
  .claimsteps span.active {
    border-color: #76935a;
    color: #45633b;
  }
  .portalnotice {
    display: flex;
    gap: 12px;
    border-radius: 8px;
    background-color: #f0f3e8;
    padding: 13px 18px;
    color: #839075;
    border: 1px solid #e4e9da;
    font-size: 11px;
    --tw-leading: 1.7;
    line-height: 1.7;
  }
  .portalaction {
    display: flex;
    cursor: pointer;
    align-items: center;
    gap: 15px;
    padding: 18px 23px;
    border-bottom: 1px solid var(--line);
  }
  .portalaction:hover {
    background-color: #fafcf5;
  }
  .portalaction>div {
    flex: 1;
  }
  .portalaction p {
    margin-top: 5px;
    font-size: 11px;
  }
  .portalsheet {
    margin: auto;
    max-width: 800px;
    padding: 28px;
  }
  .portalconversation {
    cursor: pointer;
    padding: 23px;
    border-bottom: 1px solid var(--line);
  }
  .portalconversation:hover {
    background-color: #fafcf5;
  }
  .bubble {
    margin: 20px 0;
    max-width: 90%;
    border-radius: 12px 12px 12px 0;
    background-color: #edf2e3;
    padding: 18px;
    white-space: pre-wrap;
    font-size: 12px;
    --tw-leading: 1.9;
    line-height: 1.9;
  }
  .bubble.customer {
    margin-left: auto;
    border-radius: 12px 12px 0 12px;
    background-color: #f3f5ee;
  }
  .portaltimes {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
  .portaltimes label {
    cursor: pointer;
    border-radius: 7px;
    background-color: var(--color-white);
    padding: 12px 15px;
    border: 1px solid var(--line);
  }
  .portalprofilegrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .customer-mode .drawer {
    width: min(620px, 100%);
  }
  .portalhelp summary {
    cursor: pointer;
    padding: 19px 22px;
    --tw-leading: 1.7;
    line-height: 1.7;
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .portalhelp details {
    margin-bottom: 13px;
    border-radius: 9px;
    background-color: var(--color-white);
    border: 1px solid var(--line);
  }
  .portalhelp details p {
    padding: 0 22px 20px;
    font-size: 12px;
  }
  .portal-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
  }
  .portalsuccess {
    margin: 22px 0;
    border-radius: 10px;
    background-color: #eaf1df;
    padding: 25px;
    text-align: center;
  }
  .portalsuccess h2 {
    margin: 15px 0;
    font-size: 20px;
  }
  .portalstatus {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    color: #849476;
  }
  .portalstatus:before {
    height: 6px;
    width: 6px;
    border-radius: calc(infinity * 1px);
    background-color: #91a775;
    content: '';
  }
  @media (max-width:800px) {
    .portalcolumns {
      grid-template-columns: 1fr;
    }
    .portalmotif {
      display: none;
    }
    .portalcards {
      grid-template-columns: 1fr 1fr;
    }
    .portalwelcome {
      padding: 25px;
    }
    .portalwelcome h1 {
      font-size: 27px;
    }
    .portalstats {
      gap: 10px;
    }
    .portalstat {
      padding: 16px;
    }
    .customerbar {
      flex-wrap: wrap;
    }
    body.customer-mode header {
      padding: 16px 22px;
    }
    .portalprofilegrid {
      grid-template-columns: 1fr;
    }
  }
  @media (max-width:560px) {
    .portalcards {
      grid-template-columns: 1fr;
    }
    .portalstats {
      grid-template-columns: 1fr 1fr;
    }
    .portalwelcome h1 {
      font-size: 25px;
    }
    body.customer-mode .content {
      padding: 20px 16px;
    }
    .portalbrand small {
      font-size: 10px;
    }
    .customerbar {
      width: 100%;
      justify-content: space-between;
    }
    .customerbar select {
      max-width: 185px;
    }
    .customernav {
      gap: 3px;
    }
    .customernav button {
      padding: 11px 13px;
    }
    .portalwelcome {
      margin-top: 18px;
      padding: 24px 20px;
    }
    .portalfooter {
      flex-wrap: wrap;
    }
    .portalsheet {
      padding: 22px;
    }
    .portalcard {
      padding: 22px;
    }
  }
  body.customer-mode {
    --my-bg: #f2f7fb;
    --my-surface: #ffffff;
    --my-ink: #203a50;
    --my-muted: #708598;
    --my-primary: #256a9c;
    --my-on: #ffffff;
    --my-on-primary: #ffffff;
    --my-soft: #e5f0fa;
    --my-line: #d7e4ef;
    --my-scheme: light;
    --ink: var(--my-ink,#203b35);
    --muted: var(--my-muted,#7d8782);
    --green: var(--my-primary,#245c49);
    --line: var(--my-line,#e7ebe5);
    --bg: var(--my-bg,#f7f8f3);
    color: var(--my-ink);
    color-scheme: var(--my-scheme,light);
    background: var(--my-bg) !important;
  }
  .customer-mode header,.customer-mode .panel,.customer-mode .portalcard,.customer-mode .portalstat,.customer-mode .portalempty,.customer-mode .drawer,.customer-mode .paper,.customer-mode .portalhelp details {
    border-color: var(--my-line) !important;
    color: var(--my-ink) !important;
    background: var(--my-surface) !important;
  }
  .customer-mode p,.customer-mode .small,.customer-mode .sub,.customer-mode .clientfield span,.customer-mode .field {
    color: var(--my-muted) !important;
  }
  .customer-mode h1,.customer-mode h2,.customer-mode b,.customer-mode strong {
    color: var(--my-ink);
  }
  .customer-mode .portalwelcome,.customer-mode .banner,.customer-mode .detailbox,.customer-mode .portalstat:hover,.customer-mode .signbox,.customer-mode .portalsuccess {
    border-color: var(--my-line) !important;
    background: var(--my-soft) !important;
  }
  .customer-mode .portalnotice,.customer-mode .notice {
    border-color: var(--my-line) !important;
    color: var(--my-muted) !important;
    background: var(--my-soft) !important;
  }
  .customer-mode .customernav button {
    color: var(--my-muted);
  }
  .customer-mode .customernav button.active {
    color: var(--my-primary) !important;
    background: var(--my-soft) !important;
  }
  .customer-mode button.primary {
    color: var(--my-on-primary) !important;
    background: var(--my-primary) !important;
  }
  .customer-mode a.portalstat,.customer-mode a.tab,.customer-mode a.secondary,.customer-mode a.link {
    text-decoration: none;
  }
  .customer-mode a.portalstat {
    display: block;
    color: inherit;
  }
  .customer-mode a.secondary {
    display: inline-block;
  }
  .customer-mode .secondary,.customer-mode input,.customer-mode select,.customer-mode textarea {
    border-color: var(--my-line) !important;
    color: var(--my-ink) !important;
    background: var(--my-surface) !important;
  }
  .customer-mode .link {
    color: var(--my-primary) !important;
  }
  .customer-mode .badge,.customer-mode .circle,.customer-mode .avatar,.customer-mode .portalcardicon,.customer-mode .portalstep:before {
    color: var(--my-primary) !important;
    background: var(--my-soft) !important;
  }
  .customer-mode .portalstep.pending:before {
    color: var(--my-muted) !important;
    background: var(--my-bg) !important;
  }
  .customer-mode .portalmotif {
    color: var(--my-primary) !important;
    background: var(--my-line) !important;
  }
  .customer-mode .portalaction:hover,.customer-mode .portalconversation:hover,.customer-mode tbody tr:hover {
    background: var(--my-soft) !important;
  }
  .customer-mode th {
    color: var(--my-muted) !important;
    background: var(--my-soft) !important;
  }
  .customer-mode td,.customer-mode .portalaction,.customer-mode .task,.customer-mode .detailrow,.customer-mode .clientfield,.customer-mode .contactrow {
    border-color: var(--my-line) !important;
  }
  .customer-mode .portalprofilegrid .detailbox,.customer-mode .bubble,.customer-mode .bubble.customer,.customer-mode .requestitem.complete {
    background: var(--my-soft) !important;
  }
  .customer-mode .portalfooter,.customer-mode .smalltag,.customer-mode .portalstatus,.customer-mode .portalbrand small {
    color: var(--my-muted) !important;
  }
  .customer-mode .close {
    color: var(--my-ink);
    background: var(--my-soft);
  }
  .customer-mode .demo {
    border-color: var(--my-line);
    color: var(--my-muted);
  }
  .customer-mode .logo>span {
    color: var(--my-primary) !important;
  }
  .customer-mode .claimsteps span.active {
    border-color: var(--my-primary);
    color: var(--my-primary);
  }
  .customer-mode .signmark {
    color: var(--my-primary);
  }
  .customer-mode input[type=checkbox],.customer-mode input[type=radio] {
    accent-color: var(--my-primary);
  }
  .my-theme-button {
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 20px;
    padding: 8px 12px;
    border: 1px solid var(--my-line);
    font-size: 11px;
    white-space: nowrap;
    color: var(--my-ink);
    background: var(--my-soft);
  }
  .theme-dot {
    display: inline-block;
    height: 12px;
    width: 12px;
    border-radius: calc(infinity * 1px);
    background: var(--my-primary);
  }
  .theme-grid {
    margin: 22px 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  .theme-option {
    border-radius: 11px;
    padding: 15px;
    color: var(--my-ink);
    background: var(--my-surface);
    border: 2px solid var(--my-line);
    text-align: left;
  }
  .theme-option.selected {
    border-color: var(--my-primary);
  }
  .theme-preview {
    margin-bottom: 12px;
    display: flex;
    height: 76px;
    gap: 8px;
    overflow: hidden;
    border-radius: 7px;
    padding: 11px;
    border: 1px solid #00000008;
  }
  .theme-preview-side {
    width: 18px;
    border-radius: 3px;
    opacity: .6;
  }
  .theme-preview-content {
    flex: 1;
    border-radius: 4px;
    padding: 9px;
  }
  .theme-preview-line {
    margin-bottom: 7px;
    height: 4px;
    width: 70%;
    border-radius: 3px;
    opacity: .55;
  }
  .theme-preview-button {
    height: 12px;
    width: 35%;
    border-radius: 3px;
  }
  .mode-switch {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .mode-switch button {
    border-radius: 8px;
    padding: 17px;
    color: var(--my-ink);
    background: var(--my-surface);
    border: 2px solid var(--my-line);
  }
  .mode-switch button.selected {
    border-color: var(--my-primary);
    background: var(--my-soft);
  }
  .customer-mode .theme-option .small {
    font-size: 10px;
  }
  .theme-footer {
    padding: 15px 0;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    color: var(--my-muted);
  }
  .customer-mode .customerbar {
    flex-wrap: wrap;
    gap: 11px;
  }
  .theme-access {
    margin-top: 22px;
    padding-top: 22px;
    border-top: 1px solid var(--my-line);
  }
  @media (max-width:600px) {
    .my-theme-button {
      padding: 8px 11px;
    }
    .customerbar .demo {
      display: none;
    }
    .customerbar {
      justify-content: flex-start;
    }
    .theme-grid {
      gap: 10px;
    }
    .theme-option {
      padding: 12px;
    }
  }
  body.broker-colors {
    --ink: var(--my-ink,#203b35);
    --muted: var(--my-muted,#7d8782);
    --green: var(--my-primary,#245c49);
    --line: var(--my-line,#e7ebe5);
    --bg: var(--my-bg,#f7f8f3);
    color: var(--my-ink);
    color-scheme: var(--my-scheme,light);
    background: var(--my-bg) !important;
  }
  .broker-colors header,.broker-colors .panel,.broker-colors .portalcard,.broker-colors .portalstat,.broker-colors .portalempty,.broker-colors .drawer,.broker-colors .paper,.broker-colors .portalhelp details {
    border-color: var(--my-line) !important;
    color: var(--my-ink) !important;
    background: var(--my-surface) !important;
  }
  .broker-colors p,.broker-colors .small,.broker-colors .sub,.broker-colors .clientfield span,.broker-colors .field {
    color: var(--my-muted) !important;
  }
  .broker-colors h1,.broker-colors h2,.broker-colors b,.broker-colors strong {
    color: var(--my-ink);
  }
  .broker-colors .portalwelcome,.broker-colors .banner,.broker-colors .detailbox,.broker-colors .portalstat:hover,.broker-colors .signbox,.broker-colors .portalsuccess {
    border-color: var(--my-line) !important;
    background: var(--my-soft) !important;
  }
  .broker-colors .portalnotice,.broker-colors .notice {
    border-color: var(--my-line) !important;
    color: var(--my-muted) !important;
    background: var(--my-soft) !important;
  }
  .broker-colors .customernav button {
    color: var(--my-muted);
  }
  .broker-colors .customernav button.active {
    color: var(--my-primary) !important;
    background: var(--my-soft) !important;
  }
  .broker-colors button.primary {
    color: var(--my-on-primary) !important;
    background: var(--my-primary) !important;
  }
  .broker-colors .secondary,.broker-colors input,.broker-colors select,.broker-colors textarea {
    border-color: var(--my-line) !important;
    color: var(--my-ink) !important;
    background: var(--my-surface) !important;
  }
  .broker-colors .link {
    color: var(--my-primary) !important;
  }
  .broker-colors .badge,.broker-colors .circle,.broker-colors .avatar,.broker-colors .portalcardicon,.broker-colors .portalstep:before {
    color: var(--my-primary) !important;
    background: var(--my-soft) !important;
  }
  .broker-colors .portalstep.pending:before {
    color: var(--my-muted) !important;
    background: var(--my-bg) !important;
  }
  .broker-colors .portalmotif {
    color: var(--my-primary) !important;
    background: var(--my-line) !important;
  }
  .broker-colors .portalaction:hover,.broker-colors .portalconversation:hover,.broker-colors tbody tr:hover {
    background: var(--my-soft) !important;
  }
  .broker-colors th {
    color: var(--my-muted) !important;
    background: var(--my-soft) !important;
  }
  .broker-colors td,.broker-colors .portalaction,.broker-colors .task,.broker-colors .detailrow,.broker-colors .clientfield,.broker-colors .contactrow {
    border-color: var(--my-line) !important;
  }
  .broker-colors .portalprofilegrid .detailbox,.broker-colors .bubble,.broker-colors .bubble.customer,.broker-colors .requestitem.complete {
    background: var(--my-soft) !important;
  }
  .broker-colors .portalfooter,.broker-colors .smalltag,.broker-colors .portalstatus,.broker-colors .portalbrand small {
    color: var(--my-muted) !important;
  }
  .broker-colors .close {
    color: var(--my-ink);
    background: var(--my-soft);
  }
  .broker-colors .demo {
    border-color: var(--my-line);
    color: var(--my-muted);
  }
  .broker-colors .logo>span {
    color: var(--my-primary) !important;
  }
  .broker-colors .claimsteps span.active {
    border-color: var(--my-primary);
    color: var(--my-primary);
  }
  .broker-colors .signmark {
    color: var(--my-primary);
  }
  .broker-colors input[type=checkbox],.broker-colors input[type=radio] {
    accent-color: var(--my-primary);
  }
  .my-theme-button {
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 20px;
    padding: 8px 12px;
    border: 1px solid var(--my-line);
    font-size: 11px;
    white-space: nowrap;
    color: var(--my-ink);
    background: var(--my-soft);
  }
  .theme-dot {
    display: inline-block;
    height: 12px;
    width: 12px;
    border-radius: calc(infinity * 1px);
    background: var(--my-primary);
  }
  .theme-grid {
    margin: 22px 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  .theme-option {
    border-radius: 11px;
    padding: 15px;
    color: var(--my-ink);
    background: var(--my-surface);
    border: 2px solid var(--my-line);
    text-align: left;
  }
  .theme-option.selected {
    border-color: var(--my-primary);
  }
  .theme-preview {
    margin-bottom: 12px;
    display: flex;
    height: 76px;
    gap: 8px;
    overflow: hidden;
    border-radius: 7px;
    padding: 11px;
    border: 1px solid #00000008;
  }
  .theme-preview-side {
    width: 18px;
    border-radius: 3px;
    opacity: .6;
  }
  .theme-preview-content {
    flex: 1;
    border-radius: 4px;
    padding: 9px;
  }
  .theme-preview-line {
    margin-bottom: 7px;
    height: 4px;
    width: 70%;
    border-radius: 3px;
    opacity: .55;
  }
  .theme-preview-button {
    height: 12px;
    width: 35%;
    border-radius: 3px;
  }
  .mode-switch {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .mode-switch button {
    border-radius: 8px;
    padding: 17px;
    color: var(--my-ink);
    background: var(--my-surface);
    border: 2px solid var(--my-line);
  }
  .mode-switch button.selected {
    border-color: var(--my-primary);
    background: var(--my-soft);
  }
  .broker-colors .theme-option .small {
    font-size: 10px;
  }
  .theme-footer {
    padding: 15px 0;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    color: var(--my-muted);
  }
  .broker-colors .customerbar {
    flex-wrap: wrap;
    gap: 11px;
  }
  .theme-access {
    margin-top: 22px;
    padding-top: 22px;
    border-top: 1px solid var(--my-line);
  }
  @media (max-width:600px) {
    .my-theme-button {
      padding: 8px 11px;
    }
    .customerbar .demo {
      display: none;
    }
    .customerbar {
      justify-content: flex-start;
    }
    .theme-grid {
      gap: 10px;
    }
    .theme-option {
      padding: 12px;
    }
  }
  body.broker-colors {
    --my-bg: #f7f8f3;
    --my-surface: #ffffff;
    --my-ink: #203b35;
    --my-muted: #73816e;
    --my-primary: #356344;
    --my-on-primary: #ffffff;
    --my-soft: #edf2e3;
    --my-line: #dfe7d7;
    --my-scheme: light;
    --ink: var(--my-ink);
    --muted: var(--my-muted);
    --green: var(--my-primary);
    --line: var(--my-line);
    --bg: var(--my-bg);
    color: var(--my-ink);
    color-scheme: var(--my-scheme);
    background: var(--my-bg);
  }
  .broker-colors aside {
    border-color: var(--my-line);
    background: var(--my-surface);
  }
  .broker-colors .stat,.broker-colors .column,.broker-colors .card,.broker-colors .workcard,.broker-colors .docstat,.broker-colors .clientmetrics,.broker-colors .mailworkspace,.broker-colors .mailitem,.broker-colors .mailfolders,.broker-colors .calgrid,.broker-colors .calcell,.broker-colors .caldayhead,.broker-colors .workintro,.broker-colors .focusbar {
    border-color: var(--my-line);
    color: var(--my-ink);
    background: var(--my-surface) !important;
  }
  .broker-colors .workintro,.broker-colors .focusbar,.broker-colors .column,.broker-colors .calcell.today,.broker-colors .selectionbar,.broker-colors .worktabs,.broker-colors .segmented,.broker-colors .clientinitial,.broker-colors .changebox,.broker-colors .changebox.after,.broker-colors .banner,.broker-colors .mailitem.active {
    border-color: var(--my-line);
    background: var(--my-soft) !important;
  }
  .broker-colors .nav {
    color: var(--my-muted);
  }
  .broker-colors .nav.active,.broker-colors .worktabs button.active,.broker-colors .segmented button.active,.broker-colors .nav b {
    color: var(--my-primary);
    background: var(--my-soft);
  }
  .broker-colors .tab,.broker-colors .worktabs button {
    color: var(--my-muted);
  }
  .broker-colors .tab.active {
    border-color: var(--my-primary);
    color: var(--my-primary);
  }
  .broker-colors .mailfilter,.broker-colors .search {
    color: var(--my-ink);
    background: var(--my-surface);
  }
  .broker-colors .clientfield b,.broker-colors .stat .stathead {
    color: var(--my-ink);
  }
  .broker-colors .theme-option,.broker-colors .mode-switch button {
    color: var(--my-ink);
    background: var(--my-surface);
  }
  .broker-colors .theme-option.selected,.broker-colors .mode-switch button.selected {
    border-color: var(--my-primary);
  }
  .broker-colors .my-theme-button {
    color: var(--my-ink);
  }
  .broker-colors .claimempty {
    background: var(--my-bg);
  }
  .broker-colors .chart .bar {
    background: var(--my-primary);
  }
  .broker-colors .topright {
    gap: 12px;
  }
  .broker-colors .stat .trend {
    color: var(--my-primary);
  }
  .focus-task {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 19px 0;
    border-bottom: 1px solid var(--line);
  }
  .focus-task input {
    margin-top: 4px;
    accent-color: var(--green);
  }
  .feature-actions {
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
  }
  .insurance-pass {
    margin: 22px 0;
    border-radius: 14px;
    padding: 27px;
    background: var(--my-soft);
    border: 1px solid var(--my-line);
  }
  .insurance-pass .logo {
    margin: 0 0 25px;
    font-size: 27px;
  }
  .insurance-pass h2 {
    font-size: 22px;
  }
  .extra-header,.broker-colors .extra-header {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  a.office,a.primary,a.secondary {
    color: inherit;
  }
  a.primary {
    display: inline-block;
    border-radius: 7px;
    padding: 12px 17px;
    font-weight: 600;
    color: var(--color-white);
    background: var(--green);
  }
  .broker-colors a.primary {
    color: var(--my-on-primary) !important;
    background: var(--my-primary) !important;
  }
  a.secondary {
    display: inline-block;
  }
  aside .office {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding: 8px 10px;
    overflow: hidden;
    align-items: center;
  }
  aside .office > .office-logo,
  aside .office > .avatar,
  aside .office > div:not(.avatar) {
    flex: 1 1 0;
    width: 50%;
    max-width: 50%;
    min-width: 0;
  }
  aside .office > .office-logo {
    display: block;
    height: auto;
    max-height: 56px;
    object-fit: contain;
    object-position: left center;
  }
  aside .office > .avatar {
    height: 40px;
    object-fit: contain;
    object-position: left center;
  }
  aside .office b {
    display: block;
    font-size: 12px;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }
  aside .office .sub {
    margin-top: 2px;
    font-size: 9px;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }
  .ad-shell {
    --ad-soft: var(--my-soft, #eef2e9);
    --ad-surface: var(--my-surface, #fff);
  }
  .ad-kicker {
    font-size: 9px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--green);
    font-weight: 700;
  }
  .ad-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
  }
  .ad-card {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 23px;
    background: var(--ad-surface);
  }
  .tg-priorities {
    margin: 0 0 24px;
  }
  .tg-priority-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 15px;
  }
  .tg-priority-title h2 {
    font-size: 17px;
  }
  .tg-priority {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 22px;
    background: var(--ad-surface);
  }
  .tg-priority h3 {
    font-size: 15px;
    margin: 11px 0 9px;
    line-height: 1.5;
  }
  .tg-priority p {
    font-size: 11px;
    line-height: 1.8;
    margin-bottom: 18px;
  }
  .tg-count {
    font: 500 30px Georgia, serif;
    color: var(--green);
    opacity: .5;
  }
  @media (max-width: 1100px) {
    .ad-grid {
      grid-template-columns: 1fr;
    }
  }
  .theme-option {
    color: var(--ink);
  }
  .feature-small {
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    color: var(--muted);
  }
  .policy-pass {
    background: linear-gradient(125deg,var(--my-soft,#eaf0df),var(--my-surface,#fff));
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    padding: 28px;
    border: 1px solid var(--line);
  }
  .policy-pass:after {
    position: absolute;
    top: 40px;
    right: 20px;
    font-size: 110px;
    color: var(--ink);
    opacity: .07;
    content: '◈';
    pointer-events: none;
  }
  .policy-pass .pass-title {
    margin: 20px 0 10px;
    max-width: 85%;
    --tw-leading: 1.4;
    line-height: 1.4;
    font: 700 25px Manrope;
  }
  .policy-pass .pass-meta {
    font-size: 10px;
    --tw-tracking: 1.5px;
    letter-spacing: 1.5px;
    color: var(--muted);
  }
  .policy-pass .pass-id {
    margin: 23px 0;
    --tw-tracking: 1px;
    letter-spacing: 1px;
    font: 600 18px Manrope;
  }
  .pass-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
  }
  .pass-fields small {
    margin-bottom: 6px;
    display: block;
    font-size: 10px;
    color: var(--muted);
  }
  .pass-warning {
    margin-top: 23px;
    padding-top: 15px;
    font-size: 10px;
    --tw-leading: 1.7;
    line-height: 1.7;
    color: var(--muted);
    border-top: 1px solid var(--line);
  }
  .pass-list {
    margin-top: 24px;
  }
  .pass-list .panelhead {
    flex-wrap: wrap;
    gap: 10px;
  }
  .pass-list .pass-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 17px 23px;
    border-top: 1px solid var(--line);
  }
  .pass-row>div {
    flex: 1;
  }
  .signature-method {
    display: flex;
    width: 100%;
    gap: 15px;
    padding: 19px;
    text-align: left;
    color: var(--ink);
    background: var(--my-surface,#fff);
    margin: 12px 0;
    align-items: center;
    border-radius: 10px;
    border: 1px solid var(--line);
  }
  .signature-method:hover {
    border-color: var(--green);
  }
  .signature-method b {
    display: block;
  }
  .signature-method p {
    margin-top: 7px;
    font-size: 11px;
  }
  .method-symbol {
    display: grid;
    height: 42px;
    width: 42px;
    border-radius: 10px;
    color: var(--green);
    background: var(--my-soft,#eef3e6);
    flex-shrink: 0;
    place-items: center;
    font-size: 20px;
  }
  .mini-checks label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
  }
  .mini-checks input {
    margin-top: 4px;
  }
  .policy-lab {
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
  }
  .pass-stats {
    margin: 18px 0;
    display: flex;
    gap: 10px;
  }
  .pass-stats>div {
    flex: 1;
    border-radius: 8px;
    padding: 15px;
    background: var(--my-soft,#f0f3e6);
  }
  .pass-stats b {
    margin-bottom: 7px;
    display: block;
  }
  .batch-item {
    display: flex;
    gap: 12px;
    padding: 18px 0;
    --tw-leading: 1.8;
    line-height: 1.8;
    border-bottom: 1px solid var(--line);
  }
  .download-log {
    padding: 13px 0;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    border-bottom: 1px solid var(--line);
  }
  @media (max-width:600px) {
    .policy-pass {
      padding: 22px;
    }
    .policy-pass .pass-title {
      font-size: 21px;
    }
    .pass-row {
      flex-wrap: wrap;
    }
    .pass-fields {
      gap: 13px;
    }
  }
  .policy-pass.premium-pass {
    padding: 30px;
    color: var(--card-ink) !important;
    background: var(--card-bg) !important;
    border: 1px solid var(--card-line);
    isolation: isolate;
    min-height: 320px;
    border-radius: 22px;
    box-shadow: 0 22px 45px #00000015;
  }
  .premium-pass:after {
    top: 30px;
    right: calc(12px * -1);
    font-size: 230px;
    color: var(--card-ink);
    opacity: .055;
    content: '◈';
  }
  .premium-pass:before {
    position: absolute;
    inset: 0px;
    content: '';
    background: linear-gradient(115deg,transparent 30%,var(--card-accent) 180%);
    z-index: calc(1 * -1);
    opacity: .22;
  }
  .premium-pass h2,.premium-pass b,.premium-pass strong,.premium-pass p {
    color: var(--card-ink) !important;
  }
  .premium-pass .pass-label {
    font-size: 9px;
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    --tw-tracking: 1.8px;
    letter-spacing: 1.8px;
    color: var(--card-muted) !important;
  }
  .premium-pass .pass-brand {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .premium-pass .pass-wordmark {
    --tw-tracking: calc(1px * -1);
    letter-spacing: calc(1px * -1);
    color: var(--card-ink);
    font: 800 24px Manrope;
  }
  .premium-pass .pass-wordmark em {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--card-accent);
    font-style: normal;
  }
  .premium-pass .pass-symbol {
    display: grid;
    height: 36px;
    width: 46px;
    place-items: center;
    border-radius: 9px;
    border: 1px solid var(--card-line);
    font-size: 23px;
    color: var(--card-accent);
  }
  .premium-pass .pass-heading {
    margin: 27px 0 6px;
    max-width: 90%;
    --tw-tracking: calc(.7px * -1);
    letter-spacing: calc(.7px * -1);
    font: 700 26px Manrope;
  }
  .premium-pass .pass-holder {
    font-size: 12px;
    opacity: .8;
  }
  .premium-pass .pass-number {
    margin: 24px 0;
    --tw-tracking: 2px;
    letter-spacing: 2px;
    font: 500 17px Manrope;
  }
  .premium-pass .pass-bottom {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 17px;
    padding-top: 19px;
    border-top: 1px solid var(--card-line);
  }
  .premium-pass .pass-bottom strong {
    margin-top: 7px;
    display: block;
    font-size: 11px;
    --tw-tracking: 0;
    letter-spacing: 0;
  }
  .premium-pass .pass-fineprint {
    margin-top: 23px;
    font-size: 8px;
    --tw-tracking: .8px;
    letter-spacing: .8px;
    color: var(--card-muted) !important;
  }
  .card-theme-label {
    margin: 17px 0;
    font-size: 10px;
    --tw-leading: 1.8;
    line-height: 1.8;
    color: var(--muted);
  }
  .signed-paper {
    border-radius: 10px;
    padding: 28px;
    --tw-leading: 1.8;
    line-height: 1.8;
    background: var(--my-surface,#fff);
    border: 1px solid var(--line);
    box-shadow: 0 15px 40px #0000000a;
  }
  .signed-paper .doc-kicker {
    margin-bottom: 20px;
    font-size: 9px;
    --tw-tracking: 1.5px;
    letter-spacing: 1.5px;
    color: var(--muted);
  }
  .signed-paper h2 {
    margin: 12px 0;
    font-size: 22px;
  }
  .signature-complete {
    margin-top: 28px;
    border-radius: 9px;
    padding: 22px;
    border-left: 4px solid var(--green);
    border: 1px solid var(--line);
    background: var(--my-soft,#eff4e7);
  }
  .signature-complete .signmark {
    margin: 16px 0 8px;
    font-size: 30px;
  }
  .signature-data {
    font-size: 10px;
    --tw-leading: 1.9;
    line-height: 1.9;
    color: var(--muted);
  }
  .demo-sign-banner {
    margin: 23px 0;
    display: flex;
    align-items: center;
    gap: 18px;
    border-radius: 12px;
    padding: 25px;
    border: 1px solid var(--line);
    background: var(--my-soft,#edf2e4);
  }
  .demo-sign-banner>div {
    flex: 1;
  }
  .demo-sign-banner p {
    margin-top: 9px;
    font-size: 12px;
  }
  .signature-timeline {
    padding: 14px 0;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    border-bottom: 1px solid var(--line);
  }
  @media (max-width:600px) {
    .premium-pass {
      padding: 23px !important;
    }
    .premium-pass .pass-heading {
      font-size: 22px;
    }
    .premium-pass .pass-bottom {
      grid-template-columns: 1fr 1fr;
    }
    .demo-sign-banner {
      flex-wrap: wrap;
    }
    .signed-paper {
      padding: 22px;
    }
  }
  .premium-pass.illustrated-pass {
    min-height: 370px;
    padding: 30px 31px !important;
  }
  .illustrated-pass:after {
    display: none;
  }
  .illustrated-pass .pass-brand {
    position: relative;
    z-index: 2;
  }
  .illustrated-pass .pass-heading {
    position: relative;
    z-index: 2;
    max-width: 72%;
    font-size: 25px;
  }
  .illustrated-pass .pass-holder,.illustrated-pass .pass-number {
    position: relative;
    z-index: 2;
  }
  .card-artwork {
    pointer-events: none;
    position: absolute;
    top: 106px;
    right: calc(10px * -1);
    height: 155px;
    width: 235px;
    opacity: .20;
    z-index: 0;
    color: var(--card-accent);
  }
  .card-artwork svg {
    height: 100%;
    width: 100%;
  }
  .card-watermark {
    position: absolute;
    top: 58px;
    right: 25px;
    max-width: 65%;
    --tw-tracking: calc(1.5px * -1);
    letter-spacing: calc(1.5px * -1);
    opacity: .065;
    font: 800 35px Manrope;
    pointer-events: none;
    transform: rotate(-7deg);
    text-align: right;
    --tw-leading: 1.15;
    line-height: 1.15;
    color: var(--card-ink);
  }
  .illustrated-pass .pass-bottom {
    position: relative;
    z-index: 2;
    margin-top: 32px;
    border-radius: 12px;
    padding: 20px 17px;
    background: var(--card-panel);
    border: 1px solid var(--card-line);
  }
  .pass-broker {
    margin-top: 6px;
    font-size: 9px;
    --tw-tracking: .6px;
    letter-spacing: .6px;
    color: var(--card-muted);
  }
  .illustrated-pass .pass-label {
    font-size: 8px;
  }
  .card-brand-option {
    margin: 16px 0 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .card-brand-option button {
    padding: 9px 12px;
    font-size: 10px;
    background: var(--my-surface,#fff);
    border: 1px solid var(--line);
    border-radius: 6px;
    color: var(--ink);
  }
  .card-brand-option button.selected {
    border-color: var(--green);
    color: var(--green);
  }
  .card-style-note {
    margin: 10px 0 15px;
    font-size: 10px;
    --tw-leading: 1.8;
    line-height: 1.8;
    color: var(--muted);
  }
  .illustrated-pass .pass-fineprint {
    font-size: 7px;
    --tw-tracking: .5px;
    letter-spacing: .5px;
  }
  .illustrated-pass .pass-number {
    max-width: 68%;
    font-size: 16px;
    --tw-tracking: 1.5px;
    letter-spacing: 1.5px;
  }
  @media (max-width:600px) {
    .premium-pass.illustrated-pass {
      padding: 25px 23px !important;
    }
    .illustrated-pass .pass-heading {
      max-width: 75%;
      font-size: 21px;
    }
    .card-artwork {
      top: 120px;
      right: calc(17px * -1);
      width: 185px;
      opacity: .17;
    }
    .card-watermark {
      right: 18px;
      font-size: 28px;
    }
    .illustrated-pass .pass-bottom {
      gap: 16px;
      padding: 15px 13px;
    }
    .pass-broker {
      font-size: 8px;
    }
  }
  .illustrated-pass .card-artwork {
    top: 123px;
    right: 5px;
    height: 145px;
    width: 205px;
    opacity: .78;
  }
  .illustrated-pass .card-watermark {
    top: 61px;
    right: 25px;
    font-size: 43px;
    opacity: .19;
  }
  .illustrated-pass .pass-heading {
    max-width: 63%;
  }
  .illustrated-pass .pass-holder {
    max-width: 63%;
  }
  .policy-gallery-card {
    position: relative;
    margin: 17px 0;
    display: block;
    width: 100%;
    border-radius: 12px;
    padding: 22px;
    text-align: left;
    border: 1px solid var(--line);
    min-height: 155px;
    overflow: hidden;
    color: var(--gallery-ink);
    background: var(--gallery-bg);
  }
  .policy-gallery-card .gallery-art {
    position: absolute;
    top: 27px;
    right: 4px;
    height: 110px;
    width: 160px;
    color: var(--gallery-primary);
    opacity: .85;
    pointer-events: none;
  }
  .policy-gallery-card .gallery-wm {
    position: absolute;
    top: 13px;
    right: 18px;
    color: var(--gallery-primary);
    opacity: .3;
    font: 800 22px Manrope;
    pointer-events: none;
  }
  .policy-gallery-card b {
    margin: 19px 0 8px;
    display: block;
    max-width: 65%;
    font-size: 15px;
    color: var(--gallery-ink) !important;
  }
  .policy-gallery-card p {
    max-width: 63%;
    font-size: 10px;
    color: var(--gallery-ink) !important;
    opacity: .75;
  }
  .policy-gallery-card .gallery-action {
    margin-top: 19px;
    display: block;
    font-size: 10px;
    color: var(--gallery-primary);
  }
  .policy-gallery-card .gallery-label {
    font-size: 8px;
    --tw-tracking: 1.6px;
    letter-spacing: 1.6px;
    color: var(--gallery-primary);
  }
  @media (max-width:600px) {
    .illustrated-pass .card-artwork {
      top: 140px;
      right: calc(7px * -1);
      width: 170px;
    }
    .illustrated-pass .card-watermark {
      right: 20px;
      font-size: 32px;
    }
    .illustrated-pass .pass-heading {
      max-width: 65%;
    }
    .policy-gallery-card .gallery-art {
      right: 0px;
      width: 135px;
    }
    .policy-gallery-card b {
      font-size: 14px;
    }
  }
  .vp-lockup {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    --tw-leading: 1.1;
    line-height: 1.1;
    color: var(--green,#244e43);
  }
  .vp-emblem {
    display: inline-block;
    height: 44px;
    width: 38px;
    flex-shrink: 0;
  }
  .vp-emblem svg {
    height: 100%;
    width: 100%;
  }
  .vp-name {
    --tw-tracking: calc(.3px * -1);
    letter-spacing: calc(.3px * -1);
    font: 500 17px Georgia,serif;
  }
  .vp-tagline {
    margin-top: 7px;
    display: block;
    --tw-tracking: 1.5px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    opacity: .7;
    font: 500 7px Manrope,sans-serif;
  }
  .office .vp-lockup {
    color: inherit;
  }
  .office {
    padding: 15px 0;
  }
  .office .vp-name {
    font-size: 14px;
  }
  .office .vp-tagline {
    font-size: 6px;
    --tw-tracking: 1px;
    letter-spacing: 1px;
  }
  .office .vp-emblem {
    width: 31px;
  }
  .portalbrand {
    gap: 25px !important;
  }
  .portalbrand .vp-lockup {
    color: var(--ink);
  }
  .portalbrand .vp-name {
    font-size: 18px;
  }
  .portalfooter .vp-emblem {
    height: 30px;
    width: 26px;
  }
  .portalfooter .vp-name {
    font-size: 14px;
  }
  .pass-broker .vp-lockup {
    gap: 6px;
    color: var(--card-ink);
  }
  .pass-broker .vp-name {
    font-size: 13px;
  }
  .pass-broker .vp-tagline {
    font-size: 5px;
    --tw-tracking: .7px;
    letter-spacing: .7px;
  }
  .pass-broker .vp-emblem {
    height: 36px;
    width: 30px;
  }
  .illustrated-pass .card-watermark .vp-emblem {
    height: 110px;
    width: 100px;
  }
  .illustrated-pass .card-watermark {
    top: 48px;
  }
  .gallery-wm .vp-emblem {
    height: 53px;
    width: 47px;
  }
  .policy-gallery-card .gallery-art {
    top: 43px;
  }
  .vp-download {
    margin-top: 15px;
    font-size: 11px;
  }
  @media (max-width:600px) {
    .portalbrand {
      gap: 12px !important;
    }
    .portalbrand .vp-name {
      font-size: 14px;
    }
    .portalbrand .vp-tagline {
      font-size: 6px;
    }
    .portalbrand .vp-emblem {
      width: 28px;
    }
    .pass-broker .vp-name {
      font-size: 11px;
    }
    .pass-broker .vp-tagline {
      display: none;
    }
  }
  .ad-shell {
    --ad-soft: var(--my-soft,#eef2e9);
    --ad-surface: var(--my-surface,#fff);
  }
  .ad-kicker {
    font-size: 9px;
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    --tw-tracking: 2px;
    letter-spacing: 2px;
    color: var(--green);
    text-transform: uppercase;
  }
  .ad-hero {
    display: flex;
    gap: 22px;
    border-radius: 12px;
    padding: 27px 30px;
    background: var(--ad-soft);
    border: 1px solid var(--line);
    margin: 23px 0;
    align-items: center;
  }
  .ad-hero h2 {
    margin: 9px 0;
    --tw-tracking: calc(.7px * -1);
    letter-spacing: calc(.7px * -1);
    font: 600 23px Manrope;
  }
  .ad-hero p {
    max-width: 620px;
    font-size: 12px;
    --tw-leading: 1.8;
    line-height: 1.8;
  }
  .ad-hero-icon {
    display: grid;
    height: 64px;
    width: 64px;
    place-items: center;
    border-radius: calc(infinity * 1px);
    font-size: 32px;
    border: 1px solid var(--line);
    flex-shrink: 0;
    color: var(--green);
  }
  .ad-filter {
    margin: 20px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
  }
  .ad-filter label {
    font-size: 11px;
    color: var(--muted);
  }
  .ad-filter select {
    max-width: 270px;
  }
  .ad-tabs {
    margin-bottom: 24px;
    display: flex;
    gap: 5px;
    overflow: auto;
    padding: 0 0 10px;
    border-bottom: 1px solid var(--line);
  }
  .ad-tabs button {
    border-radius: 6px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    padding: 11px 14px;
    font-size: 11px;
    white-space: nowrap;
    color: var(--muted);
  }
  .ad-tabs button.active {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--ink);
    background: var(--ad-soft);
  }
  .ad-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 18px;
  }
  .ad-two {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 22px;
  }
  .ad-card {
    min-width: 0px;
    border-radius: 10px;
    padding: 23px;
    background: var(--ad-surface);
    border: 1px solid var(--line);
  }
  .ad-card h2 {
    margin: 12px 0 9px;
    font-size: 16px;
    --tw-leading: 1.5;
    line-height: 1.5;
  }
  .ad-card p {
    font-size: 12px;
    --tw-leading: 1.8;
    line-height: 1.8;
  }
  .ad-card .ad-actions {
    margin-top: 19px;
  }
  .ad-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
  }
  .ad-actions button {
    font-size: 11px;
  }
  .ad-stats {
    margin: 22px 0;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 12px;
  }
  .ad-stat {
    border-radius: 8px;
    padding: 18px;
    border: 1px solid var(--line);
  }
  .ad-stat strong {
    margin: 8px 0;
    display: block;
    font: 600 23px Manrope;
  }
  .ad-stat span {
    font-size: 10px;
    color: var(--muted);
  }
  .ad-listrow {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 17px 0;
    border-bottom: 1px solid var(--line);
  }
  .ad-listrow:last-child {
    border-bottom: 0;
  }
  .ad-listrow>div {
    min-width: 0px;
    flex: 1;
  }
  .ad-listrow p {
    margin-top: 6px;
    font-size: 11px;
  }
  .ad-listrow b {
    font-size: 12px;
  }
  .ad-dot {
    margin-top: 4px;
    height: 9px;
    width: 9px;
    flex-shrink: 0;
    border-radius: calc(infinity * 1px);
    background: var(--green);
  }
  .ad-check {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
    font-size: 12px;
    --tw-leading: 1.6;
    line-height: 1.6;
    border-bottom: 1px solid var(--line);
  }
  .ad-check input {
    accent-color: var(--green);
  }
  .ad-tablewrap {
    overflow: auto;
    border-radius: 10px;
    background: var(--ad-surface);
    border: 1px solid var(--line);
  }
  .ad-table {
    width: 100%;
    min-width: 680px;
    border-collapse: collapse;
  }
  .ad-table th {
    min-width: 160px;
  }
  .ad-table td,.ad-table th {
    padding: 18px;
    vertical-align: top;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    white-space: normal;
  }
  .ad-table td:first-child {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--muted);
  }
  .ad-table tr {
    cursor: default;
  }
  .ad-table .chosen {
    background: var(--ad-soft);
  }
  .ad-note {
    padding: 15px 18px;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    background: var(--ad-soft);
    border-left: 3px solid var(--green);
    margin: 18px 0;
    border-radius: 0 7px 7px 0;
  }
  .ad-empty {
    border-radius: 10px;
    padding: 40px;
    text-align: center;
    border: 1px dashed var(--line);
  }
  .ad-empty p {
    margin: 12px 0;
  }
  .ad-number {
    color: var(--green);
    font: 600 28px Manrope;
  }
  .ad-section-title {
    margin: 25px 0 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .ad-section-title h2 {
    font-size: 16px;
  }
  .ad-formgrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 16px;
  }
  .ad-formgrid .full {
    grid-column: 1 / -1;
  }
  .ad-summary {
    font-size: 12px;
    --tw-leading: 1.9;
    line-height: 1.9;
    white-space: pre-wrap;
  }
  .ad-quick {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    border-radius: 9px;
    padding: 18px 22px;
    border: 1px solid var(--line);
    margin: 20px 0;
    background: var(--ad-soft);
  }
  .ad-quick b {
    font-size: 13px;
  }
  .ad-quick p {
    margin-top: 5px;
    font-size: 11px;
  }
  .ad-date {
    font-size: 10px;
    color: var(--muted);
  }
  .ad-timeline {
    margin-left: 5px;
    padding-left: 20px;
    border-left: 1px solid var(--line);
  }
  .ad-timeline>div {
    position: relative;
    padding: 0 0 22px;
  }
  .ad-timeline>div:before {
    position: absolute;
    top: 5px;
    left: calc(25px * -1);
    height: 8px;
    width: 8px;
    border-radius: calc(infinity * 1px);
    content: '';
    background: var(--green);
  }
  .ad-timeline h3 {
    margin: 5px 0;
    font-size: 12px;
  }
  .ad-timeline p {
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
  }
  .ad-pill {
    margin: 4px 5px 0 0;
    display: inline-block;
    border-radius: 20px;
    padding: 6px 10px;
    font-size: 10px;
    border: 1px solid var(--line);
  }
  .ad-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }
  .ad-drawer h2 {
    margin: 25px 0 12px;
  }
  .ad-shell .fieldinput {
    color: var(--ink);
  }
  @media (max-width:1100px) {
    .ad-grid {
      grid-template-columns: 1fr 1fr;
    }
    .ad-two {
      grid-template-columns: 1fr;
    }
  }
  @media (max-width:650px) {
    .ad-grid,.ad-formgrid {
      grid-template-columns: 1fr;
    }
    .ad-formgrid .full {
      grid-column: auto;
    }
    .ad-hero {
      align-items: flex-start;
      padding: 22px;
    }
    .ad-hero-icon {
      display: none;
    }
    .ad-hero h2 {
      font-size: 20px;
    }
    .ad-quick {
      flex-direction: column;
      align-items: flex-start;
    }
    .ad-stats {
      gap: 7px;
    }
    .ad-stat {
      padding: 13px;
    }
    .ad-stat strong {
      font-size: 20px;
    }
    .ad-listrow {
      flex-wrap: wrap;
    }
    .ad-card {
      padding: 19px;
    }
    .ad-filter select {
      max-width: 100%;
    }
  }
  .tg-shell {
    --ad-soft: var(--my-soft,#eef2e9);
    --ad-surface: var(--my-surface,#fff);
  }
  .tg-subnav {
    margin-bottom: 18px;
    display: flex;
    gap: 6px;
    overflow: auto;
    padding: 10px 0 17px;
    border-bottom: 1px solid var(--line);
  }
  .tg-subnav button {
    border-radius: 6px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    padding: 11px 15px;
    font-size: 11px;
    white-space: nowrap;
    color: var(--muted);
  }
  .tg-subnav button.active {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--ink);
    background: var(--ad-soft);
  }
  .tg-progress {
    margin: 25px 0;
    display: flex;
    list-style-type: none;
    gap: 0;
    padding: 0px;
  }
  .tg-progress li {
    position: relative;
    flex: 1;
    padding: 31px 9px 0 0;
    font-size: 10px;
    --tw-leading: 1.6;
    line-height: 1.6;
    color: var(--muted);
  }
  .tg-progress li:before {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 15px;
    width: 15px;
    border-radius: calc(infinity * 1px);
    content: '';
    background: var(--ad-surface);
    z-index: 1;
    border: 1px solid var(--line);
  }
  .tg-progress li:not(:last-child):after {
    position: absolute;
    top: 7px;
    right: 0px;
    left: 16px;
    height: 1px;
    content: '';
    background: var(--line);
  }
  .tg-progress li.done:before {
    border-color: var(--green);
    background: var(--green);
  }
  .tg-progress li.current {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--ink);
  }
  .tg-progress li.current:before {
    box-shadow: 0 0 0 4px var(--ad-soft);
    border: 2px solid var(--green);
  }
  .tg-progress li.done:after {
    background: var(--green);
  }
  .tg-image {
    margin-bottom: 18px;
    display: grid;
    height: 160px;
    place-items: center;
    overflow: hidden;
    border-radius: 8px;
    background: var(--ad-soft);
    font-size: 36px;
    color: var(--green);
  }
  .tg-image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
  }
  .tg-upload {
    border-radius: 9px;
    padding: 17px;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    color: var(--muted);
    border: 1px dashed var(--line);
  }
  .tg-priorities {
    margin: 24px 0;
  }
  .tg-priority-title {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
  }
  .tg-priority-title h2 {
    font-size: 17px;
  }
  .tg-priority {
    border-radius: 10px;
    padding: 22px;
    background: var(--ad-surface);
    border: 1px solid var(--line);
  }
  .tg-priority h3 {
    margin: 11px 0 9px;
    font-size: 15px;
    --tw-leading: 1.5;
    line-height: 1.5;
  }
  .tg-priority p {
    margin-bottom: 18px;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
  }
  .tg-count {
    color: var(--green);
    opacity: .5;
    font: 500 30px Georgia,serif;
  }
  .tg-state {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .tg-pass {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    padding: 22px;
    background: var(--ad-soft);
    border: 1px solid var(--line);
  }
  .tg-pass-art {
    position: absolute;
    top: 25px;
    right: 15px;
    width: 130px;
    color: var(--green);
    opacity: .7;
  }
  .tg-pass h2 {
    max-width: 65%;
  }
  .tg-pass p {
    max-width: 65%;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
  }
  .tg-list {
    list-style-type: none;
    padding: 0px;
  }
  .tg-list li {
    padding: 11px 0;
    font-size: 12px;
    --tw-leading: 1.8;
    line-height: 1.8;
    border-bottom: 1px solid var(--line);
  }
  .tg-statusnote {
    margin: 15px 0;
    border-radius: 7px;
    padding: 14px;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    background: var(--ad-soft);
  }
  .tg-delegate {
    margin-top: 20px;
    border-radius: 10px;
    padding: 22px;
    border: 1px dashed var(--green);
  }
  .tg-meta {
    margin: 13px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .tg-muted {
    font-size: 10px;
    --tw-leading: 1.8;
    line-height: 1.8;
    color: var(--muted);
  }
  .tg-current {
    margin: 15px 0;
    font-size: 11px;
    color: var(--green);
  }
  .tg-prevent label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 12px;
    --tw-leading: 1.8;
    line-height: 1.8;
  }
  .tg-prevent input {
    margin-top: 5px;
    accent-color: var(--green);
  }
  .tg-prevent h2 {
    margin: 0 0 8px;
  }
  .tg-prevent .ad-actions {
    margin-top: 20px;
  }
  .tg-alert {
    margin: 15px 0;
    display: block;
    font-size: 11px;
    color: var(--ink);
  }
  .tg-photo-message {
    margin-top: 8px;
    font-size: 10px;
    color: var(--muted);
  }
  .tg-shortcuts {
    margin: 20px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
  .tg-shortcuts button {
    font-size: 11px;
  }
  .tg-offline-note {
    margin-top: 20px;
    border-radius: 9px;
    padding: 18px;
    font-size: 11px;
    --tw-leading: 1.8;
    line-height: 1.8;
    border: 1px solid var(--line);
  }
  @media (max-width:650px) {
    .tg-progress {
      margin-left: 10px;
      flex-direction: column;
      gap: 15px;
      border-left: 1px solid var(--line);
    }
    .tg-progress li {
      padding: 0 0 0 23px;
    }
    .tg-progress li:before {
      top: 1px;
      left: calc(8px * -1);
    }
    .tg-progress li:after {
      display: none;
    }
    .tg-pass-art {
      width: 100px;
      opacity: .5;
    }
    .tg-priority-title {
      align-items: flex-start;
    }
    .tg-priority-title h2 {
      font-size: 15px;
    }
  }
  .cw-tabs {
    margin: 24px 0 25px;
    display: flex;
    gap: 9px;
    overflow: auto;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
  }
  .cw-tabs button {
    border-radius: 7px;
    border-style: var(--tw-border-style);
    border-width: 0px;
    background-color: transparent;
    padding: 13px 18px;
    font-size: 12px;
    white-space: nowrap;
    color: var(--muted);
  }
  .cw-tabs button.active {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    color: var(--ink);
    background: var(--my-soft,#eaf0df);
  }
  .cw-context {
    margin: 4px 0 22px;
  }
  .cw-context p {
    margin-top: 8px;
    font-size: 12px;
  }
  .cw-context-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
  }
  .cw-intro {
    margin-bottom: 24px;
    border-radius: 9px;
    padding: 19px 23px;
    background: var(--my-soft,#eef2e7);
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
  }
  .cw-intro b {
    font-size: 13px;
  }
  .cw-intro p {
    margin-top: 6px;
    font-size: 11px;
  }
  .cw-dossier-tools {
    margin-top: 23px;
    padding-top: 7px;
    border-top: 1px solid var(--line);
  }
  .cw-dossier-tools h2 {
    margin: 20px 0 15px;
    font-size: 15px;
  }
  #clientWorkspaceBody .ad-hero {
    margin-top: 18px;
  }
  #clientWorkspaceBody .ad-filter {
    margin-top: 10px;
  }
  @media (max-width:650px) {
    .cw-context-actions,.cw-intro {
      flex-direction: column;
      align-items: flex-start;
    }
    .cw-tabs {
      gap: 2px;
    }
    .cw-tabs button {
      padding: 12px 10px;
      font-size: 11px;
    }
  }
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}

body.login-screen main {
  margin: 0;
  min-height: 100vh;
  display: flex;
  align-items: safe center;
  justify-content: center;
}
body.login-screen .content {
  width: calc((min(1680px, 100vw - 232px) - 76px) / 2.5);
  max-width: calc((min(1680px, 100vw - 232px) - 76px) / 2.5);
  min-width: 280px;
  margin: 0 auto;
  padding: 28px 0;
}
body.login-screen .logo,
body.login-screen .titlebar,
body.login-screen .titlebar h1,
body.login-screen .titlebar p,
body.login-screen .notice {
  text-align: center;
}
body.login-screen .logo {
  margin: 0 0 22px;
}
body.login-screen .titlebar {
  display: block;
  margin-bottom: 18px;
}
@media (max-width: 1100px) {
  body.login-screen .content {
    width: calc((100vw - 240px) / 2.5);
    max-width: calc((100vw - 240px) / 2.5);
  }
}
@media (max-width: 700px) {
  body.login-screen .content {
    width: min(420px, calc(100% - 32px));
    max-width: min(420px, calc(100% - 32px));
    min-width: 0;
  }
}
img.clientinitial {
  display: block;
  width: 72px;
  height: 96px;
  object-fit: cover;
  object-position: center 12%;
  background: #fff !important;
}
@media (max-width: 800px) {
  img.clientinitial {
    width: 55px;
    height: 74px;
  }
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
    }
  }
}
