/* Astor v4 motion + feedback layer. One token set (DESIGN-v4.md §Motion). transform/opacity only. */
:root{--t-instant:80ms;--t-fast:120ms;--t-base:170ms;--t-slow:280ms;--t-page:420ms;
 --e-out:cubic-bezier(.2,.8,.2,1);--e-in:cubic-bezier(.5,0,.75,0);--e-spring:cubic-bezier(.25,1.08,.5,1);--tq:#14a7a0;--em:#1fae6e}
/* focus: thin turquoise line everywhere */
:focus-visible{outline:1px solid var(--tq)!important;outline-offset:3px;border-radius:0}
/* tool tabs: underline grows from the left, press scale, sliding indicator */
.bar nav>a,.bar nav>button,.bar .tools>*,header.bar>button,header.bar>a,.modes button,#sorts button,#filters button,.v4-fc header button,.v4-fc header label{position:relative;transition:color var(--t-fast) var(--e-out),transform var(--t-instant) var(--e-out)}
.bar nav>a::after,.bar nav>button::after,.bar .tools>a::after,.bar .tools>button::after,header.bar>button::after,header.bar>a::after,#sorts button::after,#filters button::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1px;background:currentColor;opacity:.4;transform:scaleX(0);transform-origin:left;transition:transform var(--t-fast) var(--e-out)}
.bar nav>a:hover::after,.bar nav>button:hover::after,.bar .tools>a:hover::after,.bar .tools>button:hover::after,header.bar>button:hover::after,header.bar>a:hover::after,#sorts button:hover::after,#filters button:hover::after{transform:scaleX(1)}
button:active,a:active,.v4-s-res a:active,.bk:active,.who:active,label:active{transform:scale(.985)}
.bar nav>*:hover,.bar .tools>*:hover,header.bar>button:hover,header.bar>a:hover{color:var(--fg,#e7e6e2)}
.v4-ind{position:absolute;left:0;bottom:-4px;height:1px;width:1px;background:linear-gradient(90deg,var(--tq),var(--em));box-shadow:0 0 6px color-mix(in srgb,var(--tq) 40%,transparent);transform-origin:left;opacity:0;pointer-events:none;transition:transform var(--t-base) var(--e-out),opacity var(--t-fast) var(--e-out)}
.v4-ind.on{opacity:1}
/* links: underline draws in */
main a:not([class]),.lb a,.story-in a,.srcs a,.cap a,figcaption a,.v4-from a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size var(--t-base) var(--e-out),color var(--t-fast)}
main a:not([class]):hover,.lb a:hover,.story-in a:hover,.srcs a:hover,figcaption a:hover,.v4-from a:hover{background-size:100% 1px;color:var(--fg,#e7e6e2)}
/* previews + tooltips: fade + rise from the link, spring-ish, out with no flicker */
.v4-pv{transform:translateY(3px) scale(.995);transform-origin:var(--ox,20px) 0;transition:opacity var(--t-base) var(--e-out),transform var(--t-base) var(--e-spring)}
.v4-pv.on{transform:none}
.v4-pv.out{opacity:0;transform:translateY(4px) scale(.99);transition-duration:var(--t-fast);transition-timing-function:var(--e-in)}
.gpop:not([hidden]){animation:v4in var(--t-base) var(--e-spring) both}
@keyframes v4in{from{opacity:0;transform:translateY(3px) scale(.995)}}
/* panels open from their trigger */
.v4-search .v4-s-in,.v4-fc .v4-fc-in,.quiz[open],.toc:not([hidden]) .toc-in{transform-origin:var(--ox,50%) var(--oy,0);animation:v4open var(--t-slow) var(--e-out) both}
@keyframes v4open{from{opacity:0;transform:scale(.988) translateY(-3px)}}
.v4-lb-x,.v4-cap-f .a button,.v4-cap-f .a a{transition:color var(--t-fast),transform var(--t-instant)}
/* rows: tiny slide + accent tick on hover */
.toc li a,.ers a,.bk,.gate li,.v4-s-res a,.who,#gl>div,.layer summary{transition:transform var(--t-base) var(--e-out),color var(--t-fast),opacity var(--t-fast)}
.toc li a:hover,.who:hover,.layer summary:hover{transform:translateX(2px)}
.bk:hover{transform:translateX(1px)}
.toc li a{position:relative}.toc li a::before{content:"";position:absolute;left:-.9rem;top:50%;width:.45rem;height:1px;background:var(--tq);transform:scaleX(0);transform-origin:left;transition:transform var(--t-fast) var(--e-out)}
.toc li a:hover::before,.toc li.cur a::before{transform:scaleX(1)}
/* fact cap + lightbox */
.v4-cap-b{transition:transform var(--t-instant) var(--e-out)}.v4-cap-b:active{transform:scale(.96)}

/* flash cards: success / fail cues */
.v4-fc .card.ok .bk{animation:v4ok var(--t-page) var(--e-out)}
@keyframes v4ok{0%{box-shadow:inset 1px 0 0 var(--em)}40%{box-shadow:inset 1px 0 0 var(--em),-10px 0 24px -12px var(--em)}100%{box-shadow:none}}
.v4-fc .card.no .fc3{animation:v4no var(--t-slow) var(--e-out)}
@keyframes v4no{25%{transform:rotateX(180deg) translateX(-2px)}60%{transform:rotateX(180deg) translateX(1.5px)}100%{transform:rotateX(180deg)}}
.v4-fc .mc button{transition:transform var(--t-instant),color var(--t-fast),padding var(--t-base) var(--e-out)}
.v4-fc .mc button.right{animation:v4in var(--t-base) var(--e-spring)}
.v4-fc .hint:not(:empty){animation:v4in var(--t-base) var(--e-spring)}
/* reader controls */
#stage~.bar button,.bar.bottom button,#scrub{transition:color var(--t-fast),transform var(--t-instant)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}button:active,a:active{transform:none}}
/* soft dimming: siblings recede a touch while one row is hovered */
@media (hover:hover){.toc ol:hover li a,.bar nav:hover>*:not(:hover):not(.v4-ind){opacity:.72}.toc ol li a:hover,.bar nav>*:hover{opacity:1}}
.bar nav>*,.bar .tools>*{white-space:nowrap}
.bar nav[data-ind]>a::after,.bar nav[data-ind]>button::after,.bar .tools[data-ind]>a::after,.bar .tools[data-ind]>button::after{display:none}
/* consistent bars everywhere: opaque near-black, one hairline */
.bar{background:rgba(12,13,14,.96)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(231,230,226,.08)}
.bar.bottom{box-shadow:0 -1px 0 rgba(231,230,226,.08)}
/* v6.1 one underline rule: where the sliding indicator runs, item-level underlines stand down */
[data-ind] .ul,[data-ind] .ul:hover{background-size:0 1px!important}
[data-ind]>a,[data-ind]>button{text-decoration:none!important;border-bottom-color:transparent!important}