/* Draft 10 · Συμβουλευτική: a decision with evidence */
.ink-motion .chip { font-size: 11px; font-weight: 600; padding: 4px 10px; border-radius: 99px; background: rgba(230,213,183,.1); color: var(--muted); white-space: nowrap; transition: background-color .3s, color .3s; }
.ink-motion .chip.c1 { background: var(--orange); color: var(--navy); }
.ink-motion .chip.c2 { background: var(--cream); color: var(--navy); }
.ink-motion .stamp { position: absolute; right: -6px; bottom: -10px; background: var(--orange); color: var(--navy); font-size: 12px; font-weight: 700; padding: 5px 10px; border-radius: 99px; opacity: 0; transform: scale(.7) rotate(-6deg); transition: opacity .35s 1.4s, transform .35s 1.4s; }
.ink-motion .cons { position: relative; height: 400px; border-radius: 12px; background: var(--navy-2); border: 1px solid rgba(230,213,183,.07); overflow: hidden; }
.ink-motion .ctabs { display: flex; gap: 18px; padding: 14px 22px 0; border-bottom: 1px solid rgba(230,213,183,.07); }
.ink-motion .ctabs span { font-size: 12px; font-weight: 600; letter-spacing: .04em; color: #8E92AB; padding: 6px 0 10px; margin-bottom: -1px; border-bottom: 2px solid transparent; transition: color .35s, border-color .35s; }
.ink-motion .ctabs span.on { color: var(--cream); border-color: var(--orange); }
.ink-motion .cv { position: absolute; inset: 66px 22px 22px; opacity: 0; transform: translateY(8px); transition: opacity .45s, transform .45s; pointer-events: none; }
.ink-motion .cv.on { opacity: 1; transform: none; }
.ink-motion .ar { display: grid; grid-template-columns: 120px minmax(0, 1fr) 96px; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid rgba(230,213,183,.08); font-size: 14px; }
.ink-motion .ar .bar2 { height: 6px; border-radius: 3px; background: rgba(230,213,183,.1); overflow: hidden; }
.ink-motion .ar .bar2 i { display: block; height: 100%; width: 0; background: var(--cream); transition: width .9s cubic-bezier(.4,0,.2,1); transition-delay: calc(var(--i) * .35s + .2s); }
.ink-motion .cv.on .ar .bar2 i { width: var(--w); }
.ink-motion .ar .chip { justify-self: end; opacity: 0; transition: opacity .3s, background-color .3s; transition-delay: calc(var(--i) * .35s + 1s); }
.ink-motion .cv.on .ar .chip { opacity: 1; }
.ink-motion .plist { position: relative; height: 248px; }
.ink-motion .pr { position: absolute; left: 0; right: 0; height: 52px; display: flex; align-items: center; gap: 14px; padding: 0 14px; border-radius: 10px; background: rgba(230,213,183,.05); border: 1px solid rgba(230,213,183,.05); font-size: 14px; transition: top .8s cubic-bezier(.65,0,.35,1), background-color .4s, border-color .4s; }
.ink-motion .pr .no { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: rgba(230,213,183,.1); color: transparent; transition: background-color .4s, color .4s; flex: none; }
.ink-motion .plist.sorted .pr .no { background: var(--orange); color: var(--navy); }
.ink-motion .plist.sorted .pr:first-child { border-color: rgba(243,109,68,.55); background: rgba(243,109,68,.08); }
.ink-motion .opts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; height: 100%; padding-bottom: 6px; }
.ink-motion .op { position: relative; border-radius: 12px; border: 1px solid rgba(230,213,183,.06); background: rgba(23,26,49,.45); padding: 16px 14px; display: grid; align-content: start; gap: 12px; transition: border-color .45s, background-color .45s, opacity .45s; }
.ink-motion .op .op-t { display: block; margin: 0; font-size: 15px; font-weight: 800; }
.ink-motion .op .cr { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: var(--muted); }
.ink-motion .op .cr i { width: 10px; height: 10px; border-radius: 50%; background: rgba(230,213,183,.14); transition: background-color .3s; transition-delay: calc(var(--i) * .25s + .2s); }
.ink-motion .cv.on .op .cr i.y { background: var(--orange); }
.ink-motion .op .fit { display: grid; gap: 6px; margin-top: 6px; padding-top: 12px; border-top: 1px solid rgba(230,213,183,.1); font-size: 11px; color: var(--muted); }
.ink-motion .op .fit em { font-style: normal; }
.ink-motion .op .fit > span { height: 6px; border-radius: 3px; background: rgba(230,213,183,.1); overflow: hidden; }
.ink-motion .op .fit i { display: block; height: 100%; width: 0; background: var(--cream); transition: width .9s cubic-bezier(.4,0,.2,1) 1.3s; }
.ink-motion .cv.on .op .fit i { width: var(--w); }
.ink-motion .opts.pick .op.best .fit i { background: var(--orange); }
.ink-motion .opts.pick .op { opacity: .45; }
.ink-motion .opts.pick .op.best { opacity: 1; border-color: var(--orange); background: rgba(243,109,68,.08); }
.ink-motion .op .stamp { right: 10px; bottom: -11px; white-space: nowrap; }
.ink-motion .opts.pick .op.best .stamp { opacity: 1; transform: rotate(-4deg); }
@media (max-width: 600px) {
  .ink-motion .op .stamp { right: 2px; font-size: 10px; padding: 4px 8px; }
}
@media (max-width: 600px) {
  .ink-motion .cons { height: 420px; }
  .ink-motion .cv { inset: 60px 14px 16px; }
  .ink-motion .ar { grid-template-columns: 92px minmax(0, 1fr); font-size: 13px; }
  .ink-motion .ar .chip { grid-column: 2; justify-self: start; margin-top: -4px; }
  .ink-motion .pr { font-size: 13px; }
  .ink-motion .opts { gap: 6px; }
  .ink-motion .op { padding: 12px 8px; gap: 9px; }
  .ink-motion .op .op-t { font-size: 13px; }
  .ink-motion .op .cr { font-size: 10px; }
}