/* T-700 Core timeline. Theme-independent component assets, version 2.3.0. */
@font-face {font-family:"T700 Log Hand";src:url("../fonts/kalam-latin-400-normal.woff2") format("woff2");font-display:swap;font-style:normal;font-weight:400}
.brand,.log-heading h1 {color:#000}
.view-blogs.log-view {display:flex;flex-direction:column;overflow:visible;min-height:calc(100svh - var(--footer-height));padding:calc(var(--header-height) + 1rem) 0 0;background:var(--paper)}
.log-heading {padding:0 4.5vw;position:relative;z-index:3}
.log-heading h1 {font:clamp(3.5rem,8.1vw,7.8rem)/.85 "Road Rage",sans-serif;text-transform:uppercase;margin:0 0 .45rem;letter-spacing:-.012em}
.log-heading h1::after {content:"";display:block;width:min(27rem,52vw);height:.48rem;background:var(--gold);clip-path:polygon(1% 15%,14% 4%,28% 17%,44% 0,61% 14%,79% 3%,100% 16%,99% 74%,83% 100%,63% 82%,44% 100%,23% 85%,0 100%);margin-top:.4rem;transform:rotate(-.5deg)}
.log-heading p {font:1.45rem/1.3 "T700 Log Hand",cursive;margin:.2rem 0;color:#1e525b}
.log-heading .log-demo {font: .85rem/1.3 "Oswald",sans-serif;color:#72553d;margin:.55rem 0 .15rem}
.development-log {--label-width:140px;position:relative;z-index:4;padding:0 3vw}
.log-tools {display:flex;align-items:center;justify-content:flex-end;gap:.35rem;margin:.15rem 0 .6rem;min-height:44px}
.log-tools button {background:#fffaf04d;border:1.2px solid #8d9b8b;border-radius:3px 6px 2px 5px;min-width:44px;min-height:44px;padding:.15rem .8rem;color:var(--ink);font:700 1.35rem "Amatic",cursive;cursor:pointer}
.log-tools button:hover {background:#edcb5838}
.log-tools .log-scroll-help {margin-right:auto;color:var(--muted);font-size:.85rem}
.log-shell {display:flex;position:relative;width:100%}
.log-labels {position:relative;flex:0 0 var(--label-width);z-index:4;background:var(--paper)}
.log-track-name {position:absolute;left:0;right:10px;transform:translateY(-50%);font:clamp(1.6rem,2.2vw,1.95rem)/1.1 "Road Rage",sans-serif;text-transform:uppercase;overflow-wrap:normal;text-align:right}
.log-scroll {min-width:0;flex:1;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#8e998e #e6e1d3;touch-action:pan-x pan-y pinch-zoom;overscroll-behavior-x:contain;padding-bottom:14px}
.log-scroll:focus-visible {outline-offset:2px}
.log-canvas {position:relative;min-width:100%}
.log-lines {position:absolute;inset:0;display:block;max-width:none;overflow:visible}
.log-week {position:absolute;top:0;text-align:center;font:1.17rem/1.2 "T700 Log Hand",cursive;color:#294c98;padding:0 4px}
.log-week strong {font-weight:400;text-transform:uppercase}
.log-week-dates {display:none}
.log-checkpoint,.log-this-week {display:block;font:1.05rem/1.2 "T700 Log Hand",cursive;color:inherit}
.log-this-week {color:#111;text-transform:uppercase}
.log-week[aria-current] strong {color:#111}
.log-week.is-future {opacity:.64}
.log-flag {position:absolute;width:220px;height:44px;padding:3px 21px 3px 47px;border:0;color:#1b2524;background:transparent;transform:rotate(-.6deg);transform-origin:left bottom;font:1.05rem/1.08 "T700 Log Hand",cursive;text-align:left;cursor:pointer;z-index:3}
.log-flag-art {position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.log-flag-text {position:relative;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.log-flag:focus-visible {outline:2px dashed #415b52;outline-offset:4px}
.log-flag:hover .log-flag-text {text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.log-flag.is-future {opacity:.42}
.log-dot {position:absolute;z-index:5;width:44px;height:44px;border:0;padding:0;background:transparent;transform:translate(-50%,-50%);display:grid;place-items:center;cursor:pointer;color:var(--ink)}
.log-dot-mark {position:relative;width:25px;height:25px;display:grid;place-items:center;color:#fff;font:700 12px/1 Arial,sans-serif}
.log-dot-glyph {display:block;position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.log-dot-count {position:relative;text-shadow:0 1px 1px #23423c66}
.log-dot.is-production-event .log-dot-mark {width:30px;height:30px}
.log-dot.is-future .log-dot-mark {opacity:.42}
.log-dot:hover .log-dot-mark,.log-dot:focus-visible .log-dot-mark {outline:1.5px dashed var(--dot-color);outline-offset:3px;border-radius:47% 53% 49% 51%}
.log-event-label {position:absolute;bottom:36px;left:50%;transform:translateX(-50%) rotate(-1deg);white-space:nowrap;font:1.2rem/1.1 "T700 Log Hand",cursive;color:var(--ink)}
.log-dot.is-future .log-event-label {opacity:.45}
.log-dot-preview {display:none;position:absolute;bottom:40px;left:50%;transform:translateX(-50%) rotate(-.4deg);width:230px;padding:10px 13px;background:#fffaf0;border:1.5px solid #655849;border-radius:2px 1px 3px 1px;box-shadow:3px 3px 0 #c4b08d32;text-align:left;pointer-events:none;color:#243933;font:.94rem/1.2 "T700 Log Hand",cursive}
.log-dot-preview::before {content:"";position:absolute;inset:3px;border:1px solid #8e7b5b55;border-radius:1px 3px 1px 2px;pointer-events:none}
.log-dot-preview::after {content:"";position:absolute;left:calc(50% - 8px);bottom:-9px;width:14px;height:14px;background:#fffaf0;border-right:1.5px solid #655849;border-bottom:1.5px solid #655849;transform:rotate(45deg)}
.log-dot-preview strong {position:relative;display:block;font:1.08rem/1.1 "T700 Log Hand",cursive;text-transform:uppercase;margin-bottom:5px}
@media(hover:hover){.log-dot:hover .log-dot-preview,.log-dot:focus-visible .log-dot-preview {display:block}}
.log-empty {margin:1rem 0 3rem;padding:1.4rem;border-top:2px solid #748575;max-width:45rem;color:var(--body)}
.log-workshop {height:165px;flex:0 0 auto;position:relative;isolation:isolate;margin-top:auto;pointer-events:none}
.log-workshop::before {content:"";position:absolute;left:0;right:0;bottom:0;height:30px;border-top:2px solid #9aa79a;background:linear-gradient(#cddfce77,#f1d9da55);z-index:-1}
.log-workshop::after {content:"";position:absolute;left:0;right:0;bottom:0;height:26px;opacity:.18;background-image:repeating-linear-gradient(90deg,transparent 0 140px,#8f98854a 141px 142px),linear-gradient(0deg,#bdd4c1,transparent);z-index:-1}
.log-workshop-left {position:absolute;left:1vw;bottom:5px;width:clamp(150px,17vw,230px);max-height:160px;object-fit:contain;object-position:left bottom}
.log-workshop-right {position:absolute;right:1vw;bottom:5px;width:clamp(130px,16vw,215px);max-height:150px;object-fit:contain;object-position:right bottom}
.log-dialog {color:#293c36;background:#fffaf0;border:1.7px solid #655849;border-radius:2px 5px 3px 1px;padding:1.6rem;width:min(680px,calc(100vw - 40px));max-height:calc(100dvh - 50px);box-shadow:4px 5px 0 #bca8823b}
.log-dialog::before {content:"";position:absolute;inset:5px;border:1px solid #8e7b5b55;border-radius:3px 1px 4px 2px;pointer-events:none}
.log-dialog::backdrop {background:#142b2666}
.log-dialog-top {display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.log-dialog h2 {font:1.8rem/1.15 "T700 Log Hand",cursive;text-transform:uppercase;margin:0 0 .6rem;color:#000}
.log-dialog-close {flex:0 0 44px;min-height:44px;border:1px solid #7c8e7d;background:transparent;font-size:1.6rem;cursor:pointer;color:var(--ink)}
.log-note-meta {font:.9rem/1.4 "T700 Log Hand",cursive;text-transform:uppercase;color:var(--note-color,#225459);margin:0 0 1rem}
.log-note-body {font-size:1rem;line-height:1.65;overflow-wrap:anywhere}
.log-note-body p {margin:0 0 1em}
.log-note-body img,.log-note-body video {max-width:100%;height:auto}
.log-note-body audio {max-width:100%}
.log-note-body iframe {max-width:100%;width:100%;aspect-ratio:16/9;border:0}
.log-note-body table {border-collapse:collapse;display:block;overflow:auto}
.log-note-body td,.log-note-body th {border:1px solid #c8cec0;padding:.4rem}
.log-note-choice {display:block;text-align:left;width:100%;padding:1rem;background:transparent;border:0;border-bottom:1px solid #c8cec0;font:1.1rem "Oswald",sans-serif;cursor:pointer;color:var(--ink)}
.log-note-choice:hover {background:#edcb5822}
.log-dialog [data-log-note-body]:empty {display:none}
.log-dialog[open] {animation:log-note-in .15s ease-out}
.log-native-fallback {padding:1rem 4.5vw}
@keyframes log-note-in {from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1099px){.development-log{--label-width:120px}.log-heading h1{font-size:clamp(3.7rem,8.5vw,6rem)}.log-workshop{height:145px}.log-workshop-left{max-height:140px}.log-workshop-right{max-height:130px}}
@media(max-width:599px){
 .view-blogs.log-view {padding-top:calc(var(--header-height) + .7rem)}
 .log-heading {padding:0 5vw}
 .log-heading h1 {font-size:3.5rem;line-height:.9}
 .log-heading p {font-size:1.1rem;max-width:22rem}
 .development-log {--label-width:95px;padding:0 3vw}
 .log-track-name {font-size:1.36rem}
 .log-tools {margin-top:.5rem;gap:.25rem}
 .log-tools .log-scroll-help {font-size:.74rem;max-width:110px}
 .log-tools button {padding:.35rem .55rem;min-height:44px}
 .log-week {font-size:1rem}
 .log-checkpoint,.log-this-week {font-size:.95rem}
 .log-flag {font-size:1.05rem}
 .log-workshop {height:125px;margin-top:14px}
 .log-workshop-left {width:142px;max-height:125px;left:0}
 .log-workshop-right {width:115px;max-height:110px;right:0}
 .log-dialog {width:calc(100vw - 20px);max-height:calc(100dvh - 24px);padding:1.1rem}
 .log-dialog h2 {font-size:1.5rem}
 .log-dialog .log-note-body {font-size:1rem}
}
@media(max-height:600px){
 .view-blogs.log-view {padding-top:calc(var(--header-height) + .4rem)}
 .log-heading h1 {font-size:2.8rem}
 .log-heading p {font-size:.9rem}
 .log-tools {margin-top:0}
 .log-workshop {height:100px}
 .log-workshop-left {max-height:95px}
 .log-workshop-right {max-height:85px}
}
@media(prefers-reduced-motion:reduce){.log-dialog[open]{animation:none}.log-scroll{scroll-behavior:auto}}

/* 2.2: frame stays around the dialog; only its content scrolls. */
.log-dialog {padding:1.3rem;overflow:hidden}
.log-dialog[open] {display:flex;flex-direction:column}
.log-dialog-top {flex:none}
.log-dialog-top h2 {overflow-wrap:anywhere;max-height:25dvh;overflow:auto}
.log-dialog-scroll {overflow:auto;min-height:0;overscroll-behavior:contain;padding:.25rem .4rem .5rem 0;scrollbar-gutter:stable}
.log-dialog::before {z-index:2}
.log-branch-name {position:absolute;z-index:2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:1rem/1.2 "T700 Log Hand",cursive;background:var(--paper,#f8f3e5);padding:2px 5px;pointer-events:none}
.log-branch-name.is-future {opacity:.45}
@media(max-width:599px){.log-dialog{padding:1rem}.log-branch-name{font-size:.9rem}}

/* Labels stay below overlays and above the paint. The tooltip is portaled to body. */
.log-lines {z-index:0;pointer-events:none}
.log-week {z-index:1}
.log-dot {z-index:5}
.log-dot:hover,.log-dot:focus-visible {z-index:6}
.log-branch-name {z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:3px;white-space:normal;overflow:visible;text-overflow:clip;font:700 var(--log-branch-size,22px)/1.15 "T700 Log Hand",cursive;padding:0 5px;background:var(--paper,#f8f3e5);overflow-wrap:anywhere}
.log-branch-title {font:inherit}
.log-branch-milestone {display:block;max-width:100%;width:fit-content;padding:2px 7px 1px;border-radius:3px 5px 2px 4px;color:#243933;font:400 13px/1.2 "T700 Log Hand",cursive;overflow-wrap:anywhere}
.log-note-label,.log-event-label {position:absolute;left:50%;bottom:auto;transform:translateX(-50%);white-space:normal;text-align:center;pointer-events:none;font:400 var(--log-report-size,16px)/1.22 "T700 Log Hand",cursive;color:var(--dot-color);padding:2px 3px;overflow-wrap:anywhere}
.log-note-label>span {display:block;width:fit-content;max-width:100%;margin:0 auto;padding:1px 3px;background:var(--paper,#f8f3e5)}
.log-note-label.is-above {bottom:36px;top:auto}
.log-note-label.is-below {top:36px;bottom:auto}
.log-dot.is-future .log-note-label {opacity:.45}
.log-measure {position:absolute;left:0;top:0;width:0;height:0;visibility:hidden;pointer-events:none;overflow:hidden}
.log-dot .log-dot-preview {display:none!important}
.log-hover-preview {display:block;position:fixed;z-index:100000;left:0;top:0;bottom:auto;transform:none;width:min(260px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:10px 13px;box-sizing:border-box;pointer-events:auto;isolation:isolate}
.log-hover-preview[hidden] {display:none!important}
.log-hover-preview strong {color:var(--dot-color);overflow-wrap:anywhere;max-height:5.2em;overflow:hidden}
.log-hover-preview>span {display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;position:relative}
.log-hover-preview::after {left:calc(var(--preview-tip,50%) - 8px)}
.log-hover-preview[data-side="below"]::after {bottom:auto;top:-9px;transform:rotate(225deg)}
.log-tools {flex-wrap:wrap;gap:.4rem;justify-content:flex-end}
.log-interaction-guide {display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:1rem;margin-left:auto;margin-right:.65rem;color:#225459;font:400 14px/1.2 "T700 Log Hand",cursive}
.log-guide-item {display:inline-flex;align-items:center;gap:.4rem;max-width:240px;overflow-wrap:anywhere}
.log-guide-item svg {display:block;flex:0 0 24px;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;overflow:visible}
.log-guide-item+.log-guide-item {padding-left:.7rem;border-left:1px solid #8d9b8b55}
@media(max-width:850px){.log-interaction-guide{font-size:13px;gap:.6rem;flex:1 1 100%;margin:.2rem 0 .35rem}.log-guide-item+.log-guide-item{padding-left:.5rem}}
@media(max-width:599px){.log-interaction-guide{justify-content:space-between;gap:.5rem}.log-guide-item{max-width:48%}.log-guide-hover{display:none}.log-guide-item svg{width:22px;height:22px;flex-basis:22px}.log-branch-name{font-size:var(--log-branch-size,22px)}}
@media(hover:none){.log-guide-hover{display:none}}