:root {
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  color:#172f4d;
  background:#f4f7fb;
  font-synthesis:none;
  --navy:#142f50;
  --blue:#2468c7;
  --muted:#627086;
  --line:#e0e7ef;
  --surface:#fff
}
* {
  box-sizing:border-box
}
body {
  margin:0
}
a {
  color:inherit;
  text-decoration:none
}
button,input {
  font:inherit
}
button,a,input {
  -webkit-tap-highlight-color:transparent
}
button,a {
  touch-action:manipulation
}
button {
  cursor:pointer
}
svg {
  width:22px;
  height:22px;
  flex-shrink:0;
  vertical-align:middle
}
a,button {
  transition:background .15s,border-color .15s,box-shadow .15s
}
a:focus-visible,button:focus-visible,input:focus-visible {
  outline:3px solid #3284ef;
  outline-offset:4px
}
a:hover {
  color:#1559b3
}
h1,h2,h3,p {
  margin-top:0
}
h1 {
  font-size:2.25rem;
  letter-spacing:-.06rem;
  line-height:1.2;
  margin-bottom:12px
}
h2 {
  font-size:1.15rem;
  letter-spacing:-.015rem
}
h3 {
  font-size:1rem;
  line-height:1.4;
  margin-bottom:5px
}
p {
  line-height:1.6
}
.sidebar {
  width:244px;
  position:fixed;
  inset:0 auto 0 0;
  background:var(--navy);
  color:#fff;
  padding:40px 24px;
  display:flex;
  flex-direction:column
}
.brand {
  display:flex;
  gap:12px;
  align-items:center;
  font-weight:750;
  font-size:.92rem;
  letter-spacing:.03em
}
.brand:hover {
  color:#fff
}
.brand-icon {
  display:flex;
  position:relative;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  background:#fff;
  color:var(--navy);
  border-radius:12px;
  font-size:1.8rem
}
.brand-icon span {
  position:absolute;
  bottom:0;
  right:2px;
  font-size:1.2rem;
  color:#2274ce
}
.brand small {
  display:block;
  font-size:.7rem;
  letter-spacing:.13em;
  margin-top:7px;
  font-weight:400;
  color:#bccce0
}
.sidebar nav {
  display:grid;
  gap:9px;
  margin-top:64px
}
.sidebar nav a {
  display:flex;
  gap:14px;
  align-items:center;
  min-height:52px;
  border-radius:10px;
  padding:12px 16px;
  font-size:.95rem;
  color:#c6d5e8
}
.sidebar nav a:hover {
  background:#ffffff0d;
  color:#fff
}
.sidebar nav a[aria-current] {
  background:#ffffff16;
  color:#fff;
  box-shadow:inset 3px 0 #7bb8ff
}
.sidebar-note {
  margin-top:auto;
  font-size:.85rem;
  color:#afc0d6;
  line-height:1.8;
  padding:0 14px
}
.shell {
  margin-left:244px
}
.topbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:85px;
  padding:0 48px;
  border-bottom:1px solid var(--line);
  background:#fff
}
.desktop-label {
  color:var(--muted);
  font-size:.9rem
}
.brand-label {
  font-size:.85rem;
  font-weight:800;
  letter-spacing:.06em
}
.brand-label i {
  font-style:normal;
  font-weight:400;
  color:#8391a3;
  margin:0 12px
}
.mobile-brand {
  display:none
}
main {
  max-width:1100px;
  padding:44px 48px 32px;
  margin:0 auto;
  min-height:calc(100vh - 153px);
  outline:none
}
.eyebrow {
  font-size:.72rem;
  letter-spacing:.17em;
  font-weight:700;
  color:var(--blue);
  margin-bottom:14px
}
.subtitle {
  color:var(--muted);
  margin-bottom:0;
  font-size:1rem
}
.page-heading {
  margin-bottom:30px
}
.searchbox {
  display:flex;
  align-items:center;
  background:#fff;
  border:1px solid #d7e1ee;
  border-radius:14px;
  padding:8px 9px 8px 18px;
  gap:13px;
  box-shadow:0 6px 20px #18375205;
  margin-bottom:32px
}
.searchbox>svg {
  color:#5e7490
}
.searchbox input {
  flex:1;
  min-width:0;
  border:0;
  outline:none;
  background:transparent;
  color:var(--navy);
  height:43px;
  font-size:1rem
}
.searchbox input::placeholder {
  color:#758296
}
.searchbox:focus-within {
  border-color:var(--blue);
  box-shadow:0 0 0 3px #2468c714
}
.searchbox button {
  border:0;
  color:#fff;
  background:var(--navy);
  width:45px;
  min-height:45px;
  border-radius:10px
}
.searchbox button:hover {
  background:var(--blue)
}
section {
  margin-bottom:28px
}
.section-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:16px
}
.section-title h2 {
  margin:0
}
.section-title>span {
  font-size:.8rem;
  color:var(--muted)
}
.section-title a {
  font-size:.85rem;
  color:var(--blue)
}
.section-title a svg {
  width:16px;
  margin-left:6px
}
.tiles {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px
}
.tile {
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:22px;
  display:flex;
  align-items:center;
  gap:16px;
  min-height:114px
}
.tile:hover {
  border-color:#91b6e8;
  box-shadow:0 5px 20px #17375608
}
.tile-icon {
  width:48px;
  height:48px;
  border-radius:13px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#2468c7;
  background:#edf4ff
}
.tile-icon svg {
  width:25px;
  height:25px
}
.sav {
  background:#eaf5f6;
  color:#277d89
}
.catalogues {
  background:#f0effb;
  color:#6652ad
}
.promos {
  background:#fff3e3;
  color:#9a6628
}
.tile>svg {
  margin-left:auto;
  color:#8794a5;
  width:18px
}
.tile strong,.resource-row strong,.ai-card strong {
  display:block;
  font-size:1rem
}
.tile small,.resource-row small,.ai-card small {
  display:block;
  font-size:.85rem;
  color:var(--muted);
  line-height:1.5;
  margin-top:6px
}
.ai-card {
  display:flex;
  align-items:center;
  gap:16px;
  padding:20px 24px;
  background:#e9f0fa;
  border:1px solid #d7e3f5;
  border-radius:16px;
  margin:26px 0 30px
}
.ai-card:hover {
  background:#e0ebfa
}
.ai-icon {
  display:flex;
  background:#fff;
  border-radius:12px;
  padding:11px;
  color:var(--blue)
}
.ai-card>svg {
  margin-left:auto;
  color:#52729b;
  width:18px
}
.ai-card small {
  margin-top:4px
}
.contact-list,.resource-list {
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden
}
.contact-row {
  display:flex;
  align-items:center;
  gap:16px;
  padding:20px 22px
}
.contact-row+.contact-row {
  border-top:1px solid var(--line)
}
.contact-symbol {
  display:flex;
  padding:11px;
  border-radius:50%;
  background:#f3f6fa;
  color:#627b98
}
.contact-row p {
  font-size:.9rem;
  color:var(--muted);
  margin:0;
  font-variant-numeric:tabular-nums
}
.call {
  margin-left:auto;
  display:flex;
  gap:8px;
  align-items:center;
  border:1px solid #d8e3f1;
  color:var(--blue);
  background:#f8fbff;
  border-radius:9px;
  padding:11px 14px;
  font-size:.85rem;
  font-weight:600;
  min-height:44px
}
.call:hover {
  background:#e9f1fc
}
.call svg {
  width:16px;
  height:16px
}
.resource-row {
  display:flex;
  gap:20px;
  align-items:center;
  padding:24px;
  background:#fff;
  min-height:95px
}
.resource-row+.resource-row {
  border-top:1px solid var(--line)
}
.resource-row:hover {
  background:#f8fbff
}
.resource-row>svg {
  margin-left:auto;
  width:18px;
  color:#6780a0
}
.list-icon {
  display:flex;
  padding:13px;
  background:#edf3fb;
  border-radius:12px;
  color:var(--blue)
}
.document-list {
  display:grid;
  gap:14px
}
.document {
  border:1px solid var(--line);
  border-radius:16px;
  padding:24px;
  background:#fff;
  display:flex;
  gap:18px;
  align-items:center
}
.document-icon {
  padding:14px;
  display:flex;
  border-radius:12px;
  background:#f0f4f9;
  color:#6d829c
}
.document-copy {
  flex:1
}
.status {
  font-size:.8rem;
  color:var(--muted);
  margin:0
}
.document-actions {
  display:flex;
  gap:8px
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:1px solid transparent;
  border-radius:9px;
  background:var(--navy);
  color:#fff;
  padding:12px 15px;
  min-height:44px;
  font-size:.85rem;
  font-weight:600
}
.button:hover {
  background:#225388;
  color:#fff
}
.button svg {
  width:16px;
  height:16px
}
.button.secondary {
  background:#fff;
  border-color:var(--line);
  color:var(--navy)
}
.button:disabled {
  color:#778495;
  background:#edf0f4;
  border-color:#e3e8ee;
  cursor:not-allowed
}
.catalogs {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px
}
.catalog {
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden
}
.catalog-cover {
  background:var(--navy);
  color:#fff;
  min-height:225px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:30px;
  gap:30px
}
.catalog:nth-child(2) .catalog-cover {
  background:#e9eef5;
  color:var(--navy)
}
.catalog-cover>span {
  font-size:2rem;
  font-weight:750
}
.catalog-cover>svg {
  width:42px;
  height:42px;
  opacity:.65
}
.catalog-cover>small {
  font-size:.7rem;
  letter-spacing:.12em
}
.catalog-body {
  padding:24px
}
.catalog-body h2 {
  margin-bottom:18px
}
.tabs {
  display:inline-flex;
  gap:6px;
  background:#e7edf5;
  padding:5px;
  border-radius:12px;
  margin-bottom:24px
}
.tabs button {
  border:0;
  border-radius:9px;
  color:#596c83;
  background:transparent;
  min-height:44px;
  padding:10px 22px;
  font-size:.9rem
}
.tabs button[aria-pressed=true] {
  background:#fff;
  color:var(--navy);
  box-shadow:0 2px 5px #1c344b10;
  font-weight:650
}
.empty {
  display:flex;
  align-items:center;
  flex-direction:column;
  justify-content:center;
  text-align:center;
  border:1px dashed #cdd9e7;
  border-radius:18px;
  padding:72px 24px;
  background:#ffffff70
}
.empty>svg {
  width:42px;
  height:42px;
  color:#7f97b6;
  margin-bottom:22px
}
.empty h2 {
  margin-bottom:10px
}
.empty p {
  color:var(--muted);
  margin:0
}
.compact {
  padding:35px 20px
}
.result-count {
  color:var(--muted);
  font-size:.9rem;
  margin-bottom:18px
}
.results-list {
  display:grid;
  gap:12px
}
.results-list>.resource-row,.results-list>.contact-row {
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff
}
.fallback {
  margin-top:24px;
  border-radius:14px;
  background:#e9f0fa;
  padding:24px;
  display:flex;
  align-items:center;
  gap:22px;
  justify-content:space-between
}
.fallback strong {
  font-size:.95rem
}
.fallback p {
  font-size:.85rem;
  color:var(--muted);
  margin:6px 0 0
}
.fallback a {
  flex-shrink:0
}
.suggestions {
  padding:24px 0
}
.suggestions p {
  color:var(--muted)
}
.suggestions button {
  margin:0 8px 10px 0;
  border:1px solid #d3dfed;
  background:#fff;
  border-radius:24px;
  padding:12px 16px;
  min-height:44px;
  color:var(--navy);
  font-size:.9rem
}
.suggestions button:hover {
  background:#e9f0fa
}
.promo {
  padding:24px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px
}
.promo img {
  display:block;
  max-width:100%;
  border-radius:12px
}
.promo a {
  margin:10px 10px 0 0
}
footer {
  padding:22px 48px;
  font-size:.75rem;
  color:#778599;
  display:flex;
  justify-content:space-between;
  gap:16px
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
.skip {
  position:fixed;
  top:-80px;
  left:12px;
  background:#fff;
  padding:12px;
  z-index:100
}
.skip:focus {
  top:12px
}
@media(min-width:1450px) {
  main {
    padding-top:64px
  }
  .topbar {
    padding-left:64px
  }
}
@media(max-width:1100px) {
  .sidebar {
    width:210px;
    padding:36px 18px
  }
  .shell {
    margin-left:210px
  }
  main {
    padding:34px 28px
  }
  .topbar {
    padding:0 28px
  }
  .tile {
    padding:18px;
    gap:12px
  }
  .tile small {
    font-size:.8rem
  }
  .document {
    flex-wrap:wrap
  }
  .document-actions {
    margin-left:auto
  }
  .fallback {
    align-items:flex-start;
    flex-direction:column
  }
  footer {
    padding:22px 28px
  }
}
@media(max-width:760px) {
  .sidebar {
    z-index:20;
    inset:auto 0 0 0;
    width:auto;
    padding:0 8px calc(env(safe-area-inset-bottom) + 5px);
    background:#fff;
    border-top:1px solid var(--line)
  }
  .brand,.sidebar-note {
    display:none
  }
  .sidebar nav {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:0;
    margin:0
  }
  .sidebar nav a {
    flex-direction:column;
    gap:5px;
    padding:11px 3px 7px;
    min-height:65px;
    font-size:.75rem;
    border-radius:0;
    color:#6a7890
  }
  .sidebar nav a[aria-current] {
    background:transparent;
    color:var(--blue);
    box-shadow:inset 0 3px var(--blue)
  }
  .sidebar nav a:hover {
    background:#edf3fb;
    color:var(--blue)
  }
  .sidebar nav svg {
    width:21px;
    height:21px
  }
  .shell {
    margin:0;
    padding-bottom:calc(76px + env(safe-area-inset-bottom))
  }
  .topbar {
    height:65px;
    padding:0 22px
  }
  .desktop-label {
    display:none
  }
  .mobile-brand {
    display:block;
    font-size:.8rem;
    letter-spacing:.025em;
    font-weight:800
  }
  .mobile-brand span {
    color:#5f98df;
    margin-left:6px
  }
  .brand-label {
    font-size:.7rem
  }
  .brand-label i {
    margin:0 7px
  }
  main {
    padding:29px 20px 14px;
    min-height:calc(100dvh - 210px)
  }
  h1 {
    font-size:1.9rem;
    letter-spacing:-.045rem
  }
  .eyebrow {
    font-size:.65rem;
    margin-bottom:10px
  }
  .page-heading {
    margin-bottom:23px
  }
  .subtitle {
    font-size:.9rem;
    line-height:1.5
  }
  .searchbox {
    gap:10px;
    padding:7px 7px 7px 13px;
    margin-bottom:27px
  }
  .searchbox input {
    font-size:1rem;
    height:40px
  }
  .searchbox>svg {
    width:19px
  }
  .searchbox button {
    width:40px;
    min-height:44px
  }
  .section-title h2 {
    font-size:1rem
  }
  .section-title>span {
    display:none
  }
  .section-title a {
    font-size:.75rem
  }
  .section-title a svg {
    display:none
  }
  .tiles {
    gap:12px
  }
  .tile {
    padding:18px 16px;
    align-items:flex-start;
    flex-direction:column;
    gap:13px;
    min-height:145px
  }
  .tile>svg {
    display:none
  }
  .tile strong {
    font-size:.95rem
  }
  .tile small {
    font-size:.75rem;
    margin-top:5px
  }
  .tile-icon {
    width:40px;
    height:40px;
    border-radius:10px
  }
  .tile-icon svg {
    width:22px;
    height:22px
  }
  .ai-card {
    padding:17px 16px;
    gap:13px;
    margin:22px 0 27px
  }
  .ai-card strong {
    font-size:.9rem
  }
  .ai-card small {
    font-size:.75rem
  }
  .ai-icon {
    padding:9px
  }
  .ai-card>svg {
    width:16px
  }
  .contact-row {
    padding:17px 15px;
    gap:12px
  }
  .contact-symbol {
    display:none
  }
  .contact-row h3 {
    font-size:.88rem
  }
  .contact-row p {
    font-size:.85rem
  }
  .call {
    padding:10px;
    font-size:.75rem;
    gap:6px
  }
  .call svg {
    width:14px
  }
  section {
    margin-bottom:22px
  }
  .resource-row {
    padding:20px 16px;
    gap:14px
  }
  .resource-row strong {
    font-size:.95rem
  }
  .resource-row small {
    font-size:.8rem
  }
  .list-icon {
    padding:11px
  }
  .document {
    padding:19px 16px;
    gap:14px
  }
  .document-icon {
    padding:12px
  }
  .document h3 {
    font-size:.95rem
  }
  .document-actions {
    margin:0;
    width:100%;
    padding-top:4px
  }
  .document-actions>* {
    flex:1
  }
  .catalogs {
    grid-template-columns:1fr;
    gap:18px
  }
  .catalog-cover {
    min-height:150px;
    gap:18px;
    padding:24px
  }
  .catalog-cover>svg {
    display:none
  }
  .catalog-body {
    padding:20px
  }
  .catalog-body .button {
    width:100%
  }
  .tabs {
    display:flex
  }
  .tabs button {
    flex:1;
    padding:10px 14px
  }
  .empty {
    padding:54px 22px
  }
  .empty p {
    font-size:.9rem
  }
  .fallback {
    padding:20px
  }
  .fallback a {
    width:100%;
    font-size:.8rem
  }
  footer {
    padding:18px 20px;
    font-size:.7rem
  }
  footer span {
    display:none
  }
}
@media(max-width:360px) {
  main {
    padding-left:15px;
    padding-right:15px
  }
  .tile {
    padding:15px 12px
  }
  .contact-row {
    gap:8px
  }
  .call span {
    display:none
  }
  .call {
    min-width:44px;
    justify-content:center
  }
  .ai-card {
    gap:10px
  }
  .ai-card small {
    font-size:.7rem
  }
}
@media(prefers-reduced-motion:reduce) {
  * {
    transition:none!important;
    scroll-behavior:auto!important
  }
}
/* Documents, e-mails et ressources commerciales */
.contact-details {
  min-width:0;
  flex:1
}
.email {
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#2468c7;
  font-size:.85rem;
  line-height:1.5;
  margin-top:7px;
  overflow-wrap:anywhere;
  max-width:100%;
  min-height:32px
}
.email svg {
  width:15px;
  height:15px
}
.contact-row .call {
  flex-shrink:0
}
.folder-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px
}
.folder-card {
  display:flex;
  align-items:flex-start;
  gap:16px;
  padding:24px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px
}
.folder-card:hover {
  border-color:#91b6e8;
  background:#fcfdff
}
.folder-card>div {
  flex:1;
  min-width:0
}
.folder-card h2 {
  font-size:1.05rem;
  margin:0 0 7px
}
.folder-card p {
  color:var(--muted);
  font-size:.85rem;
  line-height:1.5;
  margin:0 0 18px
}
.folder-card>svg {
  width:18px;
  height:18px;
  color:#7186a1;
  margin-top:15px
}
.folder-count {
  font-size:.75rem;
  color:#4c6688;
  background:#eef3fa;
  padding:5px 9px;
  border-radius:6px;
  display:inline-block
}
.back-link {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  color:var(--blue);
  font-size:.85rem;
  margin-bottom:18px
}
.business-section {
  margin-top:30px
}
.business-links {
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden
}
.commercial-promo-link {
  margin-top:24px;
  border:1px solid var(--line);
  border-radius:14px
}
.document-copy {
  min-width:0
}
.document-copy h3 {
  overflow-wrap:anywhere
}
@media(max-width:760px) {
  .folder-grid {
    grid-template-columns:1fr;
    gap:13px
  }
  .folder-card {
    padding:19px 16px;
    gap:14px
  }
  .folder-card h2 {
    font-size:1rem
  }
  .folder-card p {
    font-size:.8rem;
    margin-bottom:10px
  }
  .folder-card .list-icon {
    padding:11px
  }
  .email {
    font-size:.8rem;
    min-height:38px;
    display:flex;
    align-items:center
  }
  .contact-row {
    flex-wrap:wrap
  }
  .contact-details {
    flex-basis:calc(100% - 88px)
  }
  .contact-row h3 {
    font-size:.9rem
  }
  .email svg {
    display:none
  }
  .document-copy h3 {
    font-size:.92rem
  }
  .commercial-promo-link {
    padding:18px 15px
  }
  .back-link {
    margin-bottom:14px
  }
}
@media(max-width:360px) {
  .contact-row .call {
    align-self:flex-start
  }
  .contact-details {
    flex-basis:calc(100% - 56px)
  }
  .email {
    font-size:.75rem
  }
}
@media(max-width:760px) {
  .contact-row {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
  }
  .contact-row .call {
    grid-column:2;
    grid-row:1;
    align-self:center;
  }
  .email {
    display:block;
    padding-top:6px;
    padding-bottom:6px;
  }
}
/* Composition d'un e-mail client */
.mail-form {
  max-width:760px;
  padding:28px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
}
.mail-field { margin-bottom:22px; }
.mail-field label { display:block; font-size:.95rem; font-weight:650; margin-bottom:9px; }
.mail-field input,.mail-field textarea {
  display:block;
  width:100%;
  min-width:0;
  min-height:48px;
  border:1px solid #cdd9e7;
  border-radius:10px;
  background:#fbfcfe;
  padding:12px 14px;
  font:inherit;
  font-size:1rem;
  color:var(--navy);
}
.mail-field textarea { resize:vertical; line-height:1.6; min-height:190px; }
.mail-field input:focus-visible,.mail-field textarea:focus-visible {
  outline:3px solid #2468c733;
  outline-offset:1px;
  border-color:var(--blue);
}
.mail-field input::placeholder,.mail-field textarea::placeholder { color:#758296; }
.mail-help { font-size:.875rem; color:var(--muted); line-height:1.6; }
.mail-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:20px; }
.mail-status { font-size:.875rem; line-height:1.5; margin:16px 0 0; color:var(--blue); }
.mail-status:empty { display:none; }
@media(max-width:760px) {
  .sidebar nav { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .mail-form { padding:20px 16px; }
  .mail-actions { flex-direction:column; }
  .mail-actions button { width:100%; }
}
.mail-field select {
  width:100%;
  min-height:48px;
  border:1px solid #cdd9e7;
  border-radius:10px;
  padding:12px 10px;
  background:#fbfcfe;
  font:inherit;
  color:var(--navy);
}
.mail-field select:focus-visible { outline:3px solid #2468c733; outline-offset:1px; border-color:var(--blue); }
.field-hint { font-size:.85rem; color:var(--muted); margin:8px 0 0; }
.mail-attachments { padding:17px 18px; background:#edf3fb; border-radius:12px; margin-bottom:12px; font-size:.875rem; }
.mail-attachments ul { margin:12px 0 0; padding-left:20px; }
.mail-attachments li { margin:7px 0; line-height:1.5; }
.mail-attachments a { color:#2468c7; text-decoration:underline; text-underline-offset:3px; }
.mail-attachments p { margin:10px 0 0; color:var(--muted); font-size:.85rem; }
.mail-document-picker { margin-bottom:24px; border:1px solid var(--line); border-radius:10px; }
.mail-document-picker summary { min-height:44px; padding:13px 16px; font-size:.875rem; cursor:pointer; }
.mail-document-picker fieldset { margin:0; padding:0 14px 12px; border:0; }
.mail-document-option { display:flex; align-items:center; gap:10px; min-height:44px; padding:8px 0; border-top:1px solid var(--line); font-size:.85rem; }
.mail-document-option input { width:18px; height:18px; accent-color:var(--blue); flex-shrink:0; }
.mail-document-option span { overflow-wrap:anywhere; }
.mail-actions [hidden] { display:none; }
.mail-form[aria-busy="true"] { opacity:.8; }
.mail-status a { text-decoration:underline; }
@media(max-width:760px) {
  .mail-attachments { padding:16px 14px; }
  .mail-field select { font-size:1rem; text-overflow:ellipsis; }
}