:root {
 --page:#122978;
 --paper:#ffffff;
 --ink:#172b50;
 --muted:#4e6080;
 --accent:#3e55da;
 --tint:#e8edff;
 --field:#e2eafe;
 --rule:#ced9ed;
 --ok:#216742;
 --warn:#8d4c1a;
 --shadow:0 18px 44px rgb(8 22 70 / 18%);
 --lift:0 10px 24px rgb(25 51 118 / 20%);
}
html {
 scrollbar-gutter:auto;
 scrollbar-width:none;
}
html::-webkit-scrollbar {
 width:0;
 height:0;
}
body {
 isolation:isolate;
 background:#122978;
}
.page-background {
 position:fixed;
 inset:0;
 z-index:0;
 overflow:hidden;
 pointer-events:none;
 background:linear-gradient(135deg,#0d0d46,#122978 55%,#2955d1);
}
.page-background::before {
 content:"";
 position:absolute;
 inset:-15%;
 background:
  radial-gradient(ellipse at 80% 20%,rgb(95 150 232 / 65%),transparent 55%),
  radial-gradient(ellipse at 10% 85%,#0d0d46,transparent 65%),
  radial-gradient(ellipse at 65% 75%,#2955d1,transparent 60%);
 animation:background-flow 8s ease-in-out infinite alternate;
 will-change:transform;
}
@keyframes background-flow {
 from {transform:translate(3%,-2%) scale(1.06)}
 to {transform:translate(-3%,3%) scale(1.12)}
}
.shell {
 position:relative;
 z-index:1;
}
header {
 padding:0;
 background:transparent;
 box-shadow:none;
}
header h1,header .sub {
 color:#fff;
 text-shadow:0 1px 4px rgb(8 22 70 / 25%);
}
.header-actions button,.header-actions select {
 background:transparent;
 color:#fff;
 box-shadow:none;
}
.header-actions button:hover:not(:disabled),.header-actions select:hover {
 background:rgb(255 255 255 / 12%);
 box-shadow:none;
}
.header-actions button:focus-visible,.header-actions select:focus-visible {
 outline-color:#fff;
}
.header-actions select::picker-icon {
 color:#fff;
}
.header-actions select option {
 color:var(--ink);
}
.language-picker {
 color:#fff;
 gap:4px;
}
.language-picker select {
 padding-inline:0 4px;
}
.brand,.brand > div {
 min-width:0;
}
.brand .sub {
 overflow-wrap:anywhere;
}
.card {
 background:var(--paper);
 box-shadow:var(--shadow);
}
::selection {
 background:#c8d7ff;
 color:#172b50;
}
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible {
 outline:2px solid var(--accent);
 outline-offset:3px;
 box-shadow:none;
}
button:active:not(:disabled) {
 box-shadow:inset 0 2px 5px rgb(31 58 136 / 18%);
}
.primary {
 background:var(--accent);
 box-shadow:0 8px 20px rgb(40 65 178 / 26%);
}
.primary:hover:not(:disabled) {
 background:#3147c4;
}
.rule {
 background:#edf2ff;
}
.rule-entry .icon-disc {
 background:#fff;
 color:var(--accent);
}
.rule-entry.inactive {
 background:#f1f4f9;
}
.grip {
 color:#607393;
}
.rule-slot {
 background:#dce6ff;
 outline-color:#6b83db;
}
.preview-card.drop-ready::after {
 background:rgb(228 237 255 / 94%);
 outline-color:var(--accent);
}
.preview-columns {
 background:#dfe8fb;
 color:#354d78;
}
.target {
 color:#2d47bd;
}
.file-pair.selected {
 background:#e3ecff;
}
.selection-box {
 border-color:var(--accent);
 background:rgb(62 85 218 / 12%);
}
.formats {
 background:transparent;
 color:var(--muted);
}
.chip {
 color:#3e527a;
}
.preview-scroll {
 scrollbar-color:#7c91c0 #e8edff;
 scrollbar-width:auto;
}
.preview-scroll::-webkit-scrollbar-thumb {
 background:#7c91c0;
}
.preview-scroll::-webkit-scrollbar-thumb:hover {
 background:#566fa8;
}
.footer-status {
 padding:0;
 background:transparent;
 box-shadow:none;
}
.footer-status,.footer-status .selected-count,.footer-status .verdict {
 color:#fff;
}
.footer-actions #run {
 background:#fff;
 color:var(--accent);
 box-shadow:0 8px 20px rgb(8 22 70 / 18%);
}
.footer-actions #run:hover:not(:disabled) {
 background:#edf2ff;
}
.contact-footer {
 padding:6px 0;
 border:0;
 background:transparent;
 box-shadow:none;
}
.contact-footer a,.contact-footer .contact-address,.contact-copy-status {
 color:#fff;
}
.contact-footer .contact-social {
 width:28px;
}
.contact-footer a:hover,.contact-footer .contact-address:hover {
 background:rgb(255 255 255 / 12%);
 color:#fff;
}
.contact-footer a:focus-visible,.contact-footer button:focus-visible {
 outline-color:#fff;
}
.contact-footer .contact-mail {
 background:#fff;
 stroke:var(--accent);
}
dialog {
 box-shadow:0 24px 80px rgb(6 18 56 / 35%);
}
dialog::backdrop {
 background:rgb(8 18 45 / 44%);
}
.rename-loading {
 display:grid;
 justify-items:center;
 gap:20px;
 padding:24px 0 12px;
 text-align:center;
}
.bouncing-dots {
 display:inline-flex;
 align-items:center;
 gap:12%;
 width:56px;
 height:22px;
 color:var(--accent);
}
.bouncing-dots > span[aria-hidden] {
 display:inline-block;
 aspect-ratio:1;
 flex:1;
 border-radius:50%;
 background:currentColor;
 animation:loading-ui-bouncing-dots var(--duration,1.4s) ease-in-out infinite;
}
.bouncing-dots > span:nth-child(2) {
 animation-delay:var(--delay,.2s);
}
.bouncing-dots > span:nth-child(3) {
 animation-delay:calc(var(--delay,.2s) * 2);
}
@keyframes loading-ui-bouncing-dots {
 0%,100% {transform:scale(.8);opacity:.5}
 50% {transform:scale(1.2);opacity:1}
}
@media(max-width:760px) {
 header {
  padding:0;
 }
}
@media(prefers-reduced-motion:reduce) {
 .bouncing-dots > span[aria-hidden] {
  animation:none;
 }
 .page-background::before {
  animation:none;
  will-change:auto;
 }
}