/* Shared by the live page, the style gallery, and the owner preview. */
.accent-red{--button-color:#c82638;--button-dark:#570e23;--button-bright:#ff6976;--button-rgb:236,49,71}
.accent-coral{--button-color:#b83a20;--button-dark:#5b2418;--button-bright:#ff946d;--button-rgb:255,105,65}
.accent-blue{--button-color:#1659c9;--button-dark:#122c63;--button-bright:#66c7ff;--button-rgb:39,133,255}
.accent-purple{--button-color:#7531bf;--button-dark:#361b58;--button-bright:#d296ff;--button-rgb:159,81,255}
.accent-teal{--button-color:#007a81;--button-dark:#073b44;--button-bright:#60e0e5;--button-rgb:17,183,193}
.accent-green{--button-color:#187747;--button-dark:#133d2c;--button-bright:#72e8a5;--button-rgb:49,187,112}
.accent-amber{--button-color:#925600;--button-dark:#49300c;--button-bright:#ffd26b;--button-rgb:231,166,37}
.accent-rose{--button-color:#ae2369;--button-dark:#4f143a;--button-bright:#ff8ac9;--button-rgb:233,62,146}
.color-patreon{background:#ffe4da;color:#ad3b23}
.hub-link:not(.button-classic){color:#fff;border-color:rgba(var(--button-rgb),.55);background:var(--button-dark);overflow:hidden}
.hub-link:not(.button-classic) .link-title{color:inherit;font-weight:600}
.hub-link:not(.button-classic) .link-description{color:inherit;opacity:.87}
.hub-link:not(.button-classic) .link-arrow{color:inherit;opacity:.85}
.hub-link:not(.button-classic) .link-arrow .icon{color:inherit}
.hub-link:not(.button-classic) .link-badge{background:#ffffff18;border:1px solid #ffffff30;color:inherit}
.hub-link:not(.button-classic) .link-thumbnail,.hub-link:not(.button-classic) .feature-play{color:#fff;background:linear-gradient(145deg,var(--button-color),var(--button-dark));box-shadow:inset 0 1px 0 #ffffff70,0 3px 9px #0004;border:1px solid #ffffff30}
.hub-link.button-glow:not(.featured){background:radial-gradient(ellipse at 95% 0,rgba(var(--button-rgb),.55),transparent 67%),linear-gradient(110deg,var(--button-dark),#141b26);box-shadow:0 4px 18px rgba(var(--button-rgb),.19),inset 0 1px 0 #ffffff21}
.hub-link.button-neon:not(.featured){background:linear-gradient(115deg,#10151e,#1b202c);border-color:var(--button-bright);box-shadow:inset 0 0 13px rgba(var(--button-rgb),.15),0 0 9px rgba(var(--button-rgb),.22)}
.hub-link.button-neon .link-thumbnail{background:rgba(var(--button-rgb),.12);border-color:var(--button-bright);color:var(--button-bright);box-shadow:0 0 9px rgba(var(--button-rgb),.24),inset 0 0 8px rgba(var(--button-rgb),.1)}
.hub-link.button-gloss:not(.featured){background:linear-gradient(180deg,#ffffff35 0,#ffffff0c 46%,#00000012 49%,#00000030 100%),linear-gradient(110deg,var(--button-color),var(--button-dark));border-color:var(--button-color);box-shadow:inset 0 1px 0 #ffffff95,inset 0 -2px 0 #0005,0 4px 0 var(--button-dark),0 7px 15px rgba(var(--button-rgb),.2)}
.hub-link.button-gloss .link-thumbnail{background:linear-gradient(#ffffff55,#ffffff08 48%,#0002 50%),var(--button-color);border-color:#ffffff66;box-shadow:inset 0 1px 0 #ffffff99,0 2px 4px #0005}
.hub-link.button-glass:not(.featured){background:linear-gradient(120deg,#ffffffed,#ffffffad),var(--button-bright);color:#18252e;border-color:#ffffffd9;box-shadow:inset 0 1px 0 #fff,0 6px 18px rgba(var(--button-rgb),.13);backdrop-filter:blur(16px)}
.hub-link.button-glass .link-badge{background:#ffffff80;border-color:#17252e22}
.hub-link.button-solid:not(.featured){background:var(--button-color);border-color:var(--button-color);box-shadow:none}
.hub-link.button-solid .link-thumbnail{background:#0002;box-shadow:none;border-color:#ffffff26}
.hub-link.button-material:not(.featured){background:linear-gradient(110deg,var(--button-dark),#202936);border-color:#ffffff20;border-bottom:3px solid var(--button-color);box-shadow:0 5px 0 #10151c,0 8px 15px #10151c26}
.hub-link:not(.button-classic).featured{border:2px solid var(--button-color);box-shadow:0 5px 18px rgba(var(--button-rgb),.2)}
.hub-link.button-neon.featured{border-color:var(--button-bright)}
.hub-link:not(.button-classic).featured .feature-arrow{background:var(--button-color);color:#fff}
.hub-link:not(.button-classic):hover{border-color:var(--button-bright);box-shadow:0 8px 24px rgba(var(--button-rgb),.28);transform:translateY(-2px)}
.hub-link:not(.button-classic):active{transform:translateY(1px);box-shadow:inset 0 2px 5px #0003}
.hub-link:not(.button-classic):focus-visible{outline-color:var(--button-color);outline-offset:4px}
.button-style-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.button-style-choice{min-width:0;text-align:left;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink)}
.button-style-choice[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.button-style-choice .hub-link,.link-style-preview .hub-link{min-height:60px;padding:10px;gap:10px;border-radius:11px;animation:none;pointer-events:none}
.button-style-choice .link-thumbnail,.link-style-preview .link-thumbnail{height:34px;width:34px;border-radius:9px}
.button-style-choice .link-title{font-size:11px;line-height:1.3;letter-spacing:0}
.button-style-choice .link-arrow{margin-left:auto}
.button-style-choice .link-arrow .icon{width:15px;height:15px}
.style-choice-label{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:14px 0 2px;font-size:12px}
.button-style-choice>small{display:block;font-size:10px;color:var(--muted)}
.style-selected{display:flex;visibility:hidden;color:var(--accent)}
.style-selected .icon{width:17px;height:17px}
.button-style-choice[aria-pressed=true] .style-selected{visibility:visible}
.style-tip{margin-bottom:0}
.link-finish-fields{padding:15px;border-radius:13px;background:var(--soft);margin:10px 0}
.link-style-preview{margin:15px 0 10px}
.link-style-preview .link-title{font-size:13px;white-space:normal;overflow-wrap:anywhere}
@media(max-width:420px){.button-style-grid{gap:9px}.button-style-choice{padding:9px}.button-style-choice .link-title{font-size:10px}.button-style-choice .link-arrow{display:none}.button-style-choice .link-thumbnail{width:28px;height:28px}.style-choice-label{font-size:11px}.button-style-choice>small{font-size:10px;line-height:1.5}}
@media(prefers-reduced-motion:reduce){.hub-link{animation:none;transition:none}.hub-link:not(.button-classic):hover,.hub-link:not(.button-classic):active{transform:none}}