.dp-preview{--dp-ink:#52634b;--dp-rule:rgba(82,99,75,.23);--dp-paper:#e3eadd;box-sizing:border-box;width:100%;height:100%;max-width:320px;margin:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:inherit;font-weight:400}
.dp-preview *{box-sizing:border-box}
.dp-blue{--dp-ink:#4f6b73;--dp-rule:rgba(79,107,115,.25);--dp-paper:#e4ecec}
.dp-stone{--dp-ink:#7c6755;--dp-rule:rgba(124,103,85,.22);--dp-paper:#eee8df}
.dp-label{display:block;font-size:12px;line-height:1.45;font-weight:400;letter-spacing:0}
.dp-note{align-self:flex-start;margin-bottom:1px}
.dp-diagram{display:block;width:180px;height:140px;flex-shrink:1;overflow:visible;stroke-linecap:round;stroke-linejoin:round}
.dp-faint{stroke:var(--dp-rule);stroke-width:1}
.dp-strong{stroke:currentColor;stroke-width:1.5}
.dp-point{fill:currentColor;stroke:var(--dp-paper);stroke-width:2}
.dp-ring{fill:var(--dp-paper);stroke:var(--dp-rule);stroke-width:1}
.dp-compass{width:146px;height:146px}
.dp-needle-soft{fill:currentColor;opacity:.38}
.dp-needle{fill:currentColor}
.dp-center{fill:var(--dp-paper);stroke:currentColor;stroke-width:1.5}
.dp-compass-note{align-self:center;margin:0}
.dp-routine{width:100%}
.dp-routine-step{display:flex;align-items:center;gap:21px;min-height:54px;border-top:1px solid var(--dp-rule);padding:9px 0}
.dp-step-number{font-size:10px;letter-spacing:.06em;opacity:.72;font-variant-numeric:tabular-nums}
.dp-step-title{display:block;font-size:16px;line-height:1.25}
.dp-step-detail{display:block;margin-top:4px;font-size:11px;line-height:1.4;opacity:.85}
.dp-worksheet{width:100%;display:flex;flex-direction:column;gap:6px}
.dp-worksheet-row{min-height:41px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border:1px solid rgba(124,103,85,.12);border-radius:8px;background:rgba(255,255,255,.26);font-size:11px;line-height:1.35}
.dp-sheet-hint{text-align:right}
.dp-friction{display:flex;flex-direction:column;gap:20px;width:100%;max-width:220px}
.dp-track-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.dp-track{position:relative;display:block;width:54%;height:1px;background:var(--dp-rule)}
.dp-track-stop{position:absolute;left:50%;top:-4px;width:8px;height:8px;border:1px solid currentColor;border-radius:50%;background:var(--dp-paper)}
.dp-track-stop-0{left:25%}.dp-track-stop-1{left:66%}.dp-track-stop-2{left:43%}
.dp-caption{margin-top:4px}
.dp-equation{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:11px;text-align:center;font-size:12px;width:100%;max-width:280px}
.dp-equation b{font-size:16px;font-weight:400;opacity:.6}
.dp-equation-rule{grid-column:1/-1;width:100%;height:1px;margin-top:4px;background:var(--dp-rule)}
.dp-equation-result{grid-column:1/-1;font-size:12px;margin-top:3px}
.dp-attention{display:flex;flex-direction:column;align-items:center;gap:8px}
.dp-measure{display:flex;flex-direction:column;align-items:center;gap:19px;width:100%}
.dp-fraction{display:flex;flex-direction:column;text-align:center;font-size:25px;line-height:1.2;font-weight:300;min-width:52px}
.dp-fraction span:first-child{border-bottom:1px solid var(--dp-rule);padding:0 8px 6px}
.dp-fraction span:last-child{padding-top:5px}
.dp-measure-ticks{display:flex;justify-content:space-between;align-items:flex-start;max-width:180px;width:100%;height:16px;border-top:1px solid var(--dp-rule)}
.dp-measure-ticks i{display:block;width:1px;height:6px;background:var(--dp-rule)}
.dp-measure-ticks .dp-long-tick{height:12px;background:currentColor;opacity:.5}
.dp-week{display:grid;grid-template-columns:repeat(7,1fr);width:100%;max-width:265px;gap:10px}
.dp-week>div{display:flex;flex-direction:column;align-items:center;gap:15px}
.dp-day{display:block;width:22px;height:38px;border:1px solid var(--dp-rule);border-radius:12px}
.dp-transcript{width:100%;max-width:240px;display:flex;flex-direction:column;gap:11px;padding:13px 4px}
.dp-line{display:block;width:var(--dp-line-width);height:2px;background:var(--dp-rule)}
.dp-highlight{height:10px;margin:-4px 0;background:rgba(124,103,85,.13);border-bottom:1px solid currentColor}
.dp-blue .dp-highlight{background:rgba(79,107,115,.13)}
.dp-extract-action{display:flex;gap:12px;margin-top:12px;font-size:12px;align-items:center}
.dp-extract-action>span{font-size:21px;line-height:1}
.directory-preview--compact .dp-preview{max-width:128px;gap:7px;padding:5px 2px}
.directory-preview--compact .dp-diagram{width:100%;max-width:119px;height:87px}
.directory-preview--compact .dp-label{font-size:11px;line-height:1.25;text-align:center}
.directory-preview--compact .dp-note,.directory-preview--compact .dp-caption,.directory-preview--compact .dp-step-detail,.directory-preview--compact .dp-sheet-hint{display:none}
.directory-preview--compact .dp-friction{gap:17px;width:100%;max-width:104px}
.directory-preview--compact .dp-track-row>.dp-label{display:none}
.directory-preview--compact .dp-track{width:100%}
.directory-preview--compact .dp-equation{display:flex;flex-direction:column;gap:3px;font-size:11px}
.directory-preview--compact .dp-equation b{font-size:12px;line-height:1}
.directory-preview--compact .dp-equation-rule,.directory-preview--compact .dp-equation-result{display:none}
.directory-preview--compact .dp-attention{gap:4px}
.directory-preview--compact .dp-attention .dp-diagram{height:82px}
.directory-preview--compact .dp-measure{gap:9px}
.directory-preview--compact .dp-fraction{font-size:22px;min-width:40px}
.directory-preview--compact .dp-measure-ticks{max-width:104px;height:12px}
.directory-preview--compact .dp-measure>.dp-label{display:none}
.directory-preview--compact .dp-week{max-width:121px;gap:3px}
.directory-preview--compact .dp-week>div{gap:9px}
.directory-preview--compact .dp-week .dp-label{font-size:10px}
.directory-preview--compact .dp-day{width:9px;max-width:100%;height:30px}
.directory-preview--compact .dp-transcript{max-width:109px;gap:9px}
.directory-preview--compact .dp-extract-action{margin-top:3px;font-size:11px;gap:8px}
.directory-preview--compact .dp-routine-step{min-height:29px;gap:12px;padding:5px 0}
.directory-preview--compact .dp-step-title{font-size:12px}
.directory-preview--compact .dp-step-number{font-size:9px}
.directory-preview--compact .dp-compass{width:87px;height:87px}
.directory-preview--compact .dp-worksheet-row{min-height:26px;padding:5px 8px;font-size:11px}