.color-picker-wrapper{--dot-height: 10px;--dot-border-width: 2px;position:relative}.color-picker-wrapper .input-group-text{background-color:var(--color-picker-bg, #000)}.color-picker-area{position:absolute;top:2.2rem;left:0;z-index:10;background:var(--bs-body-bg);border:2px solid var(--bs-border-color);border-radius:0 0 var(--bs-border-radius) var(--bs-border-radius);padding:1rem}.color-area,.value-area,.alpha-area{width:180px;position:relative;border:1px solid var(--bs-border-color);margin-bottom:.8rem}.color-area{cursor:crosshair;height:120px;background:linear-gradient(to top, #fff, transparent),linear-gradient(to right, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000)}.value-area,.alpha-area{height:calc(var(--dot-height) + var(--dot-border-width));margin-bottom:.8rem}.alpha-area{margin-bottom:0}.color-dot,.value-dot,.alpha-dot{position:absolute;width:calc(var(--dot-height) + var(--dot-border-width)*2);height:calc(var(--dot-height) + var(--dot-border-width)*2);border:var(--dot-border-width) solid var(--bs-border-color);border-radius:50%}.value-dot,.alpha-dot{top:calc(50% - var(--dot-height)/2 - var(--dot-border-width))}
.form-range[data-list]{padding-bottom:.8rem}.range-marks{position:relative;justify-content:space-between;width:calc(100% - 1rem);margin:0 .5rem}.range-mark{position:absolute;font-size:.65rem}.range-mark:before{content:"";position:absolute;top:-1.15rem;left:50%;width:0;height:.4rem;border-left:1px solid var(--bs-gray-700)}.range-mark:after{content:attr(data-label) "";font-family:"Roboto Mono",monospace;font-weight:400;font-style:normal;position:absolute;top:-0.9rem;left:50%;transform:translate(-50%, 0)}
body{min-width:300px;--bs-body-font-family: "Noto Sans TC", "Noto Sans JP", "Noto Sans KR", sans-serif}h1,h2,h3,h4,h5,h6{font-weight:600}svg{overflow:hidden}main{padding:1.5em 0}#site-header{background-color:#3f51b5;box-shadow:1px 1px .5rem rgba(63,81,181,.8);padding:.25rem;color:var(--bs-gray-200)}#site-header .container-fluid{--bs-gutter-x: 2rem}#site-header .item{cursor:pointer;padding:.38rem 1rem;display:inline-block;font-weight:600}#site-header .item:hover{background-color:rgba(var(--bs-light-rgb), 0.1)}#site-header .item>i{font-size:1.25rem}#site-header .dropdown-item{padding:.63rem 1rem}#site-header .dropdown-item i{margin:0 .25rem}#site-footer a{color:var(--bs-secondary-rgb);text-decoration:none}.word-nice{font-family:"Roboto Mono",monospace;font-weight:400;font-style:normal}.input-group-text,.form-select,.form-control{background-color:var(--bs-gray-100);border-color:rgba(63,81,181,.45)}.form-select:focus,.form-control:focus{border-color:rgba(63,81,181,.75);box-shadow:0 0 0 .25rem rgba(63,81,181,.25)}.form-control[type=color]{padding:.44rem;width:2.5rem;height:2.35rem}.modal{--bs-modal-border-color: #3f51b5;--bs-modal-footer-border-width: 0}.modal .modal-content{box-shadow:0 0 .75rem rgba(63,81,181,.8)}.modal .modal-header{background-color:#3f51b5;color:var(--bs-gray-200)}.modal .modal-header .account-picture{margin:-8px 0}.modal .modal-body{padding-bottom:.5rem}.modal .modal-footer{padding:.25rem}.dropdown-menu{--bs-dropdown-border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius)}.toast{--bs-border-color-translucent: #3f51b5;--bs-toast-font-size: 1rem;--bs-toast-header-bg: #3f51b5;--bs-toast-header-color: var(--bs-gray-200);--bs-toast-bg: var(--bs-gray-100);box-shadow:0 0 .5rem rgba(63,81,181,.8)}.toast .progress{--bs-progress-height: 3px;border-top-left-radius:0;border-top-right-radius:0}.toast .progress .progress-bar{width:0%;background-color:#3f51b5;transition-property:width;transition-timing-function:linear}.info-section{--bs-gutter-x: 2.5rem;--bs-gutter-y: 1.25rem;border-top:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);margin-top:2rem;padding-top:1rem}.info-section .card-header{font-weight:600}
#now{position:relative;line-height:1}#now>div{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}#url{overflow-x:auto;text-wrap:nowrap;width:100%;display:block;cursor:pointer}
.gsi-material-button{background-color:#fff;border:1px solid #747775;border-radius:4px;color:#1f1f1f;cursor:pointer;font-family:"Roboto",arial,sans-serif;letter-spacing:.25px;outline:none;overflow:hidden;padding:.6rem 2rem;position:relative;text-align:center;transition:background-color .218s,border-color .218s,box-shadow .218s;vertical-align:middle;white-space:nowrap;width:auto;max-width:400px;min-width:min-content}.gsi-material-button .gsi-material-button-icon{height:20px;margin-right:12px;min-width:20px;width:20px}.gsi-material-button .gsi-material-button-content-wrapper{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;height:100%;justify-content:center;position:relative;width:100%}.gsi-material-button .gsi-material-button-contents{flex-grow:0;font-family:"Roboto",arial,sans-serif;font-weight:500;overflow:hidden;text-overflow:ellipsis;vertical-align:top}.gsi-material-button .gsi-material-button-state{transition:opacity .218s;bottom:0;left:0;opacity:0;position:absolute;right:0;top:0}.gsi-material-button:disabled{cursor:default;background-color:hsla(0,0%,100%,.3803921569);border-color:rgba(31,31,31,.1215686275)}.gsi-material-button:disabled .gsi-material-button-contents{opacity:38%}.gsi-material-button:disabled .gsi-material-button-icon{opacity:38%}.gsi-material-button:not(:disabled):active .gsi-material-button-state,.gsi-material-button:not(:disabled):focus .gsi-material-button-state{background-color:#303030;opacity:12%}.gsi-material-button:not(:disabled):hover{box-shadow:0 1px 2px 0 rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15)}.gsi-material-button:not(:disabled):hover .gsi-material-button-state{background-color:#303030;opacity:8%}#site-header .account-picture{cursor:pointer}
