/* Dosa Tycoon 5.1 (DUEL51): the day race's line in the Duel window, the look at a rival's place (the window's buttons and the
 * card of js/ui-screens.js duelPeek, its plan drawn by js/duel51.js). Sizes are the stage's own, as in css/screens.css and
 * css/windows.css; html.dt-compact is the phone's layout. */

/* ---- the Duel window: which day of how many, and the looks ---- */
.dtw-duel__race { margin: 2px 2px 10px; font-size: max(17px, var(--fl-deep, 0px)); font-weight: 800; line-height: 1.25; color: var(--ink, #3A1F12); }
.dtw-duel__race.is-hidden, .dtw-duel__lcard.is-hidden { display: none; }
.dtw-duel__lcard .dtw-duel__lookSay { margin-top: 0; }
.dtw-duel__look { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.dtw-duel__lookBtn { flex: 0 1 auto; min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-align: center; }
.dtw-root.is-compact .dtw-duel__lookBtn { flex: 1 1 100%; min-height: 44px; }
.dtw-root.is-compact .dtw-duel__lookBtn { padding-top: 6px; padding-bottom: 9px; line-height: 1.1; }          /* (FIT2, 5.0.1: a long name's two lines kept 4 px from the rim) */

/* ---- the card: a rival's place ---- */
.dts-dpeek { width: 860px; }
html.dt-compact .dts-dpeek { width: auto; max-width: 860px; }
.dts-dpeek .dts-dseg { margin: 12px 0 4px; }
.dpk-plan { margin: 12px 0 6px; padding: 8px; border-radius: 14px; background: #F7EEDB; box-shadow: inset 0 0 0 2px rgba(58, 31, 18, 0.18); }
.dpk-plan__svg { display: block; width: 100%; height: auto; max-height: 470px; }
html.dt-compact .dpk-plan__svg { max-height: 56vh; }
.dpk-fact { margin: 10px 2px 0; font-size: max(19px, var(--fl-deep, 0px)); font-weight: 700; line-height: 1.3; color: #4A2C1A; overflow-wrap: anywhere; }
html.dt-compact .dpk-fact { font-size: 22px; }