/* Workspace palette aligned with the approved public site: ivory, pine and quiet gold. */
body.app {
  --ink: #17382F;
  --ink-2: #3D5149;
  --ink-3: #57665D;
  --ink-4: #5F6D63;
  --canvas: #F6F2EA;
  --canvas-2: #F0ECE3;
  --card: #FFFDFA;
  --line: rgba(23, 63, 53, .12);
  --line-2: rgba(23, 63, 53, .24);
  --fill: #EEEEE7;
  --fill-2: #E1E6DE;
  --blue-soft: #EAF0E8;
  --glass: rgba(255, 253, 250, .94);
  --glass-strong: #FFFDFA;
  --glass-line: rgba(23, 63, 53, .12);
  --glass-green: #FFFDFA;
  --glass-gold: #F4F0E7;
  --glass-pine: #173F35;
  --glass-rim: inset 0 0 0 1px rgba(23, 63, 53, .12);
  --sh-1: 0 2px 8px rgba(29, 43, 34, .035);
  --sh-glass: 0 6px 24px rgba(29, 43, 34, .045);
  background: var(--canvas);
  color: var(--ink);
}
body.app::before { content: none; background: none; }
.app .login-wrap { background: none; }

/* White working surfaces; the warm tone is reserved for supporting information. */
.app :is(.card, .glasscard, .ob-card, .paper, .chat) {
  background: var(--card);
  box-shadow: var(--glass-rim), var(--sh-1);
}
.app .emp-card {
  background: #F4F0E7;
  border-color: #D8D0BF;
  box-shadow: 0 3px 16px rgba(29, 43, 34, .035);
}
.app :is(.glasscard, .emp-card, .apv) { -webkit-backdrop-filter: none; backdrop-filter: none; }
.app .gbar {
  background: var(--glass);
  border-color: #DCDDD3;
  box-shadow: var(--sh-glass);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
}
.app .tabbar { background: var(--glass); box-shadow: 0 -1px 0 var(--line), 0 -4px 20px rgba(29, 43, 34, .035); }
.app :is(.segnav, .onb) { background: #EEEEE7; }
.app .segnav [aria-current='page'] { background: var(--brand-pine); color: #FFF; box-shadow: none; }
.app .onb-dots li.is-cur { background: var(--brand-pine); }
.app .pop { background: var(--card); border-color: #DCDDD3; }
.app :is(.tabbar [aria-current='page'], .pop button[aria-current='page'], .seg button[aria-checked='true'], .seg button[aria-selected='true'], .seg button[aria-pressed='true']) {
  background: #E5EDE3; color: #173F35; box-shadow: inset 0 0 0 1px #8B9D8F;
}
.app .pop button[aria-current='page'] svg.i { color: #173F35; }

/* Pine identifies actions and selection; gold does not compete with the controls. */
.app :is(.btn-primary, .btn-dark, .me) {
  background: var(--brand-pine); color: #FFF;
  box-shadow: 0 2px 5px rgba(16, 45, 38, .1);
}
.app .btn-tinted { background: #EAF0E8; color: #173F35; box-shadow: inset 0 0 0 1px #C8D4C7; }
.app :is(.pick, .lv) { background: var(--card); }
.app :is(.pick, .lv)[aria-pressed='true'] { background: #EDF3EA; box-shadow: inset 0 0 0 2px #173F35; }
.app :is(.chip[aria-pressed='true'], .chip[aria-checked='true']:not(.serious)) { background: #E5EDE3; color: #173F35; box-shadow: inset 0 0 0 1px #8B9D8F; }
.app .tone[aria-checked='true'] { box-shadow: inset 0 0 0 2px #173F35; }
.app .pick[aria-pressed='true'] .pick-check { background: #173F35; color: #FFF; }
.app :is(.input, .select, .textarea) { background: #FFF; border-color: #C5CEC3; }
.app :is(.input, .select, .textarea):focus { box-shadow: 0 0 0 3px rgba(23, 63, 53, .13), inset 0 0 0 1px #173F35; }
.app :focus-visible { outline: 3px solid #173F35; outline-offset: 3px; }
.app :is(.btn-primary, .btn-dark, .me):focus-visible { outline-offset: 4px; }

.app .apv { background: #FBF7EC; box-shadow: inset 0 0 0 1px #C7B58B, var(--sh-1); }
.app .cm-agent p, .app .cm-typing { background: #F0EEE6; color: var(--ink); }
.app .cm-user p { background: #173F35; color: #FFF; }
.app :is(.chat-h, .chat-form) { background: var(--card); }
.app .paycard { background: #173F35; color: #FFF; }
.app .paycard::after { background: none; }
.app .paycard.paycard-bank { background: var(--canvas-2); color: var(--ink); box-shadow: var(--glass-rim); }

.app .login-card {
  background: var(--card); border-color: #DCDDD3;
  box-shadow: 0 16px 48px -24px rgba(23, 56, 47, .2);
}
.app .login-card .lang-switch { background: #F4F1E9; border-color: #D8DDD3; color: #173F35; }
.app .login-foot { color: var(--ink-3); }
@media (hover: hover) and (pointer: fine) {
  .app :is(.btn-primary, .btn-dark):hover:not(:disabled) { background: #102D26; color: #FFF; box-shadow: 0 3px 9px rgba(16, 45, 38, .14); }
  .app .btn-tinted:hover:not(:disabled) { background: #DDE8DA; color: #173F35; }
  .app .segnav [aria-current='page']:hover { background: #102D26; color: #FFF; }
}
@media (prefers-reduced-transparency: reduce) { .app :is(.gbar, .tabbar, .pop) { background: var(--card); -webkit-backdrop-filter: none; backdrop-filter: none; } }
@media (forced-colors: active) {
  .app :focus-visible { outline-color: Highlight; }
  .app :is(.pick, .lv)[aria-pressed='true'] { outline: 2px solid Highlight; }
}