/* Licensed space photography and fitted contour strokes share one responsive crop. */
[data-space-art]{--art-light:146 190 235}
[data-space-art] > picture > img,[data-space-art] > img{filter:grayscale(1) brightness(.8);transition:filter 1.1s ease}
[data-space-art].color-open > picture > img,[data-space-art].color-open > img{filter:grayscale(0) brightness(1)}
.space-contours{position:absolute;inset:0;pointer-events:none;overflow:hidden;color:rgb(var(--art-light));opacity:0;transition:opacity .4s ease}
.color-open > .space-contours{opacity:.2;transition:opacity .6s ease}
.contour-flow{display:block;width:100%;height:100%;filter:drop-shadow(0 0 2px rgb(var(--art-light) / .45))}
.contour-flow path{stroke:currentColor;stroke-width:var(--line-weight);stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:0;transition:stroke-dashoffset .4s ease,opacity .3s ease}
.color-open > .space-contours .contour-flow path{stroke-dashoffset:0;opacity:1;transition:stroke-dashoffset 1.65s cubic-bezier(.3,.05,.15,1) var(--stroke-delay),opacity .25s ease var(--stroke-delay)}
.j-card:nth-child(2){--art-light:157 181 235}
.j-card:nth-child(3){--art-light:169 206 235}
.j-card:nth-child(4),.why-tora-art{--art-light:160 176 235}
.j-card picture{position:absolute;inset:0;overflow:hidden}
.j-card .art,.j-card:hover .art,.j-card:focus-visible .art,.j-card.is-lit .art{transform:none}
.j-card > .space-contours{z-index:0}
.j-card .veil{z-index:1;pointer-events:none}
.j-dialog .jd-art::after{z-index:1;pointer-events:none}
.j-card .cat{color:#aaa;transition:color .7s ease,opacity .7s ease,transform .7s ease}
.j-card.color-open .cat{color:rgb(var(--art-light));opacity:1;transform:none}
.j-card::before{background:radial-gradient(14rem circle at var(--mx) var(--my),rgb(var(--art-light) / .65),rgb(var(--art-light) / .2) 35%,transparent 70%)}
.j-card::after{background:radial-gradient(18rem circle at var(--mx) var(--my),rgb(var(--art-light) / .1),transparent 68%)}
.j-card.color-open::before,.j-card.color-open::after{opacity:1}
.j-card.color-open{box-shadow:0 8px 38px rgb(var(--art-light) / .1)}
.art-credit{font:400 .6875rem/1.65 var(--sans);color:#89919a;max-width:none;margin:1rem 0 0}
.art-credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}
#why-tora .art-credit{max-width:38rem;pointer-events:auto}
.j-dialog .art-credit{font-size:.6875rem;margin-top:1.25rem}
#privacy .priv-panel{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:40rem;margin:var(--space-8) 0;padding:3rem 1.5rem;border:1px solid rgb(143 179 203 / .12);border-radius:var(--radius-xl);background:radial-gradient(ellipse at 50% 28%,rgb(52 78 98 / .2),transparent 62%),rgb(var(--c-carbon) / .45)}
.privacy-lock-button{display:block;width:17rem;max-width:70%;padding:0;border:0;color:inherit;background:none;cursor:pointer;transition:transform .3s cubic-bezier(.2,.7,.3,1);transform-origin:center}
.privacy-lock{display:block;width:100%;height:auto}
.privacy-lock-button:hover{transform:scale(1.06)}
.privacy-lock-button:active{transform:scale(1.02)}
.privacy-lock-button:focus-visible,.privacy-learn:focus-visible{outline:2px solid var(--steel-6,#8FB3CB);outline-offset:5px;border-radius:1rem}
#privacy h2{margin:.25rem 0 1rem}
#privacy .lede{max-width:40rem;margin:0;color:var(--muted);line-height:1.65}
.privacy-learn{margin:1.5rem 0 0;padding:.5rem;border:0;background:none;color:#8FB3CB;font:500 .95rem var(--sans);cursor:pointer}
.privacy-learn span{display:inline-block;margin-left:.25rem;transition:transform .2s ease}
.privacy-learn:hover span{transform:translate(2px,-2px)}
/* The fill is the border's own steel at a lower opacity over neutral black, so the two match in hue. */
.privacy-dialog{width:min(40rem,calc(100vw - 2rem));max-height:85dvh;padding:0;margin:auto;overflow:auto;color:var(--ink);--privacy-steel:143 179 203;background:linear-gradient(rgb(var(--privacy-steel) / .1),rgb(var(--privacy-steel) / .1)),#0A0A0A;border:1px solid rgb(var(--privacy-steel) / .3);border-radius:1.5rem;box-shadow:0 2rem 6rem #0008}
.privacy-dialog::backdrop{background:rgb(5 8 12 / .75);backdrop-filter:blur(10px)}
.privacy-dialog-body{padding:2rem}
.privacy-dialog h2{font:600 1.5rem/1.25 var(--sans);margin:0 0 .75rem}
.privacy-dialog h3{font:600 1rem/1.4 var(--sans);color:var(--ink);margin:1.5rem 0 .4rem}
.privacy-dialog p{font:400 .95rem/1.6 var(--sans);color:var(--muted);margin:0}
.privacy-dialog-actions{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;margin-top:2rem}
.privacy-dialog-actions a{font-size:.875rem;color:#8FB3CB;text-decoration:underline;text-underline-offset:3px}
.privacy-dialog-actions button{flex-shrink:0;cursor:pointer}
@media(max-width:600px){#privacy .priv-panel{min-height:34rem;padding:2rem 1.25rem}.privacy-lock-button{width:14rem}.privacy-dialog-body{padding:1.5rem}.privacy-dialog-actions{gap:1rem}}
