.ds-input{--ds-input-out: var(--white);--ds-input-bg: var(--white);position:relative;display:grid;gap:6px;min-width:0;text-align:left}.ds-input>.l{position:absolute;top:-8px;left:11px;z-index:1;display:inline-flex;align-items:center;gap:6px;max-width:calc(100% - 22px);padding:0 5px;font:600 13px/16px var(--fb);color:var(--gray-600);background:linear-gradient(var(--ds-input-out) 50%,var(--ds-input-bg) 50%);transition:color .15s}.ds-input>.l label{display:block;min-width:0;margin:0;overflow:hidden;color:inherit;font:inherit;white-space:nowrap;text-overflow:ellipsis;cursor:pointer}.ds-input .opt{font-weight:400;color:var(--gray-500)}.ds-input .req{color:var(--red-600);font-weight:700}.ds-input>:is(input,textarea,select){display:block;width:100%;min-width:0;height:52px;margin:0;padding:0 14px;font:400 16px/1.2 var(--fb);color:var(--gray-900);background:var(--ds-input-bg);border:1.5px solid var(--gray-300);border-radius:10px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:border-color .15s var(--ease),box-shadow .2s var(--ease),background-color .15s var(--ease)}.ds-input>textarea{height:auto;min-height:52px;padding:14px;line-height:1.45}:where(.ds-input)>textarea{resize:vertical}.ds-input>textarea[rows="1"]::-moz-placeholder{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-input>textarea[rows="1"]::placeholder{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-input>:is(input,textarea)::-moz-placeholder{color:var(--gray-400);opacity:1}.ds-input>:is(input,textarea)::placeholder{color:var(--gray-400);opacity:1}.ds-input>:is(input,textarea,select):hover{border-color:var(--gray-400)}.ds-input>:is(input,textarea,select):focus{border-color:var(--blue-600);box-shadow:0 0 0 3px var(--blue-100)}.ds-input:focus-within>.l{color:var(--blue-700)}.ds-input>:is(input,textarea)[readonly]{color:var(--gray-600);cursor:default}.ds-input:has(>[readonly]){--ds-input-bg: var(--gray-50)}.ds-input>:is(input,textarea)[readonly]:hover{border-color:var(--gray-300)}.ds-input>:is(input,textarea)[readonly]:focus{border-color:var(--gray-500);box-shadow:0 0 0 3px var(--gray-200)}.ds-input>:is(input,textarea,select)[aria-invalid=true],.ds-input>input[type=email]:user-invalid{border-color:var(--red-500)}.ds-input>:is(input,textarea,select)[aria-invalid=true]:focus,.ds-input>input[type=email]:user-invalid:focus{box-shadow:0 0 0 3px var(--red-100)}.ds-input:has(>[aria-invalid=true])>.l,.ds-input:has(>input[type=email]:user-invalid)>.l{color:var(--red-600)}.ds-input>.msg,.ds-input>.hint{margin:0;padding-left:16px}.ds-input>.msg{font:600 13px/1.4 var(--fb);color:var(--red-600)}.ds-input:not(:has(>[aria-invalid=true]))>.msg{display:none}.ds-input>.hint{font:400 13px/1.45 var(--fb);color:var(--gray-500)}.ds-input>.hint:empty{display:none}.ds-input>.hint[data-tone=err]{font-weight:600;color:var(--red-600)}.ds-input>.hint[data-tone=ok]{font-weight:600;color:var(--green-700)}.ds-input--mono>input{font-family:var(--fm);font-size:15px;letter-spacing:.04em}.ds-input--mono>input::-moz-placeholder{font-family:var(--fb);letter-spacing:0}.ds-input--mono>input::placeholder{font-family:var(--fb);letter-spacing:0}.ds-input .tip{position:relative;display:inline-grid;place-items:center;flex:none;width:24px;height:24px;margin:-4px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--gray-500);font:700 10px/1 var(--fb);cursor:pointer;transition:color .15s}.ds-input .tip:after{content:"";position:absolute;inset:4px;border:1.5px solid currentColor;border-radius:50%}.ds-input .tip:before{content:"";position:absolute;inset:-6px}.ds-input .tip:hover,.ds-input .tip[aria-expanded=true]{color:var(--blue-700)}.ds-input .tip:focus-visible{outline:2px solid var(--blue-500);outline-offset:2px}.ds-input--dark{--ds-input-out: var(--gray-900);--ds-input-bg: var(--gray-800)}.ds-input--dark>.l{color:var(--gray-300)}.ds-input--dark>:is(input,textarea){color:var(--white);border-color:var(--gray-600)}.ds-input--dark>:is(input,textarea)::-moz-placeholder{color:var(--gray-400)}.ds-input--dark>:is(input,textarea)::placeholder{color:var(--gray-400)}.ds-input--dark>:is(input,textarea):hover{border-color:var(--gray-500)}.ds-input--dark>:is(input,textarea):focus{border-color:var(--blue-400);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue-500) 35%,transparent)}.ds-input--dark:focus-within>.l{color:var(--blue-300)}.ds-input--dark .req{color:var(--red-400)}.ds-input--dark>:is(input,textarea)[aria-invalid=true]{border-color:var(--red-400)}.ds-input--dark>:is(input,textarea)[aria-invalid=true]:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--red-500) 35%,transparent)}.ds-input--dark:has(>[aria-invalid=true])>.l,.ds-input--dark>.msg{color:var(--red-400)}.ds-input--dark>.hint{color:var(--gray-400)}.ds-chip{width:100%;min-width:0;margin:0;padding:0;border:0;text-align:left}.ds-chip .lg{display:block;padding:0;margin:0 0 10px;font:600 14px/1.3 var(--fb);color:var(--gray-800)}.ds-chip .row{position:relative;display:grid;grid-template-columns:repeat(var(--n, 5),minmax(0,1fr));padding:4px;border-radius:12px;background:var(--gray-100);container-type:inline-size}.ds-chip .ch{position:relative;z-index:1;display:block;min-width:0;margin:0;cursor:pointer;-webkit-tap-highlight-color:transparent}.ds-chip .ch input{position:absolute;top:0;left:0;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}.ds-chip .t{display:flex;align-items:center;justify-content:center;min-height:42px;padding:0 4px;font:600 15px/1.1 var(--fb);color:var(--gray-600);white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:9px;transition:color .18s var(--ease),transform .12s var(--ease)}.ds-chip .ch:hover .t{color:var(--gray-900)}.ds-chip .ch:active .t{transform:scale(.95)}.ds-chip input:checked+.t{color:var(--blue-700)}.ds-chip input:focus-visible+.t{outline:3px solid var(--blue-300);outline-offset:2px}.ds-chip .ind{position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px) / var(--n, 5));border-radius:9px;background:var(--white);box-shadow:0 1px 3px #0000001f,0 0 0 1px #0000000a;pointer-events:none;transform:translate(calc(var(--i, 0) * 100%));transition:transform .35s var(--ease),opacity .2s var(--ease)}.ds-chip .row:not(:has(input:checked)) .ind{opacity:0}.ds-chip .row:has(.ch:nth-of-type(2) input:checked) .ind{--i: 1}.ds-chip .row:has(.ch:nth-of-type(3) input:checked) .ind{--i: 2}.ds-chip .row:has(.ch:nth-of-type(4) input:checked) .ind{--i: 3}.ds-chip .row:has(.ch:nth-of-type(5) input:checked) .ind{--i: 4}.ds-chip .row:has(.ch:nth-of-type(6) input:checked) .ind{--i: 5}@container (max-width: 380px){.ds-chip .t{padding:0 1px;font-size:13px}}.ds-checkbox{position:relative;display:flex;align-items:flex-start;gap:10px;min-width:0;margin:0;cursor:pointer;font:500 14px/1.35 var(--fb);color:var(--gray-700);text-align:left;-webkit-tap-highlight-color:transparent;transition:background-color .18s var(--ease),color .18s var(--ease)}.ds-checkbox>input{position:absolute;top:0;left:0;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}.ds-checkbox .tx{min-width:0;padding-top:1px}.ds-checkbox .bx{position:relative;flex:none;display:grid;place-items:center;width:20px;height:20px;border:1.5px solid var(--gray-400);border-radius:5px;background:var(--white);color:var(--white);transition:background-color .18s var(--ease),border-color .18s var(--ease),transform .12s var(--ease),box-shadow .18s var(--ease)}.ds-checkbox .ck{width:14px;height:14px;stroke-dasharray:23;stroke-dashoffset:-23;transition:stroke-dashoffset .3s var(--ease) .05s}.ds-checkbox:hover .bx{border-color:var(--blue-500)}.ds-checkbox:active .bx{transform:scale(.9)}.ds-checkbox>input:checked+.bx{background:var(--blue-600);border-color:var(--blue-600)}.ds-checkbox>input:checked+.bx .ck{stroke-dashoffset:0}.ds-checkbox>input:focus-visible+.bx{box-shadow:0 0 0 3px var(--white),0 0 0 5px var(--blue-500)}.ds-checkbox .req{color:var(--red-600);font-weight:700}.ds-checkbox--cons{padding-top:16px;border-top:1px solid var(--gray-200);font-size:13px;line-height:1.5;color:var(--gray-600)}.ds-checkbox--cons .tx{padding-top:0}.ds-checkbox--dark{padding-top:0;border-top:0;color:var(--gray-300)}.ds-checkbox--dark .bx{border-color:var(--gray-500);background:transparent}.ds-checkbox--dark:hover .bx{border-color:var(--blue-400)}.ds-checkbox--dark>input:focus-visible+.bx{box-shadow:0 0 0 3px var(--gray-900),0 0 0 5px var(--blue-400)}.ds-checkbox--dark .req{color:var(--red-400)}.ds-checkbox--dark .ds-link{color:var(--white);text-decoration-color:var(--blue-400)}.ds-checkbox--dark .ds-link:hover{color:var(--blue-200);text-decoration-color:var(--blue-300)}.ds-upload{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0;text-align:left}.ds-upload .fi{position:absolute;top:0;left:0;width:1px;height:1px;opacity:0;pointer-events:none}.ds-upload .dz{position:relative;display:grid;gap:16px;min-width:0;margin:0;padding:22px;border-radius:18px;background:var(--blue-600);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .2s var(--ease)}.ds-upload .dz:hover,.ds-upload .dz.is-over{background:var(--blue-700)}.ds-upload .dz.is-over{outline:2px dashed rgba(255,255,255,.7);outline-offset:-8px}.ds-upload .dz:has(>.fi:focus-visible){outline:3px solid var(--blue-300);outline-offset:3px}.ds-upload .tx{display:grid;gap:4px;min-width:0}.ds-upload .dt{display:block;font:var(--fdw) 21px/1.25 var(--fd);letter-spacing:var(--fdt);color:var(--white)}.ds-upload .dd{display:block;margin:0;font:400 14px/1.45 var(--fb);color:var(--blue-50)}.ds-upload .dz .ds-btn--secondary{border-color:var(--white);color:var(--blue-800)}.ds-upload .dz:hover .ds-btn--secondary,.ds-upload .dz.is-over .ds-btn--secondary{border-color:var(--white);background:var(--blue-50)}.ds-upload .dz .ds-btn .ds-icon{width:20px;height:20px}.ds-upload .dz:active .ds-btn{transform:scale(.97)}.ds-upload .strip{display:flex;gap:8px;min-width:0;margin:-3px;padding:3px;overflow-x:auto;scrollbar-width:none}.ds-upload .strip::-webkit-scrollbar{display:none}.ds-upload .th{position:relative;flex:0 0 min(80px,calc((100% - 24px)/4));aspect-ratio:4 / 3;overflow:hidden;border-radius:10px;background:var(--gray-200);transition:opacity .2s var(--ease),transform .2s var(--ease)}.ds-upload .th img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:filter .3s var(--ease)}.ds-upload .th.is-up img{filter:brightness(.55) saturate(.6)}.ds-upload .th.is-gone{opacity:0;transform:scale(.9)}.ds-upload .rm{position:absolute;top:4px;right:4px;z-index:2;display:grid;place-items:center;width:26px;height:26px;padding:0;border:0;border-radius:50%;background:#0009;color:var(--white);cursor:pointer;transition:background-color .15s,transform .12s var(--ease)}.ds-upload .rm .ds-icon{width:12px;height:12px;stroke-width:3}.ds-upload .rm:hover{background:var(--red-600)}.ds-upload .rm:active{transform:scale(.88)}.ds-upload .rm:focus-visible{outline:2px solid var(--white);outline-offset:1px;box-shadow:0 0 0 4px var(--blue-600)}.ds-upload .up{position:absolute;inset:0;margin:auto;pointer-events:none}.ds-upload .up--spin{width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:var(--white);animation:ds-upload-spin .8s linear infinite}@keyframes ds-upload-spin{to{transform:rotate(360deg)}}.ds-upload .thumb-state{position:absolute;left:4px;bottom:4px;z-index:2;min-width:16px;padding:0 4px;border-radius:4px;background:var(--white);color:var(--red-600);font:700 11px/16px var(--fb);text-align:center}.ds-upload .add{display:grid;place-items:center;padding:0;border:1.5px solid var(--blue-200);background:var(--blue-50);color:var(--blue-600);cursor:pointer;transition:border-color .2s var(--ease),background-color .2s var(--ease),transform .12s var(--ease)}.ds-upload .add:hover{border-color:var(--blue-600);background:var(--blue-100)}.ds-upload .add .ds-icon{width:22px;height:22px}.ds-upload .add:active{transform:scale(.95)}.ds-upload .add:focus-visible{outline:3px solid var(--blue-300);outline-offset:2px}.ds-upload .meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;margin-top:10px}.ds-upload .cnt{font:600 14px/1.3 var(--fb);color:var(--gray-600);font-variant-numeric:tabular-nums;white-space:nowrap}.ds-upload .bar{flex:1 1 120px;max-width:220px;height:6px;overflow:hidden;border-radius:999px;background:var(--gray-200)}.ds-upload .bar>span{display:block;height:100%;border-radius:inherit;background:var(--blue-600);transition:width .3s var(--ease)}.ds-upload .note{margin:0;font:400 13px/1.45 var(--fb);color:var(--gray-500)}.ds-dialog{position:fixed;inset:0;z-index:150;align-items:center;justify-content:center;padding:16px}.ds-dialog .dim{position:absolute;inset:0;background:color-mix(in srgb,var(--gray-900) 58%,transparent)}.ds-dialog .dim[data-dialog-close]{cursor:pointer}.ds-dialog .dlg{position:relative;display:flex;flex-direction:column;width:min(400px,100%);min-height:min(300px,100%);max-height:calc(100dvh - 32px);overflow:hidden;border-radius:16px;background:var(--white);color:var(--gray-900);box-shadow:0 24px 60px #00000059;font:14px/1.5 var(--fb);text-align:left;outline:none;animation:ds-dialog-in .28s var(--ease)}@keyframes ds-dialog-in{0%{opacity:0;transform:translateY(10px) scale(.98)}}.ds-dialog .bar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:56px;padding:8px 10px 8px 22px;background:var(--gray-900);color:var(--white)}.ds-dialog .bar h2{margin:0;font-family:var(--fd);font-weight:var(--fdw);letter-spacing:var(--fdt);font-stretch:var(--fds);font-size:15.5px;line-height:1.25;color:inherit}.ds-dialog .x{display:grid;place-items:center;flex:none;width:40px;height:40px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--gray-300);cursor:pointer;transition:background-color .15s,color .15s,transform .12s}.ds-dialog .x[hidden]{display:none}.ds-dialog .x:hover{background:#ffffff1a;color:var(--white)}.ds-dialog .x:active{transform:scale(.95)}.ds-dialog .x:focus-visible{outline:3px solid var(--blue-400);outline-offset:1px}.ds-dialog .bd{flex:1;display:flex;flex-direction:column;min-height:0;padding:20px 22px 22px;overflow-y:auto}.ds-dialog .bd>.flex-col{flex:1}.ds-dialog .bd p{margin:0;font-size:15px;line-height:1.55;color:var(--gray-600)}.ds-dialog .act{display:grid;gap:10px;margin-top:auto;padding-top:20px}.ds-dialog .prog{flex:none;height:8px;margin-top:auto;overflow:hidden;border-radius:999px;background:var(--gray-100)}.ds-dialog .prog>span{display:block;height:100%;border-radius:inherit;background:var(--blue-600);transition:width .3s var(--ease)}.ds-dialog--demo{position:relative;inset:auto;z-index:auto;min-height:340px;overflow:hidden;border-radius:10px}.ds-dialog--demo .dlg{animation:none}
