/*
 * Liquidosich visual system — 2026 redesign
 * The existing composition is intentionally preserved. This layer replaces
 * decorative glass, glow and gradient treatments with a restrained interface.
 */

:root {
  --s-bg: #050509;
  --s-surface: #0d0f18;
  --s-surface-raised: #151824;
  --s-surface-soft: #090a11;
  --s-line: #292633;
  --s-line-strong: #443846;
  --s-text: #f4f2f5;
  --s-muted: #918b99;
  --s-muted-strong: #c0bac7;
  --s-accent: #d63a55;
  --s-accent-strong: #ef7488;
  --s-accent-ink: #fff7f8;
  --s-accent-border: rgba(214, 58, 85, .42);
  --s-accent-border-strong: rgba(239, 116, 136, .58);
  --s-accent-surface: rgba(214, 58, 85, .09);
  --s-accent-surface-strong: rgba(214, 58, 85, .14);
  --s-danger: #e47878;
  --s-success: var(--s-text);
  --s-warning: var(--s-text);
  --s-shadow: 0 18px 52px rgba(0, 0, 0, .3);
  --accent: var(--s-accent);
  --accent-soft: var(--s-accent-strong);
  --accent-glow: transparent;
  --border-soft: var(--s-line);
  --card-bg: var(--s-surface);
  --card-strong: var(--s-surface-raised);
  --text-main: var(--s-text);
  --text-muted: var(--s-muted);
  --platform-bg: var(--s-bg);
  --platform-panel: var(--s-surface);
  --platform-line: var(--s-line);
  --platform-muted: var(--s-muted);
  --platform-cyan: var(--s-accent);
}

html {
  color-scheme: dark;
  background: var(--s-bg);
}

body {
  font-family: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--s-text);
  background: var(--s-bg);
}

body::before,
body::after,
.nebula,
.particle-field,
.profile-card__glow,
.contact-btn__shine,
.projects-folder__shine,
.events-surface__aurora {
  display: none !important;
}

button,
a,
input,
textarea,
[contenteditable="true"] {
  -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[contenteditable="true"]:focus-visible {
  outline: 2px solid var(--s-accent);
  outline-offset: 3px;
}

::selection {
  color: var(--s-accent-ink);
  background: var(--s-accent-strong);
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-thumb {
  border: 2px solid var(--s-surface);
  border-radius: 999px;
  background: #444b55;
}

/* Loading and entry motion */
.site-loader {
  background: var(--s-bg);
  transition: opacity .32s ease, visibility .32s ease;
}

.site-loader__core {
  width: min(260px, calc(100vw - 48px));
  gap: 14px;
  padding: 22px;
  border: 1px solid var(--s-line);
  border-radius: 10px;
  background: var(--s-surface);
  box-shadow: none;
  backdrop-filter: none;
}

.site-loader__text,
.contact-group__kicker,
.profile-topline,
.eyebrow,
.playlist-kicker,
.projects-kicker,
.modal-kicker,
.events-catalog__head,
.event-nav-item__date,
.event-story__meta,
.projects-folder__meta,
.track-item-hint,
.playlist-reorder-note,
.projects-reorder-note {
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
}

.site-loader__text {
  color: var(--s-muted-strong);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .16em;
}

.site-loader__line {
  height: 2px;
  border-radius: 0;
  background: var(--s-line);
}

.site-loader__line i {
  width: 34%;
  border-radius: 0;
  background: var(--s-accent);
  animation-duration: 1.1s;
}

.reveal {
  opacity: 0;
  filter: none;
  transform: translate3d(0, 10px, 0);
}

body.is-ready .reveal {
  animation: seriousReveal .5s cubic-bezier(.2, .75, .25, 1) forwards;
}

body.is-transitioning .reveal {
  opacity: 0;
  filter: none;
  transform: translate3d(0, 8px, 0);
  transition: opacity .2s ease, transform .2s ease;
}

@keyframes seriousReveal {
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* Fixed controls */
.lang-switch,
.admin-toolbar__button,
.devmode-fab {
  border: 1px solid var(--s-line);
  color: var(--s-muted-strong);
  background: var(--s-surface);
  box-shadow: none;
  backdrop-filter: none;
}

.lang-switch {
  gap: 9px;
  padding: 7px 10px;
  border-radius: 10px;
}

.lang-label {
  color: var(--s-muted);
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: .67rem;
  font-weight: 500;
}

.lang-track {
  width: 50px;
  height: 24px;
  border: 1px solid var(--s-line-strong);
  border-radius: 5px;
  background: var(--s-surface-soft);
  box-shadow: none;
}

.lang-thumb {
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: var(--s-accent);
  box-shadow: none;
  transition: transform .2s cubic-bezier(.2, .75, .25, 1);
}

body.lang-ru .lang-thumb { transform: translateX(26px); }

.admin-toolbar__button {
  border-radius: 10px;
  transition: border-color .18s ease, color .18s ease, background .18s ease;
}

.admin-toolbar__button:hover,
.devmode-fab:hover {
  color: var(--s-text);
  border-color: var(--s-line-strong);
  background: var(--s-surface-raised);
  transform: none;
}

.admin-toolbar__button.is-authenticated {
  color: var(--s-accent-strong);
  border-color: var(--s-accent-border);
}

.devmode-fab {
  border-radius: 10px;
}

.devmode-fab__status {
  background: #606975;
  box-shadow: 0 0 0 3px var(--s-surface);
}

.devmode-fab.is-active .devmode-fab__status {
  background: var(--s-danger);
  box-shadow: 0 0 0 3px var(--s-surface);
}

.events-trigger,
.events-close {
  border-color: var(--s-line);
  color: var(--s-muted-strong);
  background: var(--s-surface);
  box-shadow: none;
  backdrop-filter: none;
  animation: none;
}

.events-trigger {
  border-radius: 0 0 10px 10px;
  transition: transform .22s ease, border-color .18s ease, color .18s ease;
}

.events-trigger:hover {
  color: var(--s-text);
  border-color: var(--s-line-strong);
}

.events-trigger__grip i,
.events-close__grip i {
  height: 1px;
  border-radius: 0;
  background: var(--s-muted);
}

/* Main portrait and contact cards */
.contact-group__kicker {
  color: var(--s-accent);
  font-size: .61rem;
  font-weight: 500;
  letter-spacing: .12em;
}

.contact-group__head h2 {
  color: var(--s-text);
  font-size: 1.03rem;
  font-weight: 700;
}

.contact-btn,
.contact-btn--hero {
  border: 1px solid var(--s-line);
  border-radius: 14px;
  background: var(--s-surface);
  box-shadow: none;
  filter: none;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.contact-btn::before { display: none; }

.contact-btn:hover {
  border-color: var(--s-line-strong);
  background: var(--s-surface-raised);
  box-shadow: none;
  filter: none;
  transform: translateY(-2px);
}

.contact-btn__icon,
.contact-btn--telegram .contact-btn__icon,
.contact-btn--discord .contact-btn__icon,
.contact-btn--steam .contact-btn__icon,
.contact-btn--youtube .contact-btn__icon,
.contact-btn--channel .contact-btn__icon {
  border: 1px solid var(--s-line-strong);
  border-radius: 9px;
  color: var(--s-text);
  background: var(--s-surface-raised);
  box-shadow: none;
}

.contact-btn__label {
  color: var(--s-text);
  font-weight: 700;
}

.contact-btn__meta {
  color: var(--s-muted);
}

.profile-card {
  border: 1px solid var(--s-line);
  border-radius: 18px;
  background: var(--s-surface);
  box-shadow: var(--s-shadow);
  backdrop-filter: none;
}

.floating { animation: none; }

.profile-topline {
  border: 0;
  border-radius: 0;
  padding: 0;
  color: var(--s-muted);
  background: transparent;
  font-size: .64rem;
  font-weight: 500;
  letter-spacing: .12em;
}

.status-dot {
  width: 7px;
  height: 7px;
  border-radius: 2px;
  background: var(--s-accent);
  box-shadow: none;
  animation: none;
}

.avatar-wrap {
  padding: 7px;
  border: 1px solid var(--s-line);
  border-radius: 11px;
  background: var(--s-surface-soft);
  box-shadow: none;
}

.avatar-wrap::before { display: none; }

.avatar {
  border: 0;
  border-radius: 7px;
}

.eyebrow {
  color: var(--s-accent);
  font-size: .67rem;
  font-weight: 500;
  letter-spacing: .08em;
}

.profile-copy h1 {
  color: var(--s-text);
  font-weight: 700;
  letter-spacing: -.045em;
  text-shadow: none;
}

.profile-copy h1::after {
  width: 56px;
  height: 2px;
  border-radius: 0;
  background: var(--s-accent);
  box-shadow: none;
}

.description { color: var(--s-muted-strong); }

.tag-item {
  border: 1px solid var(--s-line);
  border-radius: 11px;
  background: var(--s-surface-soft);
  box-shadow: none;
}

.tag-icon,
.tag-icon--lang {
  border: 1px solid var(--s-line);
  border-radius: 8px;
  color: var(--s-accent-strong);
  background: var(--s-surface-raised);
  box-shadow: none;
}

.tag-icon--dev {
  border-color: var(--s-line-strong);
  color: var(--s-text);
  background: var(--s-surface-raised);
}

.tag-icon--lang {
  border-color: var(--s-line-strong);
  color: var(--s-text);
  background: var(--s-surface-raised);
}

.tag-copy strong { color: var(--s-text); }

/* Projects */
.projects-folder {
  border: 1px solid var(--s-line);
  border-radius: 13px;
  color: var(--s-text);
  background: var(--s-surface);
  box-shadow: var(--s-shadow);
  backdrop-filter: none;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.projects-folder:hover {
  border-color: var(--s-line-strong);
  background: var(--s-surface-raised);
  box-shadow: var(--s-shadow);
  transform: translateY(-2px);
}

.projects-folder__icon {
  border: 1px solid var(--s-accent-border);
  border-radius: 8px;
  color: var(--s-accent-strong);
  background: var(--s-accent-surface);
  box-shadow: none;
}

.projects-folder__label { color: var(--s-text); }
.projects-folder__meta { color: var(--s-muted); }

.projects-folder__chevron {
  border: 1px solid var(--s-line);
  border-radius: 7px;
  color: var(--s-muted-strong);
  background: var(--s-surface-soft);
}

body.projects-open .projects-folder,
#projectsBtn.is-active {
  border-color: var(--s-accent-border);
  background: var(--s-surface-raised);
  box-shadow: var(--s-shadow);
}

.projects-panel,
.playlist-panel {
  border: 1px solid var(--s-line);
  border-radius: 13px;
  background: var(--s-surface);
  box-shadow: var(--s-shadow);
  backdrop-filter: none;
}

.projects-overlay.open .projects-panel,
.playlist-overlay.open .playlist-panel {
  box-shadow: var(--s-shadow);
}

.projects-kicker,
.playlist-kicker {
  color: var(--s-accent);
  font-weight: 500;
  letter-spacing: .1em;
}

.projects-title,
.playlist-title,
.playlist-title b { color: var(--s-text); }

.project-item {
  border: 1px solid var(--s-line);
  border-radius: 10px;
  color: var(--s-text);
  background: var(--s-surface-soft);
  box-shadow: none;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.project-item:hover,
.project-item:focus-visible {
  border-color: var(--s-line-strong);
  background: var(--s-surface-raised);
  box-shadow: none;
  transform: translateY(-1px);
}

.project-item__logo {
  border: 1px solid var(--s-line);
  border-radius: 8px;
  box-shadow: none;
}

.project-item__title { color: var(--s-text); }
.project-item__description { color: var(--s-muted); }
.project-item__site { color: var(--s-accent-strong); }

.project-item__logo--fallback {
  display: grid;
  place-items: center;
  color: var(--s-accent-strong);
  background: var(--s-accent-surface);
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 1.12rem;
  font-weight: 600;
}

.projects-reorder-note {
  margin-top: 7px;
  color: var(--s-muted);
  font-size: .6rem;
  line-height: 1.45;
}

.project-item__title-row {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.project-item__title-row .project-item__title { margin-bottom: 0; }

.project-item__state {
  flex: 0 0 auto;
  padding: 3px 5px;
  border: 1px solid var(--s-accent-border);
  border-radius: 4px;
  color: var(--s-accent-strong);
  background: var(--s-accent-surface);
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: .5rem;
  font-weight: 600;
  letter-spacing: .06em;
}

.project-item.is-inactive { opacity: .68; }

.project-item.is-sortable {
  grid-template-columns: 54px minmax(0, 1fr);
  cursor: grab;
  user-select: none;
  touch-action: none;
}

.project-item.is-sortable:active { cursor: grabbing; }

.project-item.is-drag-source {
  opacity: .16;
  border-style: dashed;
  box-shadow: none;
}

.project-drag-ghost {
  position: fixed !important;
  z-index: 120;
  margin: 0;
  pointer-events: none;
  opacity: .98;
  border-color: var(--s-accent-border-strong);
  background: var(--s-surface-raised);
  box-shadow: 0 14px 40px rgba(0, 0, 0, .42);
  cursor: grabbing;
  will-change: transform;
}

.projects-list.is-saving { opacity: .72; }
.projects-list.is-saving .project-item { pointer-events: none; }

body.is-project-dragging,
body.is-project-dragging * { cursor: grabbing !important; }

.projects-add-project {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px;
  border: 1px dashed var(--s-accent-border);
  border-radius: 9px;
  color: var(--s-accent-strong);
  background: var(--s-accent-surface);
  font-size: .7rem;
  font-weight: 700;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease;
}

.projects-add-project:hover {
  border-color: var(--s-accent);
  background: var(--s-accent-surface-strong);
}

/* Player and playlist */
.player-shell {
  border: 1px solid var(--s-line);
  border-radius: 15px;
  background: var(--s-surface);
  box-shadow: var(--s-shadow);
  backdrop-filter: none;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

body.playlist-open .player-shell {
  border-color: var(--s-accent-border);
  background: var(--s-surface-raised);
  box-shadow: var(--s-shadow);
  transform: none;
}

.player-cover,
.player-cover img,
.player-cover-fallback {
  border-radius: 9px;
}

.player-cover::before { display: none; }

.player-cover img,
.cover-fallback,
.track-item-cover img {
  border: 1px solid var(--s-line);
  box-shadow: none;
}

.cover-fallback {
  border-radius: 8px;
  color: var(--s-accent-strong);
  background: var(--s-surface-raised);
}

.cover-fallback::after { display: none; }

.track-title { color: var(--s-text); font-weight: 700; }
.track-artist span { color: var(--s-muted); }

.icon-btn,
.close-btn {
  border: 1px solid var(--s-line);
  border-radius: 9px;
  color: var(--s-muted-strong);
  background: var(--s-surface-soft);
}

.play-btn {
  border: 1px solid var(--s-accent);
  border-radius: 10px;
  color: var(--s-accent-ink);
  background: var(--s-accent);
  box-shadow: none;
}

.icon-btn:hover,
.close-btn:hover {
  border-color: var(--s-line-strong);
  color: var(--s-text);
  background: var(--s-surface-raised);
  transform: none;
}

.play-btn:hover {
  color: var(--s-accent-ink);
  background: var(--s-accent-strong);
  transform: none;
}

#playlistBtn.is-active {
  border-color: var(--s-accent-border);
  color: var(--s-accent-strong);
  background: var(--s-accent-surface);
  box-shadow: none;
}

.progress {
  height: 4px;
  border-radius: 0;
  background: var(--s-line);
}

.progress:hover { box-shadow: none; }

.progress-fill {
  border-radius: 0;
  background: var(--s-accent);
}

.progress-fill::after { display: none; }
.eq-bar { border-radius: 0; background: var(--s-accent-strong); }

.playlist-reorder-note {
  margin-top: 7px;
  color: var(--s-muted);
  font-size: .6rem;
  line-height: 1.45;
}

.playlist-reorder-note,
.projects-reorder-note { display: none !important; }

.track-item {
  border: 1px solid var(--s-line);
  border-radius: 9px;
  color: var(--s-text);
  background: var(--s-surface-soft);
  box-shadow: none;
  transition: border-color .16s ease, background .16s ease, opacity .16s ease;
}

.track-item:hover {
  border-color: var(--s-line-strong);
  background: var(--s-surface-raised);
  box-shadow: none;
  transform: none;
}

.track-item.active {
  border-color: var(--s-accent-border);
  background: var(--s-accent-surface);
  box-shadow: inset 3px 0 0 var(--s-accent);
}

.track-item-cover img,
.track-item-cover-fallback { border-radius: 7px; }
.track-item-title { color: var(--s-text); font-weight: 700; }
.track-item-artist span { color: var(--s-muted); }
.track-item-hint { color: var(--s-muted); font-weight: 500; letter-spacing: .05em; }

.track-item.is-sortable {
  grid-template-columns: 48px minmax(0, 1fr) auto;
  cursor: grab;
  user-select: none;
  touch-action: none;
}

.track-item.is-sortable:active { cursor: grabbing; }

.track-item.is-drag-source {
  opacity: .16;
  border-style: dashed;
  box-shadow: none;
}

.track-drag-ghost {
  position: fixed !important;
  z-index: 120;
  margin: 0;
  pointer-events: none;
  opacity: .98;
  border-color: var(--s-accent-border-strong);
  background: var(--s-surface-raised);
  box-shadow: 0 14px 40px rgba(0, 0, 0, .42);
  cursor: grabbing;
  will-change: transform;
}

.playlist-list.is-saving .track-item { pointer-events: none; }
.playlist-list.is-saving { opacity: .72; }

body.is-track-dragging,
body.is-track-dragging * { cursor: grabbing !important; }

.playlist-add-track {
  border: 1px dashed var(--s-accent-border);
  border-radius: 9px;
  color: var(--s-accent-strong);
  background: var(--s-accent-surface);
  transition: border-color .16s ease, background .16s ease;
}

.playlist-add-track:hover {
  border-color: var(--s-accent);
  background: var(--s-accent-surface-strong);
}

/* Events surface */
.events-surface {
  color: var(--s-text);
  background: var(--s-bg);
}

.events-surface::before {
  opacity: .5;
  background-image: linear-gradient(var(--s-line) 1px, transparent 1px), linear-gradient(90deg, var(--s-line) 1px, transparent 1px);
  background-size: 96px 96px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .25), transparent 72%);
}

.events-header { border-color: var(--s-line); }
.events-brand strong { color: var(--s-text); font-weight: 700; letter-spacing: -.03em; }

.surface-button {
  border: 1px solid var(--s-line);
  border-radius: 9px;
  color: var(--s-muted-strong);
  background: var(--s-surface);
  transition: border-color .16s ease, color .16s ease, background .16s ease;
}

.surface-button:hover {
  border-color: var(--s-line-strong);
  color: var(--s-text);
  background: var(--s-surface-raised);
  transform: none;
}

.surface-button--accent {
  border-color: var(--s-accent);
  color: var(--s-accent-ink);
  background: var(--s-accent);
  box-shadow: none;
}

.surface-button--quiet.is-active {
  border-color: var(--s-accent-border);
  color: var(--s-accent-strong);
  background: var(--s-accent-surface);
}

.events-catalog {
  border: 1px solid var(--s-line);
  border-radius: 13px;
  background: var(--s-surface);
  backdrop-filter: none;
}

.events-catalog__head { color: var(--s-text); }
.events-catalog__head b { border-radius: 5px; color: var(--s-text); background: var(--s-surface-raised); }

.events-brand__eyebrow,
.event-nav-item__date,
.event-author__label { color: var(--s-text); }

.event-nav-item {
  border-radius: 8px;
  color: var(--s-text);
  transition: border-color .16s ease, background .16s ease;
}

.event-nav-item:hover {
  background: var(--s-surface-raised);
  transform: none;
}

.event-nav-item.is-active {
  border-color: var(--s-line-strong);
  background: var(--s-surface-soft);
  box-shadow: inset 2px 0 0 var(--s-accent);
}

.event-nav-item__date { color: var(--s-text); }
.event-nav-item p { color: var(--s-muted); }

.event-nav-item__draft,
.event-story__meta span {
  border-radius: 4px;
  color: var(--s-text);
  background: var(--s-accent-surface);
}

.event-story__empty { color: var(--s-muted); }

.event-story__empty-mark {
  border: 1px solid var(--s-line);
  border-radius: 12px;
  background: var(--s-surface);
  box-shadow: none;
}

.event-story__empty h2,
.event-story__title-row h1,
.event-body h2,
.event-body h3 { color: var(--s-text); }

.event-story__title-row h1 {
  font-weight: 700;
  letter-spacing: -.055em;
}

.event-cover {
  border: 1px solid var(--s-line);
  border-radius: 12px;
  background: var(--s-surface);
  box-shadow: none;
}

.event-cover::after { display: none; }
.event-story__meta { color: var(--s-muted); }
.event-story__excerpt { color: var(--s-muted-strong); }
.event-author { border-color: var(--s-line); color: var(--s-text); }
.event-author__label { color: var(--s-text); }
.event-author__name { color: var(--s-text); }
.event-author__name.is-official { color: #ff7d4f; }
.event-body { color: var(--s-muted-strong); }

.event-body blockquote,
.block-editor blockquote {
  border-left-color: var(--s-accent);
  border-radius: 0 8px 8px 0;
  color: var(--s-muted-strong);
  background: var(--s-accent-surface);
}

.event-body pre,
.block-editor pre {
  border: 1px solid var(--s-line);
  border-radius: 8px;
  color: var(--s-text);
  background: #080a0d;
}

.event-body a { color: var(--s-accent-strong); }
.event-body hr { background: var(--s-line); }
.event-body figure img { border-color: var(--s-line); border-radius: 10px; }
.event-body figcaption { color: var(--s-muted); }

.event-spoiler {
  border-color: var(--s-line);
  border-radius: 8px;
  background: var(--s-surface-soft);
}

.event-spoiler button { color: var(--s-text); background: var(--s-surface-raised); }

.events-close { border-radius: 10px 10px 0 0; }

/* Modal and admin surfaces */
.modal-backdrop {
  background: rgba(4, 5, 7, .82);
  backdrop-filter: none;
}

.glass-modal,
.auth-modal {
  border: 1px solid var(--s-line);
  border-radius: 14px;
  color: var(--s-text);
  background: var(--s-surface);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .48);
}

.modal-close {
  border: 1px solid var(--s-line);
  border-radius: 8px;
  background: var(--s-surface-soft);
}

.modal-close:hover { border-color: var(--s-line-strong); background: var(--s-surface-raised); }
.modal-close span { background: var(--s-muted-strong); }

.modal-kicker { color: var(--s-accent); font-weight: 500; letter-spacing: .12em; }
.glass-modal h2 { color: var(--s-text); font-weight: 700; letter-spacing: -.03em; }
.modal-lead { color: var(--s-muted); }

.field-control > span,
.cover-uploader__label { color: var(--s-muted-strong); }

.field-control input,
.field-control textarea,
.field-control select,
.ip-access-row input {
  border: 1px solid var(--s-line);
  border-radius: 8px;
  color: var(--s-text);
  background: var(--s-surface-soft);
}

.field-control input:focus,
.field-control textarea:focus,
.field-control select:focus,
.ip-access-row input:focus {
  border-color: var(--s-accent-border-strong);
  background: var(--s-surface-soft);
}

.auth-modal__identity {
  border: 1px solid var(--s-line);
  border-radius: 10px;
  background: var(--s-surface-soft);
  box-shadow: none;
}

.auth-modal__brand {
  margin: 0 0 8px;
  color: var(--s-accent);
  font-family: "IBM Plex Mono", monospace;
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .16em;
}

.auth-modal__access-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 20px;
  padding-top: 17px;
  border-top: 1px solid var(--s-line);
  color: var(--s-muted);
  font-size: .68rem;
  line-height: 1.55;
  text-align: left;
}

.auth-modal__access-note svg {
  flex: 0 0 17px;
  width: 17px;
  height: 17px;
  margin-top: 1px;
  color: var(--s-text);
}

.primary-action,
.secondary-action,
.danger-action,
.mini-action,
.ip-add-button {
  border: 1px solid var(--s-line);
  border-radius: 8px;
  color: var(--s-text);
  background: var(--s-surface-raised);
  box-shadow: none;
  transition: border-color .16s ease, color .16s ease, background .16s ease;
}

.primary-action {
  border-color: var(--s-accent);
  color: var(--s-accent-ink);
  background: var(--s-accent);
}

.danger-action {
  border-color: #663a3a;
  color: #f09a9a;
  background: #241313;
}

.secondary-action:hover,
.primary-action:hover,
.danger-action:hover,
.mini-action:hover,
.ip-add-button:hover {
  filter: none;
  transform: none;
}

.secondary-action:hover,
.mini-action:hover,
.ip-add-button:hover { border-color: var(--s-line-strong); background: #20252c; }
.primary-action:hover { background: var(--s-accent-strong); }
.danger-action:hover { border-color: var(--s-danger); }

.form-message { color: var(--s-muted); }
.form-message.is-error { color: #f09a9a; }
.form-message.is-success { color: var(--s-success); }

.confirm-modal__icon {
  border: 1px solid var(--s-line-strong);
  border-radius: 9px;
  color: var(--s-text);
  background: var(--s-surface-raised);
}

.confirm-modal__icon--warning {
  border-color: #663a3a;
  color: #f09a9a;
  background: #241313;
}

.toggle-control__track {
  border: 1px solid var(--s-line-strong);
  border-radius: 6px;
  background: var(--s-surface-soft);
  box-shadow: none;
}

.toggle-control__track i {
  border-radius: 3px;
  background: var(--s-muted);
}

.toggle-control:hover .toggle-control__track,
.toggle-control input:focus-visible + .toggle-control__track {
  border-color: var(--s-accent-border-strong);
  background: var(--s-surface-soft);
  box-shadow: none;
}

.toggle-control input:checked + .toggle-control__track {
  border-color: var(--s-accent);
  background: var(--s-accent-surface-strong);
}

.toggle-control input:checked + .toggle-control__track i { background: var(--s-accent); }

.ip-access-editor,
.file-field {
  border: 1px solid var(--s-line);
  border-radius: 9px;
  background: var(--s-surface-soft);
}

.ip-access-editor__head span,
.file-field small { color: var(--s-muted); }

.file-field input { color: var(--s-muted-strong); }

.file-field input::file-selector-button {
  border: 1px solid var(--s-line-strong);
  border-radius: 6px;
  color: var(--s-text);
  background: var(--s-surface-raised);
}

.file-field input::file-selector-button:hover {
  border-color: var(--s-accent-border);
  background: var(--s-accent-surface);
}

.ip-access-row button {
  border-color: #663a3a;
  border-radius: 7px;
  color: #f09a9a;
  background: #241313;
}

.devmode-warning {
  border-color: var(--s-accent-border);
  border-radius: 8px;
  color: var(--s-text);
  background: var(--s-accent-surface);
}

.devmode-modal__footer,
.editor-modal__header,
.editor-modal__footer,
.event-preview-modal__header,
.event-preview-modal__footer { border-color: var(--s-line); }

.custom-select__trigger {
  border: 1px solid var(--s-line);
  border-radius: 8px;
  color: var(--s-text);
  background: var(--s-surface-soft);
}

.custom-select__trigger:hover,
.custom-select.is-open .custom-select__trigger {
  border-color: var(--s-accent-border);
  background: var(--s-surface-soft);
}

.custom-select__menu,
.track-context-menu {
  border: 1px solid var(--s-line);
  border-radius: 9px;
  background: var(--s-surface);
  box-shadow: var(--s-shadow);
  backdrop-filter: none;
}

.custom-select__menu button,
.track-context-menu button { color: var(--s-muted-strong); border-radius: 6px; }

.custom-select__menu button:hover,
.custom-select__menu button[aria-selected="true"],
.track-context-menu button:hover {
  color: var(--s-text);
  background: var(--s-surface-raised);
}

.track-context-menu button.is-danger { color: #f09a9a; }

.editor-settings {
  border-color: var(--s-line);
  background: var(--s-surface-soft);
}

.cover-uploader__preview {
  border-color: var(--s-line-strong);
  border-radius: 8px;
  color: var(--s-muted);
  background: var(--s-bg);
}

.editor-toolbar {
  border-color: var(--s-line);
  border-radius: 9px 9px 0 0;
  background: var(--s-surface-raised);
}

.editor-toolbar button {
  border-radius: 6px;
  color: var(--s-muted-strong);
}

.editor-toolbar button:hover {
  border-color: var(--s-line-strong);
  color: var(--s-text);
  background: #20252c;
}

.editor-toolbar > span { background: var(--s-line); }

.block-editor {
  border-color: var(--s-line);
  border-radius: 0 0 9px 9px;
  color: var(--s-muted-strong);
  background: var(--s-bg);
}

.block-editor:empty::before { color: #626a75; }
.block-editor h2, .block-editor h3 { color: var(--s-text); }

.track-cover-preview {
  border: 1px solid var(--s-line);
  border-radius: 10px;
  color: var(--s-accent-strong);
  background: var(--s-surface-soft);
}

.track-editor-options {
  display: block;
}

.track-remove-cover-toggle { margin-top: 12px; }

.track-editor-footer { border-color: var(--s-line); }

.project-editor-modal { width: min(780px, 100%); }

.project-editor-layout {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  margin-top: 20px;
}

.project-logo-editor,
.project-editor-fields {
  display: grid;
  gap: 12px;
}

.project-logo-preview {
  aspect-ratio: 1;
  width: 100%;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--s-line);
  border-radius: 10px;
  color: var(--s-accent-strong);
  background: var(--s-accent-surface);
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 2.4rem;
  font-weight: 600;
}

.project-logo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.project-logo-file { padding: 11px; }

.project-editor-row {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 10px;
}

.project-editor-modal textarea {
  resize: vertical;
  min-height: 86px;
}

.project-editor-modal .form-message:empty { display: none; }

.project-editor-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--s-line);
}

.project-context-menu { width: 210px; }

.copy-toast {
  border-color: var(--s-line);
  border-radius: 9px;
  color: var(--s-text);
  background: var(--s-surface-raised);
  box-shadow: var(--s-shadow);
  backdrop-filter: none;
}

.copy-toast__icon {
  border-radius: 5px;
  color: var(--s-accent-ink);
  background: var(--s-accent);
}

/* Maintenance uses the same restrained language. */
.maintenance-page,
.maintenance-page__background { background: var(--s-bg); }
.maintenance-page__background { opacity: 1; filter: none; }
.maintenance-card__signal i { height: 1px; border-radius: 0; background: var(--s-accent); animation: none; }
.maintenance-card__reason { color: var(--s-muted-strong); }
.maintenance-card__note { color: var(--s-muted); }

@media (max-width: 720px) {
  .events-catalog { border-radius: 10px; }
  .glass-modal { border-radius: 12px; }
  .event-cover { border-radius: 10px; }
}

@media (max-width: 640px) {
  .profile-card,
  .contact-btn,
  .contact-btn--hero,
  .projects-folder,
  .player-shell { border-radius: 12px; }

  .projects-panel,
  .playlist-panel { border-radius: 11px; }

  .track-item.is-sortable {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .track-item-hint { display: none; }
  .project-item.is-sortable {
    grid-template-columns: 48px minmax(0, 1fr);
  }
  .project-editor-layout { grid-template-columns: 1fr; }
  .project-logo-editor {
    grid-template-columns: 110px minmax(0, 1fr);
    align-items: start;
  }
  .project-logo-preview { width: 110px; grid-row: 1 / span 2; }
  .project-logo-file input { min-width: 0; max-width: 100%; }
  .project-editor-footer { display: grid; align-items: stretch; }
  .project-editor-footer .toggle-control { justify-self: start; }
  body.playlist-open .devmode-fab { opacity: 0; pointer-events: none; }
}

@media (max-width: 420px) {
  .player-controls .icon-btn {
    width: 44px;
    height: 44px;
  }

  .player-controls .play-btn {
    width: 48px;
    height: 48px;
  }

  .track-item.is-sortable {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .track-item.is-sortable .track-item-hint { display: none; }
  .project-editor-row { grid-template-columns: 1fr; }
}

@media (hover: none) and (pointer: coarse) {
  .contact-btn:hover,
  .projects-folder:hover,
  .project-item:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
