/* Titan neon control system: dark core, cut corners and animated spectrum edge. */
@keyframes titan-border-flow {
  0% { background-position:0 0,0% 50%; }
  50% { background-position:0 0,100% 50%; }
  100% { background-position:0 0,0% 50%; }
}

.titan-control,
.titan-close,
.gallery-card-actions button,
.gallery-card-actions a {
  --titan-fill:#050d12;
  --titan-text:#f4fbff;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:2px solid transparent !important;
  color:var(--titan-text) !important;
  background:
    linear-gradient(var(--titan-fill),var(--titan-fill)) padding-box,
    linear-gradient(110deg,#ff0797 0%,#9c2cff 18%,#00d9ff 38%,#23ff9a 57%,#ffe500 76%,#ff7b00 88%,#ff0797 100%) border-box;
  background-size:100% 100%,320% 320%;
  background-position:0 0,0% 50%;
  background-repeat:no-repeat;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  box-shadow:0 0 12px rgba(255,7,151,.12),0 0 16px rgba(255,229,0,.08);
  text-shadow:0 0 8px rgba(255,255,255,.32);
  animation:titan-border-flow 3.2s ease-in-out infinite;
  transition:color .18s ease,transform .18s ease,box-shadow .18s ease,filter .18s ease;
  font-family:"Lucida Console",Consolas,monospace;
  font-weight:800;
  letter-spacing:.075em;
  cursor:pointer;
}

.titan-control::after,
.titan-close::after,
.gallery-card-actions button::after,
.gallery-card-actions a::after {
  content:"";
  position:absolute;
  inset:2px;
  z-index:-1;
  opacity:0;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 15%,rgba(255,255,255,.14) 48%,transparent 80%);
  transform:translateX(-130%);
  transition:opacity .18s ease,transform .35s ease;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
}

.titan-control:hover,
.titan-close:hover,
.gallery-card-actions button:hover,
.gallery-card-actions a:hover {
  --titan-fill:#101820;
  color:#ffffff !important;
  filter:saturate(1.28) brightness(1.08);
  transform:translateY(-1px);
  box-shadow:0 0 18px rgba(255,7,151,.25),0 0 22px rgba(0,217,255,.2),0 0 20px rgba(255,229,0,.16);
}

.titan-control:hover::after,
.titan-close:hover::after,
.gallery-card-actions button:hover::after,
.gallery-card-actions a:hover::after {
  opacity:1;
  transform:translateX(130%);
}

.titan-control:focus-visible,
.titan-close:focus-visible,
.gallery-card-actions button:focus-visible,
.gallery-card-actions a:focus-visible {
  outline:2px solid #ffffff;
  outline-offset:3px;
  box-shadow:0 0 0 4px rgba(0,217,255,.22),0 0 24px rgba(255,7,151,.3);
}

.titan-control:disabled,
.gallery-card-actions button:disabled {
  opacity:.48;
  cursor:not-allowed;
  filter:grayscale(.45);
  animation-play-state:paused;
  transform:none;
}

.nav-button {
  min-height:38px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 16px;
  font-size:9px;
}

.nav-icon {
  position:relative;
  width:11px;
  height:11px;
  border:2px solid #ffffff;
}
.nav-icon::before,.nav-icon::after { content:""; position:absolute; background:#ffffff; }
.nav-icon::before { width:2px; height:15px; left:3px; top:-4px; }
.nav-icon::after { width:15px; height:2px; left:-4px; top:3px; }

.logout-link {
  min-height:34px;
  display:grid;
  place-items:center;
  padding:0 14px;
  font-size:8px;
}

.select-button,.upload-button {
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:0 18px;
}

.change-button {
  min-height:38px;
  padding:0 16px;
}

.link-field {
  border:1px solid rgba(111,232,255,.22);
  box-shadow:inset 0 0 20px rgba(0,0,0,.25);
}
.link-field button {
  min-width:96px;
  min-height:40px;
  margin:-1px -1px -1px 0;
  font:800 8px/1 "Lucida Console",Consolas,monospace;
}

.result-actions a,.result-actions button {
  min-height:33px;
  display:inline-grid;
  place-items:center;
  padding:0 12px;
  font-size:8px;
}

.titan-close {
  --titan-fill:#071116;
  display:grid;
  place-items:center;
  padding:0;
  font:900 14px/1 "Lucida Console",Consolas,monospace;
}

/* Result layout guard: the close control must never consume a grid cell. */
.result-card { position:relative; }
.result-preview { grid-column:1; grid-row:1; min-width:0; }
.result-preview img { object-fit:contain; }
.result-content { grid-column:2; grid-row:1; min-width:0; overflow:hidden; }
.result-close {
  position:absolute;
  z-index:10;
  top:11px;
  right:11px;
  width:42px;
  height:42px;
}
.gallery-close { width:42px; height:42px; }

.gallery-toolbar button {
  min-height:34px;
  padding:0 14px;
  font-size:8px;
}

.gallery-card-actions button,.gallery-card-actions a {
  min-height:31px;
  display:grid;
  place-items:center;
  padding:0 8px;
  text-decoration:none;
  font-size:7px;
}

.success-check { width:38px; height:32px; flex-basis:38px; font:800 9px/1 Consolas,monospace; }

@media(max-width:560px) {
  .result-preview { grid-column:1; grid-row:1; }
  .result-content { grid-column:1; grid-row:2; overflow:visible; }
  .result-close { width:38px; height:38px; }
  .link-field button { min-width:84px; }
  .nav-button { padding:0 12px; }
}

@media(prefers-reduced-motion:reduce) {
  .titan-control,.titan-close,.gallery-card-actions button,.gallery-card-actions a {
    animation-duration:8s;
    transition:none;
  }
}