/* Visual theme only. Layout, native controls and application states remain intact. */
:root {
  color-scheme: dark;
  --bg: #000019;
  --panel: #08082c;
  --line: #5f6096;
  --text: #f3f3ff;
  --muted: #bdbdd9;
  --mint: #ffff00;
  --dark: #000;
  font-family: "Courier New", Courier, monospace;
}
body {
  background-color: var(--bg);
  background-image: radial-gradient(circle at 13px 19px,#d7d9ff 0 .7px,transparent 1px),radial-gradient(circle at 71px 83px,#898ac5 0 .7px,transparent 1px),radial-gradient(circle at 127px 41px,#ffff8870 0 .8px,transparent 1.2px),radial-gradient(circle at 53px 137px,#7277ba 0 .6px,transparent 1px);
  background-size: 173px 157px,211px 193px,257px 233px,137px 179px;
  font-size: 14px;
  line-height: 1.5;
}
button,input,select,textarea { font-family: inherit; }
h1,h2,h3,.brand,.primary,.secondary,.nav,.task-types button { font-family: Arial, Helvetica, sans-serif; }
h1 { color: #ffff00; font-size: clamp(30px,4vw,48px); font-weight: 900; letter-spacing: -1px; text-shadow: 3px 3px #c31528; margin-bottom: 6px; }
h2 { color: #ffff00; font-weight: 700; letter-spacing: 0; }
a { color: #70ffff; }
a:hover { color: #ffff00; }
button:disabled { cursor: not-allowed; opacity: .5; }
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline: 2px dashed #ffff00; outline-offset: 4px; }
input,select,textarea { background: #00000e; border: 2px inset #9898b2; border-radius: 0; color: #fff; padding: 11px 12px; box-shadow: none; }
input:focus,select:focus,textarea:focus { border-color: #70ffff; box-shadow: none; }
select option { background: #08082c; color: #fff; }
input::placeholder,textarea::placeholder { color: #9292b1; opacity: 1; }
.primary,.secondary,input::file-selector-button,.task-types button,.job-filters button,.catalogue-choice,.nav {
  border: 3px outset #eee; border-radius: 0; background: #c0c0c0; color: #101018; font-weight: 700; text-shadow: none; box-shadow: 2px 2px #000; text-decoration: none;
}
.primary { background: #ffff00; border-color: #ffff9d; color: #000; }
.primary:hover { background: #ffff8a; }
.secondary:hover,input::file-selector-button:hover,.task-types button:hover,.job-filters button:hover,.catalogue-choice:hover,.nav:hover { background: #dedee8; color: #000; }
.primary:active,.secondary:active,.nav:active,.task-types button:active,.job-filters button:active { border-style: inset; box-shadow: none; }
.workspace { max-width: 1500px; margin: 22px auto; min-height: calc(100vh - 44px); grid-template-columns: 205px minmax(0,1fr); border: 4px ridge #ddd; background: #000035; box-shadow: 7px 7px #0009; }
aside { top: 0; height: 100vh; max-height: 100vh; border-right: 3px ridge #c0c0c0; background: #080818; padding: 25px 16px; }
.brand { color: #00ff55; gap: 8px; font-size: 26px; }
.brand span { color: #ffff00; font-size: 23px; font-weight: 900; letter-spacing: -.8px; text-shadow: 2px 2px #c31528; }
.eyebrow { color: #00ff55; font-family: "Courier New",monospace; letter-spacing: 2px; }
.nav-title { margin: 38px 0 12px; padding: 6px 10px; background: #000; border: 1px solid #5b5b82; }
.nav { margin-bottom: 10px; padding: 11px 10px; gap: 10px; }
.nav.active { background: #00009b; color: #ffff00; border-style: inset; border-color: #a9a9db; }
.sidebar-bottom { border-top: 1px dashed #646481; padding-top: 15px; color: #00ff55; }
#logout { color: #70ffff; text-decoration: underline; }
.content { padding: 26px clamp(16px,3vw,42px); }
.heading { padding: 18px 20px; margin-bottom: 24px; border: 3px ridge #d6d6df; background: linear-gradient(90deg,#000067,#080816); }
.heading p { color: #00ff55; font-size: 12px; }
.heading .job-actions { gap: 10px; }
.library-toolbar,.task-types { padding: 13px; border: 3px ridge #e1e1e1; background: #aaaabb; color: #000; gap: 12px; margin-bottom: 22px; }
.library-toolbar .files-mode { color: #11112b; font-weight: bold; }
.files-mode input { accent-color: #0000a0; }
.job-filters { gap: 7px; }
.job-filters button { padding: 8px 13px; }
.job-filters button.active,.task-types button.active { background: #000080; color: #ffff00; border: 3px inset #c0c0df; }
.task-types { gap: 10px; }
.task-types button { padding: 10px 15px; }
.library-toolbar input[type=search] { width: 205px; }
#media-view > section { margin-bottom: 30px; }
#media-view > section > h2 { color: #ffff00; font-size: 18px; text-transform: uppercase; text-align: center; padding: 8px 12px; border: 3px ridge #ddd; background: #00009b; margin-bottom: 18px; }
.media-grid { gap: 22px 18px; }
.media-card { border: 3px ridge #bcbccc; border-radius: 0; background: #08081f; box-shadow: 4px 4px #0008; }
.media-cover { background: repeating-linear-gradient(135deg,#07072c 0 8px,#11113c 8px 9px); border-bottom: 2px solid #7777a1; color: #00ff55; }
.media-cover img { transition: none; }
.media-cover:hover img { transform: none; filter: brightness(1.1); }
.media-placeholder { color: #00ff55; }
.media-info { padding: 12px; }
.media-info h3 { color: #ffff8c; font-weight: 700; }
.media-info p { color: #bdbdd9; }
.text-button,.download,.breadcrumbs button,.job-tags a { color: #70ffff; text-decoration: underline; }
.delete-button,.danger { color: #ff9da8; }
.secondary.danger { color: #75001a; }
.danger:hover { background: #ffd4dc; color: #75001a; }
.media-panel.is-browser,.file-panel:not(.media-panel),#amule-results { border: 3px ridge #ddd; border-radius: 0; background: #080820; }
th,#amule-results thead { background: #000080; color: #ffff00; font-weight: bold; border-color: #77779b; }
td { border-color: #414166; }
tbody tr:nth-child(even) { background: #121233; }
tbody tr:hover { background: #1d1d49; }
td button.folder { color: #70ffff; text-decoration: underline; }
.breadcrumbs { background: #080818; border-bottom: 1px solid #77779b; }
.job-card,.amule-download,.connection-card,.onboarding { background: #080820; border: 3px ridge #c0c0d0; border-radius: 0; box-shadow: 4px 4px #0008; }
.job-card { padding: 20px; }
.job-heading h2,.amule-download h3 { color: #ffff8c; }
.job-poster { border: 2px inset #aaa; border-radius: 0; background: #000; color: #00ff55; }
.job-state { background: #000; color: #00ff55; border: 1px solid #4d684d; border-radius: 0; font-family: "Courier New",monospace; font-size: 11px; }
.task-error .job-state { background: #22000a; color: #ff9da8; }
.job-tags > span { border: 1px solid #626285; border-radius: 0; background: #12122d; color: #cfcfe7; }
.job-edit[open] { border-top: 1px dashed #777799; }
.job-card summary { color: #70ffff; text-decoration: underline; }
.catalogue-choice { border-width: 2px; font-weight: normal; }
.catalogue-choice.selected { background: #000080; border: 2px inset #bcbcdf; color: #ffff00; }
.job-card .error { color: #ff9da8; }
.catalogue-credit { opacity: 1; }
.empty { border: 1px dashed #58587b; background: #06061d; color: #bdbdd9; }
.empty > span,.empty h2 { color: #ffff00; }
.round-icon { background: #000; border: 1px solid #777; border-radius: 0; color: #00ff55; }
progress,.amule-download progress { accent-color: #00ec4b; height: 12px; border: 2px inset #aaa; border-radius: 0; background: #000; }
progress::-webkit-progress-bar { background: #000; }
progress::-webkit-progress-value { background: repeating-linear-gradient(90deg,#00ed4b 0 10px,#006a23 10px 12px); }
dialog { border: 4px ridge #ddd; border-radius: 0; background: #0a0a2d; padding: 24px; box-shadow: 10px 10px #000a; }
dialog::backdrop { background: #000023d9; }
dialog h2 { padding: 10px 12px; background: #000080; border: 2px ridge #bcbccc; color: #ffff00; }
#media-dialog .heading { padding: 10px; }
#media-title { border: 0; padding: 0; background: none; }
.media-file { border-color: #626285; }
#message { background: #000; border: 3px ridge #c0c0c0; border-radius: 0; color: #00ff55; box-shadow: 5px 5px #0009; }
#message.error { background: #30000d; border-color: #d9a4ad; color: #fff; }
.access { max-width: 1000px; min-height: 600px; margin: max(30px,8vh) auto; border: 4px ridge #ddd; background: #080820; box-shadow: 8px 8px #0009; }
.welcome { background: linear-gradient(145deg,#000080,#000016); border-right: 3px ridge #aaa; padding: 35px; }
.welcome h1 { font-family: Arial,Helvetica,sans-serif; font-size: clamp(35px,5vw,64px); letter-spacing: -2px; color: #ffff00; }
.welcome p { color: #00ff55; }
.access-form { padding: 35px; }
.form-inner h2 { font-size: 26px; }
@media(max-width:1100px) { .workspace { margin: 12px; } .library-toolbar form { margin-left: 0; flex: 1; } .library-toolbar input[type=search] { width: 100%; min-width: 0; } }
@media(max-width:900px) { .workspace { grid-template-columns: 175px minmax(0,1fr); } aside { padding: 20px 10px; } .brand span { font-size: 20px; } .heading { padding: 15px; } }
@media(max-width:650px) {
  .workspace { margin: 6px; grid-template-columns: minmax(0,1fr); border-width: 3px; }
  aside { position: static; height: auto; max-height: none; border-right: 0; border-bottom: 3px ridge #ccc; padding: 16px 12px; }
  aside nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .nav { width: 100%; margin: 0; }
  .sidebar-bottom { border: 0; padding-top: 0; }
  .content { padding: 16px 10px; }
  .heading { padding: 12px; gap: 14px; }
  .heading h1 { font-size: 34px; }
  .heading .job-actions { gap: 8px; }
  .library-toolbar { padding: 10px; gap: 12px; }
  .library-toolbar form { flex-basis: 100%; }
  .job-filters button { padding: 8px 10px; }
  .task-types { padding: 10px; }
  .task-types button { flex: 1; padding: 9px; }
  .job-card { padding: 12px; gap: 12px; }
  .media-grid { gap: 16px 10px; }
  .media-info { padding: 10px; }
  .media-info h3 { font-size: 14px; }
  .media-actions { gap: 8px; }
  .access { margin: 12px; min-height: 0; }
  .welcome { min-height: 180px; padding: 22px; border-right: 0; border-bottom: 3px ridge #aaa; }
  .access-form { padding: 28px 22px; }
  dialog { padding: 16px; }
}
