@font-face { font-family: Manrope; src: url('/fonts/manrope-latin-wght-normal.woff2') format('woff2'); font-weight: 200 800; font-display: swap; }
:root { color-scheme: light; --ink: #292231; --plum: #432940; --muted: #736775; --line: #e5dce3; --mint: #c4f3dc; --paper: #fffcf8; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; font-family: Manrope, sans-serif; color: var(--ink); background: var(--paper); font-size: 15px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
button, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; text-underline-offset: 4px; }
button:focus-visible, a:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid #96678d; outline-offset: 4px; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.18; letter-spacing: -.035em; }
.dg-skip { position: fixed; z-index: 10; top: 10px; left: 20px; padding: 10px 18px; background: #fff; transform: translateY(-150%); }
.dg-skip:focus { transform: translateY(0); }
.dg-top { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 23px clamp(20px, 3vw, 54px); border-bottom: 1px solid var(--line); background: #fff; }
.dg-brand { color: var(--plum); font-weight: 800; letter-spacing: -.04em; text-decoration: none; font-size: 23px; }
.dg-brand span { color: #aa647c; }
.dg-back { color: #76566e; font-weight: 750; font-size: 12px; text-decoration: none; }
.dg-back span { margin-left: 8px; }
.dg-layout { display: grid; grid-template-columns: minmax(225px, 285px) minmax(0, 820px) minmax(170px, 220px); gap: clamp(22px, 3vw, 45px); max-width: 1560px; margin: auto; padding: 44px clamp(20px, 3vw, 54px) 85px; align-items: start; }
.dg-sidebar h1 { font-size: clamp(28px, 2.25vw, 37px); margin-bottom: 22px; }
.dg-eyebrow { color: #a0637c; font-size: 10px; font-weight: 850; letter-spacing: .13em; line-height: 1.5; }
.dg-intro { font-size: 14px; color: #655c6a; }
.dg-origin { display: inline-block; font-size: 10px; font-weight: 750; line-height: 1.5; padding: 7px 11px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: #6a586a; }
.dg-sidebar__line { width: 44px; height: 4px; background: #b5ddc7; border-radius: 10px; margin: 24px 0; }
.dg-sidebar h2 { font-size: 19px; }
#dg-context { font-size: 12px; color: #766a76; }
.dg-evidence { display: grid; gap: 9px; margin: 23px 0; }
.dg-evidence__card { padding: 16px 18px; border-left: 3px solid #caabbd; border-radius: 0 12px 12px 0; background: #f3ebef; }
.dg-evidence__card:nth-child(2) { background: #faf0e3; border-color: #e4bf87; }
.dg-evidence__card:nth-child(3) { background: #eaf3ed; border-color: #9ccab1; }
.dg-evidence__card strong { display: block; font-size: 11px; color: #78536d; }
.dg-evidence__card p { margin: 6px 0 0; font-size: 11px; line-height: 1.55; }
.dg-save { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 10px; color: #847781; }
.dg-save__dot { width: 5px; height: 5px; background: #77ab8e; border-radius: 50%; }
.dg-save button { width: 100%; margin-top: 10px; padding: 5px 0; border: 0; background: none; font-size: 11px; font-weight: 750; color: #79576b; text-align: left; text-decoration: underline; text-underline-offset: 3px; }
.dg-main { min-width: 0; }
.dg-board { margin: 0 0 26px; border: 1px solid var(--line); border-radius: 20px; background: #fff; overflow: hidden; box-shadow: 0 20px 50px #39283d08; }
.dg-board-tabs { display: flex; gap: 6px; padding: 12px; background: #f4eff3; }
.dg-board-tab { flex: 1; min-width: 0; min-height: 38px; padding: 8px 12px; border: 1px solid transparent; border-radius: 10px; color: #7d6b7d; background: transparent; font-size: 10px; font-weight: 800; line-height: 1.35; }
.dg-board-tab[aria-pressed="true"] { color: #493145; background: #fff; border-color: #e0d7de; box-shadow: 0 3px 9px #35223c08; }
.dg-image-open { position: relative; display: block; width: 100%; padding: 0; border: 0; background: #fff; }
.dg-image-open > img { display: block; width: 100%; height: clamp(400px, 36vw, 510px); object-fit: contain; background: #f8f1f5; }
.dg-image-open > span { position: absolute; right: 13px; bottom: 13px; padding: 7px 11px; border-radius: 9px; background: #fff; color: #77506d; font-size: 10px; font-weight: 800; box-shadow: 0 3px 14px #32203b22; }
.dg-board figcaption { padding: 13px 18px; font-size: 11px; color: #7d6e7c; border-top: 1px solid var(--line); }
.dg-workspace { border: 1px solid var(--line); border-radius: 22px; overflow: hidden; background: #fff; box-shadow: 0 20px 55px #34213b06; }
.dg-workspace__head { display: flex; align-items: center; gap: 22px; justify-content: space-between; padding: 27px; border-bottom: 1px solid var(--line); }
.dg-workspace__head .dg-eyebrow { margin-bottom: 10px; }
.dg-workspace__head h2 { font-size: 23px; margin: 0; scroll-margin-top: 24px; }
.dg-progress { flex: 0 0 117px; font-size: 9px; color: #9c8397; text-align: right; }
.dg-progress__track { margin-top: 9px; height: 5px; background: #efe7ed; border-radius: 5px; overflow: hidden; }
.dg-progress__track > span { display: block; height: 100%; width: 12%; border-radius: 5px; background: #bc83a0; transition: width .35s ease; }
.dg-thread { padding: 28px 27px 14px; background: radial-gradient(ellipse at top right, #fcf8f5, #fff); }
.dg-message { width: fit-content; max-width: 88%; margin-bottom: 20px; padding: 18px 20px; border-radius: 17px 17px 17px 4px; background: #f2edf2; animation: arrive .3s ease both; }
.dg-message__speaker { display: block; margin-bottom: 6px; color: #97708b; font-size: 10px; font-weight: 800; }
.dg-message p { margin: 0; font-size: 15px; line-height: 1.65; }
.dg-message--outgoing { margin-left: auto; background: #e2f4e9; border-radius: 17px 17px 4px 17px; }
.dg-message--outgoing .dg-message__speaker { color: #54836a; }
.dg-decision { padding: 0 27px 27px; }
.dg-choices { display: grid; gap: 10px; }
.dg-choice { display: flex; align-items: flex-start; gap: 13px; padding: 17px; text-align: left; border: 1px solid #e7dce4; border-radius: 13px; background: #fffdfa; color: var(--ink); transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.dg-choice:hover { border-color: #ac7a95; background: #fcf4f9; transform: translateX(3px); }
.dg-choice__letter { display: grid; place-items: center; flex: 0 0 27px; height: 27px; border-radius: 8px; border: 1px solid #e7d8e2; background: #f4eaf1; color: #94748b; font-size: 11px; font-weight: 800; }
.dg-choice__words { display: block; min-width: 0; }
.dg-choice__words strong { display: block; margin-bottom: 6px; color: #71445f; font-size: 13px; font-weight: 850; }
.dg-choice__words > span { font-size: 15px; line-height: 1.7; }
.dg-choice:disabled { cursor: default; color: #8c818d; }
.dg-choice:disabled:hover { transform: none; }
.dg-choice--selected, .dg-choice--selected:disabled { color: var(--ink); border-color: #a36687; background: #fff4fa; }
.dg-current-feedback { margin-top: 22px; animation: arrive .3s ease both; }
.dg-feedback { padding: 20px; border: 1px solid #d6e8db; border-radius: 14px; background: #f1f8f2; }
.dg-feedback .dg-eyebrow { display: block; margin-bottom: 11px; color: #62806c; }
.dg-feedback p { color: #726c73; font-size: 14px; line-height: 1.7; margin-bottom: 15px; }
.dg-feedback p.dg-feedback__consequence { color: #3d5848; font-size: 16px; font-weight: 800; }
.dg-feedback__lenses { display: flex; gap: 6px; flex-wrap: wrap; padding-top: 13px; border-top: 1px solid #dce8de; }
.dg-feedback__lens { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 100px; padding: 8px 10px; background: #fff; border-radius: 8px; font-size: 9px; line-height: 1.5; }
.dg-feedback__lens strong { color: #6a5364; font-size: 10px; }
.dg-feedback__lens--helps span { color: #438763; }
.dg-feedback__lens--care span { color: #ab655c; }
.dg-feedback__lens--check span { color: #8a7a8d; }
.dg-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 12px 18px; border: 1px solid var(--plum); border-radius: 11px; background: var(--plum); color: #fff; font-size: 11px; font-weight: 800; line-height: 1.5; }
.dg-current-feedback > .dg-button { margin-top: 16px; }
.dg-button--quiet { border-color: #e1d5de; background: #fff; color: #725269; }
.dg-history-note { margin: -4px 0 25px; }
.dg-history-note summary { width: fit-content; color: #9c8495; font-size: 10px; cursor: pointer; }
.dg-history-note .dg-feedback { margin-top: 10px; }
.dg-wrap { padding: 25px 27px 30px; }
.dg-wrap > p { font-size: 12px; color: #7f7180; }
.dg-wrap > .dg-takeaway { padding: 20px; border: 1px solid #e5d2de; border-radius: 14px; background: #f7ecf2; color: #784966; font-size: 20px; line-height: 1.45; font-weight: 800; letter-spacing: -.03em; }
.dg-write h3, .dg-reflection h3 { font-size: 20px; margin-top: 30px; }
.dg-write p, .dg-reflection p { font-size: 14px; color: #7a6e7a; }
label { display: block; margin-bottom: 8px; font-size: 10px; color: #856c7f; font-weight: 800; }
textarea { display: block; width: 100%; resize: vertical; border: 1px solid #e2d5de; border-radius: 12px; background: #fffcfa; padding: 16px; color: var(--ink); font-size: 15px; line-height: 1.8; }
.dg-write > button { margin-top: 11px; }
.dg-model { margin-top: 20px; padding: 17px 20px; border: 1px solid #d2e7d9; border-radius: 12px; background: #f1f8f3; }
.dg-model summary { font-size: 12px; color: #557761; font-weight: 800; cursor: pointer; }
.dg-model p { font-size: 11px; }
.dg-model .dg-model__reply { margin: 16px 0; padding: 15px; border-radius: 11px; background: #fff; color: #4c6655; font-size: 13px; }
.dg-model .dg-button { min-height: 35px; padding: 8px 12px; }
.dg-reflection { border-top: 1px solid var(--line); margin-top: 30px; padding-top: 1px; }
.dg-end-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 11px; margin-top: 23px; }
.dg-course-return { width: 100%; margin-top: 9px; font-size: 11px; font-weight: 750; color: #85536e; }
.dg-clinic, .dg-reading { margin-top: 44px; }
.dg-clinic h2, .dg-reading h2 { font-size: 26px; margin-bottom: 24px; }
.dg-clinic-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.dg-clinic-card { padding: 22px; border: 1px solid #e5d5dd; border-radius: 17px; background: #f8edf0; transition: background .25s ease; }
.dg-clinic-card:first-child { grid-column: 1 / -1; }
.dg-clinic-card h3 { font-size: 17px; margin-bottom: 22px; }
.dg-clinic-card .dg-eyebrow { display: block; color: #b28696; margin-bottom: 8px; }
.dg-clinic-quote { min-height: 68px; font-size: 14px; font-weight: 750; line-height: 1.6; color: #885c71; }
.dg-clinic-card--after { background: #eaf5ed; border-color: #c9e3d1; }
.dg-clinic-card--after .dg-clinic-quote { color: #567963; }
.dg-clinic-toggle { width: 100%; padding: 10px; border: 1px solid #ffffffcc; border-radius: 9px; background: #fff; font-size: 10px; color: #896179; font-weight: 800; }
.dg-clinic-caption { margin: 14px 0 0; font-size: 11px; color: #66816d; }
.dg-reading__note { border-top: 1px solid var(--line); padding: 18px 0; }
.dg-reading__note summary { font-size: 12px; color: #6f5167; font-weight: 800; cursor: pointer; }
.dg-reading__note p { margin: 13px 0 0; color: #7f7380; font-size: 14px; }
.dg-notice { margin-top: 23px; padding: 16px 20px; border-left: 3px solid #d0b2c0; background: #f6eef3; border-radius: 0 10px 10px 0; color: #8a7584; font-size: 10px; }
.dg-sources { display: flex; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.dg-sources a { color: #947287; font-size: 10px; }
.dg-coach { position: sticky; top: 30px; padding: 21px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.dg-coach > .dg-eyebrow { font-size: 9px; margin-bottom: 24px; }
.dg-lens { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 24px; }
.dg-lens > span { display: grid; place-items: center; flex: 0 0 27px; height: 28px; background: #ecf4ee; color: #6b947a; border-radius: 8px; font-size: 10px; font-weight: 800; }
.dg-lens:nth-child(3) > span { background: #f8eaf0; color: #b5809a; }
.dg-lens:nth-child(4) > span { background: #f6f0e3; color: #b29b69; }
.dg-lens h2 { font-size: 13px; margin-bottom: 5px; }
.dg-lens p { font-size: 10px; color: #8b7b8b; line-height: 1.6; margin-bottom: 0; }
.dg-coach__note { margin: 0; border-top: 1px solid var(--line); padding-top: 19px; color: #978593; font-size: 10px; }
.dg-loading { max-width: 550px; margin: 90px auto; padding: 20px; }
.dg-image-dialog { padding: 42px 12px 12px; border: 1px solid var(--line); border-radius: 18px; width: min(96vw, 1320px); max-height: 94vh; background: #fff; }
.dg-image-dialog::backdrop { background: #221427c9; backdrop-filter: blur(5px); }
.dg-image-dialog > img { display: block; width: 100%; height: auto; }
.dg-image-dialog > button { position: absolute; top: 8px; right: 12px; padding: 6px 12px; background: #f2eaf0; border: 0; border-radius: 8px; color: #78586e; font-size: 11px; }
@keyframes arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 1220px) { .dg-layout { grid-template-columns: minmax(210px, 270px) minmax(0, 1fr); gap: 28px; } .dg-coach { display: none; } }
@media (max-width: 760px) { .dg-top { padding: 18px 20px; } .dg-brand { font-size: 20px; } .dg-back { max-width: 150px; text-align: right; line-height: 1.5; font-size: 10px; } .dg-layout { display: block; padding: 28px 20px 65px; } .dg-sidebar { margin-bottom: 27px; } .dg-sidebar h1 { max-width: 480px; font-size: 33px; margin-bottom: 17px; } .dg-intro { font-size: 13px; max-width: 560px; } .dg-sidebar__line { margin: 20px 0; } .dg-evidence { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; } .dg-evidence__card { padding: 12px; } .dg-evidence__card strong { font-size: 9px; } .dg-evidence__card p { font-size: 10px; } .dg-save { margin-top: 0; } .dg-save button { width: auto; margin-left: auto; margin-top: 0; } .dg-board { border-radius: 16px; } .dg-workspace__head { padding: 21px; gap: 15px; } .dg-workspace__head h2 { font-size: 22px; } .dg-progress { flex-basis: 86px; font-size: 8px; } .dg-thread { padding: 22px 19px 10px; } .dg-decision { padding: 0 19px 21px; } .dg-message { max-width: 94%; padding: 16px; } .dg-wrap { padding: 19px; } .dg-clinic h2, .dg-reading h2 { font-size: 27px; } }
@media (max-width: 440px) { .dg-layout { padding-inline: 15px; } .dg-evidence { grid-template-columns: 1fr; } .dg-evidence__card { padding: 11px 14px; } .dg-evidence__card p { font-size: 11px; } .dg-evidence__card strong { font-size: 10px; } .dg-evidence__card p { margin-top: 3px; } .dg-clinic-grid { grid-template-columns: 1fr; } .dg-clinic-quote { min-height: 0; } .dg-workspace__head { align-items: flex-start; padding: 19px; } .dg-progress { flex-basis: 75px; padding-top: 4px; } .dg-choice { padding: 13px; gap: 9px; } .dg-choice__letter { flex-basis: 23px; height: 24px; } .dg-choice__words > span { font-size: 15px; } .dg-end-actions > button { width: 100%; } }
@media (max-width: 760px) { .dg-main { display: flex; flex-direction: column; } .dg-workspace { order: 1; } .dg-board { order: 2; margin: 30px 0 0; } .dg-clinic { order: 3; } .dg-reading { order: 4; } .dg-image-open > img { height: auto; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }