.vi-tool{--vi-ink:#14243a;--vi-blue:#2457d6;color:var(--vi-ink);background:#fff;border:1px solid #dbe2ed;border-radius:20px;padding:clamp(20px,4vw,40px);box-shadow:0 12px 40px #14243a08;max-width:850px;margin:24px auto;box-sizing:border-box}.vi-tool *{box-sizing:border-box}.vi-tool label{display:block;font-weight:650;margin:16px 0 8px}.vi-tool input{width:100%;min-width:0;font:clamp(16px,2.5vw,21px)/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;padding:15px 12px;border:1px solid #738299;border-radius:9px;color:#14243a;background:white}.vi-tool button{cursor:pointer;font:inherit;line-height:1.3;min-height:44px;padding:12px 18px;border-radius:9px;border:1px solid #c4cddd;background:white;color:#2457d6}.vi-tool .vi-primary{background:#2457d6;color:#fff;border-color:#2457d6;font-weight:650}.vi-actions{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.vi-tool :focus-visible{outline:3px solid #2457d6;outline-offset:4px}.vi-note,.vi-status{font-size:14px;color:#526176;line-height:1.6}.vi-result{border-left:4px solid #8a5300;padding:16px;background:#faf8f3;margin:20px 0}.vi-valid{border-color:#167347;background:#f1faf5}.vi-invalid{border-color:#b42318;background:#fff7f5}.vi-result h3{font-size:22px;line-height:1.3;margin-top:0}.vi-result li{margin:8px 0}.vi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.vi-grid>div{background:#fff;border:1px solid #dbe2ed;border-radius:10px;padding:14px}.vi-grid dt{font-size:14px;color:#526176}.vi-grid dd{margin:6px 0 12px;font:600 18px/1.6 ui-monospace,monospace;overflow-wrap:anywhere}.vi-grid button{font-size:13px}.vi-warning{font-weight:600}.vi-output{overflow-wrap:anywhere}.vi-output[hidden]{display:none}@media(max-width:560px){.vi-grid{grid-template-columns:1fr}.vi-actions>.vi-primary{width:100%}.vi-tool{border-radius:14px}.vi-result{padding:12px}.vi-tool ul{padding-left:20px}}
/* 0.1.1: compact results, progressive disclosure and related tools. */
.vi-result{border-radius:0 12px 12px 0;padding:20px}.vi-result>h3{margin-bottom:8px}.vi-result>p{margin:8px 0 14px}.vi-code{font:600 clamp(15px,2vw,19px)/1.7 ui-monospace,monospace;overflow-wrap:anywhere;letter-spacing:.025em}.vi-checks{border-top:1px solid #ceded5;border-bottom:1px solid #ceded5;margin:18px 0;padding:12px 0}.vi-checks summary{cursor:pointer;font-weight:600;min-height:32px;line-height:1.7}.vi-checks ul{font-size:14px}.vi-grid{grid-template-columns:1fr 1fr 1.5fr;margin:18px 0 12px}.vi-grid dd{font-size:17px;margin-bottom:8px}.vi-grid button{padding:8px 10px}.vi-minor{display:flex;flex-wrap:wrap;gap:10px 24px;margin:12px 0 0}.vi-minor>div{display:flex;gap:7px;align-items:baseline}.vi-minor dt{font-size:13px;color:#526176}.vi-minor dd{font:600 14px/1.5 ui-monospace,monospace;margin:0}.vi-related{max-width:850px;margin:24px auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.vi-related-card{display:flex;flex-direction:column;gap:6px;border:1px solid #dbe2ed;border-radius:14px;background:white;padding:22px;color:#2457d6;text-decoration:none}.vi-related-card:hover{border-color:#2457d6}.vi-related-card span{font-size:14px;color:#526176}.vi-related a:focus-visible,.vi-faq summary:focus-visible{outline:3px solid #2457d6;outline-offset:4px}.vi-faq{background:#fff;border:1px solid #dbe2ed;border-radius:12px;margin:12px 0!important;padding:0 20px}.vi-faq summary{cursor:pointer;padding:18px 0;line-height:1.5}.vi-faq summary h3{display:inline;font-size:18px!important;font-weight:650;line-height:1.5;margin:0!important}.vi-faq-answer{padding:0 0 18px}.vi-faq-answer p{margin:0}.vi-faq[open] summary{border-bottom:1px solid #e7ecf3;margin-bottom:16px}@media(max-width:640px){.vi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vi-grid>div:last-child{grid-column:1/-1}.vi-related{grid-template-columns:1fr}.vi-result{padding:14px}.vi-minor{gap:8px 16px}}
