:host{display:block;min-width:0}
.ctw-root{--ctw-bg:#060703;--ctw-accent:#9dcd00;--ctw-cream:#cbdb93;--ctw-copy:#f0f0e8;--ctw-rule:color-mix(in srgb,var(--ctw-accent) 24%,var(--ctw-bg));--ctw-sans:var(--font-family--body,"Satoshi Variable",Arial,sans-serif);--ctw-heading:var(--font-family--heading,"Satoshi Variable",Arial,sans-serif);--ctw-mono:var(--font-family--mono,"Robotomono Variablefont Wght",ui-monospace,SFMono-Regular,Consolas,monospace);min-height:100svh;background:var(--ctw-bg);color:var(--ctw-copy);font-family:var(--ctw-sans);overflow:hidden;text-align:left}
.ctw-root *{box-sizing:border-box}.ctw-root button{font:inherit}.ctw-inner{max-width:1440px;min-height:100svh;margin:0 auto;padding:36px 0 0;display:flex;flex-direction:column}.ctw-header{padding:34px 0 25px;display:flex;align-items:flex-end;justify-content:space-between;gap:28px}.ctw-header h2{font-family:var(--ctw-heading);font-size:clamp(34px,4vw,56px);letter-spacing:-.045em;line-height:1.05;font-weight:400;margin:0}.ctw-controls{display:flex;align-items:center;gap:8px}.ctw-position,.ctw-date,.ctw-year,.ctw-footer{font-family:var(--ctw-mono);text-transform:uppercase;letter-spacing:.1em}.ctw-position{font-size:11px;color:var(--ctw-cream);margin-right:20px;white-space:nowrap}.ctw-position b{color:var(--ctw-accent);font-weight:400}.ctw-controls button{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;margin:0;padding:0;border:1px solid color-mix(in srgb,var(--ctw-accent) 72%,var(--ctw-bg));border-radius:0;background:color-mix(in srgb,var(--ctw-accent) 9%,var(--ctw-bg));color:var(--ctw-accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ctw-accent) 10%,transparent);font-family:var(--ctw-mono);font-size:23px;line-height:1;cursor:pointer;transition:background .2s,color .2s,border-color .2s}.ctw-controls button:hover:not(:disabled),.ctw-controls button:focus-visible{background:var(--ctw-accent);border-color:var(--ctw-accent);color:var(--ctw-bg)}.ctw-controls button:disabled{opacity:.22;cursor:default}.ctw-controls button:focus-visible{outline:2px solid var(--ctw-copy);outline-offset:3px}
.ctw-overview{height:1px;background:var(--ctw-rule);position:relative}.ctw-overview span{display:block;height:1px;width:var(--ctw-progress);background:var(--ctw-accent);transition:width .55s cubic-bezier(.22,1,.36,1)}.ctw-overview span:after{content:"";position:absolute;left:var(--ctw-progress);top:-3px;width:7px;height:7px;background:var(--ctw-accent);transform:translateX(-3px);transition:left .55s cubic-bezier(.22,1,.36,1)}
.ctw-drag-label{width:max-content;display:flex;align-items:center;gap:9px;padding:8px 11px;border:1px solid color-mix(in srgb,var(--ctw-accent) 55%,var(--ctw-bg));background:color-mix(in srgb,var(--ctw-accent) 5%,var(--ctw-bg));color:var(--ctw-cream);font-family:var(--ctw-mono);font-size:8px;letter-spacing:.1em;white-space:nowrap}.ctw-drag-label>span{width:5px;height:5px;background:var(--ctw-accent)}.ctw-drag-label b{color:var(--ctw-accent);font-size:14px;font-weight:400;line-height:1}.ctw-viewport{position:relative;flex:1;min-height:620px;overflow:hidden;outline:none;cursor:grab;touch-action:pan-y;user-select:none;transform:translateX(0);opacity:1;transition:transform 1.15s cubic-bezier(.22,1,.36,1),opacity .9s ease}.ctw-root:not([data-entered=true]) .ctw-viewport{transform:translateX(42px);opacity:.82}.ctw-viewport[data-dragging=true]{cursor:grabbing}.ctw-viewport:focus-visible{box-shadow:inset 0 0 0 1px var(--ctw-rule)}.ctw-track{--ctw-shift:0px;--ctw-drag:0px;position:relative;display:flex;width:max-content;min-height:620px;list-style:none;margin:0;padding:0 16px;gap:30px;transform:translate3d(calc(var(--ctw-shift) + var(--ctw-drag)),0,0);transition:transform .9s cubic-bezier(.22,1,.36,1);will-change:transform}.ctw-root:not([data-positioned=true]) .ctw-track,.ctw-viewport[data-dragging=true] .ctw-track{transition:none}.ctw-drag-intro{position:relative;flex:0 0 220px;width:220px;min-height:620px}.ctw-drag-intro:before{content:"";position:absolute;left:0;right:-15px;top:50%;height:1px;background:var(--ctw-accent)}.ctw-drag-intro:after{content:"";position:absolute;left:0;top:calc(50% - 4px);width:8px;height:8px;background:var(--ctw-accent)}.ctw-drag-intro .ctw-drag-label{position:absolute;left:0;top:calc(50% - 52px)}.ctw-drag-intro>i{position:absolute;right:-4px;top:calc(50% - 4px);width:8px;height:8px;background:var(--ctw-accent)}.ctw-item{position:relative;flex:0 0 540px;width:540px;min-height:620px}.ctw-item:before{content:"";position:absolute;left:-15px;right:-15px;top:50%;height:1px;background:var(--ctw-rule);transition:background-color .6s ease}.ctw-item[data-passed=true]:before{background:var(--ctw-accent)}.ctw-item[data-active=true]:before{background:linear-gradient(90deg,var(--ctw-accent) 0 50%,var(--ctw-rule) 50%)}
.ctw-card{position:absolute;left:0;width:100%;height:270px;display:flex;border:1px solid var(--ctw-rule);background:var(--ctw-bg);opacity:.48;transition:opacity .65s ease,border-color .65s ease,transform .9s cubic-bezier(.22,1,.36,1)}.ctw-item[data-side=above] .ctw-card{top:20px}.ctw-item[data-side=below] .ctw-card{bottom:20px}.ctw-item[data-active=true] .ctw-card{opacity:1;border-color:var(--ctw-accent);transform:translateY(0)}.ctw-item[data-side=above]:not([data-active=true]) .ctw-card{transform:translateY(8px)}.ctw-item[data-side=below]:not([data-active=true]) .ctw-card{transform:translateY(-8px)}.ctw-item:hover .ctw-card{opacity:.8}
.ctw-media{width:56%;flex:none;position:relative;overflow:hidden;border-right:1px solid var(--ctw-rule)}.ctw-media img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;pointer-events:none;user-select:none;-webkit-user-drag:none}.ctw-copy{padding:24px 22px;min-width:0;align-self:center}.ctw-date{display:block;font-size:10px;color:var(--ctw-cream);margin-bottom:18px}.ctw-copy h3{font-family:var(--ctw-heading);color:var(--ctw-accent);font-size:15px;line-height:1.4;font-weight:400;text-transform:uppercase;margin:0 0 13px;overflow-wrap:break-word}.ctw-copy p{font-size:13px;line-height:1.62;margin:0;color:var(--ctw-copy);overflow-wrap:break-word}.ctw-stem{position:absolute;left:50%;width:1px;background:var(--ctw-rule)}.ctw-item[data-passed=true] .ctw-stem{background:var(--ctw-accent)}.ctw-item[data-side=above] .ctw-stem{top:290px;height:calc(50% - 290px)}.ctw-item[data-side=below] .ctw-stem{top:50%;height:calc(50% - 290px)}.ctw-node{position:absolute;left:calc(50% - 5px);top:calc(50% - 5px);width:10px;height:10px;background:var(--ctw-bg);border:1px solid var(--ctw-rule)}.ctw-item[data-passed=true] .ctw-node{background:var(--ctw-accent);border-color:var(--ctw-accent)}.ctw-item[data-active=true] .ctw-node{box-shadow:0 0 0 5px color-mix(in srgb,var(--ctw-accent) 18%,transparent)}.ctw-year{position:absolute;left:calc(50% + 15px);font-size:9px;color:var(--ctw-cream)}.ctw-item[data-side=above] .ctw-year{top:calc(50% + 14px)}.ctw-item[data-side=below] .ctw-year{bottom:calc(50% + 14px)}
.ctw-footer{height:58px;display:flex;align-items:center;gap:10px;border-top:1px solid var(--ctw-rule);font-family:var(--ctw-mono);font-size:8px;letter-spacing:.1em;color:var(--ctw-cream)}.ctw-footer>span{width:5px;height:5px;background:var(--ctw-accent)}.ctw-footer b{font-weight:400;margin-left:auto}
.ctw-root[data-editing] .ctw-viewport{cursor:default}
@media(max-width:760px){.ctw-inner{padding:20px 0 0}.ctw-header{padding:24px 0 18px;display:block}.ctw-header h2{font-family:var(--ctw-heading);font-size:36px}.ctw-controls{margin-top:22px}.ctw-position{margin-right:auto}.ctw-controls button{width:46px;height:46px}.ctw-viewport{min-height:620px}.ctw-track{min-height:620px;gap:20px}.ctw-drag-intro{flex-basis:170px;width:170px;min-height:620px}.ctw-drag-intro:before{top:558px}.ctw-drag-intro:after,.ctw-drag-intro>i{top:554px}.ctw-drag-intro .ctw-drag-label{top:506px;font-size:8px}.ctw-item{flex-basis:calc(100vw - 48px);width:calc(100vw - 48px);min-height:620px}.ctw-item:before{top:558px}.ctw-card,.ctw-item[data-side=above] .ctw-card,.ctw-item[data-side=below] .ctw-card{height:520px;top:18px;bottom:auto;flex-direction:column}.ctw-stem,.ctw-item[data-side=above] .ctw-stem,.ctw-item[data-side=below] .ctw-stem{top:538px;height:20px}.ctw-node{top:553px}.ctw-year,.ctw-item[data-side=above] .ctw-year,.ctw-item[data-side=below] .ctw-year{top:572px;bottom:auto}.ctw-media{width:100%;height:250px;flex-basis:250px;border-right:0;border-bottom:1px solid var(--ctw-rule)}.ctw-media img{object-position:50% 0}.ctw-copy{padding:17px 16px}.ctw-date{font-size:10px;margin-bottom:13px}.ctw-copy h3{font-size:15px;line-height:1.45;margin-bottom:10px}.ctw-copy p{font-size:14px;line-height:1.55}}
@media(prefers-reduced-motion:reduce){.ctw-root *{scroll-behavior:auto!important;transition:none!important}}

/* Give milestone copy enough room to read at a glance. Dates and controls remain mono. */
.ctw-viewport,.ctw-track,.ctw-drag-intro,.ctw-item{min-height:720px}
.ctw-item{flex-basis:650px;width:650px}
.ctw-card{height:320px;opacity:.72}
.ctw-item:hover .ctw-card{opacity:.9}
.ctw-media{width:45%}
.ctw-copy{padding:26px 25px}
.ctw-date{font-size:12px;line-height:1.4;margin-bottom:16px}
.ctw-copy h3{font-size:23px;line-height:1.25;font-weight:500;text-transform:none;margin-bottom:14px}
.ctw-copy p{font-size:18px;line-height:1.45}
.ctw-item[data-side=above] .ctw-stem{top:340px;height:calc(50% - 340px)}
.ctw-item[data-side=below] .ctw-stem{height:calc(50% - 340px)}

@media(max-width:760px){
  .ctw-root,.ctw-inner{min-height:0}
  .ctw-viewport{flex:none;min-height:0;transition:height .35s ease,transform 1.15s cubic-bezier(.22,1,.36,1),opacity .9s ease}
  .ctw-track{min-height:0;align-items:flex-start}
  .ctw-drag-intro{display:none}
  .ctw-item{display:flex;flex-direction:column;align-items:stretch;flex-basis:calc(100vw - 48px);width:calc(100vw - 48px);min-height:0}
  .ctw-item:before{display:none}
  .ctw-card,.ctw-item[data-side=above] .ctw-card,.ctw-item[data-side=below] .ctw-card{position:relative;left:auto;top:auto;bottom:auto;width:100%;height:auto;min-height:0;flex-direction:column}
  .ctw-item[data-side=above]:not([data-active=true]) .ctw-card,.ctw-item[data-side=below]:not([data-active=true]) .ctw-card{transform:none}
  .ctw-media{width:100%;height:230px;flex:0 0 230px}
  .ctw-copy{width:100%;align-self:stretch;padding:22px 20px}
  .ctw-date{font-size:12px;margin-bottom:14px}
  .ctw-copy h3{font-size:22px;line-height:1.28;margin-bottom:13px}
  .ctw-copy p{font-size:17px;line-height:1.5}
  .ctw-stem,.ctw-item[data-side=above] .ctw-stem,.ctw-item[data-side=below] .ctw-stem{position:relative;left:auto;top:auto;width:1px;height:20px;flex:0 0 20px;margin:0 auto}
  .ctw-node{position:relative;left:auto;top:auto;flex:none;margin:-5px auto 0}
  .ctw-year,.ctw-item[data-side=above] .ctw-year,.ctw-item[data-side=below] .ctw-year{position:relative;left:auto;top:auto;bottom:auto;align-self:center;margin-top:8px;font-size:10px}
}