.themes-shell{width:min(1240px,calc(100% - 36px));margin:0 auto;padding:clamp(42px,7vw,88px) 0 70px}.themes-title{margin-bottom:30px}.themes-title h1{margin:8px 0 0}.theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.theme-choice{overflow:hidden;color:var(--ink);border:1px solid var(--panel-line);border-radius:24px;background:var(--panel-surface);box-shadow:var(--panel-shadow);transition:transform .2s ease,outline .2s}.theme-choice:hover{transform:translateY(-4px)}.theme-choice.selected{outline:3px solid var(--accent);outline-offset:3px}.theme-choice>div:last-child{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:19px 21px}.theme-choice h2{margin:0;font-size:1.25rem}.theme-scene{position:relative;height:210px;overflow:hidden;background:#21110b;box-shadow:inset 0 -20px 50px rgba(0,0,0,.28)}.theme-scene::before,.theme-scene::after{content:"";position:absolute}.mini-panel{position:absolute;left:9%;top:18%;width:34%;height:64%;border-radius:12px;background:rgba(255,255,255,.75);box-shadow:0 16px 22px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.5)}.mini-board{position:absolute;left:48%;top:18%;right:8%;height:64%;border:8px solid rgba(0,0,0,.2);border-radius:12px;background:repeating-linear-gradient(0deg,rgba(255,255,255,.14) 0 1px,transparent 1px 31%),repeating-linear-gradient(90deg,rgba(255,255,255,.14) 0 1px,transparent 1px 33%),rgba(255,255,255,.08);box-shadow:0 17px 24px rgba(0,0,0,.35),inset 0 4px 12px rgba(0,0,0,.18)}.theme-scene i{position:absolute;z-index:2;bottom:20%;width:17%;height:16px;border-radius:5px;box-shadow:0 6px 9px rgba(0,0,0,.3)}.theme-scene i:nth-of-type(1){left:53%;background:#168b8b}.theme-scene i:nth-of-type(2){left:71%;background:#b62d61}.theme-scene i:nth-of-type(3){left:62%;bottom:32%;background:#2a6ecd}.theme-walnut .theme-scene{background:repeating-linear-gradient(5deg,transparent 0 13px,rgba(255,222,175,.04) 14px 15px),linear-gradient(135deg,#1a0c08,#613720)}.theme-walnut .mini-panel{background:linear-gradient(145deg,#ebcfaa,#a86a38)}.theme-forest .theme-scene{background:radial-gradient(ellipse at 3% 100%,#56825c 0 16%,transparent 17%),linear-gradient(145deg,#08261d,#28704a)}.theme-forest .mini-panel{background:linear-gradient(145deg,#fbf5e6,#d2dfd0)}.theme-forest .mini-board{background-color:#174b37}.theme-marble .theme-scene{background:linear-gradient(130deg,#151719,#4b4e50)}.theme-marble .mini-panel{background:linear-gradient(145deg,#fff,#dfe2e1)}.theme-marble .mini-board{background-color:#ecebe7;border-color:#74787a}.theme-arcade .theme-scene{background:radial-gradient(circle at 12% 10%,#135c84,transparent 33%),radial-gradient(circle at 90% 90%,#662678,transparent 35%),#040521}.theme-arcade .mini-panel{background:linear-gradient(145deg,#212866,#11163f);border:1px solid #36d9ef}.theme-arcade .mini-board{border-color:#934bff;box-shadow:0 0 24px #1ebddf;background-color:#0e1546}.theme-sunstone{grid-column:1/-1}.theme-sunstone .theme-scene{background:radial-gradient(circle at 88% 8%,#c99743,transparent 27%),linear-gradient(145deg,#2b160c,#875123)}.theme-sunstone .mini-panel{background:linear-gradient(145deg,#ecd19a,#bd8447)}.theme-sunstone .mini-board{background-color:#77461f;border-color:#bd8b48}.theme-sunstone .theme-scene i:nth-of-type(1){background:#22aaa5}.token-studio{margin-top:28px;padding:27px;color:var(--ink);border:1px solid var(--panel-line);border-radius:24px;background:var(--panel-surface);box-shadow:var(--panel-shadow)}.token-studio>div:first-child{display:flex;align-items:end;justify-content:space-between}.token-studio h2{margin:4px 0 0}.palette-presets{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.colour-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.colour-grid label{position:relative;min-width:0}.colour-grid input{position:absolute;opacity:0;pointer-events:none}.colour-grid span{display:flex;align-items:center;justify-content:center;min-height:54px;padding:8px;border:2px solid color-mix(in srgb,var(--token-color) 78%,black);border-radius:12px;color:white;background:linear-gradient(145deg,color-mix(in srgb,var(--token-color) 88%,white),color-mix(in srgb,var(--token-color) 86%,black));box-shadow:inset 0 1px rgba(255,255,255,.35),0 7px 13px rgba(0,0,0,.18);font-size:.62rem;font-weight:800;text-align:center;cursor:pointer}.colour-grid span:hover{transform:translateY(-2px)}
@media(max-width:760px){.themes-shell{width:min(100% - 24px,1240px);padding-top:30px}.theme-grid{grid-template-columns:1fr}.theme-sunstone{grid-column:auto}.theme-scene{height:170px}.theme-choice>div:last-child{align-items:stretch;flex-direction:column}.colour-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v4.1 theme gallery */
.theme-scene{height:250px}.theme-scene::after{inset:0;background:linear-gradient(120deg,rgba(255,255,255,.12),transparent 35% 68%,rgba(0,0,0,.15));pointer-events:none}.mini-panel{border:1px solid rgba(255,255,255,.32);transform:perspective(700px) rotateY(5deg);transform-origin:right center}.mini-board{transform:perspective(700px) rotateY(-5deg);transform-origin:left center}.theme-choice:hover .mini-panel{transform:perspective(700px) rotateY(1deg) translateY(-3px)}.theme-choice:hover .mini-board{transform:perspective(700px) rotateY(-1deg) translateY(-3px)}.mini-panel,.mini-board{transition:transform .35s ease}.theme-walnut .theme-scene{background-image:url("../svg/walnut-grain.svg"),linear-gradient(135deg,#120805,#713f22);background-size:cover}.theme-walnut .mini-board{border-color:#35180e;background-color:#9a5d31;box-shadow:inset 0 0 0 2px #b98551,0 17px 24px rgba(0,0,0,.5)}.theme-forest .theme-scene{background-image:url("../svg/forest-corners.svg"),radial-gradient(circle at 70% 0,#d9e7b3,transparent 28%),linear-gradient(145deg,#06261c,#397552);background-size:cover}.theme-forest .mini-board{border-color:#194832;box-shadow:inset 0 0 0 2px #83a977,0 17px 24px rgba(0,0,0,.35)}.theme-marble .theme-scene{background-image:url("../svg/marble-veins.svg"),linear-gradient(130deg,#101214,#696d6f);background-size:cover}.theme-marble .mini-board{background-image:url("../svg/marble-veins.svg");background-color:#f2f2ee;box-shadow:inset 0 0 0 1px #fff,0 17px 28px rgba(0,0,0,.38)}.theme-arcade .theme-scene{background-image:url("../svg/arcade-ribbons.svg"),radial-gradient(circle at 12% 10%,#135c84,transparent 33%),#040521;background-size:cover}.theme-arcade .mini-board{animation:preview-arcade 4s ease-in-out infinite}.theme-sunstone .theme-scene{background-image:url("../svg/sunstone-emblem.svg"),radial-gradient(circle at 88% 8%,#e0b65f,transparent 27%),linear-gradient(145deg,#2b160c,#a66c30);background-size:390px,auto,auto;background-position:95% center,center,center;background-repeat:no-repeat}.theme-sunstone .mini-board{box-shadow:inset 0 0 0 2px #d09a51,0 17px 25px rgba(42,20,6,.45)}
.token-studio{position:relative;overflow:hidden}.token-studio::after{content:"";position:absolute;right:-90px;top:-110px;width:300px;height:300px;border:1px solid color-mix(in srgb,var(--accent) 25%,transparent);border-radius:50%;box-shadow:0 0 0 35px color-mix(in srgb,var(--accent) 6%,transparent);pointer-events:none}.token-studio>div{position:relative;z-index:1}.token-style-options{margin:20px 0;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.token-style-options>button,.custom-token-picker{min-height:39px;padding:0 13px;display:inline-flex;align-items:center;gap:8px;color:var(--ink-muted);border:1px solid color-mix(in srgb,var(--ink) 18%,transparent);border-radius:10px;background:color-mix(in srgb,var(--panel-2) 55%,transparent);font-size:.63rem;font-weight:900;cursor:pointer}.token-style-options>button.selected{color:var(--button-ink);border-color:var(--accent);background:var(--accent);box-shadow:inset 0 1px rgba(255,255,255,.38),inset 0 -3px rgba(0,0,0,.12),0 7px 14px rgba(0,0,0,.17)}.custom-token-picker input{width:21px;height:21px;padding:0;border:0;background:transparent}.token-preview-rack{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:16px;border:1px solid color-mix(in srgb,var(--ink) 12%,transparent);border-radius:16px;background:color-mix(in srgb,var(--board-well) 82%,black);box-shadow:inset 0 8px 18px rgba(0,0,0,.24)}.token-preview-rack span{position:relative;min-height:57px;padding:9px;display:grid;place-items:center;overflow:hidden;color:var(--token-text);border:1px solid color-mix(in srgb,var(--token-color) 62%,white);border-radius:9px;background:linear-gradient(158deg,color-mix(in srgb,var(--token-color) 54%,white),var(--token-color) 36%,color-mix(in srgb,var(--token-color) 78%,black));box-shadow:inset 0 3px 0 rgba(255,255,255,.34),inset 0 -4px 0 rgba(0,0,0,.24),0 7px 0 rgba(17,11,9,.46),0 13px 19px rgba(10,5,4,.27);text-shadow:0 1px 2px rgba(0,0,0,.62);font-size:.59rem;font-weight:900;text-align:center}.token-preview-rack span::after{content:"";position:absolute;left:7%;right:7%;top:4px;height:30%;border-radius:7px;background:linear-gradient(180deg,rgba(255,255,255,.3),transparent)}@keyframes preview-arcade{50%{box-shadow:0 0 32px #1ed7ff,inset 0 0 18px rgba(168,85,247,.28)}}
@media(max-width:760px){.theme-scene{height:190px}.token-style-options{flex-wrap:nowrap;overflow-x:auto}.token-preview-rack{grid-template-columns:repeat(2,minmax(0,1fr))}.token-preview-rack span:last-child{grid-column:1/-1}}

.theme-walnut .theme-scene{background-image:linear-gradient(rgba(24,8,3,.12),rgba(24,8,3,.2)),url("../art/walnut-world.webp");background-size:cover;background-position:center}.theme-forest .theme-scene{background-image:linear-gradient(rgba(240,245,217,.05),rgba(9,54,36,.12)),url("../art/forest-world.webp");background-size:cover;background-position:center}.theme-marble .theme-scene{background-image:linear-gradient(rgba(255,255,255,.02),rgba(30,35,37,.09)),url("../art/marble-world.webp");background-size:cover;background-position:center}.theme-arcade .theme-scene{background-image:linear-gradient(rgba(3,4,25,.06),rgba(3,4,25,.16)),url("../art/arcade-world.webp");background-size:cover;background-position:center}.theme-sunstone .theme-scene{background-image:linear-gradient(rgba(255,219,143,.03),rgba(74,35,12,.1)),url("../art/sunstone-world.webp");background-size:cover;background-position:center}