html body .hh #build .steps-mode{min-height:560px}html body .hh #build .steps-mode .step.st-on{grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:18px 28px;align-items:start}.v4-ph{width:100%;aspect-ratio:4/3;height:auto;max-height:240px;background:#fff;border:1px solid var(--v4-line)}.v4-ph img{object-fit:contain}html body .hh #build .st-shop{grid-column:1/-1;border:0;border-top:1px solid var(--v4-line);padding:16px 0 0;margin:0}html body .hh #build .st-shop .s-need{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}html body .hh #build .st-shop .s-need h4{grid-column:1/-1;margin:0}html body .hh #build .st-shop .sp.v4-dup{display:none}html body .hh #build .st-shop .sp{display:grid;grid-template-columns:72px minmax(0,1fr);grid-template-areas:"i n" "i n" "p b";gap:6px 12px;align-items:start;padding:12px;border:1px solid var(--v4-line);border-radius:12px;background:#fff;min-width:0}html body .hh #build .st-shop .sp .lth{width:72px;height:72px}html body .hh #build .st-shop .sp .spn{display:flex;flex-direction:column;gap:3px;align-items:flex-start}html body .hh #build .st-shop .sp .lnk{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:700 14px/1.25 var(--fb)}html body .hh #build .st-shop .sp .tier{order:-1;font:700 10px/1 var(--fb);letter-spacing:.05em;text-transform:uppercase;padding:3px 7px;border-radius:5px;background:#fff1e0;color:var(--v4-or2)}html body .hh #build .st-shop .sp .tier:is([data-t=basic]){display:none}.v4-why{margin:0;font:400 12px/1.4 var(--fb);color:#34506a;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}html body .hh #build .st-shop .sp .pr{grid-area:p;align-self:center;text-align:left;font:800 15px/1 var(--fb)}html body .hh #build .st-shop .sp .btn.add{grid-area:b;justify-self:end;align-self:center}html body .hh #build .st-shop .sp[data-v4opt] .btn.add{display:none}html body .hh #build .st-shop .sp[data-v4opt] .qvb{display:inline-flex;grid-area:b;justify-self:end;align-self:center;align-items:center;min-height:28px;padding:0 12px;border-radius:999px;border:1.5px solid var(--v4-or);background:#fff;color:var(--v4-or2);font:700 12px/1 var(--fb);width:auto;height:auto}html body .hh #build .st-shop .sp[data-v4opt] .qvb svg{display:none}html body .hh #build .st-shop .sp[data-v4opt] .qvb:after{content:"Options"}.v4-note{margin:2px 0 0;font:400 14px/1.5 var(--fb);color:var(--v4-ink)}html body .hh #build .st-info .step-hd h3{font-size:24px}.v4-card[hidden]{display:none!important}html body .hh #build .steps-mode .step.v4-np.st-on{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:18px 32px;align-items:start}html body .hh #build .steps-mode .step.v4-np .st-shop{grid-column:2;grid-row:1;border:0;padding:0;margin:0}html body .hh #build .steps-mode .step.v4-np .s-tip{display:none}html body .hh #build .v4-help{background:#f3f8fc;border:1px solid var(--v4-line);border-radius:14px;padding:20px 22px;display:flex;flex-direction:column;gap:14px}html body .hh #build .v4-help h4{margin:0;font:800 18px/1.2 var(--fb);color:var(--v4-ink)}html body .hh #build .v4-key{background:#fff;border:1px solid var(--v4-line);border-left:4px solid var(--v4-or);border-radius:10px;padding:12px 14px}html body .hh #build .v4-kk{display:block;font:700 11px/1 var(--fb);letter-spacing:.06em;text-transform:uppercase;color:var(--v4-or2);margin:0 0 8px}html body .hh #build .v4-key p{margin:0;display:flex;gap:10px;align-items:flex-start;font:600 14px/1.45 var(--fb);color:var(--v4-ink)}html body .hh #build .v4-ck{flex:0 0 20px;width:20px;height:20px;border-radius:50%;background:var(--v4-or);color:#fff;display:inline-flex;align-items:center;justify-content:center;margin-top:1px}html body .hh #build .v4-ck svg{width:12px;height:12px}html body .hh #build .v4-hs{margin:0;font:400 13px/1.5 var(--fb);color:#34506a}html body .hh #build .v4-ha{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}html body .hh #build .v4-hl{font:700 14px/1.2 var(--fb);color:var(--v4-or2);text-decoration:underline;text-underline-offset:3px}@media(max-width:1000px){html body .hh #build .st-shop .s-need{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){html body .hh #build .steps-mode .step.v4-np.st-on{grid-template-columns:1fr}html body .hh #build .steps-mode .step.v4-np .st-shop{grid-column:1;grid-row:auto}}@media(max-width:640px){html body .hh #build .steps-mode{min-height:0}html body .hh #build .steps-mode .step.st-on,html body .hh #build .st-shop .s-need{grid-template-columns:1fr}.v4-ph{max-height:200px}}html body .hh #build[data-v4all] .st-bar:not(.v4-allbar),html body .hh #build[data-v4all] .st-nav:not(.v4-allnav){display:none}
/*# sourceMappingURL=/cdn/shop/t/21/assets/hh-v4-step.css.map */
