.modal.design-modal{max-width:1050px;padding:30px}.design-title h2{font-size:35px}.designer{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;margin-top:20px}.design-stage{background:#edf1e8;border-radius:12px;padding:20px;align-self:start;position:sticky;top:0}#design-views{display:flex;gap:12px}.design-face{flex:1;min-width:0;border:1px solid transparent;border-radius:12px;padding:8px;text-align:center}.design-face.selected{border-color:#8caa8d}.design-face>span{font-size:12px;font-weight:bold}.design-face canvas{display:block;width:100%;height:auto;touch-action:none;cursor:grab}.design-face button{background:white;border:1px solid #bfd0bb;border-radius:5px;padding:8px;font-size:11px;color:#345543}.design-legend{font-size:11px;color:#576e59;display:grid;gap:8px;margin-top:16px}.design-controls{padding-bottom:10px}.design-controls>label:first-child{margin-top:0}.design-controls input[type=range]{width:100%;accent-color:#164e41}.design-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}.design-fields label{grid-row:1;margin-top:0}.design-upload{padding:18px 12px;text-align:center;border:1px dashed #83a18a;background:#edf3e9;border-radius:7px;cursor:pointer;font-weight:bold}.design-upload input{display:block;max-width:100%;font-size:11px;margin-top:12px}.face-tabs{display:flex;gap:10px;margin-top:18px}.face-tabs[hidden],#copy-front[hidden]{display:none}.face-tabs button{flex:1;padding:11px;background:#eee;border:0;border-radius:5px;color:#385346}.face-tabs button.active{background:#164e41;color:white}.design-link{border:0;background:none;text-decoration:underline;color:#356d4d;font-size:12px;padding:4px 0}.design-actions{display:flex;gap:8px;align-items:center;margin-top:15px;flex-wrap:wrap}.design-actions button{border:1px solid #b8c9b8;background:white;border-radius:5px;padding:10px;font-size:11px}.design-actions label{display:flex;align-items:center;gap:7px;margin:0;font-size:11px}.design-actions input{width:35px;height:33px;padding:0;border:0}.design-controls .primary{width:100%}#design-error:empty{display:none}#design-error{padding:12px;background:#fff0df;color:#97502f;font-size:12px;line-height:1.5;border-radius:6px;margin-bottom:15px}.cart-art{display:flex;align-items:start;gap:15px;margin:10px 0}.cart-art img{width:80px;border-radius:6px}.cart-art-actions{display:flex;gap:10px;flex-wrap:wrap}.cartrow .cart-art-actions button{float:none;border:1px solid #bdccbc;color:#164e41;padding:7px;border-radius:4px;font-size:11px}.cartrow .hint{clear:both}.modal:not(.design-modal) .design-title{display:none}@media(max-width:700px){.modal.design-modal{padding:20px}.designer{grid-template-columns:1fr;gap:20px}.design-stage{position:static;padding:12px}.design-face canvas{max-height:300px;width:100%;object-fit:contain}.design-title h2{font-size:28px}.design-fields{grid-template-columns:1fr 1fr}.design-stage .hint{font-size:10px}}
.fit-options{display:flex;gap:8px;margin-top:20px}.fit-options button{flex:1;border:1px solid #9ab39d;padding:12px 8px;border-radius:6px;background:white;color:#164e41;font-size:12px}.fit-options button.active{background:#164e41;color:white}.zoom-controls{display:flex;align-items:center;gap:12px}.zoom-controls button{flex-shrink:0;width:37px;height:37px;border:1px solid #a4bca7;border-radius:50%;background:white;color:#164e41;font-size:23px}.zoom-controls input{min-width:0}
.size-guide-section{margin-top:55px;padding:32px;background:#edf1e8;border-radius:12px}.size-guide-section h2{font-size:34px}.size-guide-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.design-size-help{padding:12px 0}.design-size-help summary{font-size:12px;color:#164e41;text-decoration:underline}.design-size-help svg{min-width:600px!important}.design-measure{font-size:12px;font-weight:bold;color:#164e41;margin:0 0 12px}.design-size-help .hint{font-size:11px}@media(max-width:700px){.size-guide-section{padding:20px}.size-guide-section h2{font-size:28px}}
.class-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:12px}.class-card{display:grid;justify-items:center;gap:9px;padding:20px 12px;background:#fff;border:1px solid #d9ded2;border-radius:10px;color:#375946;font-size:13px}.class-card span{font-size:25px}.class-card.active{background:#164e41;color:white;border-color:#164e41}.catalog-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:12px;color:#718171;margin:20px 0}.catalog-breadcrumb button{background:none;border:0;color:#42694d;font-size:12px;text-decoration:underline;padding:3px}.nav-label{font-size:10px;font-weight:bold;letter-spacing:1.5px;margin:20px 0 12px;color:#71816e}.subclass-list,.member-list{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:23px}.subclass-list button,.member-list button{background:white;border:1px solid #c9d5c6;border-radius:7px;color:#3d634a;padding:12px 18px;font-size:13px}.subclass-list button.active{background:#e0eadb;border-color:#628766}.member-list button{border-radius:30px}.member-list button.active{background:#164e41;color:white;border-color:#164e41}@media(max-width:600px){.class-list{grid-template-columns:repeat(3,1fr);gap:8px}.class-card{padding:15px 7px;font-size:12px}}

.design-stage.design-stage-inline { position: static; }
#design-adjust-preview:not(:empty) {
  margin-top: .75rem;
  padding: .875rem;
  background: #fff;
  border: 1px solid #bfd0bb;
  border-radius: .625rem;
}
#design-adjust-title { margin: 0 0 .5rem; font-size: 1rem; }
#design-adjust-preview .hint { margin: 0 0 .75rem; }
#design-adjust-preview input[type="range"] { min-width: 0; width: 100%; }

#design-enlarge { margin:.5rem 0; }
.design-expanded { width:min(58rem,96vw); max-height:92dvh; padding:clamp(.75rem,3vw,1.5rem); border:1px solid #bfd0bb; border-radius:1rem; color:#18231f; }
.design-expanded::backdrop { background:#101b17bd; }
.design-expanded-heading { display:flex; justify-content:space-between; align-items:center; gap:.75rem; }
.design-expanded-pieces { display:flex; justify-content:center; gap:clamp(.5rem,2vw,1rem); margin-top:1rem; }
.design-expanded-pieces figure { flex:0 1 28rem; min-width:0; margin:0; text-align:center; }
.design-expanded-pieces canvas { display:block; width:100%; height:auto; max-height:68dvh; object-fit:contain; border-radius:.625rem; }
.design-expanded-pieces figcaption { margin-top:.5rem; font-weight:650; }