/* Adier — "Your footage" picker (assets/footage.js): three toggle cards + their panels. Uses the site tokens (site.css). */
.ft{display:grid;gap:18px}
.ft-opts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:760px){.ft-opts{grid-template-columns:1fr}}
.ft-opt{position:relative;display:grid;gap:5px;align-content:start;text-align:left;cursor:pointer;border:0;padding:18px 48px 16px 18px;border-radius:20px;background:var(--card);box-shadow:0 0 0 1px var(--line);color:var(--ink);transition:transform 160ms var(--ease-out),box-shadow 200ms ease}
.ft-opt b{font-size:16.5px;font-weight:800;letter-spacing:-.015em;line-height:1.2}
.ft-opt>span:not(.ft-gly){font-size:13.5px;color:var(--mute);line-height:1.4}
.ft-gly{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--paper-2);margin-bottom:6px;transition:background-color 200ms ease}
.ft-opt::after{content:"";position:absolute;top:16px;right:16px;width:20px;height:20px;border-radius:6px;box-shadow:inset 0 0 0 1.5px var(--line-2);background:var(--card) center/12px no-repeat;transition:background-color 160ms ease,box-shadow 160ms ease}
.ft-opt[aria-pressed="true"]{box-shadow:0 0 0 2.5px var(--ink)}
.ft-opt[aria-pressed="true"] .ft-gly{background:var(--sun)}
.ft-opt[aria-pressed="true"]::after{background-color:var(--sig);box-shadow:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.5 9.5 3.5' fill='none' stroke='%230E0E12' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.ft-opt:active{transform:scale(.98)}
@media (hover:hover) and (pointer:fine){.ft-opt:not([aria-pressed="true"]):hover{transform:translateY(-2px);box-shadow:0 0 0 1.5px var(--ink),0 12px 24px -16px rgba(14,14,18,.4)}}
.ft-panel{padding:20px;border-radius:20px;background:rgba(14,14,18,.035);box-shadow:0 0 0 1px var(--line);animation:ftin 360ms var(--ease-out)}
@keyframes ftin{from{opacity:0;transform:translateY(8px)}}
@media (prefers-reduced-motion:reduce){.ft-panel{animation:none}}
.ft-panel[hidden]{display:none}
.ft-ph{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.ft-ph svg{width:16px;height:16px}
.ft-site{margin:0 0 12px;font-size:15px;color:var(--ink-2)}
.ft-site b{color:var(--ink);word-break:break-all}
.ft-sitebox{display:grid;gap:7px;margin-bottom:14px;max-width:520px}
.ft-sitebox[hidden]{display:none}
.ft-h{margin:6px 0 10px;font-size:15px;font-weight:800;letter-spacing:-.01em}
.ft-h small{font-weight:500;color:var(--mute)}
.ft-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
@media (max-width:560px){.ft-grid{grid-template-columns:1fr}}
.ft-grid>div{display:grid;gap:7px}
.ft-l{font-size:14px;font-weight:700;color:var(--ink-2)}
.ft-in{width:100%;min-width:0;padding:13px 15px;border-radius:14px;border:0;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--ui);font-size:16px;font-weight:500;outline:none;transition:box-shadow 160ms ease}
.ft-in:focus{box-shadow:inset 0 0 0 2.5px var(--ink)}
.ft-links{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:10px}
.ft-links li{display:flex;gap:8px;align-items:center}
.ft-x{flex:none;width:40px;height:40px;border-radius:12px;border:0;display:grid;place-items:center;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);color:var(--ink-2);cursor:pointer;transition:background-color 160ms ease}
@media (hover:hover){.ft-x:hover{background:var(--sig-soft);color:#9E2A12}}
.ft-add{border:0;background:none;padding:8px 2px;font-weight:800;font-size:15px;color:var(--ink);text-decoration-color:var(--sig);cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px}
.ft-note{margin:6px 0 0;font-size:13.5px;color:var(--mute)}
.ft-drop{position:relative;display:grid;justify-items:center;gap:6px;text-align:center;padding:28px 18px;border-radius:18px;background:var(--card);border:2px dashed var(--line-2);cursor:pointer;transition:border-color 160ms ease,background-color 160ms ease,transform 160ms var(--ease-out)}
.ft-drop:focus-visible{outline:2.5px solid var(--ink);outline-offset:3px}
@media (hover:hover){.ft-drop:hover{border-color:var(--ink)}}
.ft-drop.over{border-color:var(--sig-deep);background:var(--sig-soft);transform:scale(1.01)}
.ft-file{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.ft-up{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--sun);color:var(--ink);margin-bottom:4px}
.ft-dt{font-size:16px}
.ft-dt u{text-decoration-color:var(--sig);text-underline-offset:3px;text-decoration-thickness:2px;font-weight:800}
.ft-touch{display:none}
@media (hover:none) and (pointer:coarse){.ft-fine{display:none}.ft-touch{display:inline}}
.ft-dh{font-size:13.5px;color:var(--mute);max-width:52ch}
.ft-count{margin:12px 0 0;font-size:14px;font-weight:700;color:var(--ink-2)}
.ft-count:empty{display:none}
.ft-list{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.ft-list:empty{display:none}
.ft-item{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"nm sz act" "bar bar act" "st st act";gap:4px 12px;align-items:center;padding:12px 12px 12px 16px;border-radius:14px;background:var(--card);box-shadow:0 0 0 1px var(--line)}
.ft-nm{grid-area:nm;font-weight:700;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ft-sz{grid-area:sz;font-size:13px;color:var(--mute)}
.ft-bar{grid-area:bar;height:6px;border-radius:99px;background:var(--paper-2);overflow:hidden}
.ft-bar i{display:block;height:100%;background:var(--sig);transform-origin:left;transition:transform 300ms linear}
.ft-st{grid-area:st;font-size:13px;color:var(--mute)}
.ft-act{grid-area:act;display:flex;gap:6px;align-items:center}
.ft-item.ft-done .ft-bar i{background:var(--ok)}
.ft-item.ft-done .ft-st{color:var(--ok);font-weight:700}
.ft-item.ft-error{box-shadow:0 0 0 1.5px #E2A08F;background:#FFF6F3}
.ft-item.ft-error .ft-bar{display:none}
.ft-item.ft-error .ft-st{color:#9E2A12;font-weight:600}
.ft-retry{border:0;border-radius:999px;padding:8px 14px;background:var(--ink);color:var(--paper);font-weight:800;font-size:13.5px;cursor:pointer}
@media (max-width:760px){.ft-opt{grid-template-columns:36px minmax(0,1fr);column-gap:14px;row-gap:2px;padding:14px 46px 14px 14px}.ft-gly{grid-row:span 2;margin:0}.ft-opt::after{top:14px;right:14px}}