body{font-family:Arial,sans-serif;width:100%;height:100%;margin:0;padding:0;display:flex;justify-content:center;align-items:flex-start;background-color:#f5f5f5}
.container{text-align:center;margin-top:100px;width:90%;max-width:800px;display:flex;flex-direction:column;align-items:center}

.toggle-container{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:2px}
.toggle-label{font-size:12px;color:#666;white-space:nowrap;transition:color .2s ease}
.toggle-label.active{color:#1e90ff}
.toggle-button{position:relative;display:inline-block;width:40px;height:16px}
.toggle-button input{opacity:0;width:0;height:0}
.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.2s;border-radius:16px}
.slider::before{position:absolute;content:'';height:12px;width:12px;left:2px;bottom:2px;background-color:#fff;transition:.2s;border-radius:50%}
input:checked+.slider{background-color:#1e90ff}
input:checked+.slider::before{transform:translateX(24px)}
.suggestions{position:absolute;top:calc(100% + 5px);left:0;width:100%;border:1px solid #ddd;border-radius:8px;background-color:#fff;box-shadow:0 2px 4px rgba(0,0,0,.1);display:none;z-index:10;overflow-y:hidden;max-height:none}
.suggestions div{padding:6px 10px;cursor:pointer;transition:background-color .2s ease;display:flex;align-items:center;white-space:normal;text-align:left;word-break:break-word}
.suggestions div:hover{background-color:#f0f0f0}
.suggestions div::before{content:attr(data-index);display:inline-block;width:20px;text-align:center;margin-right:10px;font-weight:700;font-size:16px;line-height:1;flex-shrink:0}
.suggestions div[data-index="1"]::before{color:#ff4757}
.suggestions div[data-index="2"]::before{color:#ff6b81}
.suggestions div[data-index="3"]::before{color:coral}
.suggestions div[data-index="4"]::before{color:#ffa502}
.suggestions div[data-index="5"]::before{color:#ffb142}
.suggestions div[data-index="6"]::before{color:#fc0}
.suggestions div[data-index="7"]::before{color:#7bed9f}
.suggestions div[data-index="8"]::before{color:#70a1ff}
.suggestions div[data-index="9"]::before{color:#5352ed}
.suggestions div[data-index="10"]::before{color:#1e90ff}
.custom-sites{margin-top:20px;width:100%;max-width:800px;margin-left:auto;margin-right:auto}
#add-site-btn{margin:10px 0px;padding:6px 12px;font-size:12px;border-radius:8px;background:linear-gradient(135deg,#1e90ff,#07c);color:#fff;border:none;cursor:pointer;transition:background-color .2s ease,box-shadow .2s ease;height:30px}
#add-site-btn:hover{background:linear-gradient(135deg,#07c,#1e90ff);box-shadow:0 2px 4px rgba(0,0,0,.1)}
.custom-sites-list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.custom-site{position:relative;display:inline-block;align-items:center;padding:0px 0px 5px 0px;border:0px solid #ddd;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1);width:75px;box-sizing:border-box;transition:box-shadow .2s ease,border-color .2s ease; cursor: pointer;}
.custom-site:hover{border-color:#1e90ff;box-shadow:0 4px 8px rgba(0,0,0,.2);background-color:#ffffff50;}
.custom-site img{width: 3em;height: 3em;max-width: 72px;border-radius:4px}
.custom-site a{text-decoration:none;color:white;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:72px;font-size: 0.75em;display: inline-block;margin:auto;
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.3); border-radius: 10px 10px 10px 10px;height: 20px; line-height: 20px}
.custom-site .delete-icon,.custom-site .edit-icon{position:absolute;cursor:pointer;font-size:12px;color:#999;transition:color .2s ease;opacity:0}
.custom-site .edit-icon{top:5px;right:-13px}
.custom-site .delete-icon{bottom:5px;right:-11px}
.custom-site:hover .delete-icon,.custom-site:hover .edit-icon{opacity:1}
.custom-site .delete-icon:hover::after,.custom-site .edit-icon:hover::after{content:attr(data-tooltip);position:absolute;background-color:#333;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;white-space:nowrap;top:-25px;left:50%;transform:translateX(-50%)}
.custom-site .delete-icon:hover,.custom-site .edit-icon:hover{color:#1e90ff}
.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);justify-content:center;align-items:center;z-index:1000}
.modal-content{background-color:#fff;padding:20px;border-radius:8px;width:300px;position:relative;text-align:left;box-shadow:0 4px 8px rgba(0,0,0,.2)}
.modal-content .close{position:absolute;top:10px;right:10px;font-size:20px;cursor:pointer;color:#666;transition:color .2s ease}
.modal-content .close:hover{color:#1e90ff}
.modal-content h3{margin-bottom:5px;text-align:center;color:#333;margin-top:0}
.modal-content .modal-tip{font-size:12px;color:#666;text-align:left;margin-bottom:10px}
.modal-content form{display:flex;flex-direction:column;gap:5px}
.modal-content label{display:flex;align-items:center;color:#333;margin-bottom:2px}
.modal-content label .required{color:red;margin-left:4px}
.modal-content input{padding:6px;border:1px solid #ddd;border-radius:4px;outline:0;transition:border-color .2s ease,box-shadow .2s ease;margin-bottom:5px}
.modal-content input:focus{border-color:#1e90ff;box-shadow:0 0 0 2px rgba(30,144,255,.2)}
.modal-content button{padding:8px;background:linear-gradient(135deg,#1e90ff,#07c);color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease,box-shadow .2s ease}
.modal-content button:hover{background:linear-gradient(135deg,#07c,#1e90ff);box-shadow:0 2px 4px rgba(0,0,0,.1)}

.jh-nav-div{position:absolute;top:20px;right:20px;text-align:right;width:300px;height:20px;}
.jh-nav-div a{color:#007BFF;text-decoration:none;position:relative;font-size:14px;margin-left:5px;text-stroke: 1px white;}
.jh-nav-div a::after{content:'';position:absolute;width:100%;height:2px;bottom:0;left:0;background-color:#007BFF;transform:scaleX(0);transform-origin:bottom right;transition:transform 0.3s ease-out;}
.jh-nav-div a:hover::after{transform:scaleX(1);transform-origin:bottom left;}
.jh-wrap>div{opacity:0;padding:10px;}
.jh-layer-right-setwin{overflow-y: auto;}
.jh-bg-frame{position:absolute;width:99%;height:99%;}