*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{font-family:monospace;background:#000000;color:#ffffff;min-height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;padding:60px 20px 80px;text-transform:lowercase}
body>*{width:100%;max-width:640px}
h1{margin-bottom:32px;font-size:32px;text-align:center}
p{margin-bottom:12px;line-height:1.5}
a{color:#888888;text-decoration:underline}
a:hover{color:#ffffff}
.box{border:1px solid #ffffff4f;padding:24px;width:100%;margin-bottom:24px;background:#040404;}
button, a.button{display:inline-block;border:1px solid #ffffff;background:#000000;color:#ffffff;padding:8px 16px;cursor:pointer;font-family:monospace;text-decoration:none;margin-right:8px;text-transform:uppercase}
button:hover, a.button:hover{background:#ffffff;color:#000000}
input[type="text"]{width:100%;font-family:monospace;border:1px solid #ffffff;background:#000000;color:#ffffff;padding:8px;margin-bottom:10px}
input[type="file"]{margin-bottom:10px;display:block}
#status{margin-top:10px}
#progress-wrap{display:none;margin-top:10px}
#progress-bar{width:100%;height:20px;border:1px solid #ffffff}
#progress-fill{height:100%;background:#ffffff;width:0%}
#progress-text{margin-top:4px}
#link{margin-top:10px;word-break:break-all}
#link a,.files a,.debrid-cache a{color:#ffffff;font-weight:bold}
.files,.debrid-cache{width:100%}
#files,#debrid-cache{max-height:315px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#444444 #000000;padding-right:10px}
#files::-webkit-scrollbar,#debrid-cache::-webkit-scrollbar{width:6px}
#files::-webkit-scrollbar-track,#debrid-cache::-webkit-scrollbar-track{background:#000000}
#files::-webkit-scrollbar-thumb,#debrid-cache::-webkit-scrollbar-thumb{background:#444444;border-radius:3px}
#files::-webkit-scrollbar-thumb:hover,#debrid-cache::-webkit-scrollbar-thumb:hover{background:#ffffff}
.file{border-top:1px solid #222222;padding:10px 0}
.file:first-child{border-top:0}
.meta{font-size:12px;margin-top:4px;color:#888888}
.empty{margin-top:10px}
.nav{position:initial;bottom:0;width:100%;text-align:center;font-size:12px;padding:14px 20px;z-index:100;}
.actions{margin-top:24px}
.custom-select-container {
    position: relative;
    width: 100%;
    max-width: 250px;
    margin-bottom: 20px;
    font-family: monospace;
}
.custom-select-trigger {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #ffffff;
    background: #000000;
    color: #ffffff;
    padding: 10px 15px;
    cursor: pointer;
    user-select: none;
    transition: border-color 0.2s;
}
.custom-select-trigger:hover {
    border-color: #ffffff;
}
.custom-select-options {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    border: 1px solid #ffffff;
    border-top: 0;
    background: #000000;
    z-index: 10;
}
.custom-select-options.open {
    display: block;
}
.custom-option {
    padding: 10px 15px;
    cursor: pointer;
    color: #888888;
    transition: background 0.15s, color 0.15s;
}
.custom-option:hover {
    background: #ffffff;
    color: #000000;
}
.custom-select-trigger span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 180px;
}
.custom-option.selected {
    background: #222222;
    color: #ffffff;
    font-weight: bold;
}
.toggle-button {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    user-select: none;
    border: 1px solid #ffffff4f;
    padding: 10px 15px;
    background: #000000;
    color: #888888;
    transition: all 0.2s;
    font-family: monospace;
}
.toggle-button:hover {
    border-color: #ffffff;
}
.toggle-status {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: transparent;
    border: 1px solid #ffffff4f;
    margin-right: 10px;
    transition: background-color 0.2s, border-color 0.2s;
}
.toggle-button.active {
    border-color: #ffffff;
    color: #ffffff;
}
.toggle-button.active .toggle-status {
    background: #ffffff;
    border-color: #ffffff;
}
