@keyframes stitchTwinkle {
  0%, 100% { opacity: .48; filter: brightness(.85); }
  50% { opacity: 1; filter: brightness(1.5); }
}

body[data-theme="stitch"] {
  --bg: #07112a;
  --panel: #101d3e;
  --muted: #a8b8dc;
  --text: #f4f2ff;
  --accent: #74d9ff;
  --glow: rgba(51, 164, 255, .28);
  background-color: #07112a;
  background-image: linear-gradient(180deg, rgba(5, 11, 30, .48), rgba(5, 11, 30, .78)), url("assets/stitch-night.jpg");
  background-size: cover;
  background-position: center 40%;
  background-attachment: fixed;
}

body[data-theme="stitch"] .side {
  background: rgba(5, 13, 35, .9);
  border-right-color: rgba(116, 217, 255, .22);
  backdrop-filter: blur(18px);
}
body[data-theme="stitch"] .brandmark {
  position: relative;
  z-index: 0;
  overflow: visible;
  background-image: url("assets/stitch-portrait.webp");
  background-size: 180%;
  background-position: center 24%;
  border: 1px solid rgba(166, 231, 255, .8);
  border-radius: 50%;
  box-shadow: 0 0 20px rgba(79, 186, 255, .55);
}
body[data-theme="stitch"] .brandmark svg { display: none; }
body[data-theme="stitch"] .brandmark::before,
body[data-theme="stitch"] .brandmark::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -4px;
  width: 11px;
  height: 18px;
  border: 1px solid #80dfff;
  background: linear-gradient(145deg, #4ba8ed, #272e6d 64%, #e98bcf 66%);
  border-radius: 90% 14% 70% 20%;
}
body[data-theme="stitch"] .brandmark::before { left: -5px; transform: rotate(-28deg); }
body[data-theme="stitch"] .brandmark::after { right: -5px; transform: rotate(28deg) scaleX(-1); }
body[data-theme="stitch"] .brandname { color: #b7edff; letter-spacing: -.8px; }
body[data-theme="stitch"] .navlabel { color: #8296c4; }
body[data-theme="stitch"] .navitem { color: #bdc9e7; }
body[data-theme="stitch"] .navitem svg { color: #7ddcff; filter: drop-shadow(0 0 4px rgba(87, 187, 255, .4)); }
body[data-theme="stitch"] .navitem:hover,
body[data-theme="stitch"] .navitem.active { color: #fff; background: rgba(67, 154, 232, .18); }
body[data-theme="stitch"] .navitem.active { box-shadow: inset 3px 0 #f08bc9, 0 0 20px rgba(68, 155, 239, .12); }
body[data-theme="stitch"] .skin-mini {
  border-color: rgba(116, 217, 255, .27);
  background: linear-gradient(145deg, rgba(28, 55, 109, .92), rgba(11, 20, 48, .94));
  box-shadow: inset 0 1px rgba(255,255,255,.06), 0 12px 30px rgba(0,0,0,.2);
}
body[data-theme="stitch"] .skin-mini:before { background: rgba(53, 162, 255, .4); }
body[data-theme="stitch"] .skin-mini small,
body[data-theme="stitch"] .profile small { color: #9db5e4; }
body[data-theme="stitch"] .skin-btn { border-color: #79d9ff55; background: #75cfff18; }
body[data-theme="stitch"] .avatar {
  color: transparent;
  background: url("assets/stitch-portrait.webp") center 25% / cover;
  border: 1px solid #a8eaff;
  box-shadow: 0 0 13px #55baff55;
}

body[data-theme="stitch"] .main { background: linear-gradient(90deg, rgba(5, 12, 32, .46), transparent 70%); }
body[data-theme="stitch"] .ambient {
  background: radial-gradient(ellipse at 75% 5%, rgba(63, 151, 247, .24), transparent 52%), linear-gradient(180deg, rgba(6, 15, 41, .56), transparent 90%);
}
body[data-theme="stitch"] .topbar .round,
body[data-theme="stitch"] .bell,
body[data-theme="stitch"] .search,
body[data-theme="stitch"] .source-pill,
body[data-theme="stitch"] .skin-pill {
  color: #d4eaff;
  border-color: rgba(125, 205, 255, .25);
  background-color: rgba(8, 19, 49, .72);
  box-shadow: inset 0 1px rgba(255,255,255,.04);
}
body[data-theme="stitch"] .search svg,
body[data-theme="stitch"] .bell svg { color: #8de3ff; }
body[data-theme="stitch"] .skin-pill i { background: #ed93d4; box-shadow: 0 0 12px #ed93d4; }
body[data-theme="stitch"] .hero {
  border-color: rgba(120, 205, 255, .4);
  box-shadow: 0 24px 70px rgba(0,0,0,.48), 0 0 35px rgba(57, 151, 245, .12);
}
body[data-theme="stitch"] .hero-bg {
  background-color: #0a1534;
  background-image: linear-gradient(90deg, rgba(5, 12, 32, .98) 0%, rgba(5, 12, 32, .8) 34%, rgba(5, 12, 32, .25) 66%, rgba(5, 12, 32, .05)), url("assets/stitch-portrait.webp"), radial-gradient(ellipse at 80% 20%, #667be9, #101c45);
  background-size: cover, auto 145%, cover;
  background-position: center, right 12% center, center;
  background-repeat: no-repeat;
}
body[data-theme="stitch"] .hero-bg::before,
body[data-theme="stitch"] .hero-bg::after { display: none; content: none; }
body[data-theme="stitch"] .hero-tag { color: #d8f4ff; border-color: #a0e5ff66; background: #08132bc9; }
body[data-theme="stitch"] .eyebrow { color: #a8eaff; }
body[data-theme="stitch"] .eyebrow::before { background: #f18ccb; }
body[data-theme="stitch"] .hero h1 { text-shadow: 0 4px 30px #07112acc; }
body[data-theme="stitch"] .hero p { color: #d1dcf4; }
body[data-theme="stitch"] .primary {
  color: #07152e;
  background: linear-gradient(120deg, #8ce6ff, #76baff 65%, #f39bd5);
}
body[data-theme="stitch"] .ghost { border-color: #9be6ff55; background: #9be6ff16; color: #e9f8ff; }
body[data-theme="stitch"] .hero-actions svg { filter: drop-shadow(0 1px 3px #4b7dab); }
body[data-theme="stitch"] .section-head h2,
body[data-theme="stitch"] #pageIntro h1 { color: #e8f5ff; text-shadow: 0 0 18px rgba(96, 183, 255, .14); }
body[data-theme="stitch"] .section-head p,
body[data-theme="stitch"] #pageIntro p { color: #b3c3e4; }
body[data-theme="stitch"] .mix {
  border-color: rgba(126, 201, 255, .2);
  background: linear-gradient(145deg, rgba(24, 42, 84, .76), rgba(10, 19, 47, .8));
  box-shadow: 0 10px 25px rgba(0,0,0,.12);
}
body[data-theme="stitch"] .mix-title { color: #e6f5ff; }
body[data-theme="stitch"] .track:hover { background: rgba(92, 169, 255, .11); }
body[data-theme="stitch"] .track .thumb::after,
body[data-theme="stitch"] .player .now .thumb::after { display: none; }
body[data-theme="stitch"] .track .song strong { color: #edf5ff; }
body[data-theme="stitch"] .track .song small,
body[data-theme="stitch"] .album,
body[data-theme="stitch"] .duration { color: #a9bbdf; }
body[data-theme="stitch"] .player {
  color: #e6f4ff;
  border-top-color: rgba(128, 209, 255, .32);
  background: rgba(5, 13, 37, .94);
  box-shadow: 0 -12px 42px rgba(0,0,0,.36);
  backdrop-filter: blur(22px);
}
body[data-theme="stitch"] .player .now .thumb { border: 1px solid #8ddfff88; box-shadow: 0 0 16px #58baff33; }
body[data-theme="stitch"] .player .now strong { color: #f2f7ff; }
body[data-theme="stitch"] .player .now small,
body[data-theme="stitch"] .player .ctrl { color: #a9dff5; }
body[data-theme="stitch"] .player .ctrl.play { color: #07152e; background: linear-gradient(135deg, #a1edff, #93bfff 68%, #f69bd8); }
body[data-theme="stitch"] .player .heart { color: #f08dcc; }
body[data-theme="stitch"] .player .heart.liked { color: #ff7fc7; text-shadow: 0 0 12px #ff7fc7; }
body[data-theme="stitch"] .bar { background: #435276; }
body[data-theme="stitch"] .bar i { background: linear-gradient(90deg, #71dfff, #f18fcd); }
body[data-theme="stitch"] .bar i::after { border-color: #e99ad8; box-shadow: 0 0 12px #70d7ff99; }
body[data-theme="stitch"] .tools svg { color: #9edfff; }
body[data-theme="stitch"] .modal-backdrop { background: rgba(2, 7, 22, .82); }
body[data-theme="stitch"] .modal { border-color: rgba(126, 206, 255, .32); background: linear-gradient(145deg, #14234a, #0a1230); }
body[data-theme="stitch"] .modal h2 { color: #e8f7ff; }
body[data-theme="stitch"] .modal p { color: #b2c4e7; }
body[data-theme="stitch"] .theme { border-color: #a6d8ff22; background: #c5e7ff0a; }
body[data-theme="stitch"] .theme.selected { border-color: #8ae5ff; box-shadow: 0 0 0 1px #8ae5ff, 0 0 24px #55baff33; }
body[data-theme="stitch"] .swatch.stitch {
  background-image: linear-gradient(0deg, #07112a99, transparent 65%), url("assets/stitch-portrait.webp");
  background-size: cover;
  background-position: center 28%;
}
body[data-theme="stitch"] .swatch.stitch::before { display: none; }
body[data-theme="stitch"] .stitch-sparkle { position: absolute; right: 12px; top: 9px; color: #ffe6a4; text-shadow: 0 0 12px #94eaff; animation: stitchTwinkle 2s ease-in-out infinite; }
body[data-theme="stitch"] .upload { color: #d4eaff; border-color: #85dfff66; }
body[data-theme="stitch"] .upload button { color: #e7f7ff; background: #7cceff22; }
body[data-theme="stitch"] .toast { color: #eef8ff; border-color: #78d9ff55; background: #12264a; }
body[data-theme="stitch"] .oto-petal {
  width: 5px; height: 5px; border-radius: 50%; clip-path: polygon(50% 0, 62% 36%, 100% 50%, 62% 63%, 50% 100%, 37% 63%, 0 50%, 37% 36%);
  background: #a9e9ff; box-shadow: 0 0 8px #a9e9ff; opacity: .85;
}
body[data-theme="stitch"] .oto-petal:nth-child(3n) { background: #f8a5df; box-shadow: 0 0 8px #f8a5df; }
body[data-theme="stitch"] .oto-petal:nth-child(4n) { background: #fff0b0; box-shadow: 0 0 8px #fff0b0; }

@media (max-width: 900px) {
  body[data-theme="stitch"] { background-position: 54% 35%; }
  body[data-theme="stitch"] .hero-bg { background-position: center, 70% center, center; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-theme="stitch"] .stitch-sparkle { animation: none; }
}
