
.hub{max-width:1340px;margin:auto;padding:32px 28px 10px}.hub-kicker{font-size:11px;letter-spacing:.14em;font-weight:700;color:#a46046;margin:0 0 7px}.hub h1{font:42px/1.15 Georgia,serif;margin:0 0 10px}.hub-intro{color:#67716b;margin:0 0 24px}.design-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.design-choice{position:relative;text-align:left;padding:0;background:#fffcf7;border:1px solid #e2cdbd;border-radius:18px;overflow:hidden;cursor:pointer;color:inherit;box-shadow:0 6px 18px #60462909;transition:border-color .15s,transform .15s}.design-choice:hover{transform:translateY(-2px);border-color:#a76045}.design-choice:focus-visible{outline:3px solid #9bc0ad;outline-offset:4px}.design-choice[aria-selected=true]{border:2px solid #3f5749;box-shadow:0 6px 20px #35544316}.cover{height:145px;display:flex;align-items:center;justify-content:center;background:#e9dfd0;padding:12px}.cover img{height:100%;width:auto;max-width:100%;object-fit:contain;box-shadow:0 5px 10px #372a292b}.design-choice:first-child .cover{background:#f0e5d6}.design-choice:first-child .cover img{width:100%;object-fit:cover;border-radius:7px;box-shadow:none}.design-choice[data-kind=stars] .cover{background:#dce5dd}.design-choice[data-kind=numbers] .cover{background:#dbe7e4}.choice-text{padding:15px 16px 17px;display:block;min-height:98px}.choice-text strong{display:block;font:22px/1.15 Georgia,serif;margin-bottom:8px}.choice-text small{font:12px/1.5 Arial,sans-serif;color:#67716b}.choice-check{position:absolute;top:11px;right:11px;border-radius:50%;background:#3f5749;color:white;width:25px;height:25px;display:none;place-items:center}.design-choice[aria-selected=true] .choice-check{display:grid}.hub-guide{display:flex;align-items:center;gap:12px;padding:15px 0 22px;color:#5b675e;border-bottom:1px solid #e2d2c4;font-size:12px}.hub-guide img{width:39px;height:46px;object-fit:contain}.selected-area{max-width:1340px;margin:auto;padding:18px 28px 0}.selected-area h2{font:28px/1.2 Georgia,serif;margin:0 0 5px}.selected-area p{margin:0 0 8px;color:#66726b;font-size:12px}.design-panel-frame{display:block;width:100%;border:0;min-height:800px;background:#f8f5f0}.design-panel-frame[hidden]{display:none}.preview-badge{position:fixed;bottom:12px;right:16px;z-index:1000;border:1px solid #ddcbb7;border-radius:20px;padding:7px 13px;background:#fffcf4;color:#805c42;font-size:11px;box-shadow:0 3px 10px #0001}@media(max-width:760px){.hub{padding:22px 16px 0}.hub h1{font-size:32px}.hub-intro{font-size:13px;margin-bottom:18px}.design-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.cover{height:108px;padding:8px}.choice-text{padding:12px;min-height:100px}.choice-text strong{font-size:20px}.choice-text small{font-size:11px}.selected-area{padding:16px}.hub-guide{align-items:flex-start;font-size:11px}.preview-badge{bottom:6px;right:8px}}

#panel-imagine[hidden],.design-panel-frame[hidden]{display:none!important}.design-panel-frame{min-height:600px}.hub,.selected-area{width:100%}.hub button{font-family:inherit}.hub-guide{min-height:76px}

/* The set link opens its own studio; the four existing tabs retain their panels. */
.design-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.design-options>.design-choices{grid-column:span 4}
.design-set-link{min-width:0;color:inherit;text-decoration:none;background:#fffcf7;border:1px solid #e2cdbd;border-radius:18px;overflow:hidden;box-shadow:0 6px 18px #60462909}
.design-set-link:hover{border-color:#a76045}.design-set-link:focus-visible{outline:3px solid #9bc0ad;outline-offset:4px}
.set-cover{gap:7px;background:#e9e4da}.set-cover i{height:108px;flex:1;max-width:45px;background:linear-gradient(145deg,#e8dbc5 15%,#b96547 16% 48%,#ead9b8 49% 68%,#40574b 69%);box-shadow:2px 4px 7px #372a292b}
.set-cover i:nth-child(2){background:linear-gradient(145deg,#b96547 15%,#ead9b8 16% 48%,#40574b 49% 68%,#e8dbc5 69%)}
.set-cover i:nth-child(3){background:linear-gradient(145deg,#ead9b8 15%,#40574b 16% 48%,#e8dbc5 49% 68%,#b96547 69%)}
@media(max-width:1000px){.design-options{grid-template-columns:repeat(2,minmax(0,1fr))}.design-options>.design-choices{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.design-options{gap:10px}.set-cover i{height:90px}}
