/* Isolated alternatives for the seven-step support explorer. */
body.soft-palace #support .support-loop {
  --loop-navy:#263f52; --loop-gold:#aa8a54; --loop-edge:#d8cbb3;
  position:relative; margin-top:30px; color:#3e444b;
}
body.soft-palace #support .support-loop .loop-label {
  align-items:center; gap:16px; margin-bottom:22px;
}
body.soft-palace #support .support-loop .loop-label>span:first-child {
  color:#8c7149; font-size:11px; letter-spacing:.12em; white-space:nowrap;
}
body.soft-palace #support .support-loop .loop-controls button {
  position:relative; cursor:pointer; min-width:0; transition:background .18s,border-color .18s;
}
body.soft-palace #support .support-loop .loop-controls button:focus-visible,
body.soft-palace #support .support-loop .loop-next:focus-visible {
  outline:2px solid #a8864b; outline-offset:4px;
}
body.soft-palace #support .support-loop .loop-explanation {
  margin-top:25px; padding:26px 22px; min-height:230px;
  grid-template-columns:65px minmax(0,1fr) 46px; gap:20px;
}
body.soft-palace #support .support-loop .loop-number { font-size:46px; }
body.soft-palace #support .support-loop .loop-explanation h3 { font-size:23px; line-height:1.65; margin-bottom:12px; }
body.soft-palace #support .support-loop .loop-explanation p { font-size:15px; line-height:2; white-space:pre-line; }
body.soft-palace #support .support-loop .loop-next { width:46px; height:46px; font-size:25px; }

/* A: one bound notebook, with subtle ruling underneath the explanation. */
body.soft-palace #support [data-loop-design="a"] {
  background:#fffdf7; border:1px solid #d5c5a7; border-radius:7px 15px 15px 7px;
  padding:35px 27px 25px 43px; box-shadow:5px 6px 0 #f0eadd,0 10px 28px #293e4c0a;
}
body.soft-palace #support [data-loop-design="a"]::before {
  content:""; position:absolute; left:19px; top:0; bottom:0; border-left:1px solid #dac9a966;
}
body.soft-palace #support [data-loop-design="a"]::after {
  content:""; position:absolute; width:52px; height:13px; top:-7px; left:45px;
  border:2px solid #b79a66; border-radius:9px; transform:rotate(-8deg); background:#ffffff70;
}
body.soft-palace #support [data-loop-design="a"] .loop-controls { gap:9px; }
body.soft-palace #support [data-loop-design="a"] .loop-controls button {
  background:#fff; border:1px solid #dfd6c4; border-radius:5px; min-height:74px; padding:10px 8px; font-size:14px;
}
body.soft-palace #support [data-loop-design="a"] .loop-controls button[aria-pressed="true"] {
  background:#edf2f6; color:var(--loop-navy); border-color:#879dac; box-shadow:inset 0 -3px #879dac;
}
body.soft-palace #support [data-loop-design="a"] .loop-explanation {
  border-top:1px solid #ddcfb8; padding-inline:12px;
  background:repeating-linear-gradient(to bottom,transparent 0,transparent 33px,#b7a3811c 33px,#b7a3811c 34px);
}
body.soft-palace #support [data-loop-design="a"] .loop-number {
  color:#a78a58; font-family:var(--hand); font-style:oblique 6deg; font-size:50px;
}

/* B: small paper notes, then one clear explanation card. */
body.soft-palace #support [data-loop-design="b"] {
  background:#f4f6f8; border:1px solid #e3e7eb; border-radius:14px; padding:28px; box-shadow:none;
}
body.soft-palace #support [data-loop-design="b"] .loop-controls { gap:15px 12px; padding:8px 3px 3px; overflow:visible; }
body.soft-palace #support [data-loop-design="b"] .loop-controls button {
  min-height:83px; padding:15px 8px 10px; background:#fffdf8; border:1px solid #e0d6c3;
  border-radius:2px 2px 9px 2px; box-shadow:0 3px 4px #23394a0a; font-size:14px; transform:rotate(-.6deg);
}
body.soft-palace #support [data-loop-design="b"] .loop-controls button:nth-child(even) { transform:rotate(.6deg); background:#fff; }
body.soft-palace #support [data-loop-design="b"] .loop-controls button::before {
  content:""; position:absolute; left:calc(50% - 20px); top:-6px; width:40px; height:12px;
  background:#d4c19b8c; transform:rotate(-3deg);
}
body.soft-palace #support [data-loop-design="b"] .loop-controls button[aria-pressed="true"] {
  border-color:#647f94; color:#263f52; background:#eaf0f5; box-shadow:0 3px 0 #bac9d5;
}
body.soft-palace #support [data-loop-design="b"] .loop-explanation {
  border:1px solid #d9e0e6; border-left:4px solid #879faf; background:#fff; border-radius:5px 11px 11px 5px;
}
body.soft-palace #support [data-loop-design="b"] .loop-number { color:#8399aa; }
body.soft-palace #support [data-loop-design="b"] .loop-explanation h3 { color:#263f52; }

/* C: a navy step rail with a large, white reading card. */
/* Selected combination: A notebook + B paper tabs, with a warm cream selection. */
body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls {
  gap:15px 12px; padding:8px 3px 3px; overflow:visible;
}
body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls button {
  min-height:83px; padding:15px 8px 10px; background:#fffdf8;
  border:1px solid #e0d6c3; border-radius:2px 2px 9px 2px;
  box-shadow:0 3px 4px #66502b0b; color:#514b42; transform:rotate(-.6deg);
}
body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls button:nth-child(even) {
  transform:rotate(.6deg); background:#fff;
}
body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls button::before {
  content:""; position:absolute; left:calc(50% - 20px); top:-6px;
  width:40px; height:12px; background:#d4c19b8c; transform:rotate(-3deg);
}
body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls button[aria-pressed="true"] {
  background:#eddbb6; color:#4a3c28; border-color:#b9985c; box-shadow:0 3px 0 #d5bd92;
}
body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls button[aria-pressed="true"]::before { background:#bda16a99; }
body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls button[aria-pressed="true"]>span { color:#806237; }
body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls button:hover { border-color:#b9985c; }
body.soft-palace #support .support-loop.loop-memo-tabs .loop-label>span:last-child { color:#756b58; }

body.soft-palace #support [data-loop-design="c"] {
  background:#fff; border:1px solid #c5b18d; border-radius:10px; padding:24px; box-shadow:0 6px 20px #23394a0a;
}
body.soft-palace #support [data-loop-design="c"] .loop-controls {
  grid-template-columns:repeat(7,minmax(0,1fr)); gap:0; border:0; border-radius:7px; overflow:hidden; background:#263f52;
}
body.soft-palace #support [data-loop-design="c"] .loop-controls button {
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  min-height:132px; padding:17px 8px 15px; border:0; border-right:1px solid #ffffff24;
  border-radius:0; background:transparent; color:#f1f4f6; font-size:13px; line-height:1.8; grid-column:auto;
}
body.soft-palace #support [data-loop-design="c"] .loop-controls button>span {
  display:grid; place-items:center; width:28px; height:28px; margin:0 auto 10px;
  border:1px solid #cbb88e80; border-radius:50%; color:#e9d4a9; font-size:12px;
}
body.soft-palace #support [data-loop-design="c"] .loop-controls button[aria-pressed="true"] {
  background:#eee3cd; color:#263f52; box-shadow:inset 0 -3px #b69961;
}
body.soft-palace #support [data-loop-design="c"] .loop-controls button[aria-pressed="true"]>span { background:#263f52; color:#f3e4c8; border-color:#263f52; }
body.soft-palace #support [data-loop-design="c"] .loop-controls button:hover { background:#3b5263; color:#fff; }
body.soft-palace #support [data-loop-design="c"] .loop-controls button[aria-pressed="true"]:hover { background:#eee3cd; color:#263f52; }
body.soft-palace #support [data-loop-design="c"] .loop-explanation { border-bottom:1px solid #ded1b7; padding-bottom:29px; }
body.soft-palace #support [data-loop-design="c"] .loop-number { color:#263f52; }
body.soft-palace #support [data-loop-design="c"] .loop-explanation h3 { color:#263f52; }

@media(max-width:760px) {
  body.soft-palace #support .support-loop { padding:24px 15px; }
  body.soft-palace #support .support-loop .loop-label { display:block; margin-bottom:17px; }
  body.soft-palace #support .support-loop .loop-label>span:last-child { font-size:16px; margin-top:7px; }
  body.soft-palace #support .support-loop .loop-controls { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.soft-palace #support .support-loop .loop-controls button { font-size:13px; }
  body.soft-palace #support .support-loop .loop-controls button:last-child { grid-column:1/-1; }
  body.soft-palace #support .support-loop .loop-explanation {
    min-height:285px; grid-template-columns:minmax(0,1fr) 42px; gap:12px; padding:22px 13px;
  }
  body.soft-palace #support .support-loop .loop-number { font-size:34px; }
  body.soft-palace #support .support-loop .loop-next { width:42px; height:42px; }
  body.soft-palace #support .support-loop .loop-explanation h3 { font-size:20px; }
  body.soft-palace #support .support-loop .loop-explanation p { font-size:14px; }
  body.soft-palace #support [data-loop-design="a"] { padding-left:25px; }
  body.soft-palace #support [data-loop-design="a"]::before { left:11px; }
  body.soft-palace #support [data-loop-design="b"] .loop-controls { gap:14px 9px; }
  body.soft-palace #support .support-loop.loop-memo-tabs .loop-controls { gap:14px 9px; }
  body.soft-palace #support [data-loop-design="c"] .loop-controls { gap:1px; background:#687b89; }
  body.soft-palace #support [data-loop-design="c"] .loop-controls button { min-height:94px; padding:11px 8px; border:0; background:#263f52; }
  body.soft-palace #support [data-loop-design="c"] .loop-controls button>span { margin-bottom:6px; width:25px; height:25px; }
}
@media(prefers-reduced-motion:reduce) {
  body.soft-palace #support .support-loop .loop-controls button { transition:none; }
}