
#creator-engine{--andi:#D24A70}
.ce.andi{background:#16261C;box-shadow:0 0 0 100vmax #16261C;clip-path:inset(0 -100vmax);padding-block:clamp(72px,8vw,120px) clamp(56px,6.5vw,96px)}
.flowon #creator-engine{position:relative;z-index:4}
.ce.andi{cursor:auto}

.ce.andi h2{line-height:0}
.ce.andi h2 .amk{display:block;height:clamp(42px,4.03vw,58px);width:auto}
.ce.andi .ceside>p{max-width:47ch}

.andi .awin{background:var(--panel);border:1px solid var(--line);border-radius:calc(var(--r) - 6px);overflow:hidden;color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.4;text-align:left;box-shadow:0 40px 90px -40px rgba(0,0,0,.6)}
.andi .awin *,.andi .awin *::before,.andi .awin *::after{box-sizing:border-box}
.andi .abar{display:flex;align-items:center;justify-content:space-between;gap:12px;height:48px;padding:0 clamp(14px,1.6vw,22px);border-bottom:1px solid var(--line)}
.andi .att,.andi .alab,.andi .acount,.andi .afit,.andi .acap,.andi .arep{font-family:var(--mono);font-size:10.5px;font-weight:400;line-height:1.35;letter-spacing:.05em;text-transform:uppercase}
.andi .att{color:var(--ink)}
.andi .arep{display:inline-flex;align-items:center;gap:8px;color:var(--ink);background:none;border:1px solid var(--panel2);border-radius:999px;padding:7px 13px;cursor:pointer}
@media (hover:hover){.andi .arep:hover{border-color:var(--muted)}}
.andi .arep i{display:block;width:0;height:0;border-left:7px solid currentColor;border-top:4.5px solid transparent;border-bottom:4.5px solid transparent}
.andi .abody{padding:clamp(14px,1.6vw,22px)}

.andi .asearch{display:flex;align-items:flex-start;gap:11px;margin:0 0 clamp(14px,1.4vw,18px);padding:11px 14px;border:1px solid var(--panel2);border-radius:8px;background:var(--white);color:var(--ink);font-size:14.5px;line-height:1.45}
.andi .amag{flex:none;display:block;width:15px;height:15px;margin-top:3px;color:var(--muted)}
.andi .aq{flex:1;display:grid;min-width:0}
.andi .aq>span{grid-area:1/1;min-width:0}
.andi .aqg{visibility:hidden}
.andi .aqp{color:var(--dim);opacity:0}
.andi .asearch.aempty .aqp{opacity:1}
.andi .acaret{display:inline-block;width:1.5px;height:1.2em;margin-right:-1.5px;vertical-align:-.22em;background:var(--ink)}
.andi .aq mark{color:inherit;background-color:transparent;border-radius:3px;padding:1px 2px;margin:0 -2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;
  text-decoration-line:underline;text-decoration-thickness:2px;text-decoration-color:transparent;text-underline-offset:4px;transition:background-color var(--t-quick) linear,text-decoration-color var(--t-quick) linear}
.andi .aq mark.got{text-decoration-color:rgba(241,245,238,.2)}
.andi .aq mark.hit{background-color:rgba(241,245,238,.13);text-decoration-color:var(--andi)}

.andi .abrief{display:flex;flex-wrap:wrap;align-items:center;gap:7px;padding-bottom:clamp(14px,1.4vw,18px);border-bottom:1px solid var(--line)}
.andi .abrief .alab{width:100%;margin-bottom:3px;color:var(--muted)}
.andi .achip{display:inline-flex;align-items:center;gap:7px;font-size:13px;line-height:1.25;padding:6px 10px;border-radius:6px;border:1px solid var(--panel2);background:var(--white);color:var(--ink)}
.andi .achip.chk::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;box-shadow:inset 0 0 0 1.5px currentColor}
.ce.andi .acount{display:grid;margin:16px 0 12px;max-width:none;color:var(--muted)}
.andi .acount>span{grid-area:1/1;min-width:0;transition:opacity var(--t-quick) var(--ease-ui)}
.andi .acount>.gone{transform:none}
.andi .acount>.acn:not(.gone){transition-delay:var(--t-quick)}
.andi .ast{display:inline-flex;align-items:center;gap:9px;align-self:start;color:var(--ink)}
.andi .ast i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--andi)}
.andi .ast:not(.gone) i{animation:apulse 1.2s linear infinite}
@keyframes apulse{0%,100%{opacity:1}50%{opacity:.3}}

.andi .acands{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(14px,1.8vw,24px);align-items:stretch}
.andi .arows{display:flex;flex-direction:column;min-width:0;border-top:1px solid var(--line)}
.andi .arow{display:grid;grid-template-columns:16px 30px minmax(0,1fr) auto 40px;align-items:center;gap:12px;width:100%;margin:0;padding:10px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.andi .arows .arow{flex:1 0 auto}   /* the rows share out the height of the reasons' box, so the 2 columns end together */
@media (hover:hover){.andi .arow:not(.focus):hover{background:rgba(241,245,238,.04)}.andi .arow:hover .anm b{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--muted)}}
.andi .arow.focus{background:var(--white);box-shadow:inset 3px 0 0 var(--andi)}
.andi .arow:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.andi .ano{font-family:var(--mono);font-size:10.5px;color:var(--dim)}
.andi .aav{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--panel2);color:var(--ink);font-size:11px;font-weight:500;letter-spacing:.02em}
.andi .anm{min-width:0}
.andi .anm b{display:block;font-size:14.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.andi .anm span{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.andi .afit{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;color:var(--ink)}
.andi .afit::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:currentColor}
.andi .afit.chk::before{background:none;box-shadow:inset 0 0 0 1.5px currentColor}
.andi .afit.off{color:var(--muted)}
.andi .afit.off::before{width:9px;height:1.5px;border-radius:0}
.andi .asc{justify-self:end;display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:24px;padding:0 7px;border-radius:5px;background:rgba(241,245,238,.13);color:var(--ink);font-family:var(--mono);font-size:12px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums}
.andi .arow.focus .asc{background:var(--ink);color:#16261C}

.andi .awhy{display:flex;flex-direction:column;gap:11px;min-width:0;background:var(--white);border-radius:8px;padding:16px 18px;transition:opacity var(--t-arrive) var(--ease-arrive)}
.andi .awhy.hide{opacity:0}
.andi .awhy .alab{color:var(--muted)}
.andi .atop{display:flex;flex-direction:column;gap:11px;min-height:var(--atop,0px)}
.ce.andi .awhy h3{margin:0;font-family:var(--sans);font-weight:500;font-stretch:100%;font-size:15px;line-height:1.35;letter-spacing:0;color:var(--ink);text-wrap:pretty}
.andi .arules{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.andi .arules li{position:relative;padding-left:17px;font-size:13.5px;line-height:1.4;color:var(--ink)}
.andi .arules li::before{content:"";position:absolute;left:0;top:6px;width:7px;height:7px;border-radius:50%}
.andi .arules li.pass::before{background:var(--ink)}
.andi .arules li.check::before{box-shadow:inset 0 0 0 1.5px var(--ink)}
.andi .arules li.fail::before{top:9px;width:9px;height:1.5px;border-radius:0;background:var(--muted)}
.andi .aparts,.andi .aposts{display:flex;flex-direction:column;border-top:1px solid var(--line);padding-top:12px}
.andi .aparts{gap:7px}
.andi .aposts{gap:5px}
.andi .apt{display:grid;grid-template-columns:86px minmax(0,1fr) 30px 36px;gap:10px;align-items:center;font-size:12.5px;color:var(--ink)}
.andi .apt i{position:relative;display:block;height:2px;background:var(--line)}
.andi .apt i u{position:absolute;left:0;top:0;display:block;width:100%;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform var(--t-fill) var(--ease-arrive)}
.andi .awhy.gl .apt i u{transition-duration:var(--t-glide);transition-timing-function:var(--ease-move)}
.andi .apt b{font-weight:500;text-align:right;font-variant-numeric:tabular-nums}
.andi .apt em{font-style:normal;font-family:var(--mono);font-size:10.5px;color:var(--muted);text-align:right}
.andi .apt.tot{margin-top:2px;padding-top:8px;border-top:1px solid var(--muted)}
.andi .apt.tot span{font-weight:500}
.andi .apt.tot i{background:none}
.andi .apt.tot b.asc{justify-self:end;min-width:30px;padding:0 5px;background:var(--ink);color:#16261C}   /* the same creator's score as the selected row's */
.andi .aposts span:not(.alab){font-size:12.5px;color:var(--muted)}

@media (min-width:641px) and (max-width:860px){
  .andi .apt{grid-template-columns:minmax(0,1fr) 30px 36px}
  .andi .apt i{display:none}
}

.andi .abrief,.andi .arows{transition:border-color var(--t-quick) linear}
.andi .a0 .abrief,.andi .a1 .arows{border-color:transparent}
.andi .ainst *{transition:none!important}
.andi .achip,.andi .abrief .alab,.andi .arules li{transition:opacity var(--t-arrive) var(--ease-arrive),transform var(--t-arrive) var(--ease-arrive)}
.andi .gone{opacity:0;transform:translateY(var(--rise))}
.andi .arow{transition:opacity var(--t-arrive) var(--ease-arrive),transform var(--t-glide) var(--ease-move),background var(--t-quick) linear}
.andi .arow.gone{transform:none}
.andi .arow.anow{transition:opacity var(--t-arrive) var(--ease-arrive),background var(--t-quick) linear}
.andi .aadd .arow{transition:opacity var(--t-arrive) var(--ease-arrive),background var(--t-quick) linear}   /* moves are Web Animations that add up (andi.js) */
.andi .arow.asnap{transition:none}
.andi .aplay .arow,.andi .arow.amv{position:relative;z-index:1;background:var(--panel)}
.andi .aadd .arow.amv{transition:opacity var(--t-arrive) var(--ease-arrive)}
.andi .aplay .arow.anew{z-index:0}
.andi .arow.gone{pointer-events:none}
@media (hover:hover){.andi .aplay .arow:not(.focus):hover{background:var(--panel)}}

.andi .andi-foot{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:10px 28px;margin-top:16px}
.ce.andi .acap{margin:0;max-width:none;color:var(--muted)}
.andi .andi-more{margin-left:auto;font-size:14px;color:var(--ink);text-decoration:underline;text-decoration-color:rgba(241,245,238,.35);text-underline-offset:4px;white-space:nowrap}
.andi .andi-more:hover{text-decoration-color:var(--ink)}
.andi .andi-more:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:2px}

@media (max-width:640px){
  .andi .abar{height:44px}
  .andi .abody{padding:12px}
  .andi .asearch{gap:9px;margin-bottom:12px;padding:9px 11px;border-radius:6px;font-size:13px;line-height:1.42}
  .andi .amag{width:13px;height:13px;margin-top:2px}
  .andi .abrief{gap:6px;padding-bottom:12px}
  .andi .abrief .alab{margin-bottom:1px}
  .andi .achip{font-size:12px;padding:4px 8px;border-radius:5px}
  .ce.andi .acount{margin:11px 0 8px}
  .andi .acands{display:block}
  .andi .arow{grid-template-columns:26px minmax(0,1fr) auto 38px;gap:10px;padding:4px 8px}
  .andi .ano,.andi .anm span{display:none}
  .andi .aav{width:26px;height:26px;font-size:10px}
  .andi .anm b{font-size:14px}
  .andi .asc{height:22px}
  .andi .afit{justify-self:end}
  .andi .awhy{margin:0;border-radius:0;padding:10px 12px 12px 14px;gap:8px;box-shadow:inset 3px 0 0 var(--andi)}
  .andi .atop{gap:8px}
  .andi .awhy.hide{display:none}   /* while the rows fill it takes no room, so there's no hole under Jess K. */
  .andi .awhy .alab{display:none}
  .ce.andi .awhy h3{font-size:14px}
  .andi .arules{gap:6px}
  .andi .arules li{font-size:12.5px;padding-left:16px}
  .andi .arules li::before{top:5.5px}
  .andi .arules li.fail::before{top:8.5px}
  .andi .aparts,.andi .aposts{display:none}
  .andi .arow.focus{border-bottom-color:transparent}
  .andi .andi-foot{flex-direction:column;align-items:flex-start;gap:12px}
  .andi .andi-more{margin-left:0}
}
@media (max-width:359px){
  .andi .arow{grid-template-columns:26px minmax(0,1fr) 10px 38px}
  .andi .afit{font-size:0;gap:0;justify-self:center}
}
.sc-up .sc-lb,.sc-up .sc-nm{font-style:normal}
.sc-up .sc-nm{text-transform:none}

@media (prefers-reduced-motion:reduce){
  .andi .awin *,.andi .awin *::before,.andi .awin *::after{transition:none!important;animation:none!important}
  .andi .gone{opacity:1;transform:none}
  .andi .acount>.gone{opacity:0}
}
