/* Character portraits and a shared, restrained motion language. */
#force-field{position:fixed;inset:0;width:100%;height:100%;z-index:21;pointer-events:none;mix-blend-mode:screen;opacity:.82;transition:opacity .5s}
.modal-open #force-field{opacity:.12}
.motion-toggle{position:fixed;bottom:22px;right:22px;z-index:24;display:grid;place-items:center;width:38px;height:38px;border:1px solid #d7ba7d38;border-radius:50%;background:#101518d9;backdrop-filter:blur(12px);color:var(--gold);box-shadow:0 3px 20px #0003;transition:color .25s,border-color .25s}
.motion-toggle svg{width:16px;height:16px;stroke-width:1.2}.motion-toggle:hover{border-color:var(--gold)}.motion-toggle[aria-pressed=false]{color:#737b80;border-color:#ffffff20}.modal-open .motion-toggle{visibility:hidden}
.hero-shade{z-index:1}.hero-grid{z-index:1}.hero-content,.hero-coordinate,.hero-scroll{z-index:2}.motion-active .hero-art{will-change:transform}.motion-active .hero .status-dot{animation:signal-breathe 5s ease-in-out infinite}
.habit-grid{gap:14px}.habit-card{position:relative;overflow:hidden;padding:0;display:flex;flex-direction:column;min-height:432px;border:1px solid #d7ba7d1d;background:#121619;text-align:left;isolation:isolate;transition:transform .45s,border-color .45s,box-shadow .45s}
.habit-card:hover{border-color:#d7ba7d8c;box-shadow:0 20px 40px #0004;transform:translateY(-6px);background:#151a1d}
.habit-visual{position:relative;display:block;width:100%;height:236px;overflow:hidden;flex-shrink:0;background:#152128}
.habit-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#121619 0,transparent 38%),linear-gradient(180deg,#0005,transparent 35%);pointer-events:none}
.habit-visual img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:saturate(.76) contrast(1.03);transition:transform 1.1s cubic-bezier(.2,.65,.3,1),filter 1.1s}
.habit-card:hover .habit-visual img{transform:scale(1.065);filter:saturate(.96) contrast(1.03)}
.habit-card[data-habit=move] .habit-visual img{object-position:50% 33%}.habit-card[data-habit=sleep] .habit-visual img{object-position:50% 43%}
.habit-card .card-top{position:absolute;top:15px;left:15px;right:15px;margin:0;display:flex;align-items:center;justify-content:space-between;z-index:1;color:#e6d7b6}
.habit-card .card-top svg{width:23px;height:23px;filter:drop-shadow(0 1px 5px #0009);stroke-width:1.1}.habit-card .card-top>span{display:block;font-size:9px;color:#f2e7d0c4;margin:0;letter-spacing:1px}
.habit-character{position:absolute;bottom:16px;left:20px;right:12px;z-index:1;color:var(--gold);font-size:8px;font-weight:600;letter-spacing:1.6px;line-height:1.5;text-shadow:0 1px 8px #0008}
.habit-content{display:flex;flex-direction:column;flex:1;padding:3px 20px 15px;width:100%}
.habit-title{display:block;font-size:17px;font-weight:600;line-height:1.4;letter-spacing:-.5px;color:var(--white);margin-bottom:12px}
.habit-description{display:block;font-size:11px;line-height:1.9;color:#a5abae;margin-bottom:22px}
.habit-card .card-bottom{padding-top:12px;margin-top:auto;width:100%;font-size:6.5px;letter-spacing:.6px}
.habit-card:before{content:'';position:absolute;top:0;bottom:0;left:-80%;width:40%;background:linear-gradient(90deg,transparent,#e7d2aa10,transparent);transform:skewX(-18deg);z-index:3;pointer-events:none}
.motion-active .habit-card:hover:before{animation:portrait-light 1.2s ease-out}
.habit-dialog-visual{position:relative;height:190px;margin:26px -10px 0;overflow:hidden;background:#142027}
.habit-dialog-visual img{width:100%;height:100%;object-fit:cover;object-position:center 33%}
.habit-dialog-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#111518,transparent 60%)}
#habit-character{position:absolute;bottom:15px;left:20px;color:var(--gold);font-size:9px;letter-spacing:2px;text-transform:uppercase;z-index:1}.habit-dialog .dialog-icon{width:24px;height:24px;margin-top:14px}.habit-dialog h2{margin-top:8px}.habit-dialog{max-width:560px}
.motion-active .orbit-art .o1{animation:orbit-turn 70s linear infinite}.motion-active .orbit-art .o2{animation:orbit-turn-reverse 100s linear infinite}.motion-active .orbit-art>svg{animation:emblem-breathe 8s ease-in-out infinite}
.reveal{transition:opacity .85s ease,transform .85s cubic-bezier(.16,.7,.25,1);transition-delay:var(--reveal-delay,0ms)}
.motion-active .reveal:not(.is-visible){opacity:.05;transform:translateY(24px)}
.motion-active .reveal.is-visible{opacity:1;transform:translateY(0)}
.motion-active .habit-card.reveal.is-visible{transition:transform .45s,border-color .45s,box-shadow .45s,opacity .85s;transition-delay:0ms}
.motion-active .habit-card.reveal.is-visible:hover{transform:translateY(-6px)}
@keyframes signal-breathe{0%,100%{box-shadow:0 0 6px #d7ba7d44;opacity:.65}50%{box-shadow:0 0 14px #d7ba7d99;opacity:1}}
@keyframes portrait-light{from{left:-80%}to{left:160%}}
@keyframes orbit-turn{from{transform:rotate(-40deg)}to{transform:rotate(320deg)}}
@keyframes orbit-turn-reverse{from{transform:rotate(130deg)}to{transform:rotate(-230deg)}}
@keyframes emblem-breathe{0%,100%{filter:drop-shadow(0 0 8px #d7ba7d10)}50%{filter:drop-shadow(0 0 20px #d7ba7d38)}}
@media(max-width:1150px){.habit-content{padding-inline:15px}.habit-character{left:15px;font-size:7px;letter-spacing:1.2px}.habit-title{font-size:15px}.habit-visual{height:210px}.habit-card{min-height:425px}.habit-card .card-bottom{font-size:6px;letter-spacing:.4px}}
@media(max-width:900px){.habit-card{min-height:420px;padding:0}.habit-visual{height:235px}.habit-content{padding:3px 21px 18px}.habit-title{font-size:18px}.habit-description{font-size:12px}.habit-character{font-size:9px;left:21px}.habit-card .card-bottom{font-size:8px}.habit-card:nth-child(n+4) .habit-visual{height:245px}}
@media(max-width:680px){.habit-grid{gap:20px}.habit-card,.habit-card:nth-child(n+4){display:flex;min-height:0;padding:0}.habit-visual,.habit-card:nth-child(n+4) .habit-visual{height:255px}.habit-visual img{object-position:50% 28%}.habit-card[data-habit=sleep] .habit-visual img{object-position:50% 40%}.habit-card .card-top{grid-row:auto;top:19px;left:21px;right:21px}.habit-card .card-top>span{font-size:10px;margin:0}.habit-character{bottom:17px;font-size:9px;letter-spacing:2px}.habit-content{padding:3px 22px 19px}.habit-title{font-size:23px;margin-bottom:10px;letter-spacing:-.7px}.habit-description{font-size:12px;max-width:300px;margin-bottom:20px}.habit-card .card-bottom{font-size:8px;padding-top:12px}.habit-card:hover,.motion-active .habit-card.reveal.is-visible:hover{transform:none}.motion-toggle{right:14px;bottom:14px;width:34px;height:34px}.motion-toggle svg{width:14px;height:14px}.habit-dialog-visual{height:180px;margin-inline:-4px}.habit-dialog .dialog-icon{margin-top:14px}.habit-dialog h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){.reveal,.motion-active .reveal:not(.is-visible){opacity:1;transform:none;transition:none}.motion-active .hero-art{will-change:auto}.habit-card .habit-visual img{transition:none}.motion-active .habit-card:hover:before{animation:none}}


.habit-card[data-habit=control] .habit-visual img{object-position:50% 9%}
.habit-card[data-habit=move] .habit-visual img{object-position:40% 9%}
.habit-card[data-habit=focus] .habit-visual img{object-position:100% 30%}
.habit-card[data-habit=respect] .habit-visual img{object-position:50% 2%;filter:brightness(.72) saturate(.6) contrast(1.08)}
.habit-dialog[data-character=control] .habit-dialog-visual img{object-position:50% 8%}
.habit-dialog[data-character=sleep] .habit-dialog-visual img{object-position:50% 36%}
.habit-dialog[data-character=move] .habit-dialog-visual img{object-position:50% 9%}
.habit-dialog[data-character=respect] .habit-dialog-visual img{object-position:50% 1%}
.path.dark-path .path-image img{object-position:0% 45%;filter:brightness(.78) saturate(.75)}
.path.light-path .path-image img{object-position:50% 36%;filter:brightness(.85) saturate(.65)}

.habit-card[data-habit=focus] .habit-visual img{transform:scale(1.48);transform-origin:90% 32%}
.habit-card[data-habit=focus]:hover .habit-visual img{transform:scale(1.55)}
.habit-card[data-habit=sleep] .habit-visual img{transform:scale(1.18);transform-origin:50% 42%}
.habit-card[data-habit=sleep]:hover .habit-visual img{transform:scale(1.24)}
.habit-card[data-habit=respect] .habit-visual:after{background:linear-gradient(0deg,#121619,transparent 60%),linear-gradient(90deg,#14202a88,transparent 45%,#14202a55)}
.path.dark-path .path-image img{width:200%;max-width:none;object-position:0% 12%;filter:brightness(1.08) saturate(.7);transform-origin:0% 40%}
