/* Project 54, Job application components. Built on about-base.css (accent #1f6feb). */
/* culture video */
.j-video{position:relative;border:1px solid var(--line);aspect-ratio:16/9;overflow:hidden;background:radial-gradient(120% 130% at 50% 30%,rgba(31,111,235,.10),transparent 60%),repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 2px,transparent 2px 12px),var(--ink-2);cursor:pointer;display:flex;align-items:center;justify-content:center}
.j-video .play{width:74px;height:74px;border-radius:50%;border:1px solid var(--accent);background:rgba(31,111,235,.14);display:flex;align-items:center;justify-content:center;transition:transform .25s,background .25s}
.j-video:hover .play{transform:scale(1.08);background:rgba(31,111,235,.26)}
.j-video .play::after{content:"";border-left:18px solid var(--accent);border-top:11px solid transparent;border-bottom:11px solid transparent;margin-left:5px}
.j-video .vlabel{position:absolute;left:16px;bottom:14px;right:16px;font-family:var(--mono);font-size:10.5px;color:var(--faint);letter-spacing:.06em}
.j-video .vtag{position:absolute;left:16px;top:14px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent-soft);padding:5px 9px;background:rgba(10,10,11,.5)}
.j-video .vdur{position:absolute;right:16px;top:14px;font-family:var(--mono);font-size:10.5px;color:var(--muted);background:rgba(10,10,11,.6);padding:5px 8px;border:1px solid var(--line)}

/* application form */
.apply-card{border:1px solid var(--line);background:var(--ink-2)}
.apply-card .ah{padding:22px 26px;border-bottom:1px solid var(--line)}
.apply-card .ah h2{font-size:clamp(22px,2.4vw,30px);font-weight:700;letter-spacing:-.02em}
.apply-card .ah p{color:var(--muted);font-size:14px;margin-top:8px;line-height:1.55;max-width:54ch}
.apply-body{padding:26px}
.fld{margin-bottom:22px}
.fld>label{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);display:block;margin-bottom:9px}
.fld input[type=text],.fld input[type=email],.fld textarea{width:100%;background:var(--ink-3);border:1px solid var(--line);color:var(--text);font-family:inherit;font-size:15px;padding:13px 14px;transition:border-color .2s,box-shadow .2s}
.fld textarea{resize:vertical;min-height:120px;line-height:1.55}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(31,111,235,.16)}
.fld input::placeholder,.fld textarea::placeholder{color:#54545a}
.fld .grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
/* dropzone */
.drop{border:1px dashed var(--line);background:var(--ink-3);padding:24px;display:flex;align-items:center;gap:16px;cursor:pointer;transition:border-color .2s,background .2s}
.drop:hover,.drop.over{border-color:var(--accent);background:rgba(31,111,235,.06)}
.drop .ic{width:44px;height:44px;border:1px solid var(--accent-soft);display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:20px;flex:none}
.drop .dt{font-size:14px;font-weight:600}.drop .dt b{color:var(--accent)}
.drop .dh{font-family:var(--mono);font-size:10.5px;color:var(--faint);margin-top:4px}
.drop.has-file{border-style:solid;border-color:var(--accent-soft)}
.drop.has-file .ic{color:#7FD4A6;border-color:rgba(127,212,166,.4)}
.drop input[type=file]{display:none}
/* why-text + AI screen */
.whywrap{position:relative}
.counter{font-family:var(--mono);font-size:10.5px;color:var(--faint);margin-top:7px;display:flex;justify-content:space-between;align-items:center}
.counter .flag{color:#E0A14B;display:none;align-items:center;gap:6px}
.counter .flag.on{display:inline-flex}
.counter .ok{color:#7FD4A6;display:none;align-items:center;gap:6px}.counter .ok.on{display:inline-flex}
.human-note{border-left:2px solid var(--accent);background:rgba(31,111,235,.06);padding:12px 16px;font-size:13px;color:#c8c8cd;line-height:1.55;margin-bottom:22px}
.human-note b{color:var(--accent);font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;display:block;margin-bottom:6px}
/* channel chips */
.chgroup{margin-bottom:20px}
.chgroup .cq{font-size:14.5px;font-weight:600;letter-spacing:-.01em;margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip2{font-family:var(--mono);font-size:12px;border:1px solid var(--line);background:var(--ink-3);color:var(--muted);padding:9px 13px;cursor:pointer;transition:.2s;display:inline-flex;align-items:center;gap:8px}
.chip2:hover{color:var(--text)}.chip2.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.chip2 .tick{width:14px;height:14px;border:1px solid currentColor;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:9px}
.chip2.on .tick::after{content:"✓"}
.chnote{font-family:var(--mono);font-size:11px;color:var(--faint);line-height:1.6;margin-top:4px}
.consent{display:flex;align-items:flex-start;gap:11px;margin:6px 0 22px;cursor:pointer;font-size:13.5px;color:#c8c8cd;line-height:1.5}
.consent input{margin-top:3px;accent-color:var(--accent);width:16px;height:16px;flex:none}
.submit-btn{display:inline-flex;align-items:center;gap:12px;background:var(--accent);color:#fff;font-weight:600;font-size:15px;border:0;padding:15px 26px;cursor:pointer;transition:transform .2s,opacity .2s;width:100%;justify-content:center}
.submit-btn:hover{transform:translateY(-1px)}.submit-btn:disabled{opacity:.7;cursor:wait;transform:none}
.altsend{font-family:var(--mono);font-size:11px;color:var(--faint);text-align:center;margin-top:14px}.altsend a{color:var(--accent);border-bottom:1px solid var(--accent);padding-bottom:2px}
/* success */
.apply-success{display:none;flex-direction:column;align-items:center;text-align:center;padding:48px 30px}
.apply-success.on{display:flex}
.apply-success .ring{width:64px;height:64px;border:1.5px solid var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:28px;position:relative}
.apply-success .ring::after{content:"";position:absolute;inset:-1.5px;border-radius:50%;border:1.5px solid var(--accent);opacity:.4;animation:ripple 1.6s ease-out infinite}
@keyframes ripple{from{transform:scale(1);opacity:.5}to{transform:scale(1.5);opacity:0}}
.apply-success h3{font-size:24px;font-weight:700;letter-spacing:-.015em;margin-top:22px}
.apply-success p{color:var(--muted);font-size:14px;margin-top:12px;max-width:40ch;line-height:1.6}
.apply-success .recap{font-family:var(--mono);font-size:11px;color:var(--faint);margin-top:20px;border-top:1px solid var(--line-2);padding-top:16px;width:100%;max-width:380px;text-align:left;line-height:1.9}
.apply-success .recap .ok{color:var(--accent)}