@layer components{.save-design-modal{position:fixed;inset:0;z-index:var(--z-modal);display:none;align-items:center;justify-content:center;padding:1rem;box-sizing:border-box}.save-design-modal *{box-sizing:border-box}.save-design-modal.active{display:flex}.save-design-modal-overlay{position:absolute;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.save-design-modal-content{position:relative;background:var(--color-bg-base);border-radius:var(--radius-lg);max-width:800px;width:100%;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);border:1px solid var(--color-border);color:var(--color-text)}.save-design-modal-close{position:absolute;top:1rem;right:1rem;background:transparent;border:none;font-size:1.5rem;cursor:pointer;color:var(--color-text-muted);width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s;z-index:var(--z-local-overlay)}.save-design-modal-close:hover{background:var(--color-bg-alt);color:var(--color-text)}.save-design-modal-header{padding:1.5rem 1.2rem 1rem;border-bottom:1px solid var(--color-border)}.save-design-modal-header h2{font-size:1.75rem;margin:0 0 .25rem;color:var(--color-text);font-weight:700}.save-design-modal-header p{color:var(--color-text-light);margin:0;font-size:.95rem}.save-design-modal-body{padding:1.5rem 1.2rem;overflow-y:auto;flex:1}.save-design-form{display:flex;flex-direction:column;gap:1.25rem}.save-design-form-group{display:flex;flex-direction:column;gap:.5rem}.save-design-form-group label{font-size:.9rem;font-weight:600;color:var(--color-text)}.save-design-form-group input,.save-design-form-group textarea{width:100%;padding:.75rem;font-size:.9rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg-card);color:var(--color-text);font-family:inherit;transition:all .2s}.save-design-form-group input:focus,.save-design-form-group textarea:focus{outline:none;border-color:var(--color-primary);background:var(--color-bg-base)}.save-design-form-group textarea{min-height:100px;resize:vertical;line-height:1.6}.save-design-form-group small{font-size:.85rem;color:var(--color-text-muted);line-height:1.4}.save-design-modal-footer{padding:1rem 1.2rem;border-top:1px solid var(--color-border);display:flex;gap:.75rem;justify-content:flex-end}.save-design-btn{padding:.65rem 1.5rem;font-size:.9rem;font-weight:500;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s}.save-design-btn-cancel{background:var(--color-bg-alt);color:var(--color-text);border:1px solid var(--color-border)}.save-design-btn-cancel:hover{background:var(--color-bg-card);border-color:var(--color-text-muted)}.save-design-btn-save{background:var(--color-primary);color:#fff}.save-design-btn-save:hover{background:var(--color-primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}.save-design-btn-save:active{transform:translateY(0)}.save-design-btn-save:disabled{opacity:.5;cursor:not-allowed}@media(max-width:640px){.save-design-modal{align-items:flex-end;padding:0}.save-design-modal-content{width:100%;max-width:100%;max-height:90vh;border-radius:16px 16px 0 0}.save-design-modal-header{padding:1.5rem 1.25rem 1rem}.save-design-modal-header h2{font-size:1.5rem}.save-design-modal-body{padding:1.25rem}.save-design-modal-footer{padding:1rem 1.25rem;flex-direction:column-reverse}.save-design-btn{width:100%}}@media(max-width:480px){.save-design-modal-content{padding:0}.save-design-modal-header{padding:1.25rem 1rem .875rem}.save-design-modal-header h2{font-size:1.35rem}.save-design-modal-body{padding:1rem}.save-design-modal-footer{padding:.875rem 1rem}}}@layer components{.tags-input-container{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:.5rem;background:var(--color-bg-card);min-height:60px;transition:all .2s}.tags-input-container:focus-within{border-color:var(--color-primary);background:var(--color-bg-base);box-shadow:0 0 0 3px #6b8c5f1a}.tags-chips{display:flex;flex-wrap:wrap;gap:.375rem;margin-bottom:.5rem;min-height:24px}.tags-chips:empty{margin-bottom:0}.tag-chip{display:inline-flex;align-items:center;gap:.375rem;padding:.25rem .5rem .25rem .75rem;background:var(--color-primary);color:#fff;border-radius:16px;font-size:.8125rem;font-weight:500;animation:tagSlideIn .2s ease;-webkit-user-select:none;user-select:none}@keyframes tagSlideIn{0%{opacity:0;transform:scale(.8) translateY(-4px)}to{opacity:1;transform:scale(1) translateY(0)}}.tag-remove{display:flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;background:#fff3;border:none;border-radius:50%;color:#fff;font-size:16px;line-height:1;cursor:pointer;transition:all .2s}.tag-remove:hover{background:#ffffff59;transform:scale(1.1)}.tag-remove:active{transform:scale(.95)}.tags-text-input{width:100%;border:none!important;background:transparent!important;padding:.25rem 0!important;font-size:.9rem;outline:none;color:var(--color-text)}.tags-text-input::placeholder{color:var(--color-text-muted);opacity:.7}[data-theme=dark] .tags-input-container{background:var(--color-bg-tertiary, #2a2a2a);border-color:var(--color-border-dark, #444)}[data-theme=dark] .tags-input-container:focus-within{border-color:var(--color-primary);box-shadow:0 0 0 3px #6b8c5f26}[data-theme=dark] .tag-chip{background:var(--color-primary-dark, #5a7a4f)}}