/* =========================================================
   WORLD SPECIAL ENGINE V2
   Studio · Arcade · Systems · Partners
   Shared runtime, world-specific experience.
   ========================================================= */

.ws-special-section{
    position:relative;
    overflow:hidden;
}

.wsp-head{
    display:grid;
    grid-template-columns:1fr minmax(300px,.68fr);
    gap:42px;
    align-items:end;
    margin-bottom:20px;
}
.wsp-head span{
    color:rgb(var(--world-accent)/.88);
    font:700 .43rem/1 monospace;
    letter-spacing:.1em;
}
.wsp-head h2{
    margin:10px 0 0;
    max-width:980px;
    font-size:clamp(2.2rem,4vw,4.4rem);
    line-height:.92;
    letter-spacing:-.055em;
}
.wsp-head p{
    margin:0;
    color:var(--ws-muted);
    font-size:.61rem;
    line-height:1.68;
}

.wsp-summary{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
    margin-bottom:10px;
}
.wsp-summary-card{
    min-height:118px;
    padding:12px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:19px;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.055),transparent 40%),
        rgba(255,255,255,.012);
}
.wsp-summary-card span{
    color:var(--ws-dim);
    font:700 .34rem/1 monospace;
    letter-spacing:.06em;
}
.wsp-summary-card strong{
    display:block;
    margin-top:13px;
    color:#fff;
    font-size:.82rem;
    line-height:1.2;
}
.wsp-summary-card small{
    display:block;
    margin-top:5px;
    color:rgba(255,255,255,.31);
    font-size:.41rem;
    line-height:1.42;
}

.wsp-panel{
    margin-top:10px;
    padding:16px;
    border:1px solid rgba(255,255,255,.075);
    border-radius:26px;
    background:
        radial-gradient(circle at 8% 10%,rgb(var(--world-accent)/.05),transparent 33%),
        linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.008)),
        rgba(9,20,31,.64);
    box-shadow:
        0 22px 62px rgba(0,0,0,.12),
        inset 0 1px 0 rgba(255,255,255,.045);
}
.wsp-panel-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-bottom:12px;
    border-bottom:1px solid rgba(255,255,255,.06);
}
.wsp-panel-head span{
    color:rgb(var(--world-accent)/.72);
    font:700 .39rem/1 monospace;
    letter-spacing:.075em;
}
.wsp-panel-head i{
    padding:6px 8px;
    border:1px solid rgb(var(--world-accent)/.14);
    border-radius:999px;
    color:rgb(var(--world-accent)/.68);
    background:rgb(var(--world-accent)/.025);
    font:700 .33rem/1 monospace;
    font-style:normal;
    letter-spacing:.05em;
}

.wsp-pipeline{
    margin-top:12px;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:7px;
}
.wsp-stage{
    position:relative;
    min-height:190px;
    padding:13px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:20px;
    background:
        linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.006)),
        rgba(255,255,255,.01);
}
.wsp-stage:not(:last-child)::after{
    content:"→";
    position:absolute;
    z-index:3;
    right:-9px;
    top:50%;
    transform:translateY(-50%);
    width:18px;
    height:18px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.07);
    border-radius:50%;
    color:rgb(var(--world-accent)/.58);
    background:#0a1621;
    font-size:.46rem;
}
.wsp-stage b{
    color:rgb(var(--world-accent)/.58);
    font:750 .38rem/1 monospace;
}
.wsp-stage strong{
    display:block;
    margin-top:24px;
    color:#fff;
    font-size:.73rem;
}
.wsp-stage p{
    margin:7px 0 0;
    color:rgba(255,255,255,.36);
    font-size:.44rem;
    line-height:1.5;
}

.wsp-chip-row{
    margin-top:11px;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}
.wsp-chip{
    min-height:31px;
    padding:0 9px;
    display:inline-flex;
    align-items:center;
    border:1px solid rgba(255,255,255,.065);
    border-radius:999px;
    color:rgba(255,255,255,.48);
    background:rgba(255,255,255,.01);
    font-size:.44rem;
}

.wsp-rule-grid{
    margin-top:10px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
}
.wsp-rule{
    min-height:104px;
    padding:11px;
    border:1px solid rgba(255,172,104,.10);
    border-radius:17px;
    color:rgba(255,214,175,.52);
    background:rgba(255,172,104,.018);
    font-size:.44rem;
    line-height:1.5;
}

.wsp-constellation{
    margin-top:12px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
}
.wsp-product{
    min-height:164px;
    padding:13px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    border:1px solid rgba(255,255,255,.065);
    border-radius:20px;
    color:inherit;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.045),transparent 40%),
        rgba(255,255,255,.01);
    transition:
        transform .18s var(--ws-ease),
        border-color .18s ease,
        background .18s ease;
}
a.wsp-product:hover{
    transform:translateY(-2px);
    border-color:rgb(var(--world-accent)/.22);
    background:rgb(var(--world-accent)/.035);
}
.wsp-product span{
    color:rgb(var(--world-accent)/.56);
    font:700 .34rem/1 monospace;
    letter-spacing:.06em;
    text-transform:uppercase;
}
.wsp-product h3{
    margin:16px 0 7px;
    color:#fff;
    font-size:.72rem;
    line-height:1.28;
}
.wsp-product p{
    margin:0;
    color:rgba(255,255,255,.33);
    font-size:.43rem;
    line-height:1.45;
}
.wsp-product footer{
    margin-top:13px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}
.wsp-product footer small{
    color:rgba(255,255,255,.28);
    font-size:.37rem;
}
.wsp-product footer i{
    width:27px;
    height:27px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.07);
    border-radius:50%;
    color:rgb(var(--world-accent)/.68);
    font-style:normal;
}

.wsp-layer-stack{
    margin-top:12px;
    display:grid;
    gap:7px;
}
.wsp-layer{
    position:relative;
    min-height:112px;
    padding:14px 16px;
    display:grid;
    grid-template-columns:minmax(180px,.35fr) 1fr;
    gap:20px;
    align-items:center;
    border:1px solid rgba(255,255,255,.065);
    border-radius:20px;
    background:
        linear-gradient(90deg,rgb(var(--world-accent)/.045),transparent 46%),
        rgba(255,255,255,.01);
}
.wsp-layer:not(:last-child)::after{
    content:"↓";
    position:absolute;
    z-index:3;
    left:50%;
    bottom:-12px;
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    transform:translateX(-50%);
    border:1px solid rgba(255,255,255,.07);
    border-radius:50%;
    color:rgb(var(--world-accent)/.60);
    background:#0a1621;
    font-size:.48rem;
}
.wsp-layer strong{
    color:#fff;
    font-size:.72rem;
}
.wsp-layer p{
    margin:0;
    color:rgba(255,255,255,.39);
    font-size:.47rem;
    line-height:1.52;
}

.wsp-state-grid{
    margin-top:12px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}
.wsp-state{
    min-height:120px;
    padding:12px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    border:1px solid rgba(255,255,255,.06);
    border-radius:20px;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.055),transparent 42%),
        rgba(255,255,255,.01);
}
.wsp-state span{
    color:var(--ws-dim);
    font:700 .34rem/1 monospace;
    letter-spacing:.06em;
}
.wsp-state b{
    color:#fff;
    font-size:.75rem;
}
.wsp-state small{
    color:rgba(255,255,255,.28);
    font-size:.39rem;
    line-height:1.4;
}

.wsp-track-grid{
    margin-top:8px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
}
.wsp-track{
    min-height:165px;
    padding:13px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:20px;
    background:rgba(255,255,255,.01);
}
.wsp-track span{
    color:rgb(var(--world-accent)/.58);
    font:700 .34rem/1 monospace;
    letter-spacing:.06em;
}
.wsp-track strong{
    display:block;
    margin-top:18px;
    color:#fff;
    font-size:.72rem;
}
.wsp-track p{
    margin:7px 0 0;
    color:rgba(255,255,255,.36);
    font-size:.44rem;
    line-height:1.5;
}

.wsp-control-note{
    margin-top:10px;
    padding:11px 13px;
    border:1px solid rgba(255,172,104,.13);
    border-radius:16px;
    color:rgba(255,214,175,.58);
    background:rgba(255,172,104,.022);
    font:650 .39rem/1.55 monospace;
}

.wsp-pillars{
    margin-top:12px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
}
.wsp-pillar{
    min-height:112px;
    padding:12px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:18px;
    background:rgba(255,255,255,.01);
}
.wsp-pillar span{
    color:rgb(var(--world-accent)/.58);
    font:700 .34rem/1 monospace;
}
.wsp-pillar strong{
    display:block;
    margin-top:16px;
    color:#fff;
    font-size:.68rem;
}
.wsp-pillar small{
    display:block;
    margin-top:5px;
    color:rgba(255,255,255,.30);
    font-size:.4rem;
    line-height:1.4;
}

@media(max-width:1100px){
    .wsp-head{grid-template-columns:1fr;gap:14px}
    .wsp-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
    .wsp-pipeline{grid-template-columns:repeat(3,minmax(0,1fr))}
    .wsp-constellation{grid-template-columns:repeat(2,minmax(0,1fr))}
    .wsp-state-grid,.wsp-track-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
    .wsp-pipeline{grid-template-columns:1fr}
    .wsp-stage::after{display:none!important}
    .wsp-rule-grid,.wsp-pillars{grid-template-columns:1fr}
    .wsp-layer{grid-template-columns:1fr;gap:9px}
}
@media(max-width:560px){
    .wsp-summary,.wsp-constellation,.wsp-state-grid,.wsp-track-grid{grid-template-columns:1fr}
    .wsp-panel{border-radius:21px}
}

/* =========================================================
   WORLD SPECIAL ENGINE V3
   Interactive detail trays + selected states.
   ========================================================= */

.wsp-detail-tray{
    position:relative;
    margin-top:10px;
    padding:14px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.075),transparent 34%),
        radial-gradient(circle at 100% 100%,rgb(var(--world-accent-2)/.055),transparent 36%),
        linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.01)),
        rgba(8,19,29,.72);
    box-shadow:
        0 20px 54px rgba(0,0,0,.14),
        inset 0 1px 0 rgba(255,255,255,.05);
    backdrop-filter:blur(18px) saturate(160%);
}

.wsp-detail-tray::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    border-radius:inherit;
    background:
        linear-gradient(180deg,rgba(255,255,255,.03),transparent 24%),
        radial-gradient(circle at 50% -30%,rgba(255,255,255,.04),transparent 44%);
}

.wsp-detail-tray>*{
    position:relative;
    z-index:1;
}

.wsp-detail-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-bottom:11px;
    border-bottom:1px solid rgba(255,255,255,.06);
}

.wsp-detail-head>span{
    color:rgb(var(--world-accent)/.72);
    font:700 .38rem/1 monospace;
    letter-spacing:.08em;
}

.wsp-detail-live{
    padding:6px 8px;
    border:1px solid rgb(var(--world-accent)/.14);
    border-radius:999px;
    color:rgb(var(--world-accent)/.72);
    background:rgb(var(--world-accent)/.03);
    font:700 .32rem/1 monospace;
    font-style:normal;
    letter-spacing:.06em;
}

.wsp-detail-copy{
    padding:16px 0 10px;
}

.wsp-detail-eyebrow{
    color:rgba(255,255,255,.32);
    font:700 .37rem/1 monospace;
    letter-spacing:.08em;
}

.wsp-detail-title{
    margin:8px 0 6px;
    color:#fff;
    font-size:1.18rem;
    letter-spacing:-.035em;
}

.wsp-detail-body{
    margin:0;
    max-width:920px;
    color:rgba(240,247,255,.50);
    font-size:.52rem;
    line-height:1.6;
}

.wsp-detail-meta{
    display:flex;
    gap:6px;
    flex-wrap:wrap;
}

.wsp-detail-meta span{
    min-height:28px;
    padding:0 8px;
    display:inline-flex;
    align-items:center;
    border:1px solid rgba(255,255,255,.065);
    border-radius:999px;
    color:rgba(255,255,255,.38);
    background:rgba(255,255,255,.012);
    font:650 .34rem/1 monospace;
}

.wsp-detail-tray.is-pulsing{
    animation:wspDetailPulse .34s cubic-bezier(.2,.75,.2,1);
}

@keyframes wspDetailPulse{
    0%{transform:scale(.995);opacity:.86}
    100%{transform:none;opacity:1}
}

/* Interactive cards become soft buttons instead of sharp controls. */
button.wsp-stage,
button.wsp-layer,
button.wsp-state{
    width:100%;
    color:inherit;
    text-align:left;
    cursor:pointer;
    font:inherit;
}

button.wsp-stage,
button.wsp-layer,
button.wsp-state{
    outline:0;
}

.wsp-stage.is-active,
.wsp-layer.is-active,
.wsp-state.is-active{
    border-color:rgb(var(--world-accent)/.28);
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.105),transparent 42%),
        linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.008)),
        rgba(255,255,255,.014);
    box-shadow:
        0 12px 32px rgba(0,0,0,.10),
        0 0 0 1px rgb(var(--world-accent)/.04),
        inset 0 1px 0 rgba(255,255,255,.055);
}

.wsp-stage:hover,
.wsp-layer:hover,
.wsp-state:hover,
.wsp-stage:focus-visible,
.wsp-layer:focus-visible,
.wsp-state:focus-visible{
    border-color:rgb(var(--world-accent)/.24);
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.08),transparent 42%),
        rgba(255,255,255,.016);
}

.wsp-stage:focus-visible,
.wsp-layer:focus-visible,
.wsp-state:focus-visible{
    box-shadow:
        0 0 0 3px rgb(var(--world-accent)/.055),
        inset 0 1px 0 rgba(255,255,255,.05);
}

/* Arcade hover-selection feels like a product deck, not a static grid. */
.wsp-product{
    position:relative;
    overflow:hidden;
    border-radius:22px;
}

.wsp-product::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    border-radius:inherit;
    opacity:0;
    background:
        radial-gradient(circle at 8% 0%,rgb(var(--world-accent)/.09),transparent 38%),
        linear-gradient(180deg,rgba(255,255,255,.025),transparent 30%);
    transition:opacity .2s ease;
}

.wsp-product:hover::before,
.wsp-product:focus-visible::before{
    opacity:1;
}

.wsp-product>*{
    position:relative;
    z-index:1;
}

@media(max-width:760px){
    .wsp-detail-tray{
        border-radius:20px;
    }
}

@media(prefers-reduced-motion:reduce){
    .wsp-detail-tray.is-pulsing{
        animation:none!important;
    }
}

/* V3.1 — nested hub doors */
.wsp-hub-grid{
    margin-top:12px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}
.wsp-hub-link{
    min-height:112px;
    padding:15px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    gap:8px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.075);
    border-radius:22px;
    color:#fff;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.09),transparent 40%),
        radial-gradient(circle at 100% 100%,rgb(var(--world-accent-2)/.055),transparent 40%),
        linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.008)),
        rgba(255,255,255,.01);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
    font-size:.7rem;
    font-weight:760;
    letter-spacing:-.01em;
    transition:
        transform .2s var(--ws-ease),
        border-color .2s ease,
        background .2s ease;
}
.wsp-hub-link small{
    color:rgba(255,255,255,.34);
    font:650 .34rem/1.45 monospace;
    letter-spacing:.05em;
}
.wsp-hub-link:hover{
    transform:translateY(-2px);
    border-color:rgb(var(--world-accent)/.24);
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.13),transparent 42%),
        radial-gradient(circle at 100% 100%,rgb(var(--world-accent-2)/.08),transparent 42%),
        rgba(255,255,255,.014);
}
@media(max-width:700px){
    .wsp-hub-grid{grid-template-columns:1fr}
}

/* =========================================================
   V13 — SPECIAL WORLDS EXPERIENCE
   Studio · Arcade · Systems · Partners
   ========================================================= */

.wsp-head h2{
    text-wrap:balance;
}

.wsp-summary-card{
    position:relative;
    overflow:hidden;
    border-radius:22px;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.085),transparent 42%),
        linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.01)),
        rgba(255,255,255,.012);
    box-shadow:
        0 16px 44px rgba(0,0,0,.09),
        inset 0 1px 0 rgba(255,255,255,.045);
}

.wsp-summary-card::after{
    content:"";
    position:absolute;
    right:-38px;
    bottom:-38px;
    width:110px;
    height:110px;
    border-radius:50%;
    background:radial-gradient(circle,rgb(var(--world-accent)/.10),transparent 68%);
}

.wsp-panel{
    border-radius:30px;
    background:
        radial-gradient(circle at 8% 10%,rgb(var(--world-accent)/.065),transparent 33%),
        radial-gradient(circle at 96% 100%,rgb(var(--world-accent-2)/.045),transparent 35%),
        linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.008)),
        rgba(9,20,31,.68);
    box-shadow:
        0 24px 72px rgba(0,0,0,.14),
        inset 0 1px 0 rgba(255,255,255,.05);
}

.wsp-stage,
.wsp-layer,
.wsp-state,
.wsp-product,
.wsp-track,
.wsp-pillar,
.wsp-hub-link{
    isolation:isolate;
}

.wsp-stage,
.wsp-layer,
.wsp-state{
    position:relative;
    overflow:hidden;
}

.wsp-stage::before,
.wsp-layer::before,
.wsp-state::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    opacity:0;
    border-radius:inherit;
    background:
        radial-gradient(
            240px circle at var(--mx,50%) var(--my,50%),
            rgb(var(--world-accent)/.13),
            transparent 62%
        );
    transition:opacity .2s ease;
}

.wsp-stage:hover::before,
.wsp-stage:focus-visible::before,
.wsp-layer:hover::before,
.wsp-layer:focus-visible::before,
.wsp-state:hover::before,
.wsp-state:focus-visible::before{
    opacity:1;
}

.wsp-stage>*,
.wsp-layer>*,
.wsp-state>*{
    position:relative;
    z-index:1;
}

.wsp-stage{
    border-radius:24px;
    min-height:200px;
}

.wsp-stage.is-active{
    transform:translateY(-2px);
    border-color:rgb(var(--world-accent)/.32);
    box-shadow:
        0 18px 48px rgba(0,0,0,.13),
        0 0 30px rgb(var(--world-accent)/.055),
        inset 0 1px 0 rgba(255,255,255,.06);
}

.wsp-stage.is-active b{
    color:rgb(var(--world-accent)/.88);
}

.wsp-detail-tray{
    border-radius:28px;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.09),transparent 34%),
        radial-gradient(circle at 100% 100%,rgb(var(--world-accent-2)/.065),transparent 38%),
        linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.01)),
        rgba(8,19,29,.76);
}

.wsp-detail-live{
    box-shadow:0 0 14px rgb(var(--world-accent)/.06);
}

.wsp-product{
    min-height:176px;
    border-radius:24px;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.065),transparent 40%),
        linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.008)),
        rgba(255,255,255,.012);
}

.wsp-product::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    opacity:0;
    border-radius:inherit;
    background:
        radial-gradient(
            260px circle at var(--mx,50%) var(--my,50%),
            rgb(var(--world-accent)/.12),
            transparent 60%
        );
    transition:opacity .2s ease;
}

.wsp-product:hover::after,
.wsp-product:focus-visible::after{
    opacity:1;
}

.wsp-product:hover{
    transform:translateY(-3px);
    box-shadow:
        0 22px 58px rgba(0,0,0,.14),
        0 0 28px rgb(var(--world-accent)/.04);
}

.wsp-product footer i{
    width:30px;
    height:30px;
    border-color:rgb(var(--world-accent)/.14);
    background:rgb(var(--world-accent)/.025);
}

.wsp-layer{
    border-radius:24px;
}

.wsp-layer.is-active{
    transform:translateY(-1px);
}

.wsp-state{
    border-radius:24px;
}

.wsp-state.is-active{
    transform:translateY(-2px);
}

.wsp-track{
    border-radius:22px;
    background:
        radial-gradient(circle at 0 0,rgb(var(--world-accent)/.045),transparent 40%),
        rgba(255,255,255,.01);
    transition:transform .2s var(--ws-ease),border-color .2s ease;
}

.wsp-track:hover{
    transform:translateY(-2px);
    border-color:rgb(var(--world-accent)/.18);
}

.wsp-pillar{
    border-radius:21px;
}

.wsp-hub-link{
    border-radius:26px;
    min-height:128px;
}

.wsp-hub-link::after{
    content:"↗";
    position:absolute;
    right:14px;
    top:14px;
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border:1px solid rgb(var(--world-accent)/.15);
    border-radius:50%;
    color:rgb(var(--world-accent)/.74);
    background:rgb(var(--world-accent)/.025);
    font-size:.54rem;
}

.wsp-control-note{
    border-radius:20px;
}

@media(max-width:760px){
    .wsp-panel{
        border-radius:22px;
    }

    .wsp-stage,
    .wsp-product,
    .wsp-layer,
    .wsp-state{
        border-radius:20px;
    }
}
