.slcs255{--sl:#51d8ff;position:relative;margin:10px 14px 18px;padding:0;border:1px solid color-mix(in srgb,var(--sl) 42%,#17384c);border-radius:10px;background:radial-gradient(circle at 13% 0%,color-mix(in srgb,var(--sl) 13%,transparent),transparent 38%),linear-gradient(135deg,rgba(4,24,39,.97),rgba(2,13,24,.98));box-shadow:0 20px 60px #0008,0 0 38px color-mix(in srgb,var(--sl) 8%,transparent);color:#dff7ff;overflow:hidden;font-family:Inter,ui-sans-serif,system-ui,sans-serif;z-index:3}.slcs255[data-tone="DEFENSIVE"]{--sl:#ffb547}.slcs255[data-tone="HARDEN"]{--sl:#ff796f}.slcs255[data-tone="EXPANSIVE"]{--sl:#67e6a8}.slcs255>header{display:flex;justify-content:space-between;gap:24px;padding:19px 22px 15px;border-bottom:1px solid #ffffff12}.slcs255 h2{margin:3px 0;font:600 20px/1.05 Georgia,serif;letter-spacing:.08em}.slcs255 header p{margin:5px 0 0;color:#8aa9b8;font-size:10px;letter-spacing:.05em}.slcs255 small{color:#668b9d;font-size:8px;letter-spacing:.18em}.slcs255>header aside{text-align:right;min-width:130px}.slcs255>header aside strong{display:block;font-size:26px;color:var(--sl)}.slcs255>header aside em{font-style:normal;font-size:8px;letter-spacing:.18em}.slcs255>nav{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#ffffff12}.slcs255>nav button{min-height:57px;padding:9px 12px;border:0;background:#061726;color:#7696a5;text-align:left;cursor:pointer;display:grid;grid-template-columns:24px 1fr;align-items:center}.slcs255>nav button small{grid-row:1/3}.slcs255>nav button span{font-size:9px;letter-spacing:.16em}.slcs255>nav button b{font-size:8px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slcs255>nav button[data-active="true"]{background:color-mix(in srgb,var(--sl) 15%,#061726);color:#fff;box-shadow:inset 0 -2px var(--sl)}.slcs255>nav button[data-compared="true"] small{color:var(--sl)}.slcs255-flow{display:grid;grid-template-columns:1.1fr 1.35fr 1fr 1fr 1.2fr;padding:14px 16px;gap:7px}.slcs255-flow article{position:relative;min-height:108px;padding:13px;border:1px solid #ffffff12;background:#071827aa}.slcs255-flow article:not(:last-child):after{content:"›";position:absolute;right:-10px;top:41%;z-index:2;color:var(--sl);font-size:20px}.slcs255-flow strong{display:block;margin:12px 0 7px;font-size:10px;line-height:1.5;color:#e4f8ff;letter-spacing:.045em}.slcs255-flow p{margin:0;color:#668b9d;font-size:8px;line-height:1.45}.slcs255>footer{display:grid;grid-template-columns:1.1fr 1.5fr auto;align-items:center;gap:18px;padding:14px 19px;border-top:1px solid #ffffff12;background:#04121ed9}.slcs255>footer strong{display:block;margin-top:4px;color:var(--sl);font-size:13px;letter-spacing:.1em}.slcs255>footer span{display:block;margin-top:3px;color:#7596a5;font-size:8px}.slcs255>footer p{margin:0;color:#a9c3cf;font:italic 10px/1.5 Georgia,serif}.slcs255>footer button{height:37px;border:1px solid var(--sl);background:transparent;color:var(--sl);font-size:8px;letter-spacing:.14em;padding:0 14px}.slcs255>footer button:disabled{opacity:.32}.slcs255>footer output{grid-column:1/-1;color:#557989;font-size:7px;letter-spacing:.15em;text-align:right}
@media(max-width:900px){.slcs255{margin:8px 7px 14px}.slcs255>header{padding:15px 13px}.slcs255 h2{font-size:16px}.slcs255>header p{max-width:230px}.slcs255>nav{grid-template-columns:1fr 1fr}.slcs255>nav button{min-height:52px}.slcs255-flow{grid-template-columns:1fr;padding:10px}.slcs255-flow article{min-height:77px}.slcs255-flow article:not(:last-child):after{content:"↓";right:12px;top:auto;bottom:-15px}.slcs255-flow strong{margin:7px 0 4px}.slcs255>footer{grid-template-columns:1fr;padding:12px;gap:10px}.slcs255>footer button{width:100%}.slcs255>footer output{text-align:left}.slcs255>header aside{min-width:76px}.slcs255>header aside strong{font-size:20px}}
