.panel{border:1px solid var(--ink);background:var(--paper);color:var(--ink)}.panel__head{border-bottom:1px solid var(--ink);justify-content:space-between;align-items:center;gap:14px;padding:15px 18px;display:flex}.panel__state{align-items:center;gap:9px;display:inline-flex}.panel__pip{background:var(--ink-soft);flex:none;width:6px;height:6px}.panel__meta{color:var(--ink-soft)}.panel.is-busy .panel__pip{background:var(--blue);animation:1.1s step-end infinite panel-blink}@keyframes panel-blink{50%{opacity:0}}.panel__alert{border-bottom:1px solid var(--ink);background:var(--ink);color:var(--paper);align-items:flex-start;gap:10px;padding:13px 18px;display:flex}.panel__alert:before{content:"";background:var(--paper);flex:none;width:6px;height:6px;margin-top:5px}.panel__alert[hidden],.panel__result[hidden]{display:none}.panel__alert p{font-size:15px;line-height:1.4}.panel__alert a{border-bottom:1px solid #fefdf980;transition:color .18s,border-color .18s}.panel__alert a:hover{color:var(--lime);border-color:var(--lime)}.panel__row{padding:14px 18px 15px;position:relative}.panel__row+.panel__row{border-top:1px solid var(--rule)}.panel__row:focus-within{outline:2px solid var(--blue);outline-offset:-1px}.panel__label{color:var(--ink-soft);transition:color .18s;display:block}.panel__row:focus-within .panel__label{color:var(--blue)}.panel__field{align-items:center;gap:12px;margin-top:7px;display:flex}.panel__input{width:100%;min-width:0;font-family:var(--sans);color:var(--ink);appearance:none;background:0 0;border:0;border-radius:0;flex:1;padding:0;font-size:16px;line-height:1.4}.panel__input::placeholder{color:var(--ink-soft)}.panel__input:focus,.panel__input:focus-visible{outline:none}.panel__input:-webkit-autofill{-webkit-text-fill-color:var(--ink);box-shadow:inset 0 0 0 100px var(--paper)}.panel__toggle{border:1px solid var(--rule);color:var(--ink-soft);flex:none;padding:5px 8px;transition:color .18s,border-color .18s}.panel__toggle:hover{color:var(--blue);border-color:var(--blue)}.panel__row--split:focus-within{outline:none}.panel__row--split{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}.panel__check{cursor:pointer;align-items:center;gap:9px;display:inline-flex}.panel__check input{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.panel__check input:focus-visible+.panel__box{outline:2px solid var(--blue);outline-offset:2px}.panel__box{border:1px solid var(--ink);flex:none;width:13px;height:13px;transition:background-color .18s;display:block}.panel__check input:checked+.panel__box{background:var(--blue);border-color:var(--blue)}.panel__check span{color:var(--ink-soft);transition:color .18s}.panel__check:hover span{color:var(--ink)}.panel__link{color:var(--ink-soft);transition:color .18s;position:relative}.panel__link:after{content:"";background:var(--blue);transform-origin:0;width:100%;height:1px;transition:transform .26s cubic-bezier(.16,1,.3,1);position:absolute;bottom:-3px;left:0;transform:scaleX(0)}.panel__link:hover{color:var(--blue)}.panel__link:hover:after{transform:scaleX(1)}.panel__submit{border-top:1px solid var(--ink);background:var(--ink);width:100%;height:56px;color:var(--paper);font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;justify-content:space-between;align-items:center;gap:12px;padding:0 18px;font-size:11px;font-weight:500;transition:background-color .18s;display:flex}.panel__submit:hover{background:var(--blue);color:#fff}.panel__submit svg{flex:none;width:22px;height:10px;transition:transform .24s cubic-bezier(.16,1,.3,1)}.panel__submit:hover svg{transform:translate(4px)}.panel__submit:disabled{cursor:progress;background:var(--ink-soft);color:var(--paper)}.panel__submit:disabled svg{opacity:0}.panel__result{border-top:1px solid var(--ink);background:var(--lime);color:var(--ink);padding:18px}.panel__result h2{font-family:var(--serif);font-size:26px;font-weight:400;line-height:1}.panel__result p{max-width:38ch;margin-top:9px;font-size:15px;line-height:1.4}@media (pointer:coarse){.panel__row{padding:16px 18px 18px}.panel__input{padding-block:11px}.panel__toggle{align-items:center;min-height:44px;padding-inline:12px;display:inline-flex}.panel__check{min-height:44px}.panel__link{align-items:center;min-height:44px;display:inline-flex}}@media (hover:none){.panel__toggle:active,.panel__link:active{color:var(--blue);border-color:var(--blue)}.panel__submit:active{background:var(--blue);color:#fff}.panel__check:active span{color:var(--ink)}}
