/* A reading pause over the same complete living illustration. */
.day-finale{position:absolute;z-index:4;left:20px;right:20px;top:43%;bottom:calc(80px + var(--safe-bottom));padding:21px 22px;background:linear-gradient(145deg,#242d2aef,#1c2423f5);border:1px solid #d8bd8659;border-radius:23px;box-shadow:0 12px 40px #111a1b45;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff6e7;pointer-events:auto}
.day-commentary{height:100%;display:flex;flex-direction:column;min-height:0}
.day-commentary header{display:flex;justify-content:space-between;align-items:center;gap:8px;flex:none}
.day-eyebrow{font-size:10px;font-weight:600;letter-spacing:.10em;line-height:1.3;color:#d6c4a4;display:block}
.day-pages{font-size:11px;color:#dbccb0;white-space:nowrap;min-height:14px}
.day-finale h3{font-size:20px;font-weight:500;line-height:1.22;margin:10px 0 14px;color:#fff3dc;overflow-wrap:anywhere;outline:none}
.day-reading{min-height:0;flex:1}
.day-reading p{font-size:17px;line-height:1.48;font-weight:400;margin:0;outline:none;color:#faf4e9;letter-spacing:0;overflow-wrap:break-word}
.day-results{height:100%;display:flex;flex-direction:column;justify-content:center;gap:18px}
.day-results p{margin:6px 0 0;font-size:15px;line-height:1.35;color:#e7e2d7}
.day-results .day-award{font-size:21px;color:#fff3d9;display:flex;align-items:center;gap:14px}
.day-award strong{font-size:24px;font-weight:500;color:#f3cf92}
.day-results .day-explanation{color:#cbc6ba;font-size:14px}
.day-dream{border-top:1px solid #ecd5ab30;padding-top:16px}
.day-dream h3{font-size:20px;margin:7px 0 6px}
.day-end{height:100%;display:flex;flex-direction:column;justify-content:center}
.day-end h3{font-size:24px}.day-end p{font-size:16px;line-height:1.5;margin:0}
.lo-finale .lo-dock{display:none}
.lo-finale .lo-next{background:linear-gradient(135deg,#e8ce9e,#ccb07c);color:#242b27;border-color:#f3ddae;font-weight:600}
.lo-arrived .day-finale{animation:lo-thought-in .45s ease-out both}
.lo-arrived[data-kind=day-result] .day-award strong{animation:day-award-in .7s ease-out both}
@keyframes day-award-in{from{opacity:.5;text-shadow:0 0 18px #e8ce9e}to{opacity:1;text-shadow:none}}
@media(orientation:portrait) and (max-height:700px){
 .day-finale{left:14px;right:14px;top:40%;bottom:calc(69px + var(--safe-bottom));padding:14px 16px;border-radius:19px}
 .day-finale h3{font-size:18px;margin:7px 0 10px}.day-reading p{font-size:16px;line-height:1.4}
 .day-results{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-content:center;gap:12px 13px}
 .day-dream{grid-column:1/-1;padding-top:10px}.day-results .day-award{font-size:17px;gap:8px;flex-wrap:wrap}.day-award strong{font-size:21px}.day-results p{font-size:14px}.day-results .day-explanation{font-size:12px;line-height:1.3}.day-dream h3{font-size:18px;margin:6px 0}.day-eyebrow{font-size:9px}
}
@media(orientation:portrait) and (max-height:540px){
 .day-finale{top:40%;padding:11px 13px}.day-reading p{font-size:15px;line-height:1.4}.day-finale h3{font-size:16px;margin:6px 0 8px}.day-results{gap:8px 10px}.day-results .day-award{font-size:15px;gap:5px;flex-wrap:nowrap}.day-award strong{font-size:18px}.day-results p{font-size:13px;line-height:1.3}.day-results .day-explanation{font-size:12px}.day-dream{padding-top:8px}
}
@media(orientation:landscape) and (max-height:600px){
 .day-finale{left:50%;right:16px;top:max(74px,calc(var(--safe-top) + 48px));bottom:calc(67px + var(--safe-bottom));padding:16px 18px}
 .day-finale h3{font-size:19px;margin:7px 0 9px}.day-reading p{font-size:16px;line-height:1.4}
 .day-results{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-content:center;gap:12px}.day-dream{grid-column:1/-1;padding-top:10px}.day-results p{font-size:14px}.day-results .day-award{font-size:18px;gap:8px}.day-results .day-explanation{font-size:13px}.day-dream h3{font-size:18px}
}
@media(orientation:landscape) and (max-height:400px){
 .day-finale{top:max(58px,calc(var(--safe-top) + 38px));bottom:calc(60px + var(--safe-bottom));padding:10px 13px;border-radius:18px}.day-reading p{font-size:15px;line-height:1.35}.day-eyebrow{font-size:8px}.day-finale h3{font-size:16px;margin:5px 0 7px}.day-results{gap:7px 10px}.day-results p{font-size:12px;line-height:1.28;margin-top:4px}.day-results .day-award{font-size:14px;gap:5px}.day-award strong{font-size:18px}.day-results .day-explanation{font-size:11px}.day-dream{padding-top:7px}.day-end h3{font-size:20px}.day-end p{font-size:15px}
}
@media(prefers-reduced-motion:reduce){.lo-arrived .day-finale,.lo-arrived .day-award strong{animation:none}}
.lo-paused .day-finale,.lo-paused .day-award strong{animation:none}

/* Narrow portrait panels gain room by keeping daily changes in short full-width rows. */
@media(orientation:portrait) and (max-height:700px){
 .day-results{display:flex;gap:9px}.day-results .day-award{font-size:17px;line-height:1.15;margin-top:4px}.day-results .day-explanation{margin-top:3px}.day-results .day-patterns p{margin-top:3px}.day-dream h3{margin:5px 0}.day-results .day-dream p{margin-top:4px}.day-dream{padding-top:9px}
}
@media(orientation:portrait) and (max-height:540px){.day-results{gap:7px}.day-results .day-award{font-size:16px}.day-dream{padding-top:7px}}
@media(orientation:landscape) and (max-height:400px){.day-results .day-award{display:block;line-height:1.4}.day-award strong{margin-left:3px}}
/* Opacity-only entry cannot move the card into the controls during a transition. */
.lo-arrived .day-finale{animation:day-panel-in .4s ease-out both}
@keyframes day-panel-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.lo-arrived .day-finale{animation:none}}
.lo-paused .day-finale{animation:none}
@media(orientation:portrait) and (max-height:700px){
 .day-finale{padding-top:12px;padding-bottom:12px}.day-results{gap:6px}.day-results .day-dream h3{font-size:17px;line-height:1.2;margin:4px 0}.day-results .day-dream p{font-size:13px;line-height:1.3}.day-dream{padding-top:7px}
}
@media(orientation:portrait) and (max-height:540px){.day-finale{padding-top:9px;padding-bottom:9px}.day-results{gap:5px}}
@media(orientation:landscape) and (max-height:400px){
 .lo-finale .day-finale,.lo-finale .lo-controls{left:45%}.day-finale{bottom:calc(67px + var(--safe-bottom))}
 .lo-finale .lo-controls{gap:6px}.lo-finale .lo-controls .lo-next{font-size:14px;padding:9px 6px}
 .day-results{gap:5px 10px}.day-dream{padding-top:5px}
}

/* Extra space for enlarged device text; the complete figure remains behind the panel. */
@media(orientation:portrait) and (max-height:700px){.day-finale.day-roomy{top:31%}}
@media(orientation:portrait) and (max-height:700px){.day-finale.day-roomy{padding:8px 12px}.day-roomy .day-results{gap:4px}}

/* Author's interpretation belongs to the established plum narration palette.
   The following factual scorecard keeps its own green-grey presentation. */
.living-opening[data-kind=commentary] .day-finale{
 background:linear-gradient(145deg,#412e48f5,#281e31f7);
 border-color:#dfc2b28c;
 box-shadow:0 12px 40px #160f214d,inset 0 1px 0 #f7dfbf12;
}
.living-opening[data-kind=commentary] .day-commentary .day-eyebrow{color:#f0d9bc}
.living-opening[data-kind=commentary] .day-dream-title{color:#fff0d9}

/* Three concrete daily awards share the same scorecard, with all controls visible. */
.day-finale.day-multi{top:35%}
.day-multi .day-results{gap:12px}
.day-multi .day-awards{display:grid;gap:8px;margin-top:7px}
.day-multi .day-award{font-size:18px;justify-content:space-between;margin:0;gap:8px;line-height:1.25}
.day-multi .day-award strong{font-size:21px}
.day-results .day-award-detail{font-size:12px;line-height:1.25;color:#ccc7bc;margin:2px 0 0}
@media(orientation:portrait) and (max-height:700px){
 .day-finale.day-multi{top:calc(118px + var(--safe-top));padding:12px 14px}
 .day-finale.day-multi.day-roomy{top:calc(90px + var(--safe-top))}
 .day-multi .day-results{gap:7px}.day-multi .day-awards{gap:6px;margin-top:5px}
 .day-multi .day-award{font-size:16px}.day-multi .day-award strong{font-size:19px}
 .day-multi .day-award-detail{font-size:12px}.day-multi .day-dream{padding-top:7px}
}
@media(orientation:portrait) and (max-height:540px){
 .day-finale.day-multi{top:calc(94px + var(--safe-top));padding:9px 12px}
 .day-finale.day-multi.day-roomy{top:calc(82px + var(--safe-top))}
 .day-multi .day-results{gap:5px}.day-multi .day-awards{gap:4px;margin-top:4px}
 .day-multi .day-award{font-size:15px;line-height:1.15}.day-multi .day-award strong{font-size:17px}
 .day-multi .day-award-detail{font-size:11px;line-height:1.2}.day-multi .day-patterns p{font-size:12px}
 .day-multi .day-eyebrow{font-size:8px}.day-multi .day-dream h3{font-size:15px}
 .day-multi .day-dream p{font-size:12px}
}
@media(orientation:landscape) and (max-height:600px){
 .day-finale.day-multi{top:calc(62px + var(--safe-top));padding:10px 14px}
 .day-multi .day-results{display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:8px 14px}
 .day-multi .day-skills{grid-row:1/3}.day-multi .day-patterns{grid-column:2}.day-multi .day-dream{grid-column:2;padding-top:7px}
 .day-multi .day-award{font-size:15px;display:flex}.day-multi .day-award strong{font-size:18px}
 .day-multi .day-award-detail{font-size:11px}.day-multi .day-awards{gap:7px}
 .day-multi .day-dream h3{font-size:16px}.day-multi .day-dream p{font-size:12px}
}
/* The narrowest landscape phone needs a wider scorecard to avoid broken rows. */
@media(orientation:landscape) and (max-height:400px) and (max-width:650px){
 .lo-finale .day-finale.day-multi{left:33%;right:10px;padding:9px 12px}
 .day-multi .day-results{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px 12px}
 .day-multi .day-award{font-size:14px;gap:4px;line-height:1.2}.day-multi .day-award strong{font-size:16px;margin-left:0}
 .day-multi .day-award-detail{font-size:11px;line-height:1.2}.day-multi .day-awards{gap:6px;margin-top:5px}
 .day-multi .day-dream h3{font-size:15px;line-height:1.2}.day-multi .day-dream p{font-size:12px;line-height:1.25}
}
@media(orientation:portrait) and (max-height:540px){
 .day-finale.day-multi{bottom:calc(56px + var(--safe-bottom))}
}

/* Five awards remain on one screen; short phones show the compact name/value list. */
.day-finale.day-five{top:27%}
.day-five .day-results{gap:10px}
.day-five .day-awards{gap:6px}
.day-five .day-award{font-size:17px}
@media(orientation:portrait) and (max-height:760px){
 .day-finale.day-five{top:calc(94px + var(--safe-top));padding:10px 14px}
 .day-five .day-awards{gap:6px}
 .day-five .day-award{font-size:16px;line-height:1.25}
 .day-five .day-award-detail{display:none}
 .day-five .day-results{gap:8px}
}
@media(orientation:portrait) and (max-height:540px){
 .day-finale.day-five,.day-finale.day-five.day-roomy{top:calc(82px + var(--safe-top));padding:9px 12px}
 .day-five .day-award{font-size:15px;line-height:1.2}
 .day-five .day-awards{gap:5px;margin-top:4px}
 .day-five .day-results{gap:6px}
}
@media(orientation:landscape) and (max-height:600px){
 .day-finale.day-five{top:calc(62px + var(--safe-top))}
 .day-five .day-award-detail{display:none}
 .day-five .day-awards{gap:8px}
 .day-five .day-award{font-size:15px;line-height:1.2}
}
@media(orientation:landscape) and (max-height:400px){
 .day-five .day-awards{gap:6px}
 .day-five .day-award{font-size:14px}
}
@media(orientation:portrait) and (max-height:540px){
 .day-finale.day-five{padding-top:8px;padding-bottom:8px}
 .day-five .day-awards{gap:3px}
 .day-five .day-award strong{font-size:16px;line-height:1}
 .day-five .day-results{gap:4px}
 .day-five .day-patterns{display:flex;align-items:baseline;gap:8px}
 .day-five .day-patterns p{margin:0}
 .day-five .day-dream{padding-top:4px}
 .day-five .day-dream h3{font-size:14px;line-height:1.2}
}

/* Recorded behaviour uses its own group; it never subtracts earned skill points. */
.day-pattern-awards{display:grid;gap:6px;margin-top:6px}
.day-pattern-awards .day-award strong{color:#e4c8ad}
.day-five.day-with-patterns .day-patterns{display:block}
@media(orientation:portrait) and (max-height:540px){
 .day-five .day-pattern-awards{margin-top:3px}
 .day-five .day-pattern-awards .day-award{font-size:14px;line-height:1.2}
}
@media(orientation:landscape) and (min-height:601px) and (max-height:800px){
 .day-five.day-with-patterns .day-skills .day-award-detail{display:none}
}
@media(orientation:landscape) and (min-height:601px) and (max-height:800px){
 .day-finale.day-five.day-with-patterns{top:calc(94px + var(--safe-top))}
}
/* Keep all multi-award result cards clear of the footer on short portrait screens. */
@media(orientation:portrait) and (max-height:540px){
 .day-finale.day-multi{bottom:calc(69px + var(--safe-bottom))}
}
/* A concrete behaviour adds a row to the three-skill help result as well. */
@media(orientation:portrait) and (max-height:540px){
 .day-multi.day-with-patterns .day-award-detail{display:none}
}
@media(orientation:landscape) and (min-height:601px) and (max-height:800px){
 .day-finale.day-multi.day-with-patterns{top:calc(110px + var(--safe-top))}
}
/* Short portrait screens keep the chapter and result title on one line above the card. */
@media(orientation:portrait) and (max-height:540px){
 .living-opening[data-kind=day-result] .lo-heading{display:flex;align-items:baseline;gap:8px;right:14px}
 .living-opening[data-kind=day-result] .lo-heading p{margin:0;font-size:7px;letter-spacing:.08em;white-space:nowrap}
 .living-opening[data-kind=day-result] .lo-heading h2{font-size:16px;white-space:nowrap}
 .day-finale.day-five,.day-finale.day-five.day-roomy{top:calc(86px + var(--safe-top))}
}