/* iStandOut v2.11.2 — platform-wide premium app experience */
:root{
  --iso-app-purple:#50218e;
  --iso-app-plum:#281044;
  --iso-app-gold:#f5bd27;
  --iso-app-bg:#f7f4fb;
  --iso-app-card:#ffffff;
  --iso-app-border:#e8e0f0;
  --iso-app-muted:#6c6176;
  --iso-app-shadow:0 14px 36px rgba(40,16,68,.09);
  --iso-app-shadow-hover:0 20px 48px rgba(40,16,68,.15);
  --iso-app-radius:18px;
}
html{font-size:16px}
body.istandout-app-page{font-size:16px;line-height:1.55;background:var(--iso-app-bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.istandout-app-page :where(p,li,dd,dt){font-size:14px;line-height:1.65}
body.istandout-app-page small{font-size:13px!important;line-height:1.5!important}
body.istandout-app-page :where(label,input,select,textarea,button){font-size:14px!important}
body.istandout-app-page :where(input,select,textarea){min-height:44px;line-height:1.35}
body.istandout-app-page textarea{min-height:110px}
body.istandout-app-page :where(button,.iso-button,.iso21-btn,.iso22-btn,.iso24-btn,.iso25-btn,.iso26-btn,.iso27-btn,.iso28-btn,.iso29-btn,.iso30-btn,.iso31-btn){min-height:42px;font-size:14px!important;line-height:1.2;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease}
body.istandout-app-page :where(button,.iso-button,.iso21-btn,.iso22-btn,.iso24-btn,.iso25-btn,.iso26-btn,.iso27-btn,.iso28-btn,.iso29-btn,.iso30-btn,.iso31-btn):active{transform:translateY(1px) scale(.99)}
body.istandout-app-page :where(h1){line-height:1.12}
body.istandout-app-page :where(h2){line-height:1.2}
body.istandout-app-page :where(h3){line-height:1.3}

/* Readable typography across the legacy + patch UI generations. */
body.istandout-app-page :where(.iso-app,.iso21-app,.iso22-app,.iso24-wrap,.iso25-page,.iso26-wrap,.iso27-wrap,.iso28-wrap,.iso29-wrap,.iso30-page,.iso31-page){font-size:16px;color:var(--iso-app-plum)}
body.istandout-app-page :where(.iso-app,.iso21-app,.iso22-app,.iso24-wrap,.iso25-page,.iso26-wrap,.iso27-wrap,.iso28-wrap,.iso29-wrap,.iso30-page,.iso31-page) :where(p,li){font-size:14px!important;line-height:1.6!important}
body.istandout-app-page :where(.iso-app,.iso21-app,.iso22-app,.iso24-wrap,.iso25-page,.iso26-wrap,.iso27-wrap,.iso28-wrap,.iso29-wrap,.iso30-page,.iso31-page) :where(label){font-size:14px!important;line-height:1.4!important}
body.istandout-app-page .iso-readable-type{font-size:13px!important;line-height:1.45!important}
body.istandout-app-page .iso22-mobile :where(a,button){font-size:11px!important;line-height:1.2!important}
body.istandout-app-page .iso22-mobile span{font-size:19px!important}
body.istandout-app-page .iso-brand small{font-size:12px!important}
body.istandout-app-page .iso-eyebrow{font-size:13px!important}

/* Unified app surfaces */
body.istandout-app-page :where(.iso-tile,.iso21-card,.iso21-panel,.iso22-card,.iso22-focus-card,.iso22-childcard,.iso22-assignment,.iso22-question,.iso22-announcement-list article,.iso24-card,.iso25-card,.iso26-card,.iso27-card,.iso28-card,.iso29-card,.iso30-card,.iso31-card){border-color:var(--iso-app-border)!important;border-radius:var(--iso-app-radius)!important;box-shadow:0 5px 18px rgba(40,16,68,.045);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;background:var(--iso-app-card)}
body.istandout-app-page .iso-app-action-card{cursor:pointer}
body.istandout-app-page .iso-app-action-card:hover,body.istandout-app-page .iso-app-action-card:focus-within{transform:translateY(-3px);box-shadow:var(--iso-app-shadow-hover);border-color:#d5c5e4!important}
body.istandout-app-page .iso-app-action-card:active{transform:translateY(-1px)}
body.istandout-app-page :where(.iso-form,.iso21-form,.iso22-form,.iso24-form,.iso25-form,.iso26-form,.iso27-form,.iso28-form,.iso29-form,.iso30-form,.iso31-form){border-radius:20px!important;box-shadow:var(--iso-app-shadow)}

/* Inputs feel like an app, with visible focus and touch comfort. */
body.istandout-app-page :where(input,select,textarea){border-radius:12px!important;border:1px solid #d9cee4!important;background:#fff;color:var(--iso-app-plum);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
body.istandout-app-page :where(input,select,textarea):focus{outline:none;border-color:#8b62ad!important;box-shadow:0 0 0 4px rgba(80,33,142,.11)!important}
body.istandout-app-page :where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid rgba(245,189,39,.75);outline-offset:2px}

/* Tables become responsive app data surfaces rather than cramped WP tables. */
.iso-app-table-scroll{width:100%;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:16px;border:1px solid var(--iso-app-border);background:#fff;box-shadow:0 7px 22px rgba(40,16,68,.055)}
.iso-app-table-scroll>table{margin:0!important;border:0!important;min-width:680px;width:100%}
body.istandout-app-page table{font-size:14px!important;border-collapse:separate;border-spacing:0}
body.istandout-app-page table :where(th,td){padding:13px 14px!important;vertical-align:middle}
body.istandout-app-page table th{font-size:13px!important;font-weight:800;background:#faf8fc;color:#4d3b59;position:sticky;top:0;z-index:1}
body.istandout-app-page table tbody tr{transition:background .16s ease}
body.istandout-app-page table tbody tr:hover{background:#fbf9fd}

/* Notices surface like app alerts. */
body.istandout-app-page :where(.iso-notice,.iso21-notice,.iso22-toast){font-size:14px!important;border-radius:14px!important;box-shadow:0 7px 20px rgba(40,16,68,.06)}

/* Page entrance / section reveal. */
.iso-app-reveal{opacity:0;transform:translateY(10px)}
.iso-app-reveal.is-visible{opacity:1;transform:none;transition:opacity .38s ease,transform .38s ease}

/* Shared app scroll progress */
.iso-app-scroll-progress{position:fixed;z-index:9999;left:0;top:0;height:3px;width:0;background:linear-gradient(90deg,var(--iso-app-gold),var(--iso-app-purple));pointer-events:none;transition:width .08s linear}

/* Shared working state */
.iso-app-working{pointer-events:none;opacity:.72;position:relative}
.iso-app-working::after{content:'';display:inline-block;width:13px;height:13px;margin-left:8px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-2px;animation:isoAppSpin .65s linear infinite}
@keyframes isoAppSpin{to{transform:rotate(360deg)}}

/* Make public homepage microcopy readable while preserving its existing premium composition. */
body.istandout-app-page :where(.is23-home,.iso-public-home,.iso-home-app,.iso-home) small{font-size:13px!important}
body.istandout-app-page :where(.is23-home,.iso-public-home,.iso-home-app,.iso-home) :where(p,li){font-size:15px!important}

@media(max-width:700px){
  html{font-size:16px}
  body.istandout-app-page{font-size:16px}
  body.istandout-app-page :where(p,li){font-size:14px!important}
  body.istandout-app-page small{font-size:12.5px!important}
  body.istandout-app-page :where(button,.iso-button,.iso21-btn,.iso22-btn,.iso24-btn,.iso25-btn,.iso26-btn,.iso27-btn,.iso28-btn,.iso29-btn,.iso30-btn,.iso31-btn){min-height:44px;font-size:14px!important}
  body.istandout-app-page :where(input,select,textarea){font-size:16px!important} /* prevents iOS zoom */
  .iso-app-table-scroll{border-radius:14px}
}
@media(prefers-reduced-motion:reduce){.iso-app-reveal{opacity:1;transform:none}.iso-app-reveal.is-visible{transition:none}.iso-app-action-card{transition:none!important}.iso-app-scroll-progress{transition:none}.iso-app-working::after{animation:none}}

/* iStandOut v3.5.0 — platform engagement and motion layer */
:root{
  --iso-motion-fast:160ms;
  --iso-motion-base:260ms;
  --iso-motion-slow:420ms;
  --iso-motion-ease:cubic-bezier(.2,.75,.25,1);
  --iso-motion-spring:cubic-bezier(.18,.89,.32,1.18);
}
body.istandout-app-page{overflow-x:hidden}
body.istandout-app-page.iso-engagement-ready .iso-app,
body.istandout-app-page.iso-engagement-ready .iso21-app,
body.istandout-app-page.iso-engagement-ready .iso22-app,
body.istandout-app-page.iso-engagement-ready .iso24-wrap,
body.istandout-app-page.iso-engagement-ready .iso25-page,
body.istandout-app-page.iso-engagement-ready .iso26-wrap,
body.istandout-app-page.iso-engagement-ready .iso27-wrap,
body.istandout-app-page.iso-engagement-ready .iso28-wrap,
body.istandout-app-page.iso-engagement-ready .iso29-wrap,
body.istandout-app-page.iso-engagement-ready .iso30-page,
body.istandout-app-page.iso-engagement-ready .iso31-page{
  animation:isoPageIn var(--iso-motion-slow) var(--iso-motion-ease) both;
}
@keyframes isoPageIn{from{opacity:.001;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Staggered section reveal: meaningful page blocks, not every text node. */
.iso-engage-reveal{opacity:0;transform:translateY(14px) scale(.995);filter:saturate(.97)}
.iso-engage-reveal.iso-engage-visible{opacity:1;transform:none;filter:none;transition:opacity var(--iso-motion-slow) var(--iso-motion-ease),transform var(--iso-motion-slow) var(--iso-motion-ease),filter var(--iso-motion-slow) ease}

/* Cards and KPI surfaces gain depth and feedback without turning finance rows into toys. */
body.istandout-app-page :where(.iso-tile,.iso21-card,.iso21-panel,.iso22-card,.iso22-focus-card,.iso22-childcard,.iso22-assignment,.iso24-card,.iso25-card,.iso26-card,.iso27-card,.iso28-card,.iso29-card,.iso30-card,.iso31-card,.iso-kpi,.iso-stat){
  will-change:transform;
  transition:transform var(--iso-motion-base) var(--iso-motion-ease),box-shadow var(--iso-motion-base) ease,border-color var(--iso-motion-fast) ease,background-color var(--iso-motion-fast) ease;
}
body.istandout-app-page .iso-engage-interactive:hover{transform:translateY(-4px)}
body.istandout-app-page .iso-engage-interactive:active{transform:translateY(-1px) scale(.995)}
body.istandout-app-page .iso-engage-interactive:focus-visible{box-shadow:0 0 0 4px rgba(245,189,39,.24),var(--iso-app-shadow-hover)}

/* Buttons: press, sheen and keyboard-safe feedback. */
body.istandout-app-page :where(button,.iso-button,.iso21-btn,.iso22-btn,.iso24-btn,.iso25-btn,.iso26-btn,.iso27-btn,.iso28-btn,.iso29-btn,.iso30-btn,.iso31-btn){position:relative;overflow:hidden;isolation:isolate}
.iso-ripple{position:absolute!important;border-radius:999px;pointer-events:none;background:currentColor;opacity:.16;transform:translate(-50%,-50%) scale(0);animation:isoRipple .52s ease-out forwards;z-index:-1}
@keyframes isoRipple{to{opacity:0;transform:translate(-50%,-50%) scale(3.4)}}

/* App tabs and segmented controls feel connected to page state. */
body.istandout-app-page :where([role="tab"],.iso-tabs a,.iso-tabs button,.iso21-tabs a,.iso21-tabs button,.iso22-tabs a,.iso22-tabs button){
  transition:background-color var(--iso-motion-fast) ease,color var(--iso-motion-fast) ease,transform var(--iso-motion-fast) ease,box-shadow var(--iso-motion-fast) ease;
}
body.istandout-app-page :where([role="tab"],.iso-tabs a,.iso-tabs button,.iso21-tabs a,.iso21-tabs button,.iso22-tabs a,.iso22-tabs button):active{transform:scale(.98)}

/* Drawers, dialogs, popovers and mobile sheets. */
body.istandout-app-page :where(dialog,[role="dialog"],.iso-drawer,.iso-modal,.iso-sheet,.iso22-drawer,.iso22-modal,.iso21-drawer){
  transition:opacity var(--iso-motion-base) ease,transform var(--iso-motion-base) var(--iso-motion-ease),visibility var(--iso-motion-base) step-end;
}
body.istandout-app-page dialog[open]{animation:isoDialogIn var(--iso-motion-base) var(--iso-motion-spring) both}
body.istandout-app-page dialog::backdrop{background:rgba(24,10,41,.4);backdrop-filter:blur(3px);animation:isoBackdropIn var(--iso-motion-fast) ease both}
@keyframes isoDialogIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@keyframes isoBackdropIn{from{opacity:0}to{opacity:1}}

/* Accordion/details transitions retain native accessibility. */
body.istandout-app-page details{transition:background-color var(--iso-motion-fast) ease,border-color var(--iso-motion-fast) ease,box-shadow var(--iso-motion-fast) ease}
body.istandout-app-page details[open]{box-shadow:0 8px 24px rgba(40,16,68,.06)}
body.istandout-app-page summary{cursor:pointer;transition:color var(--iso-motion-fast) ease}
body.istandout-app-page summary::marker{transition:transform var(--iso-motion-base) ease}

/* Forms feel alive while preserving server authority. */
body.istandout-app-page :where(input,select,textarea){transition:border-color var(--iso-motion-fast) ease,box-shadow var(--iso-motion-fast) ease,background-color var(--iso-motion-fast) ease,transform var(--iso-motion-fast) ease}
body.istandout-app-page :where(input,select,textarea):focus{transform:translateY(-1px)}
body.istandout-app-page .iso-field-invalid{animation:isoNudge .28s ease}
@keyframes isoNudge{0%,100%{transform:translateX(0)}35%{transform:translateX(-3px)}70%{transform:translateX(3px)}}

/* Data surfaces: restrained emphasis for hover/focus. */
body.istandout-app-page table tbody tr{transition:background-color var(--iso-motion-fast) ease,box-shadow var(--iso-motion-fast) ease}
body.istandout-app-page table tbody tr:hover{box-shadow:inset 3px 0 0 rgba(80,33,142,.18)}

/* Status chips animate only when state actually changes in the DOM. */
.iso-status-pulse{animation:isoStatusPulse .55s var(--iso-motion-ease)}
@keyframes isoStatusPulse{0%{transform:scale(.96);opacity:.65}55%{transform:scale(1.04)}100%{transform:scale(1);opacity:1}}

/* Progress indicators animate toward their real, already-rendered values. */
body.istandout-app-page :where(progress,.iso-progress-fill,[role="progressbar"]){transition:width .65s var(--iso-motion-ease),transform .65s var(--iso-motion-ease)}

/* Friendly empty states get a soft entrance. */
body.istandout-app-page :where(.iso-empty,.iso-empty-state,.iso22-empty,.iso21-empty){animation:isoEmptyIn .42s var(--iso-motion-ease) both}
@keyframes isoEmptyIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Toasts slide rather than suddenly appearing. */
body.istandout-app-page :where(.iso-toast,.iso22-toast,.iso-notice)[data-iso-animated="1"]{animation:isoToastIn .3s var(--iso-motion-spring) both}
@keyframes isoToastIn{from{opacity:0;transform:translateY(-8px) scale(.985)}to{opacity:1;transform:none}}

/* Mr Ayans has a quiet pulse only while idle; no distracting continuous bounce. */
body.istandout-app-page :where(.iso-ayans-fab,.iso22-ayans-fab,.iso-coach-fab,.mr-ayans-fab){transition:transform var(--iso-motion-base) var(--iso-motion-spring),box-shadow var(--iso-motion-base) ease}
body.istandout-app-page :where(.iso-ayans-fab,.iso22-ayans-fab,.iso-coach-fab,.mr-ayans-fab):hover{transform:translateY(-3px) scale(1.025)}

/* High-focus screens deliberately suppress stronger hover motion. */
body.istandout-app-page.iso-focus-mode .iso-engage-interactive:hover{transform:translateY(-2px)}
body.istandout-app-page.iso-focus-mode :where(.iso-tile,.iso21-card,.iso22-card,.iso24-card,.iso25-card,.iso26-card,.iso27-card,.iso28-card,.iso29-card,.iso30-card,.iso31-card){transition-duration:180ms}

@media(max-width:700px){
  .iso-engage-reveal{transform:translateY(9px)}
  body.istandout-app-page .iso-engage-interactive:hover{transform:none}
  body.istandout-app-page .iso-engage-interactive:active{transform:scale(.992)}
  body.istandout-app-page dialog[open]{animation-name:isoSheetIn}
  @keyframes isoSheetIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
}
@media(prefers-reduced-motion:reduce){
  body.istandout-app-page *,body.istandout-app-page *::before,body.istandout-app-page *::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .iso-engage-reveal{opacity:1!important;transform:none!important;filter:none!important}
}
