EV-021Password policy exportp. 2
Minimum length: 12 characters.
A white sheet with dark ink. The cited words (mark) carry the thin copper underline while the citation is still
suggested; add .accepted (here or on an ancestor) and it goes. Add .on to .src-excerpt (or any ancestor) and the
marks underline themselves over --dur-draw; mark.always is drawn from the start. */
.src-excerpt { position: relative; margin: 0; padding: 12px 14px; font-family: "Geist", ui-sans-serif, system-ui, sans-serif; font-size: 13px; line-height: 1.6; letter-spacing: -0.006em; text-align: left; font-style: normal; }
.src-excerpt p { margin: 0; } .src-excerpt p + p { margin-top: 6px; }
.src-excerpt-h { margin: -12px -14px 10px; padding: 8px 14px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line-2); font-size: 12px; color: var(--fg-3); white-space: nowrap; overflow: hidden; }
.src-excerpt-h .id { font-family: "Geist Mono", ui-monospace, monospace; font-size: 11.5px; letter-spacing: 0; color: var(--fg-2); }
.src-excerpt-h b { color: var(--fg-1); font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.src-excerpt-h .r { margin-left: auto; font-family: "Geist Mono", ui-monospace, monospace; font-size: 11.5px; letter-spacing: 0; }
.src-excerpt mark, .ap-paper mark { --u: color-mix(in srgb, var(--cu) 80%, transparent); color: inherit; padding: 0 0 1px; background: linear-gradient(var(--u), var(--u)) no-repeat 0 100% / 0% 1px; -webkit-box-decoration-break: clone; box-decoration-break: clone; transition: background-size var(--dur-draw) var(--ease-spring), color var(--dur-draw) var(--ease-spring); }
.src-excerpt mark:nth-of-type(2), .ap-paper mark:nth-of-type(2) { transition-delay: var(--stagger); }
.src-excerpt mark:nth-of-type(3), .ap-paper mark:nth-of-type(3) { transition-delay: calc(2 * var(--stagger)); }
.src-excerpt mark:nth-of-type(n+4), .ap-paper mark:nth-of-type(n+4) { transition-delay: calc(3 * var(--stagger)); }
.src-excerpt.on mark, .on .src-excerpt mark, .src-excerpt mark.always, .src-excerpt.lit mark,
.ap-paper.lit mark, .ap-paper.on mark, .ap-paper mark.always { background-size: 100% 1px; color: var(--fg-1); }
.src-excerpt.accepted mark, .accepted .src-excerpt mark, .ap-paper.accepted mark, .accepted .ap-paper mark { background-size: 0% 1px; }
.ap-evc .acts { margin-top: 10px; display: flex; gap: 6px; justify-content: flex-end; align-items: center; color: var(--fg-3); font-size: 12px; }
/* the decided state */
.ap-decided { height: 0; overflow: hidden; transition: height var(--dur-enter) var(--ease-spring); }
.ap-decided.on { height: 46px; }
.ap-decided > div { margin: 10px 14px 0; padding: 8px 10px; border-radius: 8px; background: var(--ok-tint); color: var(--fg-1); display: flex; gap: 8px; align-items: center; font-size: 12.5px; }
.ap-decided svg { width: 14px; height: 14px; color: var(--ok); }
.ap-decided time { margin-left: auto; color: var(--fg-3); font-size: 11.5px; }
/* the cursor */
.ap-cursor { position: absolute; left: 0; top: 0; width: 18px; height: 18px; z-index: 20; pointer-events: none; transition: transform var(--dur-swap) var(--ease-swap), opacity var(--dur-enter); filter: drop-shadow(0 2px 4px #0008); opacity: 0; }
.ap-cursor.on { opacity: 1; }
.ap-cursor .tag { position: absolute; left: 16px; top: 16px; height: 20px; padding: 0 7px; border-radius: 999px; background: #3b4a5c; color: #eef3f8; font-size: 11px; display: inline-flex; align-items: center; white-space: nowrap; }
/* no click ripple: a press is the button's own 160ms scale */
.ap-ripple { display: none; }
/* toast */
.ap-toast { position: absolute; right: 20px; bottom: 100px; z-index: 15; width: 300px; border-radius: 12px; padding: 12px 14px; background: color-mix(in srgb, var(--bg-2) 92%, transparent); backdrop-filter: blur(12px); box-shadow: inset 0 0 0 1px var(--line-3), var(--float); display: flex; gap: 10px; font-size: 12.5px; opacity: 0; transform: translateY(8px); filter: blur(4px); transition: opacity var(--dur-enter) var(--ease-spring), transform var(--dur-enter) var(--ease-spring), filter var(--dur-enter) var(--ease-spring); }
.ap-toast.on { opacity: 1; transform: none; filter: none; }
.ap-toast small { display: block; color: var(--fg-3); margin-top: 2px; }
/* ---------- status icon: state as a 14px glyph, its word on hover (title) ----------