@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700&display=swap");

:root {
  font-family: "DM Sans", sans-serif;
  color: #17202a;
  background: #cfd4da;
  font-synthesis: none;
  --navy: #17263c;
  --blue: #4169e1;
  --border: #c1c7cf;
  --muted: #697386;
  --surface: #e3e6ea;
  --shadow: 0 1px 2px rgba(23, 32, 42, .05), 0 8px 24px rgba(23, 32, 42, .04);
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: #cfd4da; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3, .brand strong { font-family: "Manrope", sans-serif; }

.app-shell { min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: 248px; background: #111b2b; color: #d8deea; padding: 22px 16px; display: flex; flex-direction: column; z-index: 30; }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px 26px; }
.brand-mark { width: 35px; height: 35px; display: grid; place-items: center; background: linear-gradient(145deg, #6b8cff, #3658c9); border-radius: 10px; color: white; font: 700 18px Manrope; box-shadow: 0 6px 16px rgba(65, 105, 225, .3); }
.brand > div:nth-child(2) { display: flex; flex-direction: column; }
.brand strong { color: white; font-size: 14px; line-height: 1.3; }
.brand span { color: #8e9bad; font-size: 12px; }
.nav-label { display: block; color: #667387; font-size: 10px; text-transform: uppercase; letter-spacing: .12em; font-weight: 700; padding: 7px 12px 9px; }
.sidebar nav button { border: 0; background: transparent; color: #9ba7b9; width: 100%; display: flex; align-items: center; gap: 11px; padding: 10px 12px; border-radius: 8px; margin: 2px 0; text-align: left; font-size: 13px; font-weight: 500; }
.sidebar nav button:hover { color: white; background: rgba(255,255,255,.05); }
.sidebar nav button.active { background: rgba(91, 124, 250, .16); color: #f7f9ff; box-shadow: inset 2px 0 #6d89f7; }
.sidebar-bottom { margin-top: auto; }
.focus-card { background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.07); border-radius: 10px; padding: 13px; margin: 0 2px 17px; }
.focus-kicker { display: flex; align-items: center; gap: 6px; color: #8ba5ff; text-transform: uppercase; letter-spacing: .06em; font-size: 9px; font-weight: 700; margin-bottom: 8px; }
.focus-card strong { color: #eef2f9; font-size: 12px; display: block; }
.focus-card p { color: #768499; font-size: 10px; margin: 5px 0 0; line-height: 1.45; }
.profile { border-top: 1px solid rgba(255,255,255,.07); padding: 17px 6px 0; display: flex; align-items: center; gap: 10px; }
.profile > div:last-child { display: flex; flex-direction: column; }
.profile > div:nth-child(2) { display: flex; flex-direction: column; min-width: 0; }
.profile strong { color: #e7ebf2; font-size: 11px; }
.profile span { color: #68768a; font-size: 10px; }
.profile .signout-button { margin-left: auto; color: #718097; }
.profile .signout-button:hover { background: rgba(255,255,255,.06); color: white; }
.avatar { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; background: #dfe5fb; color: #3c5cbd; font-size: 10px; font-weight: 700; }
.main-shell { margin-left: 248px; min-height: 100vh; }
.topbar { height: 66px; border-bottom: 1px solid var(--border); background: rgba(227,230,234,.92); backdrop-filter: blur(12px); display: flex; align-items: center; gap: 20px; padding: 0 34px; position: sticky; top: 0; z-index: 20; }
.search-box { display: flex; align-items: center; gap: 9px; color: #8993a3; flex: 1; max-width: 560px; }
.search-box input { border: 0; outline: 0; background: transparent; width: 100%; color: #263142; font-size: 12px; }
.search-box kbd { border: 1px solid #d9dee6; border-radius: 5px; background: #f8f9fa; padding: 2px 6px; font: 10px sans-serif; color: #8b95a3; white-space: nowrap; }
.topbar .capture-button { margin-left: auto; background: #17263c; color: white; }
.icon-button { border: 0; background: transparent; color: #697386; padding: 6px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; }
.icon-button:hover { background: #f0f2f5; color: #273247; }
.menu-button, .mobile-close { display: none; }
main { max-width: 1380px; margin: 0 auto; padding: 35px 38px 60px; }
.sync-error { background: #fff1f1; border: 1px solid #f1d4d4; color: #a23f3f; border-radius: 8px; padding: 10px 12px; margin-bottom: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 10px; }
.sync-error button { border: 0; background: transparent; color: #a23f3f; font-weight: 700; font-size: 10px; }
.sync-indicator { position: fixed; right: 25px; bottom: 22px; z-index: 25; background: #17263c; color: white; border-radius: 20px; padding: 7px 11px; box-shadow: 0 8px 24px rgba(23,38,60,.2); font-size: 9px; }
.app-loading { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; background: #cfd4da; color: #748092; font-size: 11px; }
.app-loading .brand-mark { animation: loading-pulse 1.5s ease-in-out infinite; }
@keyframes loading-pulse { 50% { transform: scale(.94); opacity: .72; } }

.share-page { min-height: 100vh; background: #f4f5f7; color: #1d2939; }
.share-header { height: 68px; padding: 0 max(24px, calc((100vw - 920px) / 2)); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e3e7ed; background: rgba(255,255,255,.92); }
.share-header > span { color: #7b8493; font-size: 11px; }
.share-brand { display: flex; align-items: center; gap: 9px; }
.share-brand > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; background: #17263c; color: white; font: 700 15px Manrope; }
.share-brand strong { font: 700 13px Manrope; color: #233148; }
.share-main { width: min(920px, calc(100% - 36px)); margin: 0 auto; padding: 52px 0 70px; }
.share-hero { max-width: 720px; margin-bottom: 34px; }
.share-eyebrow { color: #526bb7; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; }
.share-hero h1 { margin: 9px 0 9px; color: #172236; font-size: clamp(28px, 5vw, 42px); line-height: 1.12; letter-spacing: -.04em; }
.share-hero > p { color: #687386; font-size: 15px; line-height: 1.6; margin-bottom: 17px; }
.share-meta { display: flex; flex-wrap: wrap; gap: 8px; }
.share-meta span { padding: 5px 9px; border-radius: 20px; background: #e8ecf5; color: #58667a; font-size: 10px; font-weight: 600; }
.share-note { margin-bottom: 30px; padding: 17px 19px; border-left: 3px solid #6c86df; border-radius: 0 9px 9px 0; background: #eef2ff; }
.share-note strong { display: block; margin-bottom: 5px; color: #405aab; font-size: 11px; }
.share-note p { margin: 0; color: #4f5f77; font-size: 13px; line-height: 1.6; white-space: pre-wrap; }
.share-section { margin-bottom: 30px; }
.share-section-title { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; color: #536aaf; }
.share-section-title h2 { margin: 0 0 2px; color: #263348; font-size: 17px; }
.share-section-title p { margin: 0; color: #87909e; font-size: 10px; }
.share-task-list { display: grid; gap: 12px; }
.share-task { display: grid; grid-template-columns: 32px 1fr; gap: 13px; padding: 21px; border: 1px solid #e0e4ea; border-radius: 12px; background: white; box-shadow: 0 8px 26px rgba(31,45,68,.04); }
.share-task-number { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 8px; background: #edf1ff; color: #5069b8; font: 700 12px Manrope; }
.share-task-content { min-width: 0; }
.share-task-content > h3 { margin: 3px 0 10px; color: #263348; font-size: 15px; line-height: 1.5; }
.share-task-content > ul { display: grid; gap: 7px; margin: 0 0 15px; padding: 0; list-style: none; }
.share-task-content > ul li { display: flex; align-items: center; gap: 6px; color: #647083; font-size: 12px; line-height: 1.45; }
.share-task-content > ul li:before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #aab4c3; flex: 0 0 auto; }
.share-task-content > ul li.completed { color: #99a1ad; text-decoration: line-through; }
.share-task-content > ul li.completed:before { display: none; }
.share-attachments { display: grid; gap: 8px; margin: 0 0 15px; padding: 11px; border: 1px solid #dde3ef; border-radius: 9px; background: #f8faff; }
.share-attachments-title { display: flex; align-items: center; gap: 6px; color: #536aaf; }
.share-attachments-title strong { color: #334054; font-size: 10px; }
.share-attachment-list { display: flex; flex-wrap: wrap; gap: 7px; }
.share-attachment-list button { min-width: 0; max-width: 260px; border: 1px solid #dbe1ea; background: white; color: #465366; border-radius: 16px; padding: 6px 8px; display: inline-flex; align-items: center; gap: 5px; font-size: 9px; }
.share-attachment-list button span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.share-attachment-list button small { color: #8c96a6; font-size: 8px; white-space: nowrap; }
.share-attachment-list button:hover:not(:disabled) { border-color: #b8c5ef; color: #405db3; background: #f4f6ff; }
.share-attachments > p { margin: 0; color: #bd4c4c; font-size: 9px; }
.share-response-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.share-completion { margin-top: 18px; padding: 20px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; border: 1px solid #d9dfeb; border-radius: 12px; background: #f7f9fd; color: #5570bb; }
.share-completion.completed { border-color: #bee4d5; background: #eaf7f2; color: #28795b; }
.share-completion h2 { margin: 0 0 4px; color: #2e3b50; font-size: 14px; }
.share-completion p { margin: 0; color: #6f7a8b; font-size: 11px; line-height: 1.5; }
.share-completion time { display: block; margin-top: 4px; color: #53816f; font-size: 9px; }
.share-completion button { border: 0; border-radius: 8px; padding: 10px 13px; display: inline-flex; align-items: center; gap: 6px; background: #245f4b; color: white; font-size: 10px; font-weight: 700; white-space: nowrap; }
.share-completion > span { grid-column: 2 / -1; color: #bd4c4c; font-size: 9px; }
.share-composer { padding: 20px; border: 1px solid #e0e4ea; border-radius: 12px; background: white; }
.share-composer.compact { padding: 15px; margin-top: 16px; background: #f8f9fb; box-shadow: none; }
.share-composer-heading { display: flex; align-items: flex-start; gap: 9px; color: #5970b7; margin-bottom: 13px; }
.share-composer-heading h3 { margin: 0 0 3px; color: #334054; font-size: 13px; }
.share-composer-heading p { margin: 0; color: #808a99; font-size: 10px; line-height: 1.45; }
.share-entry-list { display: grid; gap: 7px; margin-bottom: 12px; }
.share-entry { padding: 9px 10px; border-radius: 7px; background: #f1f3f6; }
.share-entry strong { color: #4b596c; font-size: 10px; }
.share-entry p { margin: 3px 0 0; color: #596679; font-size: 11px; line-height: 1.45; white-space: pre-wrap; }
.share-owner-reply { margin-top: 9px; padding: 9px 10px; border-left: 3px solid #6480d6; border-radius: 0 7px 7px 0; background: #e9eefc; }
.share-owner-reply strong { color: #405cae; font-size: 9px; }
.share-owner-reply p { color: #42516a; }
.share-composer form { display: grid; gap: 8px; }
.share-composer input, .share-composer textarea { width: 100%; border-color: #dce1e8; background: white; font-size: 12px; resize: vertical; }
.share-composer form > div { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.share-composer form > div span { margin-right: auto; font-size: 9px; }
.share-composer form > div .success { color: #238162; }
.share-composer form > div .error { color: #bd4c4c; }
.share-composer button { border: 0; border-radius: 7px; padding: 8px 11px; display: inline-flex; align-items: center; gap: 6px; background: #17263c; color: white; font-size: 10px; font-weight: 700; }
.share-empty { padding: 30px; border: 1px dashed #cbd1d9; border-radius: 10px; color: #7d8795; text-align: center; font-size: 12px; }
.share-footer { padding: 22px; border-top: 1px solid #e0e4ea; color: #929aa6; text-align: center; font-size: 10px; }
.share-loading, .share-state { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: #f4f5f7; color: #758092; font-size: 12px; }
.share-state { flex-direction: column; padding: 30px; text-align: center; }
.share-state > svg { margin-top: 45px; color: #8996aa; }
.share-state h1 { margin: 15px 0 7px; color: #29364a; font-size: 24px; }
.share-state p { max-width: 430px; margin: 0; color: #768194; font-size: 13px; line-height: 1.55; }

@media (max-width: 680px) {
  .share-header { height: 60px; padding: 0 18px; }
  .share-header > span { display: none; }
  .share-main { width: min(100% - 24px, 920px); padding: 35px 0 50px; }
  .share-response-grid { grid-template-columns: 1fr; }
  .share-completion { grid-template-columns: auto 1fr; }
  .share-completion button { grid-column: 1 / -1; justify-content: center; }
  .share-task { grid-template-columns: 27px 1fr; gap: 9px; padding: 16px 13px; }
  .share-task-number { width: 25px; height: 25px; }
  .share-composer.compact { margin-left: -36px; }
}

.page-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 28px; }
.page-header h1 { font-size: 27px; letter-spacing: -.035em; margin: 3px 0 5px; color: #172236; }
.page-header p { margin: 0; color: var(--muted); font-size: 13px; }
.eyebrow { color: #697386; font-size: 10px; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; }
.button { border: 1px solid transparent; border-radius: 7px; padding: 9px 14px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.button.primary { background: var(--navy); color: white; box-shadow: 0 2px 5px rgba(23,38,60,.15); }
.button.primary:hover { background: #223958; }
.button.secondary { background: white; border-color: #dfe3e9; color: #4b5668; }
.success-button { background: #e9f7f2; color: #20815f; }
.attention-banner { background: linear-gradient(100deg, #fff7f2, #fff); border: 1px solid #f4dfd2; border-radius: 10px; padding: 13px 16px; display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }
.attention-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; background: #feeadf; color: #d55f26; }
.attention-banner > div:nth-child(2) { display: flex; flex-direction: column; gap: 2px; }
.attention-banner span { color: #b2552c; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.attention-banner strong { font-size: 12px; color: #422d23; }
.attention-banner button { margin-left: auto; border: 0; background: transparent; color: #b2552c; font-weight: 700; font-size: 11px; display: flex; align-items: center; gap: 6px; }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin-bottom: 16px; }
.stat-card { background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow); border-radius: 10px; padding: 15px; display: flex; align-items: center; gap: 12px; text-align: left; color: inherit; }
.stat-card:hover { transform: translateY(-1px); box-shadow: 0 8px 25px rgba(23,32,42,.07); }
.stat-card > div:nth-child(2) { display: grid; grid-template-columns: 1fr auto; flex: 1; align-items: baseline; }
.stat-card span { color: #697386; font-size: 10px; font-weight: 600; }
.stat-card strong { font: 700 23px Manrope; color: #172236; grid-row: span 2; grid-column: 2; }
.stat-card small { color: #9aa2ae; font-size: 9px; }
.stat-card > svg { color: #aab1bd; }
.stat-icon { width: 34px; height: 34px; border-radius: 8px; display: grid; place-items: center; }
.stat-icon.red { color: #d04c4c; background: #fdeeee; }.stat-icon.amber { color: #c07a1a; background: #fff4df; }.stat-icon.blue { color: #4169e1; background: #edf1ff; }.stat-icon.purple { color: #7e5acb; background: #f2edff; }
.dashboard-grid { display: grid; grid-template-columns: 1fr 1fr .82fr; gap: 16px; }
.card { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--shadow); min-width: 0; }
.card.span-2 { grid-column: span 2; }
.card-header { display: flex; justify-content: space-between; align-items: center; padding: 17px 18px 13px; border-bottom: 1px solid #eef0f3; }
.card-header h2 { font-size: 13px; margin: 0 0 3px; color: #1c2738; }
.card-header p { font-size: 9px; color: #8c96a5; margin: 0; }
.card-header button { border: 0; background: transparent; color: #5c6e8e; font-size: 10px; font-weight: 600; display: flex; align-items: center; }
.task-row { display: flex; align-items: center; gap: 11px; padding: 13px 17px; border-bottom: 1px solid #f0f1f3; min-width: 0; }
.task-row:last-child { border-bottom: 0; }
.task-row.compact { padding: 12px 17px; }
.task-check { width: 18px; height: 18px; border: 1.5px solid #c6ccd5; background: white; border-radius: 5px; flex: 0 0 auto; display: grid; place-items: center; color: white; padding: 0; }
.task-check:hover { border-color: #5b7cfa; }
.task-check.checked { background: #35a47a; border-color: #35a47a; }
.task-main { flex: 1; min-width: 0; }
.text-button { border: 0; background: transparent; padding: 0; text-align: left; color: inherit; }
.task-title { display: block; font-size: 11px; font-weight: 600; margin-bottom: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.task-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 12px; color: #8992a0; font-size: 9px; }
.task-meta span { position: relative; }
.task-meta > span:not(:last-child):after { content: ""; width: 2px; height: 2px; background: #c2c7cf; position: absolute; right: -7px; top: 5px; border-radius: 50%; }
.task-meta .danger-text { color: #c84b4b; font-weight: 600; }
.topic-mini { display: inline-flex; align-items: center; gap: 4px; }
.topic-mini i { width: 5px; height: 5px; border-radius: 50%; }
.badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 5px; padding: 3px 7px; font-size: 8px; font-weight: 700; white-space: nowrap; }
.badge-neutral { background: #f0f2f4; color: #66717e; }.badge-danger { background: #fdecec; color: #bd4545; }.badge-warning { background: #fff2dc; color: #ad6a12; }.badge-success { background: #e7f7f0; color: #20815f; }.badge-info { background: #edf2ff; color: #4c68b8; }.badge-purple { background: #f1ebff; color: #7654b8; }
.task-menu { flex: 0 0 auto; }
.owner-list { padding: 8px 17px 12px; }
.owner-row { display: grid; grid-template-columns: 30px minmax(80px, 1fr) 60px 15px; align-items: center; gap: 9px; padding: 8px 0; }
.owner-row .avatar { width: 28px; height: 28px; }.color-2 { background: #f8e9de; color: #b86737; }.color-3 { background: #e5f4ef; color: #278466; }.color-4 { background: #f1e9f7; color: #795399; }
.owner-row > div:nth-child(2) { display: flex; flex-direction: column; min-width: 0; }
.owner-row strong { font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.owner-row span { color: #949daa; font-size: 8px; }
.owner-row b { font-size: 10px; }
.bar { background: #eef0f3; height: 3px; border-radius: 4px; overflow: hidden; }.bar i { display: block; height: 100%; background: #7590ed; border-radius: 4px; }
.meeting-timeline { padding: 9px 18px 13px; }
.timeline-row { display: grid; grid-template-columns: 34px 12px 1fr; min-height: 61px; }
.date-box { height: 36px; border: 1px solid #e6e8ec; border-radius: 7px; display: flex; flex-direction: column; align-items: center; justify-content: center; }.date-box strong { font: 700 13px Manrope; }.date-box span { font-size: 7px; text-transform: uppercase; color: #8e97a5; }
.timeline-line { position: relative; display: flex; justify-content: center; }.timeline-line:after { content: ""; width: 1px; position: absolute; top: 8px; bottom: 0; background: #e8eaee; }.timeline-line i { width: 5px; height: 5px; background: #7590ed; border-radius: 50%; margin-top: 15px; z-index: 1; }
.timeline-row:last-child .timeline-line:after { display: none; }
.timeline-content { min-width: 0; padding: 1px 0 12px 5px; display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 5px 8px; }.timeline-content strong { font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.timeline-content > span:last-child { grid-column: 1 / -1; display: flex; align-items: center; gap: 5px; color: #8f98a6; font-size: 8px; }
.topic-ranking { padding: 7px 16px 11px; }.topic-ranking button { border: 0; background: transparent; display: grid; grid-template-columns: 17px 7px 1fr 20px; align-items: center; gap: 8px; width: 100%; padding: 8px 0; color: inherit; text-align: left; }.topic-ranking button:hover strong { color: #4169e1; }.topic-ranking .rank { color: #9aa2ae; font-size: 9px; }.topic-ranking i { width: 7px; height: 7px; border-radius: 50%; }.topic-ranking div { display: flex; flex-direction: column; }.topic-ranking strong { font-size: 10px; }.topic-ranking div span { font-size: 8px; color: #929ba8; }.topic-ranking b { font-size: 10px; color: #566273; }

.toolbar, .filter-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 17px; }
.toolbar > span { margin-left: auto; font-size: 10px; color: #8a93a1; }
.search-box.standalone { background: white; border: 1px solid #dfe3e9; padding: 9px 11px; border-radius: 7px; max-width: 340px; }
.filter-bar .search-box { margin-right: auto; }
select, input, textarea { border: 1px solid #dfe3e9; background: white; border-radius: 7px; padding: 9px 10px; outline: none; color: #2b3545; font-size: 12px; }
select:focus, input:focus, textarea:focus { border-color: #7a95ed; box-shadow: 0 0 0 3px rgba(91,124,250,.1); }
.meeting-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.meeting-card { border: 1px solid var(--border); background: var(--surface); border-radius: 10px; padding: 17px; text-align: left; color: inherit; box-shadow: var(--shadow); display: flex; flex-direction: column; min-height: 220px; }
.meeting-card:hover { border-color: #bfc9e8; transform: translateY(-2px); box-shadow: 0 10px 30px rgba(23,32,42,.07); }
.meeting-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }.meeting-card-top > span:last-child { color: #8e97a5; font-size: 9px; }
.meeting-card h3 { font-size: 13px; line-height: 1.45; margin-bottom: 8px; }
.meeting-card p { color: #7b8492; font-size: 10px; line-height: 1.5; margin-bottom: 14px; }
.participants { display: flex; align-items: center; gap: 5px; color: #7e8795; font-size: 9px; margin-top: auto; }
.meeting-card-footer { border-top: 1px solid #eef0f3; margin-top: 13px; padding-top: 12px; display: flex; justify-content: space-between; color: #6e7887; font-size: 9px; }.meeting-card-footer span { display: flex; align-items: center; gap: 5px; }
.simple-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 12px; margin-bottom: 28px; }
.simple-summary button { border: 1px solid var(--border); background: var(--surface); border-radius: 11px; padding: 18px; text-align: left; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 3px; color: inherit; }
.simple-summary button:hover { border-color: #bfc9e8; }
.simple-summary strong { font: 700 25px Manrope; color: #172236; }
.simple-summary span { color: #7d8795; font-size: 10px; }
.reminder-section { margin-bottom: 28px; }
.reminder-section .section-heading > span { color: #8a93a1; font-size: 9px; }
.reminder-groups { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.reminder-group { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--shadow); overflow: hidden; }
.reminder-group-title { width: 100%; border: 0; display: flex; align-items: center; gap: 8px; padding: 11px 13px; border-bottom: 1px solid #eef0f3; font-size: 10px; font-weight: 700; text-align: left; }
.reminder-group-title > span:first-child { flex: 1; }
.reminder-group-open { display: inline-flex; align-items: center; gap: 2px; font-size: 8px; font-weight: 600; opacity: .72; }
.reminder-group-title:hover .reminder-group-open { opacity: 1; }
.reminder-group-title b { min-width: 20px; height: 20px; padding: 0 6px; display: grid; place-items: center; border-radius: 10px; font-size: 9px; }
.reminder-group.overdue .reminder-group-title { color: #b54a4a; background: #fff7f7; }.reminder-group.overdue .reminder-group-title b { background: #fde5e5; }
.reminder-group.today .reminder-group-title { color: #9b661c; background: #fffaf1; }.reminder-group.today .reminder-group-title b { background: #ffedcd; }
.reminder-group.upcoming .reminder-group-title { color: #4e65ad; background: #f7f9ff; }.reminder-group.upcoming .reminder-group-title b { background: #e7edff; }
.reminder-item { display: flex; align-items: flex-start; gap: 9px; padding: 12px 13px; border-bottom: 1px solid #dde0e5; background: var(--surface); }
.reminder-item:last-child { border-bottom: 0; }
.reminder-item:hover { background: #e9ebee; }
.reminder-item > .task-check { margin-top: 1px; }
.reminder-content { flex: 1; min-width: 0; border: 0; background: transparent; padding: 0; display: grid; grid-template-columns: 1fr auto; align-items: start; gap: 8px; text-align: left; color: #657083; }
.reminder-content > div { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.reminder-list strong { color: #303b4c; font-size: 13px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.reminder-list span, .reminder-list time { color: #8b94a1; font-size: 10px; }
.reminder-list time { white-space: nowrap; }
.reminder-list .meeting-label, .reminder-list .personal-label { border-radius: 10px; padding: 2px 6px; font-weight: 700; }
.reminder-list .meeting-label { color: #526bb7; background: #edf2ff; }
.reminder-list .personal-label { color: #6b5b91; background: #f2edfb; }
.reminder-list p { color: #a0a7b1; font-size: 9px; text-align: center; padding: 18px 10px; margin: 0; }
.reminder-edit-button { border: 1px solid #e1e5ec; background: #fff; color: #667389; border-radius: 8px; padding: 6px 8px; display: inline-flex; align-items: center; gap: 4px; font-size: 9px; font-weight: 700; }
.reminder-edit-button:hover { border-color: #b8c5ef; color: #405db3; background: #f6f8ff; }
.reminder-edit-button.compact { padding: 5px; }
.reminder-empty { border: 1px dashed #b7bdc6; border-radius: 10px; padding: 17px; display: flex; align-items: center; justify-content: center; gap: 8px; color: #737e8c; font-size: 10px; background: rgba(227,230,234,.78); }
.expanded-reminders { padding: 8px 22px 22px; }
.expanded-reminder-item { display: grid; grid-template-columns: 20px 1fr auto auto; align-items: start; gap: 11px; padding: 15px 4px; border-bottom: 1px solid #edf0f3; }
.expanded-reminder-item:last-child { border-bottom: 0; }
.expanded-reminder-item > .task-check { margin-top: 2px; }
.expanded-reminder-content { min-width: 0; border: 0; background: transparent; padding: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 7px; text-align: left; }
.expanded-reminder-content strong { color: #293546; font-size: 15px; line-height: 1.5; }
.expanded-reminder-content .meeting-label, .expanded-reminder-content .personal-label { border-radius: 10px; padding: 3px 7px; font-size: 8px; font-weight: 700; }
.expanded-reminder-content .meeting-label { color: #526bb7; background: #edf2ff; }
.expanded-reminder-content .personal-label { color: #6b5b91; background: #f2edfb; }
.expanded-reminder-item time { color: #778296; font-size: 10px; white-space: nowrap; padding-top: 3px; }
.personal-reminder-toolbar .button { padding: 8px 11px; }
.personal-reminder-toolbar .overdue-filter.secondary { border-color: #e5bcbc; color: #a94747; background: #fff6f6; }
.retention-notice { display: flex; align-items: center; gap: 8px; margin: -5px 0 14px; padding: 10px 12px; border: 1px solid #ead7bc; border-radius: 9px; background: #fff8eb; color: #856020; font-size: 10px; line-height: 1.45; }
.personal-reminder-list { display: grid; gap: 10px; }
.personal-reminder-list > .empty-state { background: var(--surface); border: 1px solid var(--border); border-radius: 11px; }
.personal-reminder-card { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: start; gap: 12px; padding: 16px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface); box-shadow: var(--shadow); }
.personal-reminder-card.overdue { border-color: #e2b6b6; background: #fff8f8; }
.personal-reminder-card > .task-check { margin-top: 2px; }
.personal-reminder-copy { min-width: 0; display: grid; gap: 8px; }
.personal-reminder-copy > div:first-child { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.personal-reminder-copy strong { color: #2d394b; font-size: 14px; line-height: 1.5; }
.personal-reminder-copy time { display: inline-flex; align-items: center; gap: 4px; color: #748093; font-size: 9px; white-space: nowrap; }
.personal-reminder-date { display: flex; align-items: center; gap: 7px; }
.personal-reminder-date > span { padding: 3px 7px; border-radius: 12px; background: #f7dddd; color: #a33f3f; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.personal-reminder-card.overdue .personal-reminder-copy time { color: #a64a4a; }
.personal-reminder-attachment-step { padding: 20px 22px 22px; display: grid; gap: 10px; }
.personal-reminder-attachment-step > strong { color: #2d394b; font-size: 14px; line-height: 1.5; }
.personal-reminder-attachment-step > p { margin: 0; color: #748093; font-size: 10px; line-height: 1.5; }
.personal-reminder-edit-attachments { margin: 0 22px 22px; padding: 14px; border: 1px solid #e1e5ec; border-radius: 9px; background: #f8f9fb; }
.meeting-preview { margin-top: 4px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 14px; }
.section-heading h2 { font-size: 15px; margin: 0 0 3px; }
.section-heading p { color: #8992a0; font-size: 10px; margin: 0; }
.section-heading button { border: 0; background: transparent; color: #5c6e8e; font-size: 10px; font-weight: 600; display: flex; align-items: center; gap: 3px; }
.compact-grid { grid-template-columns: repeat(3, 1fr); }
.meeting-card.simple-card { min-height: 155px; }
.meeting-card.simple-card h3 { margin: 12px 0 4px; font-size: 14px; }
.meeting-card.simple-card > p { margin: 0; font-size: 10px; }
.meeting-card-status { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.meeting-person { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: #edf2ff; color: #4c68b8; }
.meeting-new-badge { display: inline-flex; align-items: center; gap: 4px; padding: 5px 8px; border-radius: 14px; background: #fff0d8; color: #9b6113; font-size: 9px; font-weight: 700; box-shadow: inset 0 0 0 1px #f2d7ad; }
.meeting-completed-badge { display: inline-flex; align-items: center; gap: 4px; padding: 5px 8px; border-radius: 14px; background: #e5f5ee; color: #26765a; font-size: 9px; font-weight: 700; box-shadow: inset 0 0 0 1px #c3e7d9; }
.meeting-detail { padding: 18px 22px 22px; }
.meeting-detail-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.meeting-detail-actions > span { color: #7d8795; font-size: 10px; }
.meeting-detail-actions > div { display: flex; flex-wrap: wrap; gap: 8px; }
.meeting-detail-actions .share-action { color: #4059a8; border-color: #cbd5f3; background: #f4f6ff; }
.meeting-share-error { margin: 0 0 12px; }
.agenda-list { border: 1px solid #e7e9ed; border-radius: 10px; overflow: hidden; }
.meeting-contributions { margin-top: 18px; padding-top: 17px; border-top: 1px solid #dfe3e9; }
.preparation-status { margin-bottom: 14px; padding: 12px 13px; display: flex; align-items: center; gap: 10px; border-radius: 9px; }
.preparation-status.completed { color: #28785b; background: #e8f6f0; border: 1px solid #c8e8dc; }
.preparation-status.pending { color: #86631d; background: #fff8e8; border: 1px solid #ecddb9; }
.preparation-status > div { display: flex; flex-direction: column; gap: 2px; }
.preparation-status strong { color: inherit; font-size: 11px; }
.preparation-status span { color: #6f7a88; font-size: 9px; }
.contribution-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.contribution-heading > div { display: flex; align-items: center; gap: 9px; color: #536bb3; }
.contribution-heading > div > span { display: flex; flex-direction: column; gap: 2px; }
.contribution-heading strong { color: #303d51; font-size: 13px; }
.contribution-heading small { color: #87909e; font-size: 9px; }
.contribution-heading .button { padding: 7px 10px; font-size: 9px; }
.contribution-empty { padding: 18px; border: 1px dashed #bdc4ce; border-radius: 9px; color: #7b8594; background: rgba(255,255,255,.3); text-align: center; font-size: 10px; }
.contribution-group { display: grid; gap: 8px; margin-top: 14px; }
.contribution-group h4 { display: flex; align-items: center; gap: 6px; margin: 0; color: #627086; font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.contribution-card { padding: 12px 13px; border: 1px solid #dfe3e9; border-radius: 9px; background: #f7f8fa; }
.contribution-card.suggestion { border-color: #ddd8c4; background: #fffdf5; }
.contribution-card > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.contribution-card > div strong { color: #405069; font-size: 10px; }
.contribution-card > div span { color: #929aa6; font-size: 8px; }
.contribution-card > small { display: inline-block; margin-top: 7px; padding: 3px 6px; border-radius: 10px; background: #e9edf6; color: #617099; font-size: 8px; }
.contribution-card p { margin: 7px 0 0; color: #3e4a5d; font-size: 12px; line-height: 1.5; white-space: pre-wrap; }
.contribution-card .button { margin-top: 10px; padding: 7px 9px; font-size: 9px; }
.contribution-actions { display: flex; align-items: center; justify-content: flex-start !important; gap: 10px; }
.delete-contribution { width: fit-content; border: 0; background: transparent; padding: 3px 0; display: inline-flex; align-items: center; gap: 4px; color: #a24b4b; font-size: 9px; font-weight: 700; }
.delete-contribution:hover:not(:disabled) { color: #842e2e; }
.delete-contribution:disabled { opacity: .55; cursor: wait; }
.contribution-actions .delete-contribution { margin-top: 10px; }
.agenda-item { padding: 14px 15px; border-bottom: 1px solid #dde0e5; background: var(--surface); }
.agenda-item:last-child { border-bottom: 0; }
.agenda-main { display: flex; align-items: flex-start; gap: 11px; }
.agenda-main > .task-check { margin-top: 1px; }
.agenda-copy { display: flex; flex-direction: column; gap: 5px; flex: 1; min-width: 0; }
.agenda-copy > span { font-size: 15px; line-height: 1.5; color: #303b4c; }
.agenda-item small { color: #6b78a0; font-size: 9px; display: flex; align-items: center; gap: 4px; }
.task-description-editor { display: flex; flex-direction: column; gap: 7px; }
.task-description-editor textarea { width: 100%; resize: vertical; border: 1px solid #d9dee6; border-radius: 7px; padding: 9px 10px; color: #303b4c; font-size: 11px; line-height: 1.45; }
.task-description-editor > div { display: flex; gap: 7px; }
.task-description-editor .button { padding: 7px 9px; font-size: 9px; }
.detail-actions { display: flex; align-items: center; gap: 13px; margin-top: 2px; }
.detail-actions button { border: 0; background: transparent; padding: 2px 0; color: #788495; font-size: 9px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; }
.detail-actions button:not(:disabled):hover { color: #4169e1; }
.detail-actions .details-toggle svg { transition: transform .15s ease; }
.detail-actions .details-toggle.expanded svg { transform: rotate(180deg); }
.detail-actions button:disabled { opacity: 1; cursor: default; color: #a1a8b2; }
.task-attachments { display: grid; gap: 7px; margin-top: 4px; }
.task-attachments.compact { margin-top: 2px; }
.task-attachments-title { display: flex; align-items: center; gap: 6px; color: #748093; font-size: 9px; font-weight: 700; }
.task-attachments-title > span { margin-right: 3px; }
.task-attachments-title button { border: 0; background: transparent; color: #526bb2; padding: 2px 0; display: inline-flex; align-items: center; gap: 4px; font-size: 9px; font-weight: 700; }
.task-attachments-title button:hover:not(:disabled) { color: #324fba; }
.task-attachment-list { display: flex; flex-wrap: wrap; gap: 6px; }
.task-attachment-item { display: inline-flex; align-items: center; gap: 3px; max-width: 100%; }
.task-attachment-item > button:first-child { min-width: 0; max-width: 260px; border: 1px solid #dbe1ea; background: #f9fafc; color: #465366; border-radius: 16px; padding: 5px 7px; display: inline-flex; align-items: center; gap: 5px; font-size: 9px; }
.task-attachment-item > button:first-child span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-attachment-item > button:first-child small { color: #8c96a6; font-size: 8px; white-space: nowrap; }
.task-attachment-item > button:first-child:hover:not(:disabled) { border-color: #b8c5ef; color: #405db3; background: #f4f6ff; }
.task-attachment-delete { border: 0; background: transparent; color: #a85a5a; padding: 3px; display: inline-flex; }
.task-attachment-delete:hover:not(:disabled) { color: #8e3535; }
.task-attachments > p { margin: 0; color: #ad4141; font-size: 9px; }
.task-shared-comments { display: grid; gap: 7px; margin-top: 10px; padding: 10px; border-left: 3px solid #7890df; border-radius: 0 8px 8px 0; background: #f2f5ff; }
.task-shared-comments > strong { display: flex; align-items: center; gap: 5px; color: #5068b0; font-size: 9px; text-transform: uppercase; letter-spacing: .04em; }
.task-shared-comments > div { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding-top: 7px; border-top: 1px solid #dfe5f7; }
.task-shared-comments > div span { color: #465a91; font-size: 9px; font-weight: 700; }
.task-shared-comments > div time { color: #8a94aa; font-size: 8px; }
.task-shared-comments > div p { grid-column: 1 / -1; margin: 2px 0 0; color: #3d4b64; font-size: 12px; line-height: 1.45; white-space: pre-wrap; }
.task-shared-comments .delete-contribution { grid-column: 1 / -1; }
.reply-trigger, .owner-reply button { width: fit-content; border: 0; background: transparent; padding: 3px 0; display: inline-flex; align-items: center; gap: 4px; color: #526bb2; font-size: 9px; font-weight: 700; }
.reply-editor { grid-column: 1 / -1; display: grid; gap: 7px; margin-top: 5px; }
.reply-editor textarea { width: 100%; resize: vertical; border: 1px solid #ccd5ee; background: white; font-size: 11px; line-height: 1.45; }
.reply-editor small { color: #808a9a; font-size: 8px; }
.reply-editor > span { color: #ad4141; font-size: 9px; }
.reply-editor > div { display: flex; gap: 7px; }
.reply-editor .button { padding: 7px 9px; font-size: 9px; }
.owner-reply { grid-column: 1 / -1; margin-top: 5px; padding: 9px 10px; border-radius: 7px; background: white; border: 1px solid #d8e0f5; }
.owner-reply > div { display: flex; justify-content: space-between; gap: 10px; }
.owner-reply > div strong { color: #405aa8; font-size: 9px; }
.owner-reply > div span { color: #929bad; font-size: 8px; }
.owner-reply p { margin: 5px 0 2px !important; color: #3c4a62 !important; font-size: 11px !important; }
.task-date-editor { display: flex; align-items: center; gap: 7px; padding: 8px; margin-top: 3px; border: 1px solid #e1e5eb; border-radius: 8px; background: #fafbfc; }
.task-date-editor input { min-width: 145px; border: 1px solid #d9dee6; border-radius: 6px; padding: 7px 8px; background: white; color: #364153; font-size: 10px; }
.task-date-editor .button { padding: 7px 9px; font-size: 9px; }
.subtask-list { margin: 12px 0 0 29px; border-left: 2px solid #edf0f4; padding-left: 12px; }
.subtask-item { min-height: 34px; display: flex; align-items: center; gap: 9px; padding: 5px 7px; border-radius: 6px; }
.subtask-item:hover { background: #f8f9fb; }
.subtask-item .task-check { width: 16px; height: 16px; border-radius: 4px; }
.subtask-item > span { flex: 1; color: #4a5566; font-size: 13px; line-height: 1.45; }
.subtask-item.completed > span { color: #9aa2ad; text-decoration: line-through; }
.delete-detail { border: 0; background: transparent; color: #b0b6bf; padding: 4px; opacity: 0; display: inline-flex; }
.subtask-item:hover .delete-detail { opacity: 1; }
.delete-detail:hover { color: #c64f4f; }
.subtask-form { display: flex; align-items: center; gap: 7px; padding: 7px 0 2px; }
.subtask-form input { flex: 1; min-width: 0; border: 1px solid #dfe3e9; border-radius: 7px; padding: 8px 10px; outline: 0; color: #303b4c; font-size: 13px; }
.subtask-form input:focus { border-color: #8ca3ea; box-shadow: 0 0 0 3px rgba(65,105,225,.08); }
.subtask-form .button { padding: 7px 10px; font-size: 9px; }
.button.danger { border-color: #ddb5b5; background: #f5dddd; color: #963f3f; }
.button.danger:hover { background: #efcece; }
.nested-form { border-top: 1px solid #e8eaee; background: #fafbfc; }
.nested-form .form-stack { padding-top: 17px; }
.email-draft { padding: 18px 22px 22px; }
.email-draft-intro { display: flex; align-items: center; gap: 10px; padding: 11px 12px; margin-bottom: 15px; border-radius: 8px; background: #eef3ff; color: #506ab7; }
.email-draft-intro > div { display: flex; flex-direction: column; gap: 2px; }
.email-draft-intro strong { color: #31466f; font-size: 10px; }
.email-draft-intro span { color: #7383a1; font-size: 9px; }
.email-fields { display: flex; flex-direction: column; gap: 12px; }
.email-fields label { display: flex; flex-direction: column; gap: 6px; }
.email-fields label > span { color: #4e5969; font-size: 10px; font-weight: 600; }
.email-fields textarea { resize: vertical; min-height: 220px; line-height: 1.55; }
.share-preparation-panel { padding: 20px 22px 22px; }
.share-preparation-section { margin: 16px 0 18px; border: 1px solid #dfe5f2; border-radius: 12px; background: #fbfcff; }
.share-panel-intro { display: flex; align-items: center; gap: 11px; padding: 13px; border-radius: 9px; background: #eef3ff; color: #506ab7; }
.share-panel-intro > div { display: flex; flex-direction: column; gap: 3px; }
.share-panel-intro strong { color: #31466f; font-size: 12px; }
.share-panel-intro span { color: #7383a1; font-size: 10px; line-height: 1.4; }
.share-link-field { display: flex; flex-direction: column; gap: 6px; margin-top: 16px; }
.share-link-field > span { color: #4e5969; font-size: 10px; font-weight: 600; }
.share-link-field input { width: 100%; color: #536176; background: white; }
.share-panel-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.share-preparation-panel > .form-success, .share-preparation-panel > .form-error { margin-top: 12px; }
.share-steps { display: grid; gap: 10px; margin: 18px 0; padding: 0; list-style: none; counter-reset: share-step; }
.share-steps li { position: relative; min-height: 35px; padding-left: 44px; display: flex; flex-direction: column; justify-content: center; gap: 2px; counter-increment: share-step; }
.share-steps li:before { content: counter(share-step); position: absolute; left: 0; top: 0; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #e8edfc; color: #4c65b4; font: 700 11px Manrope; }
.share-steps strong { color: #344154; font-size: 11px; }
.share-steps span { color: #7d8795; font-size: 10px; line-height: 1.4; }
.share-panel-footer { display: flex; justify-content: space-between; gap: 8px; padding-top: 15px; border-top: 1px solid #e5e8ed; }
.new-contact-fields { display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: 8px; padding: 11px; border: 1px solid #e3e7ed; border-radius: 8px; background: white; }
.new-contact-fields .button { height: 36px; }
.optional-fields { border-top: 1px solid #eef0f3; padding-top: 10px; }
.optional-fields summary { color: #758093; font-size: 10px; cursor: pointer; margin-bottom: 10px; }
.simple-suggestion { display: grid; gap: 12px; }
.simple-suggestion label { display: flex; flex-direction: column; gap: 6px; }
.simple-suggestion label > span { color: #4e5969; font-size: 10px; font-weight: 600; }
.simple-suggestion textarea { resize: vertical; line-height: 1.5; }
.capture-hint { color: #8b94a1; font-size: 10px; text-align: center; margin-top: 12px; }
.table-heading { display: flex; justify-content: space-between; padding: 12px 17px; background: #fafbfc; border-bottom: 1px solid #eceef1; font-size: 9px; color: #8b94a1; }
.empty-state { text-align: center; color: #818a98; padding: 50px 20px; }.empty-icon { width: 38px; height: 38px; background: #eaf7f2; color: #299172; display: grid; place-items: center; border-radius: 50%; margin: 0 auto 12px; }.empty-state strong { display: block; color: #3a4555; font-size: 13px; }.empty-state p { font-size: 10px; margin: 5px 0; }
.topic-hero { border-radius: 12px; background: linear-gradient(110deg, #15243a, #243b5d); color: white; padding: 22px 25px; display: grid; grid-template-columns: 1fr 130px 130px; align-items: center; gap: 20px; margin-bottom: 16px; box-shadow: 0 12px 30px rgba(23,38,60,.12); }
.topic-hero > div:first-child { display: grid; grid-template-columns: 22px 1fr; }.topic-hero > div:first-child svg { color: #8ba5ff; }.topic-hero > div:first-child span { font-size: 9px; text-transform: uppercase; color: #9eadd0; letter-spacing: .08em; }.topic-hero > div:first-child strong, .topic-hero > div:first-child p { grid-column: 1 / -1; }.topic-hero > div:first-child strong { font: 600 17px Manrope; margin-top: 11px; }.topic-hero > div:first-child p { color: #aeb9cb; font-size: 10px; margin: 5px 0 0; }
.topic-hero-stat { border-left: 1px solid rgba(255,255,255,.12); padding-left: 22px; display: flex; flex-direction: column; }.topic-hero-stat strong { font: 700 26px Manrope; }.topic-hero-stat span { color: #9eabc0; font-size: 9px; }
.topics-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; }
.topic-card { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 17px; box-shadow: var(--shadow); }
.topic-card-title { display: flex; align-items: center; gap: 8px; }.topic-card-title i { width: 9px; height: 9px; border-radius: 50%; }.topic-card-title h3 { font-size: 12px; margin: 0; flex: 1; }
.topic-numbers { display: grid; grid-template-columns: repeat(3, 1fr); margin: 20px 0 14px; }.topic-numbers div { display: flex; flex-direction: column; border-right: 1px solid #eceef1; padding-left: 10px; }.topic-numbers div:first-child { padding-left: 0; }.topic-numbers div:last-child { border: 0; }.topic-numbers strong { font: 700 17px Manrope; }.topic-numbers span { color: #939ba8; font-size: 8px; }
.progress { height: 4px; background: #edf0f3; border-radius: 5px; overflow: hidden; }.progress i { display: block; height: 100%; border-radius: 5px; }.completion { color: #8b94a2; font-size: 8px; display: block; margin-top: 6px; text-align: right; }
.risk-list { display: grid; gap: 11px; }.risk-card { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 17px; display: flex; align-items: center; gap: 15px; box-shadow: var(--shadow); }.risk-level { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 8px; flex: 0 0 auto; }.risk-level.alto { color: #c64c4c; background: #fdecec; }.risk-level.medio { color: #b67418; background: #fff3de; }.risk-level.bajo { color: #687386; background: #e4e7eb; }
.risk-content { flex: 1; }.risk-content > div { display: flex; gap: 5px; }.risk-content h3 { font-size: 12px; margin: 8px 0 5px; }.risk-content p { color: #737d8d; font-size: 10px; margin: 0 0 5px; }.risk-content > span { color: #a0a7b1; font-size: 8px; }

.modal-backdrop { position: fixed; inset: 0; background: rgba(10,18,30,.48); backdrop-filter: blur(2px); z-index: 50; display: grid; place-items: center; padding: 20px; }
.modal { width: min(590px, 100%); max-height: calc(100vh - 40px); overflow: auto; border-radius: 12px; background: var(--surface); box-shadow: 0 25px 70px rgba(10,18,30,.25); }.modal-wide { width: min(850px, 100%); }
.modal-header { display: flex; justify-content: space-between; padding: 20px 22px 15px; border-bottom: 1px solid #eceef1; }.modal-header h2 { font-size: 17px; margin: 0 0 4px; }.modal-header p { margin: 0; color: #828b99; font-size: 10px; }
.form-stack { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 14px; }.form-stack label { display: flex; flex-direction: column; gap: 6px; }.form-stack label > span, fieldset legend, .suggestion-grid label > span, .suggested-topics > span { color: #4e5969; font-size: 10px; font-weight: 600; }.form-stack textarea { resize: vertical; line-height: 1.45; }.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.area-field { display: flex; gap: 7px; }.area-field select { flex: 1; min-width: 0; }.area-add-button { border: 0; background: transparent; color: #526dcb; padding: 0 3px; font-size: 9px; font-weight: 600; white-space: nowrap; }.area-add-button:hover { color: #324ca5; }.area-create { display: flex; gap: 7px; }.area-create input { flex: 1; min-width: 0; }.area-create .button { padding: 8px 11px; }.field-error { color: #ad4141; font-size: 9px; }
fieldset { border: 0; padding: 0; margin: 0; }.topic-picker { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 8px; }.topic-option { border: 1px solid #e1e4e9; background: white; border-radius: 20px; padding: 6px 9px; display: flex; align-items: center; gap: 6px; font-size: 9px; color: #67717f; }.topic-option i { width: 6px; height: 6px; border-radius: 50%; }.topic-option.selected { border-color: #7690e9; background: #f4f6ff; color: #3954a4; }
.form-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 5px; }
.form-error, .form-success { border-radius: 7px; padding: 9px 10px; margin: 0; font-size: 10px; line-height: 1.4; }
.form-error { background: #fff0f0; color: #ad4141; border: 1px solid #f2d8d8; }
.form-success { background: #eaf7f2; color: #24785e; border: 1px solid #d2eee4; }

.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 50% 0%, #d9deea 0, #cfd4da 38%, #cfd4da 100%); }
.auth-panel { width: min(430px, 100%); background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 28px; box-shadow: 0 18px 55px rgba(23,32,42,.1); }
.auth-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 35px; }
.auth-brand > div:last-child { display: flex; flex-direction: column; }
.auth-brand strong { font: 700 13px Manrope; color: #172236; }
.auth-brand span { color: #8a94a3; font-size: 10px; }
.auth-copy h1 { font-size: 24px; letter-spacing: -.035em; margin: 5px 0 7px; color: #172236; }
.auth-copy p { color: #737d8c; font-size: 11px; line-height: 1.55; margin-bottom: 23px; }
.auth-form { display: flex; flex-direction: column; gap: 13px; }
.auth-form label { display: flex; flex-direction: column; gap: 6px; }
.auth-form label > span { color: #4e5969; font-size: 10px; font-weight: 600; }
.auth-form label > div { position: relative; display: flex; align-items: center; }
.auth-form label svg { position: absolute; left: 11px; color: #87919f; }
.auth-form input { width: 100%; padding-left: 36px; height: 41px; }
.auth-submit { width: 100%; margin-top: 3px; height: 41px; }
.auth-switch { display: block; border: 0; background: transparent; color: #5b6fa9; font-size: 10px; font-weight: 600; margin: 16px auto 0; }

.capture-page, .assistant-page { max-width: 850px; margin: 0 auto; }
.capture-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 10px 35px rgba(23,32,42,.06); overflow: hidden; }.capture-input-wrap { display: flex; gap: 12px; padding: 20px; }.capture-input-wrap svg { color: #6a83da; margin-top: 3px; flex: 0 0 auto; }.capture-input-wrap textarea { border: 0; box-shadow: none; padding: 0; resize: none; width: 100%; font-size: 15px; line-height: 1.6; color: #273244; background: transparent; }.capture-input-wrap textarea::placeholder { color: #a4abb5; }
.capture-footer { border-top: 1px solid #eceef1; background: #fafbfc; padding: 11px 14px 11px 20px; display: flex; align-items: center; justify-content: space-between; }.capture-footer > span { color: #939ba8; font-size: 9px; display: flex; gap: 5px; align-items: center; }
.suggestion-card { margin-top: 18px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 19px; box-shadow: var(--shadow); }.suggestion-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 17px; }.suggestion-head > div { display: flex; align-items: center; gap: 7px; color: #3d5dbf; }.suggestion-head strong { color: #273244; font-size: 12px; }
.suggestion-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.suggestion-grid label { display: flex; flex-direction: column; gap: 6px; }.suggestion-grid label:first-child { grid-row: span 2; }.suggestion-grid textarea { resize: none; height: 100%; }.suggested-topics { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 7px; }.suggested-topics > div { display: flex; gap: 6px; }
.capture-success { max-width: 500px; margin: 100px auto; text-align: center; }.capture-success > div { width: 58px; height: 58px; display: grid; place-items: center; margin: 0 auto 17px; border-radius: 50%; background: #e7f7f0; color: #26916e; }.capture-success h1 { font-size: 23px; }.capture-success p { color: #7c8593; font-size: 12px; line-height: 1.5; margin-bottom: 22px; }
.assistant-empty { text-align: center; padding: 35px 20px 24px; }.assistant-orb { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 17px; margin: 0 auto 17px; color: white; background: linear-gradient(145deg, #5575df, #263f8c); box-shadow: 0 12px 28px rgba(65,105,225,.24); }.assistant-empty h2 { font-size: 17px; margin-bottom: 6px; }.assistant-empty p { color: #7e8795; font-size: 11px; }
.question-chips { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 25px; }.question-chips button { border: 1px solid var(--border); background: var(--surface); border-radius: 9px; padding: 13px; color: #536071; font-size: 10px; text-align: left; display: flex; justify-content: space-between; gap: 10px; box-shadow: var(--shadow); }.question-chips button:hover { border-color: #9badeb; color: #3e5ab8; }
.chat { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 20px; min-height: 350px; max-height: 520px; overflow: auto; }.message { display: flex; gap: 10px; margin-bottom: 18px; max-width: 85%; }.message > div { width: 28px; height: 28px; flex: 0 0 auto; border-radius: 8px; background: #eaf0ff; color: #4965bd; display: grid; place-items: center; font-size: 9px; font-weight: 700; }.message p { background: #e7e9ed; border-radius: 3px 10px 10px; padding: 11px 13px; margin: 0; font-size: 11px; line-height: 1.6; }.message.user { margin-left: auto; flex-direction: row-reverse; }.message.user > div { background: #17263c; color: white; border-radius: 50%; }.message.user p { background: #17263c; color: white; border-radius: 10px 3px 10px 10px; }
.assistant-input { margin-top: 12px; display: flex; gap: 8px; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 7px; box-shadow: var(--shadow); }.assistant-input input { flex: 1; border: 0; box-shadow: none; }.assistant-note { text-align: center; color: #9aa2ae; font-size: 8px; margin: 9px 0; }
.mobile-overlay { display: none; }

@media (max-width: 1100px) {
  .stat-grid { grid-template-columns: 1fr 1fr; }
  .dashboard-grid { grid-template-columns: 1fr 1fr; }
  .card.span-2 { grid-column: span 1; }
  .meeting-grid, .compact-grid { grid-template-columns: 1fr 1fr; }
  .topics-grid { grid-template-columns: 1fr 1fr; }
  .question-chips { grid-template-columns: 1fr; }
  .reminder-groups { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 761px) and (max-width: 1100px) {
  .agenda-copy > span { font-size: 17px; }
  .subtask-item > span, .subtask-form input { font-size: 15px; }
  .reminder-list strong { font-size: 15px; }
  .expanded-reminder-content strong { font-size: 17px; }
  .reminder-list span, .reminder-list time { font-size: 11px; }
}

@media (max-width: 760px) {
  .sidebar { transform: translateX(-100%); transition: transform .2s ease; width: 265px; }
  .sidebar.open { transform: translateX(0); }
  .main-shell { margin-left: 0; }
  .mobile-overlay { display: block; position: fixed; inset: 0; border: 0; background: rgba(10,18,30,.35); z-index: 29; }
  .menu-button, .mobile-close { display: inline-flex; }
  .mobile-close { margin-left: auto; color: #8995a8; }
  .topbar { height: 60px; padding: 0 15px; gap: 9px; }
  .topbar .search-box kbd { display: none; }
  .capture-button { padding: 9px !important; }
  .capture-button svg { margin: 0; }
  .capture-button { font-size: 0; }
  main { padding: 24px 16px 50px; }
  .page-header { align-items: flex-start; margin-bottom: 22px; }
  .page-header h1 { font-size: 23px; }
  .page-header p { font-size: 11px; max-width: 230px; }
  .attention-banner strong { font-size: 10px; }
  .attention-banner button { font-size: 0; }
  .stat-grid, .dashboard-grid, .meeting-grid, .compact-grid, .topics-grid { grid-template-columns: 1fr; }
  .simple-summary { grid-template-columns: 1fr 1fr; }
  .reminder-groups { grid-template-columns: 1fr; }
  .meeting-detail-actions { align-items: flex-start; flex-direction: column; }
  .meeting-detail-actions > div { width: 100%; }
  .meeting-detail-actions .button { flex: 1 1 145px; }
  .contribution-heading { align-items: flex-start; }
  .contribution-heading .button { flex: 0 0 auto; }
  .subtask-form { align-items: stretch; flex-wrap: wrap; }
  .subtask-form input { flex-basis: 100%; }
  .task-date-editor { align-items: stretch; flex-wrap: wrap; }
  .task-date-editor input { flex-basis: 100%; }
  .personal-reminder-toolbar { align-items: stretch; flex-wrap: wrap; }
  .personal-reminder-toolbar .search-box { flex-basis: 100%; max-width: none; }
  .personal-reminder-card { grid-template-columns: 20px minmax(0, 1fr); }
  .personal-reminder-card > .reminder-edit-button { grid-column: 2; width: fit-content; }
  .personal-reminder-copy > div:first-child { flex-direction: column; gap: 5px; }
  .new-contact-fields { grid-template-columns: 1fr; }
  .share-panel-actions .button { flex: 1; }
  .card.span-2 { grid-column: auto; }
  .stat-grid { gap: 9px; }
  .stat-card { padding: 12px; }
  .task-row { padding: 12px; }
  .task-row > .badge:nth-of-type(2), .task-menu { display: none; }
  .task-title { max-width: 210px; }
  .topic-hero { grid-template-columns: 1fr 1fr; }
  .topic-hero > div:first-child { grid-column: 1 / -1; }
  .topic-hero-stat { border-left: 0; padding-left: 0; }
  .risk-card { align-items: flex-start; flex-wrap: wrap; }.risk-content { min-width: calc(100% - 60px); }.risk-card > .button { margin-left: 53px; }
  .filter-bar { flex-wrap: wrap; }.filter-bar .search-box { flex-basis: 100%; max-width: none; }
  .suggestion-grid, .form-grid { grid-template-columns: 1fr; }.suggestion-grid label:first-child { grid-row: auto; }
  .modal-backdrop { padding: 0; align-items: end; }.modal { border-radius: 14px 14px 0 0; max-height: 92vh; }
  .assistant-page .page-header { display: block; }
}

@media (max-width: 420px) {
  .page-header .button { padding: 9px; font-size: 0; }
  .page-header .button svg { margin: 0; }
  .attention-banner { align-items: flex-start; }
  .stat-card strong { font-size: 20px; }
  .timeline-content strong { max-width: 185px; }
  .owner-row { grid-template-columns: 30px 1fr 45px 15px; }
  .capture-footer > span { display: none; }
  .capture-footer { justify-content: flex-end; }
}

/* Dark visual mode */
:root {
  color-scheme: dark;
  color: #e6ebf5;
  background: #08111f;
  --navy: #6f8cff;
  --blue: #8fa8ff;
  --border: #253349;
  --muted: #9aa7bc;
  --surface: #121d2d;
  --surface-soft: #172438;
  --surface-raised: #1b2a40;
  --text-strong: #f4f7fb;
  --text: #d9e1ee;
  --text-muted: #9aa7bc;
  --shadow: 0 1px 2px rgba(0, 0, 0, .28), 0 16px 45px rgba(0, 0, 0, .24);
}

body,
.app-shell,
.main-shell,
.app-loading {
  background:
    radial-gradient(circle at 22% 0%, rgba(80, 105, 180, .18) 0, rgba(8, 17, 31, 0) 36%),
    #08111f;
  color: var(--text);
}

.sidebar {
  background: linear-gradient(180deg, #0b1424, #070d18);
  border-right: 1px solid rgba(255, 255, 255, .06);
}

.topbar {
  background: rgba(10, 20, 35, .9);
  border-bottom-color: var(--border);
}

.card,
.stat-card,
.meeting-card,
.topic-card,
.risk-card,
.modal,
.auth-panel,
.capture-card,
.suggestion-card,
.chat,
.assistant-input,
.reminder-group,
.personal-reminder-card,
.personal-reminder-list > .empty-state,
.simple-summary button {
  background: var(--surface);
  border-color: var(--border);
  color: var(--text);
}

.stat-card:hover,
.meeting-card:hover,
.simple-summary button:hover {
  border-color: #3d5280;
  box-shadow: 0 14px 38px rgba(0, 0, 0, .32);
}

.page-header h1,
.stat-card strong,
.card-header h2,
.simple-summary strong,
.meeting-card h3,
.topic-card-title h3,
.risk-content h3,
.modal-header h2,
.auth-brand strong,
.auth-copy h1,
.suggestion-head strong,
.assistant-empty h2,
.empty-state strong,
.expanded-reminder-content strong,
.personal-reminder-copy strong,
.personal-reminder-attachment-step > strong,
.contribution-heading strong,
.agenda-copy > span,
.reminder-list strong,
.task-title,
.timeline-content strong,
.owner-row strong,
.topic-ranking strong {
  color: var(--text-strong);
}

.page-header p,
.eyebrow,
.search-box,
.search-box input,
.card-header p,
.meeting-card p,
.participants,
.meeting-card-footer,
.simple-summary span,
.reminder-section .section-heading > span,
.reminder-list span,
.reminder-list time,
.expanded-reminder-item time,
.personal-reminder-copy time,
.personal-reminder-attachment-step > p,
.section-heading p,
.meeting-detail-actions > span,
.contribution-heading small,
.task-meta,
.agenda-item small,
.task-attachments-title,
.capture-hint,
.empty-state,
.assistant-empty p,
.assistant-note,
.timeline-content > span:last-child,
.topic-ranking div span,
.completion,
.risk-content p,
.risk-content > span,
.auth-copy p,
.auth-brand span,
.form-stack label > span,
fieldset legend,
.suggestion-grid label > span,
.suggested-topics > span,
.email-fields label > span,
.share-link-field > span,
.simple-suggestion label > span {
  color: var(--text-muted);
}

.card-header,
.modal-header,
.capture-footer,
.table-heading,
.meeting-card-footer,
.share-panel-footer,
.optional-fields,
.nested-form,
.meeting-contributions,
.agenda-list,
.task-row,
.agenda-item,
.reminder-item,
.expanded-reminder-item,
.topic-numbers div {
  border-color: var(--border);
}

.task-row,
.agenda-item,
.reminder-item {
  background: var(--surface);
}

.task-row:hover,
.agenda-item:hover,
.reminder-item:hover,
.subtask-item:hover,
.capture-footer,
.table-heading,
.nested-form,
.personal-reminder-edit-attachments {
  background: var(--surface-soft);
}

select,
input,
textarea,
.search-box.standalone,
.reply-editor textarea,
.task-description-editor textarea,
.task-date-editor input,
.subtask-form input,
.share-link-field input,
.share-composer input,
.share-composer textarea,
.assistant-input input,
.capture-input-wrap textarea {
  background: #0d1727;
  border-color: #2a3951;
  color: var(--text);
}

input::placeholder,
textarea::placeholder {
  color: #6f7d92;
}

select:focus,
input:focus,
textarea:focus {
  border-color: #7893ee;
  box-shadow: 0 0 0 3px rgba(120, 147, 238, .14);
}

.button.primary,
.topbar .capture-button,
.message.user > div,
.message.user p {
  background: linear-gradient(145deg, #4969d9, #314dab);
  color: #fff;
}

.button.primary:hover {
  background: linear-gradient(145deg, #5b79e2, #3b59bd);
}

.button.secondary,
.reminder-edit-button,
.topic-option,
.new-contact-fields,
.share-attachment-list button,
.task-attachment-item > button:first-child,
.share-attachments {
  background: #0d1727;
  border-color: #2a3951;
  color: var(--text);
}

.button.secondary:hover,
.reminder-edit-button:hover,
.topic-option.selected,
.task-attachment-item > button:first-child:hover:not(:disabled),
.share-attachment-list button:hover:not(:disabled) {
  background: #172744;
  border-color: #516bb2;
  color: #dfe7ff;
}

.icon-button,
.card-header button,
.section-heading button,
.detail-actions button,
.task-attachments-title button,
.reply-trigger,
.owner-reply button,
.area-add-button,
.auth-switch {
  color: #9fb1d9;
}

.icon-button:hover {
  background: #19263a;
  color: #f5f7fb;
}

.task-check {
  background: #0b1424;
  border-color: #42506a;
}

.task-check.checked {
  background: #35a47a;
  border-color: #35a47a;
}

.subtask-list {
  border-left-color: #3b4d6c;
}

.subtask-item {
  background: rgba(18, 31, 50, .64);
}

.subtask-item:hover {
  background: #20304a;
}

.subtask-item > span {
  color: #dbe5f4;
}

.subtask-item.completed {
  background: rgba(53, 164, 122, .12);
  border: 1px solid rgba(86, 202, 160, .22);
}

.subtask-item.completed > span {
  color: #b8c8df;
  text-decoration-color: rgba(184, 200, 223, .65);
}

.subtask-item.completed .task-check {
  background: #35a47a;
  border-color: #65d5ad;
  color: #ffffff;
}

.badge-neutral { background: #1d2838; color: #b7c2d5; }
.badge-danger { background: #3c2026; color: #ff9ca3; }
.badge-warning { background: #3b2b14; color: #ffd087; }
.badge-success { background: #14372c; color: #8ee1bf; }
.badge-info { background: #172849; color: #b8c8ff; }
.badge-purple { background: #2a2141; color: #d2b9ff; }

.stat-icon.red { color: #ff8f98; background: #3b2028; }
.stat-icon.amber { color: #ffd08a; background: #3a2a15; }
.stat-icon.blue,
.meeting-person { color: #b6c7ff; background: #172849; }
.stat-icon.purple { color: #d2bdff; background: #2a2141; }

.reminder-group-title {
  border-color: var(--border);
}

.reminder-group.overdue .reminder-group-title { color: #ff9ca3; background: #2b1820; }
.reminder-group.overdue .reminder-group-title b { background: #46212b; }
.reminder-group.today .reminder-group-title { color: #ffd18b; background: #2b2114; }
.reminder-group.today .reminder-group-title b { background: #423016; }
.reminder-group.upcoming .reminder-group-title { color: #b9c8ff; background: #17233b; }
.reminder-group.upcoming .reminder-group-title b { background: #223457; }

.reminder-list .meeting-label,
.expanded-reminder-content .meeting-label {
  color: #c2cffd;
  background: #1a2d55;
}

.reminder-list .personal-label,
.expanded-reminder-content .personal-label {
  color: #d9c4ff;
  background: #2d2446;
}

.reminder-empty,
.contribution-empty {
  background: rgba(18, 29, 45, .75);
  border-color: #37445a;
  color: #8f9bb1;
}

.personal-reminder-toolbar .overdue-filter.secondary,
.personal-reminder-card.overdue {
  background: #2b1820;
  border-color: #62313b;
  color: #ffb1b7;
}

.personal-reminder-date > span {
  background: #4b222b;
  color: #ffadb5;
}

.retention-notice,
.attention-banner,
.preparation-status.pending {
  background: linear-gradient(100deg, rgba(66, 48, 24, .9), rgba(36, 27, 16, .7));
  border-color: #5d4723;
  color: #ffd08a;
}

.attention-icon {
  background: #4a2a16;
  color: #ffb06f;
}

.attention-banner span,
.attention-banner button {
  color: #ffb06f;
}

.attention-banner strong {
  color: #ffe0bc;
}

.preparation-status.completed,
.success-button,
.form-success {
  background: #11382d;
  border-color: #275d4b;
  color: #8ee1bf;
}

.form-error,
.sync-error {
  background: #3a1e25;
  border-color: #66313c;
  color: #ff9ba5;
}

.sync-error button {
  color: #ffadb5;
}

.bar,
.progress {
  background: #263349;
}

.date-box,
.task-date-editor,
.subtask-list,
.share-preparation-section,
.share-panel-intro,
.email-draft-intro,
.task-shared-comments,
.owner-reply,
.contribution-card,
.contribution-card.suggestion,
.share-composer,
.share-composer.compact,
.share-entry,
.share-owner-reply,
.share-completion,
.share-note {
  background: var(--surface-soft);
  border-color: var(--border);
}

.share-panel-intro,
.email-draft-intro,
.task-shared-comments > strong,
.contribution-heading > div,
.share-composer-heading,
.share-section-title,
.share-eyebrow {
  color: #b8c8ff;
}

.share-panel-intro strong,
.email-draft-intro strong,
.share-steps strong,
.contribution-card > div strong,
.task-shared-comments > div span,
.owner-reply > div strong,
.share-composer-heading h3,
.share-section-title h2,
.share-task-content > h3,
.share-attachments-title strong,
.share-brand strong,
.share-hero h1,
.share-completion h2,
.share-state h1 {
  color: var(--text-strong);
}

.share-panel-intro span,
.email-draft-intro span,
.share-steps span,
.contribution-card > div span,
.contribution-card > small,
.contribution-card p,
.task-shared-comments > div time,
.task-shared-comments > div p,
.owner-reply > div span,
.owner-reply p,
.share-composer-heading p,
.share-section-title p,
.share-task-content > ul li,
.share-attachment-list button small,
.share-hero > p,
.share-note p,
.share-completion p,
.share-state p {
  color: var(--text-muted) !important;
}

.share-page,
.share-loading,
.share-state,
.auth-page {
  background:
    radial-gradient(circle at 26% 0%, rgba(87, 112, 190, .16) 0, rgba(8, 17, 31, 0) 38%),
    #08111f;
  color: var(--text);
}

.share-header {
  background: rgba(10, 20, 35, .92);
  border-color: var(--border);
}

.share-task {
  background: var(--surface);
  border-color: var(--border);
  box-shadow: var(--shadow);
}

.share-task-number,
.share-steps li:before,
.share-meta span {
  background: #172849;
  color: #b9c8ff;
}

.share-empty {
  border-color: #3b465b;
  color: #9aa7bc;
}

.share-footer {
  border-color: var(--border);
  color: #7c899e;
}

.modal-backdrop {
  background: rgba(1, 7, 16, .72);
}

.message > div {
  background: #172849;
  color: #c4d0ff;
}

.message p {
  background: #1a2639;
  color: var(--text);
}

.auth-page {
  background:
    radial-gradient(circle at 50% 0%, rgba(80, 105, 180, .2) 0, rgba(8, 17, 31, 0) 40%),
    #08111f;
}