.mode-select{border:2px solid var(--color-border-input);border-radius:var(--radius-md);cursor:pointer;background:var(--color-bg-input);color:var(--color-text);width:100%;padding:10px 12px;font-size:14px;transition:all .15s}.mode-select:focus{border-color:var(--color-primary);background:var(--color-bg-input-focus);outline:none}.mode-select:disabled{background:var(--color-bg-input-disabled);color:var(--color-button-disabled-text);border-color:var(--color-border-light);cursor:not-allowed;opacity:.9}.duration-input{border:2px solid var(--color-border-input);border-radius:var(--radius-md);text-align:center;background:var(--color-bg-input);width:100%;color:var(--color-text);padding:10px 12px;font-size:14px;font-weight:600}.duration-input:focus{border-color:var(--color-primary);background:var(--color-bg-input-focus);outline:none}.duration-input:disabled{background:var(--color-bg-input-disabled);color:var(--color-button-disabled-text);border-color:var(--color-border-light);cursor:not-allowed;opacity:.9}.volume-slider{appearance:none;cursor:pointer;background:0 0;border-radius:3px;outline:none;width:100%;height:6px;margin:8px 0}.volume-slider::-webkit-slider-runnable-track{background:var(--color-border-light);border-radius:3px;width:100%;height:6px}.volume-slider::-webkit-slider-thumb{appearance:none;background:var(--color-primary);cursor:pointer;border-radius:50%;width:18px;height:18px;margin-top:-6px;transition:all .15s}.volume-slider::-webkit-slider-thumb:hover{background:var(--color-primary-hover);transform:scale(1.1)}.volume-slider::-moz-range-track{background:var(--color-border-light);border:none;border-radius:3px;width:100%;height:6px}.volume-slider::-moz-range-thumb{background:var(--color-primary);cursor:pointer;border:none;border-radius:50%;width:18px;height:18px;transition:all .15s}.volume-slider::-moz-range-thumb:hover{background:var(--color-primary-hover);transform:scale(1.1)}.volume-slider:disabled{opacity:.5;cursor:not-allowed}.volume-slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.volume-slider:disabled::-moz-range-thumb{cursor:not-allowed}.spin-button-main{background:var(--color-button-primary-bg);width:100%;color:var(--color-button-primary-text);border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--shadow-button);border:none;padding:20px 32px;font-size:18px;font-weight:700;transition:all .15s}.spin-button-main:hover:not(:disabled){background:var(--color-button-primary-bg-hover);transform:translateY(-2px);box-shadow:0 6px 16px #4a7c6c59}.spin-button-main:active:not(:disabled){background:var(--color-button-primary-bg-active);transform:translateY(0)}.spin-button-main:disabled{background:var(--color-button-disabled-bg);color:var(--color-button-disabled-text);cursor:not-allowed;box-shadow:none}.display-color-input{border:2px solid var(--color-border-input);border-radius:var(--radius-md);cursor:pointer;background:var(--color-bg-input);width:100%;height:40px;padding:2px;transition:all .15s}.display-color-input::-webkit-color-swatch-wrapper{padding:0}.display-color-input::-webkit-color-swatch{border-radius:var(--radius-sm);border:none}.display-color-input::-moz-color-swatch{border-radius:var(--radius-sm);border:none}.display-color-input:hover{border-color:var(--color-primary)}.display-color-input:focus{border-color:var(--color-primary);outline:none}.display-color-input:disabled{cursor:not-allowed;opacity:.7}.paid-feature-tooltip-trigger{line-height:0;display:inline-block}.paid-feature-tooltip-content{max-width:280px;color:var(--color-text-inverse);background:var(--color-text,#1a202c);border-radius:var(--radius-md,8px);padding:10px 14px;font-size:13px;line-height:1.4;animation:.15s ease-out paid-feature-tooltip-show;box-shadow:0 4px 12px #00000026}@keyframes paid-feature-tooltip-show{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}.paid-feature-tooltip-arrow{fill:var(--color-text,#1a202c)}.color-picker{flex-shrink:0;align-self:center;position:relative}.color-picker-swatch{border:2px solid var(--color-border-input);border-radius:var(--radius-md);cursor:pointer;width:40px;height:40px;padding:0;transition:all .15s}.color-picker-swatch:hover:not(:disabled){border-color:var(--color-primary);transform:scale(1.05)}.color-picker-swatch:disabled{opacity:.6;cursor:not-allowed}.color-picker-popover{z-index:200;position:absolute;top:calc(100% + 6px);left:0}.items-list{flex-direction:column;gap:12px;min-height:240px;margin-bottom:20px;display:flex}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:200px;padding:40px 20px;display:flex}.empty-icon{opacity:.5;margin-bottom:16px;font-size:48px}.empty-title{color:var(--color-text);margin-bottom:8px;font-size:16px;font-weight:600}.empty-description{color:var(--color-text-muted);font-size:14px;line-height:1.5}.item-row{align-items:flex-start;gap:8px;transition:opacity .15s;display:flex}.item-row[draggable=true]{cursor:grab}.item-row[draggable=true]:active{cursor:grabbing}.item-row--dragging{opacity:0;pointer-events:none}.item-row--overlay{border-radius:var(--radius-md);cursor:grabbing}.drag-handle{color:var(--color-text-muted);cursor:grab;flex-shrink:0;align-self:center;align-items:center;padding:2px;display:flex}.item-row>.paid-feature-tooltip-trigger{flex-shrink:0;align-self:center;display:flex}.drag-handle--disabled{opacity:.3;cursor:not-allowed;pointer-events:none}.item-row--excluded>.drag-handle,.item-row--excluded>.paid-feature-tooltip-trigger>.drag-handle,.item-row--excluded>.item-menu>.item-menu-trigger,.item-row--excluded>.color-picker>.color-picker-swatch,.item-row--excluded>*>.item-name-input,.item-row--excluded>*>.item-weight-input,.item-row--excluded>.item-name-input,.item-row--excluded>.item-weight-input{opacity:.65}.item-row--excluded .item-name-input{text-decoration:line-through}.item-row--disabled{opacity:.75}.item-name-input{border:2px solid var(--color-border-input);border-radius:var(--radius-md);background:var(--color-bg-input);min-width:0;color:var(--color-text);resize:none;flex:1;min-height:2.4em;padding:10px 12px;font-size:14px;font-weight:500;line-height:1.4;transition:all .15s}.item-name-input[rows]{font-family:inherit}.item-name-input:focus{border-color:var(--color-primary);background:var(--color-bg-input-focus);outline:none}.item-name-input:disabled{background:var(--color-bg-input-disabled);color:var(--color-button-disabled-text);border-color:var(--color-border-light);cursor:not-allowed}.item-weight-input{border:2px solid var(--color-border-input);border-radius:var(--radius-md);text-align:center;background:var(--color-bg-input);width:90px;color:var(--color-text);flex-shrink:0;align-self:center;padding:10px 12px;font-size:14px;font-weight:600;transition:all .15s}.item-weight-input:focus{border-color:var(--color-primary);background:var(--color-bg-input-focus);outline:none}.item-weight-input:disabled{background:var(--color-bg-input-disabled);color:var(--color-button-disabled-text);border-color:var(--color-border-light);cursor:not-allowed}.item-menu{flex-shrink:0;align-self:center;position:relative}.item-menu-trigger{width:36px;height:36px;color:var(--color-text-muted);border-radius:var(--radius-md);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;transition:all .15s;display:flex}.item-menu-trigger:hover:not(:disabled){background:var(--color-button-secondary-bg);color:var(--color-text)}.item-menu-trigger:disabled{opacity:.4;cursor:not-allowed}.item-menu-dropdown{z-index:100;background:var(--color-bg-surface,#fff);border:1px solid var(--color-border-light);border-radius:var(--radius-md);min-width:120px;position:absolute;top:calc(100% + 4px);right:0;overflow:hidden;box-shadow:0 4px 12px #00000026}.item-menu-item{cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:10px 14px;font-size:13px;font-weight:500;transition:background .1s;display:flex}.item-menu-item--restore{color:var(--color-button-secondary-text)}.item-menu-item--restore:hover{background:var(--color-button-secondary-bg)}.item-menu-item--duplicate{color:var(--color-button-secondary-text)}.item-menu-item--duplicate:hover{background:var(--color-button-secondary-bg)}.item-menu-item--delete{color:var(--color-danger)}.item-menu-item--delete:hover{background:color-mix(in srgb, var(--color-danger) 10%, transparent)}.action-buttons{flex-wrap:wrap;gap:12px;display:flex}.action-button{border-radius:var(--radius-md);cursor:pointer;border:none;padding:10px 16px;font-size:14px;font-weight:600;transition:all .15s}.action-button.primary{background:var(--color-button-primary-bg);color:var(--color-button-primary-text)}.action-button.primary:hover{background:var(--color-button-primary-bg-hover)}.action-button.primary:active{background:var(--color-button-primary-bg-active)}.action-button.secondary{background:var(--color-button-secondary-bg);color:var(--color-button-secondary-text)}.action-button.secondary:hover:not(:disabled){background:var(--color-button-secondary-bg-hover)}.action-button:disabled{opacity:.5;cursor:not-allowed}.emoji-picker-overlay{z-index:1000;background:#1a202c66;justify-content:center;align-items:center;padding:20px;animation:.2s emojiFadeIn;display:flex;position:fixed;inset:0}@keyframes emojiFadeIn{0%{opacity:0}to{opacity:1}}.emoji-picker{background:var(--color-bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-overlay);border:2px solid var(--color-border-light);flex-direction:column;width:100%;max-width:440px;max-height:90vh;padding:24px;animation:.3s emojiSlideUp;display:flex}@keyframes emojiSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.emoji-picker-header{flex-shrink:0;justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.emoji-picker-header h3{color:var(--color-text);margin:0;font-size:20px;font-weight:700}.emoji-picker-close{color:var(--color-text-muted);cursor:pointer;border-radius:var(--radius-md);background:0 0;border:none;justify-content:center;align-items:center;width:40px;height:40px;padding:4px;font-size:32px;line-height:1;transition:all .15s;display:flex}.emoji-picker-close:hover{background:var(--color-primary-light);color:var(--color-primary)}.emoji-grid{flex:1;grid-template-columns:repeat(6,1fr);gap:10px;max-height:400px;padding:4px;display:grid;overflow:hidden auto}.emoji-grid::-webkit-scrollbar{width:8px}.emoji-grid::-webkit-scrollbar-track{background:var(--color-bg-input);border-radius:4px}.emoji-grid::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}.emoji-grid::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}.emoji-button{background:var(--color-bg-input);border-radius:var(--radius-md);aspect-ratio:1;cursor:pointer;border:2px solid #0000;justify-content:center;align-items:center;width:100%;padding:0;font-size:32px;transition:all .15s;display:flex}.emoji-button:hover{background:var(--color-primary-light);transform:scale(1.1)}.emoji-button.selected{border-color:var(--color-primary);background:var(--color-button-primary-bg)}.emoji-button:active{transform:scale(.9)}.confirm-modal-overlay{z-index:1000;background:#1a202c66;justify-content:center;align-items:center;animation:.2s ease-out confirmFadeIn;display:flex;position:fixed;inset:0}.confirm-modal{background:var(--color-bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-overlay);border:2px solid var(--color-border-light);width:90%;max-width:400px;animation:.2s ease-out confirmSlideUp}.confirm-modal-header{border-bottom:2px solid var(--color-border-light);padding:20px 24px}.confirm-modal-header h3{color:var(--color-text);margin:0;font-size:18px;font-weight:600}.confirm-modal-body{padding:24px}.confirm-modal-body p{color:var(--color-text-muted);margin:0;font-size:14px;line-height:1.5}.confirm-modal-footer{justify-content:flex-end;gap:12px;padding:16px 24px;display:flex}.confirm-button{border-radius:var(--radius-md);cursor:pointer;border:none;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s}.confirm-button.cancel{background:var(--color-button-secondary-bg);color:var(--color-button-secondary-text)}.confirm-button.cancel:hover{background:var(--color-button-secondary-bg-hover)}.confirm-button.confirm{background:var(--color-danger);color:var(--color-text-inverse)}.confirm-button.confirm:hover{background:var(--color-danger-hover)}@keyframes confirmFadeIn{0%{opacity:0}to{opacity:1}}@keyframes confirmSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.pattern-tabs{background:var(--color-bg-card);border-radius:var(--radius-md);box-shadow:var(--shadow-card-accent);border:2px solid var(--color-border-light);margin-bottom:20px;padding:16px}.tabs-container{scrollbar-width:thin;scrollbar-color:var(--color-border) var(--color-bg-input);gap:8px;display:flex;overflow-x:auto}.tabs-container::-webkit-scrollbar{height:6px}.tabs-container::-webkit-scrollbar-track{background:var(--color-bg-input);border-radius:3px}.tabs-container::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}.tabs-container::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}.tab{background:var(--color-bg-input);border-radius:var(--radius-md);cursor:pointer;border:2px solid #0000;align-items:center;gap:2px;padding:4px;transition:opacity .2s,background .2s;display:flex;position:relative}.tab-emoji{cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:8px;font-size:24px;line-height:1;transition:all .15s}.tab-emoji:hover{background:#0000000d;transform:scale(1.15)}.tab.active .tab-emoji:hover{background:#fff3}.tab-emoji:active{transform:scale(.9)}.tab:not(.active):hover{background:var(--color-primary-light);border-color:var(--color-primary-light)}.tab.tab-disabled{cursor:not-allowed;opacity:.7}.tab.tab-disabled:hover{background:var(--color-bg-input);border-color:#0000}.tab-close{color:var(--color-danger);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:4px 6px;font-size:16px;line-height:1;transition:all .15s}.tab.active .tab-close{color:var(--color-text-inverse);opacity:.9}.tab-close:hover,.tab.active .tab-close:hover{background:var(--color-danger);color:var(--color-text-inverse)}.tab-add{background:var(--color-bg-input);border-top-right-radius:var(--radius-md);border-top-left-radius:var(--radius-md);color:var(--color-primary);cursor:pointer;border:2px solid #0000;padding:12px 16px;font-size:20px;font-weight:600;transition:all .15s}.tab-add:hover:not(:disabled){background:var(--color-primary-light);border-color:var(--color-primary-light);color:var(--color-primary-hover)}.tab-add:active:not(:disabled){background:var(--color-button-secondary-bg-hover);transform:scale(.95)}.tab-add:disabled{opacity:.5;cursor:not-allowed;color:var(--color-button-disabled-text);border-color:#0000}.paid-key-modal-overlay{z-index:1000;background:#1a202c66;justify-content:center;align-items:center;animation:.2s ease-out confirmFadeIn;display:flex;position:fixed;inset:0}.paid-key-modal{background:var(--color-bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-overlay);border:2px solid var(--color-border-light);width:90%;max-width:420px;animation:.2s ease-out confirmSlideUp}.paid-key-modal-header{border-bottom:2px solid var(--color-border-light);padding:20px 24px}.paid-key-modal-header h3{color:var(--color-text);margin:0;font-size:18px;font-weight:600}.paid-key-description{color:var(--color-text-secondary,#64748b);margin:10px 0 0;font-size:13px;line-height:1.5}.paid-key-description a{color:#fc4d50;text-decoration:underline}.paid-key-description a:hover{color:#e84447;text-decoration:none}.paid-key-modal-body{padding:24px}.paid-key-label{color:var(--color-text);margin-bottom:8px;font-size:14px;font-weight:500;display:block}.paid-key-textarea{width:100%;min-height:80px;color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border,#e0e0e0);border-radius:var(--radius-md,6px);resize:vertical;box-sizing:border-box;padding:12px;font-family:ui-monospace,monospace;font-size:14px}.paid-key-textarea:focus{border-color:var(--color-primary,#6366f1);outline:none;box-shadow:0 0 0 2px #6366f133}.paid-key-textarea[aria-invalid=true]{border-color:var(--color-danger,#dc2626)}.paid-key-error{color:var(--color-danger,#dc2626);margin:8px 0 0;font-size:13px}.paid-key-modal-footer{justify-content:flex-end;gap:12px;padding:16px 24px;display:flex}.paid-key-btn{border-radius:var(--radius-md);cursor:pointer;border:none;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s}.paid-key-btn:disabled{opacity:.6;cursor:not-allowed}.paid-key-btn.cancel{background:var(--color-button-secondary-bg);color:var(--color-button-secondary-text)}.paid-key-btn.cancel:hover:not(:disabled){background:var(--color-button-secondary-bg-hover)}.paid-key-btn.submit{background:var(--color-primary,#6366f1);color:#fff}.paid-key-btn.submit:hover:not(:disabled){filter:brightness(1.1)}