/* SHEM EANSIT — Motion + Continuity
   Quiet movement only. The visual system stays locked; motion should feel like content
   settling into the same room, never like a tech dashboard or carousel. */

:root{
  --se-motion-fast:130ms;
  --se-motion:175ms;
  --se-motion-slow:220ms;
  --se-motion-ease:cubic-bezier(.22,.72,.28,1);
}

/* The shell, member header, quick exit and bottom navigation stay visually anchored. */
#main.se-motion-entering > :not(.member-head):not(.bottom-nav){
  animation:se-content-settle var(--se-motion) var(--se-motion-ease) both;
}

@keyframes se-content-settle{
  from{opacity:.72;transform:translate3d(0,6px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}

/* Natural tactile feedback: almost imperceptible, no bounce. */
.btn:not(:disabled),
.home-card,
.mode-card,
.ref-resource,
.option-card,
.resource-card,
.tool-panel,
.se-intel-continue,
.se-intel-focus,
.se-intel-check,
.preview-intel-focus button,
.preview-intel-route button{
  transition:
    transform var(--se-motion-fast) ease-out,
    opacity var(--se-motion-fast) ease-out,
    border-color var(--se-motion-fast) ease-out,
    box-shadow var(--se-motion) ease-out,
    background-color var(--se-motion) ease-out;
  -webkit-tap-highlight-color:transparent;
}

.home-card:active,
.mode-card:active,
.ref-resource:active,
.option-card:active,
.resource-card:active,
.se-intel-continue:active,
.se-intel-focus:active,
.se-intel-check:active{
  transform:translate3d(0,1px,0) scale(.996);
}

.btn:not(:disabled):active{transform:translate3d(0,1px,0) scale(.997)}

/* Keep primary navigation still; only state changes gently. */
.bottom-nav,
.member-head,
.quick-exit{animation:none!important}
.bottom-nav .nav-item,
.bottom-nav button{
  transition:color var(--se-motion) ease,opacity var(--se-motion) ease,background-color var(--se-motion) ease!important;
}
.bottom-nav .nav-item svg,
.bottom-nav button svg{transition:stroke var(--se-motion) ease,opacity var(--se-motion) ease!important}

/* New confirmations arrive quietly instead of popping. */
.alert-success,
.alert-info,
.se-intel-context-note,
.se-intel-badge{
  animation:se-soft-appear var(--se-motion) var(--se-motion-ease) both;
}
@keyframes se-soft-appear{
  from{opacity:0;transform:translate3d(0,3px,0)}
  to{opacity:1;transform:none}
}

/* Guide waiting state: calm breathing, not a spinner. */
.guide-wait-mark{
  animation:se-breathe 1.9s ease-in-out infinite!important;
  transform-origin:center;
}
@keyframes se-breathe{
  0%,100%{opacity:.58;transform:scale(.985)}
  50%{opacity:1;transform:scale(1.025)}
}

/* Dialogs feel placed into the room rather than launched at the user. */
.modal-backdrop{animation:se-backdrop-in var(--se-motion) ease both}
.modal-backdrop .modal{animation:se-modal-in var(--se-motion) var(--se-motion-ease) both}
@keyframes se-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes se-modal-in{
  from{opacity:0;transform:translate3d(0,5px,0) scale(.992)}
  to{opacity:1;transform:none}
}

/* Avoid browser-added smooth scrolling that can feel like a webpage. */
html{scroll-behavior:auto!important}

@media(prefers-reduced-motion:reduce){
  #main.se-motion-entering > :not(.member-head):not(.bottom-nav),
  .alert-success,.alert-info,.se-intel-context-note,.se-intel-badge,
  .modal-backdrop,.modal-backdrop .modal,.guide-wait-mark{
    animation:none!important;
  }
  .btn,.home-card,.mode-card,.ref-resource,.option-card,.resource-card,.tool-panel,
  .se-intel-continue,.se-intel-focus,.se-intel-check,.bottom-nav .nav-item,.bottom-nav button{
    transition:none!important;
    transform:none!important;
  }
}

/* SHEM EANSIT 2026-10-19: Safari motion repair */
html,body{max-width:100%;overflow-x:clip!important;overscroll-behavior-x:none;scroll-behavior:auto!important}
#app.app-shell,#main.screen{max-width:100%;overflow-x:clip!important}
#main.se-motion-entering,#main.se-motion-entering>*{animation:none!important}
#main.se-motion-entering>:not(.member-head):not(.bottom-nav){transform:none!important;opacity:1!important}
.btn:not(:disabled),.home-card,.ol-grid-card,.mode-card,.ref-resource,.option-card,.resource-card,.tool-panel,.se-intel-continue,.se-intel-focus,.se-intel-check{transition:background-color 135ms ease,border-color 135ms ease,box-shadow 135ms ease!important}
.btn:active,.home-card:active,.ol-grid-card:active,.mode-card:active,.ref-resource:active,.option-card:active,.resource-card:active,.se-intel-continue:active,.se-intel-focus:active,.se-intel-check:active{transform:none!important}
.se-onboarding-layer,.se-onboarding-layer.is-leaving{animation:none!important}
.se-onboarding-layer.is-leaving{opacity:0!important;visibility:hidden!important}
.guide-wait-mark{animation:se-quiet-breathe 2.6s ease-in-out infinite!important;transform:none!important}
@keyframes se-quiet-breathe{0%,100%{opacity:.75}50%{opacity:1}}
/* Restore the existing three-step Guide markup to the organic-ivory/rose visual style. */
.se-guide-progress{margin:0 0 18px;padding:0 0 14px;border-bottom:1px solid var(--ol-line);color:var(--ol-muted)}
.se-guide-step-label{font-size:8px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ol-rose-deep);margin-bottom:9px}
.se-guide-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.se-guide-steps span{min-width:0;display:grid;place-items:center;text-align:center;padding:8px 4px;border:1px solid var(--ol-line);border-radius:999px;font-size:8px;line-height:1.3;color:var(--ol-muted);background:rgba(251,247,241,.6)}
.se-guide-steps span.active{background:var(--ol-rose-wash);color:var(--ol-rose-deep);border-color:rgba(150,88,79,.25)}
.se-guide-steps span.done{color:var(--ol-rose-deep)}
.se-guide-progress>p{font-size:9px;line-height:1.5;margin:9px 0 0}
.guide-conversation-head{margin:0 0 19px}
.guide-conversation-head .page-title{font-size:clamp(30px,8vw,36px)!important;line-height:1.12!important;margin:7px 0 10px!important;letter-spacing:-.025em}
.guide-conversation-head>.small{font-size:10px!important;line-height:1.6;max-width:350px}
.guide-you-summary,.guide-response-card{margin:0 0 14px;padding:16px;border:1px solid var(--ol-line);border-radius:23px;background:rgba(251,247,241,.86);box-shadow:var(--ol-shadow-soft)}
.guide-response-card{background:linear-gradient(145deg,var(--ol-rose-wash),rgba(251,247,241,.93))}
.guide-card-label{font-size:8px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ol-rose-deep);margin-bottom:9px}
.guide-you-summary>p,.guide-response-card>p{margin:0;font-size:12px!important;line-height:1.6!important;color:var(--ol-ink);overflow-wrap:break-word}
.guide-follow-question{margin:15px 0 0;padding:14px;border:1px solid var(--ol-line);border-radius:18px;background:rgba(255,252,247,.76)}
.guide-follow-question>span{display:block;font-size:8px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ol-rose-deep);margin-bottom:7px}
.guide-follow-question>p{margin:0;font-size:12px!important;line-height:1.6!important;overflow-wrap:break-word}
.guide-input-card,.guide-input-card .form-group{min-width:0}
.guide-input-card textarea{width:100%;max-width:100%;min-height:145px;font-size:16px!important;line-height:1.55;overflow-wrap:break-word}
.guide-action-stack .btn{margin-top:8px}
.guide-action-stack .btn-link{min-height:40px}
@media(prefers-reduced-motion:reduce){.guide-wait-mark{animation:none!important}}