/* Shared interaction layer for amitaielon.com
   Injected by assets/interact.js. Everything is prefixed .tai- so it cannot collide
   with a page's own styles, and every widget degrades to nothing without JS. */

:root{--tai-ink:#FAF6EC;--tai-bg:rgba(21,17,13,.94);--tai-gold:#C9A227;--tai-hair:rgba(201,162,39,.28)}
html[data-tai-theme="light"]{--tai-ink:#2a2620;--tai-bg:rgba(251,250,244,.96);--tai-gold:#9d7d17;--tai-hair:rgba(157,125,23,.3)}

/* 1. skip link, visible only on keyboard focus */
.tai-skip{position:fixed;left:-999px;top:10px;z-index:9999;background:var(--tai-gold);color:#15110D;
  padding:11px 20px;border-radius:3px;font:600 .82rem/1 'Frank Ruhl Libre',Georgia,serif;
  letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border:none}
.tai-skip:focus{left:12px;outline:3px solid var(--tai-ink);outline-offset:2px}

/* 2. mobile nav toggle */
.tai-navbtn{display:none;align-items:center;gap:9px;background:none;border:1px solid var(--tai-hair);
  border-radius:3px;color:inherit;font:inherit;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  padding:8px 13px;cursor:pointer;line-height:1}
.tai-navbtn:hover{border-color:var(--tai-gold);color:var(--tai-gold)}
.tai-navbtn:focus-visible{outline:2px solid var(--tai-gold);outline-offset:3px}
.tai-bars{display:inline-block;width:15px;height:11px;position:relative;flex:0 0 auto}
.tai-bars i{position:absolute;left:0;right:0;height:1.5px;background:currentColor;transition:transform .28s,opacity .2s}
.tai-bars i:nth-child(1){top:0}.tai-bars i:nth-child(2){top:4.75px}.tai-bars i:nth-child(3){top:9.5px}
.tai-open .tai-bars i:nth-child(1){transform:translateY(4.75px) rotate(45deg)}
.tai-open .tai-bars i:nth-child(2){opacity:0}
.tai-open .tai-bars i:nth-child(3){transform:translateY(-4.75px) rotate(-45deg)}
@media (max-width:760px){
  .tai-hasmenu{display:flex!important;flex-wrap:wrap!important;align-items:center;justify-content:space-between}
  .tai-hasmenu .tai-navbtn{display:inline-flex;order:2}
  .tai-hasmenu>.brand,.tai-hasmenu>a.brand{order:1}
  /* pages carry their own nav rules (nav.top .links wins on specificity), so the
     collapsed and open states are stated outright rather than politely */
  .tai-hasmenu .tai-navlinks{display:none!important;width:100%;order:3;flex-direction:column;
    align-items:flex-start;gap:0;padding:6px 0 10px;border-top:1px solid var(--tai-hair);
    margin-top:10px;max-height:calc(100vh - 128px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  .tai-hasmenu.tai-open .tai-navlinks{display:flex!important;animation:tai-drop .26s ease}
  .tai-hasmenu .tai-navlinks>a{padding:11px 2px;width:100%;font-size:.84rem!important;opacity:1!important}
  @keyframes tai-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
}

/* 3. back to top */
.tai-top{position:fixed;right:18px;bottom:18px;z-index:60;width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;background:var(--tai-bg);color:var(--tai-gold);
  border:1px solid var(--tai-hair);cursor:pointer;opacity:0;transform:translateY(14px) scale(.9);
  pointer-events:none;transition:opacity .3s,transform .3s;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.tai-top.tai-show{opacity:1;transform:none;pointer-events:auto}
.tai-top:hover{background:var(--tai-gold);color:#15110D}
.tai-top:focus-visible{outline:2px solid var(--tai-gold);outline-offset:3px}
.tai-top svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* 4. form sending state */
.tai-sending{opacity:.62;cursor:progress;pointer-events:none}
.tai-note{margin-top:12px;font-size:.9rem;font-style:italic;opacity:.85}

/* 5. lightbox */
.tai-lb{position:fixed;inset:0;z-index:999;background:rgba(10,8,6,.94);display:none;
  align-items:center;justify-content:center;padding:44px 18px 66px;
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.tai-lb.tai-show{display:flex;animation:tai-fade .22s ease}
.tai-lb:focus{outline:none}
@keyframes tai-fade{from{opacity:0}to{opacity:1}}
.tai-lb img{max-width:100%;max-height:100%;object-fit:contain;border-radius:4px;
  box-shadow:0 20px 70px rgba(0,0,0,.65)}
.tai-lb figcaption{position:absolute;left:0;right:0;bottom:22px;text-align:center;color:#FAF6EC;
  font:italic 1rem/1.5 'Cormorant Garamond',Georgia,serif;padding:0 24px;text-shadow:0 2px 10px rgba(0,0,0,.9)}
.tai-lb button{position:absolute;background:none;border:none;color:#FAF6EC;cursor:pointer;
  padding:12px;line-height:0;opacity:.75;transition:opacity .2s}
.tai-lb button:hover{opacity:1}
.tai-lb button:focus-visible{outline:2px solid var(--tai-gold);outline-offset:2px;opacity:1}
.tai-lb .tai-x{top:8px;right:10px;font:400 2rem/1 Georgia,serif}
.tai-lb .tai-prev,.tai-lb .tai-next{top:50%;transform:translateY(-50%);font:400 2.4rem/1 Georgia,serif}
.tai-lb .tai-prev{left:6px}.tai-lb .tai-next{right:6px}
.tai-lb .tai-count{position:absolute;top:14px;left:0;right:0;text-align:center;color:#FAF6EC;
  font-size:.74rem;letter-spacing:.2em;opacity:.6}
.tai-zoomable{cursor:zoom-in}
body.tai-locked{overflow:hidden}

/* 6. current section in the nav */
.tai-current{color:var(--tai-gold)!important;opacity:1!important}

@media (prefers-reduced-motion:reduce){
  .tai-top,.tai-bars i,.tai-lb,.tai-hasmenu.tai-open .tai-navlinks{transition:none!important;animation:none!important}
}

/* 7. reading progress: a hairline, never a bar chart */
.tai-prog{position:fixed;top:0;left:0;right:0;height:2px;z-index:9998;
  background:linear-gradient(90deg,var(--tai-gold),#EBC94A);
  transform:scaleX(0);transform-origin:0 50%;will-change:transform;pointer-events:none;opacity:.9}
@media (prefers-reduced-motion:no-preference){.tai-prog{transition:transform .08s linear}}

/* 8. the quiet offer to a returning reader */
.tai-resume{position:fixed;left:50%;bottom:20px;transform:translate(-50%,22px);z-index:70;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;
  max-width:min(560px,calc(100vw - 28px));padding:12px 16px;border-radius:4px;
  background:var(--tai-bg);border:1px solid var(--tai-hair);color:var(--tai-ink);
  font:400 .93rem/1.4 'Frank Ruhl Libre',Georgia,serif;
  box-shadow:0 14px 44px rgba(0,0,0,.38);opacity:0;pointer-events:none;
  transition:opacity .3s,transform .3s;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.tai-resume.tai-show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.tai-resume span{font-style:italic;opacity:.9}
.tai-resume button{font:inherit;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;
  padding:8px 14px;border-radius:2px;cursor:pointer;background:none;
  border:1px solid var(--tai-hair);color:var(--tai-ink)}
.tai-resume .tai-go{border-color:var(--tai-gold);color:var(--tai-gold)}
.tai-resume .tai-go:hover{background:var(--tai-gold);color:#15110D}
.tai-resume .tai-no:hover{border-color:var(--tai-ink)}
.tai-resume button:focus-visible{outline:2px solid var(--tai-gold);outline-offset:2px}
@media (max-width:560px){.tai-resume{gap:9px;padding:11px 13px;font-size:.88rem}
  .tai-resume span{width:100%;text-align:center}}