/**
 * @license
 * SPDX-License-Identifier: Apache-2.0
 */:root{--bg-color: #f0f0f0;--panel-bg-color: #ffffff;--panel-alt-bg-color: #f9f9f9;--text-color: #333;--text-color-light: #666;--border-color: #cccccc;--border-color-heavy: #e0e0e0;--button-bg-color: #f8f8f8;--button-hover-bg-color: #e0e0e0;--primary-color: #4285f4;--primary-hover-color: #357ae8;--primary-text-color: white;--active-button-bg: #e4eefe;--active-button-text: #4285f4;--canvas-bg: #ffffff;--shadow-color: rgba(0, 0, 0, .1);--loader-bg: #f3f3f3;--style-drop-bg: #eef;--error-color: #e53935;--success-color: #43a047;--vip-color: #8e24aa;--pro-color: #fb8c00;--warning-color: #f9a825}body.dark-mode{--bg-color: #121212;--panel-bg-color: #1e1e1e;--panel-alt-bg-color: #242424;--text-color: #e0e0e0;--text-color-light: #999;--border-color: #444;--border-color-heavy: #333;--button-bg-color: #333;--button-hover-bg-color: #444;--primary-color: #4285f4;--primary-hover-color: #5a9bff;--primary-text-color: white;--active-button-bg: #3a5b99;--active-button-text: #bbdefb;--canvas-bg: #303030;--shadow-color: rgba(0, 0, 0, .5);--loader-bg: #444;--style-drop-bg: #2a2a3a;--error-color: #ff5252;--success-color: #69f0ae;--vip-color: #ab47bc;--pro-color: #ffa726;--warning-color: #ffca28}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;background-color:var(--bg-color);color:var(--text-color);transition:background-color .3s,color .3s;display:flex;flex-direction:column}#verification-banner{display:flex;justify-content:center;align-items:center;gap:1rem;padding:.75rem 1rem;background-color:var(--warning-color);color:#111;font-weight:500;text-align:center;flex-shrink:0}#verify-now-btn{padding:.4rem .8rem;border-radius:6px;border:1px solid #111;background-color:transparent;color:#111;font-weight:700;cursor:pointer;transition:all .2s}#verify-now-btn:hover{background-color:#0000001a}#app-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background-color:var(--panel-bg-color);border-bottom:1px solid var(--border-color);box-shadow:0 2px 5px var(--shadow-color);z-index:20;flex-shrink:0}#app-header h1{margin:0;font-size:1.25rem}.header-right{display:flex;align-items:center;gap:1rem}.container{display:flex;flex-grow:1;min-height:0}.panel{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.drawing-panel{background-color:var(--panel-bg-color);display:flex;flex-direction:column;padding:1rem;box-sizing:border-box}.ai-panel{border-left:2px solid var(--border-color-heavy);background-color:var(--panel-alt-bg-color);box-sizing:border-box;display:flex;flex-direction:column;align-items:center;text-align:center;padding:1rem}.ai-panel h2{margin:0 0 1rem;color:var(--text-color)}#ai-result-container{flex-grow:1;width:100%;position:relative;border:2px dashed var(--border-color);border-radius:8px;background-color:var(--panel-bg-color);overflow:hidden;cursor:grab}#ai-result-image{border-radius:6px;transform-origin:0 0}#ai-placeholder{color:var(--text-color-light);padding:1rem}.toolbar{display:flex;flex-direction:column;gap:.75rem;padding:.75rem 1rem;background-color:var(--panel-bg-color);border-bottom:1px solid var(--border-color);box-shadow:0 2px 5px var(--shadow-color);z-index:10}.toolbar-row{display:flex;flex-wrap:wrap;align-items:center;gap:1rem}.toolbar label{font-weight:500;color:var(--text-color)}.toolbar select{padding:.4rem .5rem;border:1px solid var(--border-color);border-radius:6px;background-color:var(--button-bg-color);color:var(--text-color);cursor:pointer;font-size:.9rem;font-family:inherit}.toolbar select:hover{background-color:var(--button-hover-bg-color)}#color-picker{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:40px;height:40px;background-color:transparent;border:none;cursor:pointer}#color-picker::-webkit-color-swatch{border-radius:50%;border:2px solid var(--border-color)}#color-picker::-moz-color-swatch{border-radius:50%;border:2px solid var(--border-color)}#brush-size{cursor:pointer;width:120px}.tool-buttons{display:flex;border:1px solid var(--border-color);border-radius:6px;overflow:hidden}.tool-button{padding:.5rem 1rem;border:none;background-color:var(--button-bg-color);color:var(--text-color);cursor:pointer;font-size:.9rem;transition:background-color .2s;border-right:1px solid var(--border-color)}.tool-button:last-child{border-right:none}.tool-button:hover{background-color:var(--button-hover-bg-color)}.tool-button.active{background-color:var(--active-button-bg);color:var(--active-button-text);font-weight:700}#clear-canvas-button,#clear-all-button,#redraw-button,#upload-style-button,#upload-theme-button,#save-button,#logout-button,#change-password-button,.upgrade-btn{padding:.5rem 1rem;border:1px solid var(--border-color);border-radius:6px;background-color:var(--button-bg-color);color:var(--text-color);cursor:pointer;font-size:.9rem;transition:background-color .2s}#clear-canvas-button:hover,#clear-all-button:hover,#redraw-button:hover,#upload-style-button:hover,#upload-theme-button:hover,#save-button:hover,#logout-button:hover,#change-password-button:hover,.upgrade-btn:hover{background-color:var(--button-hover-bg-color)}#redraw-button,#save-button{background-color:var(--primary-color);color:var(--primary-text-color);border-color:var(--primary-color)}#redraw-button{position:relative;flex:1}#redraw-button:hover,#save-button:hover{background-color:var(--primary-hover-color)}.upgrade-btn{background-color:var(--success-color);color:var(--primary-text-color);border-color:var(--success-color);font-weight:500}body.dark-mode .upgrade-btn:hover{background-color:#57bb8a}body:not(.dark-mode) .upgrade-btn:hover{background-color:#388e3c}#save-button{margin-top:1rem}#user-info{display:flex;align-items:center;gap:.75rem;font-size:.9rem}.plan-badge{padding:.2em .6em;border-radius:10px;font-size:.8rem;font-weight:700;text-transform:uppercase;color:#fff}.plan-badge.plan-free{background-color:var(--text-color-light)}.plan-badge.plan-vip{background-color:var(--vip-color)}.plan-badge.plan-pro{background-color:var(--pro-color)}.plan-badge.plan-admin{background-color:var(--error-color)}#theme-toggle{border-radius:6px;width:44px;height:38px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid var(--border-color)}#theme-toggle:before{content:"☀️";font-size:20px}body.dark-mode #theme-toggle:before{content:"🌙"}.help-button{width:44px;height:38px;font-size:1.2rem;font-weight:700;border-right:0!important;border-radius:6px}#style-container{padding:.5rem 1rem;border-bottom:1px solid var(--border-color);background-color:var(--panel-alt-bg-color)}.style-top-row{display:flex;gap:1rem;align-items:stretch;margin-bottom:1rem}.description-area{flex:1;display:flex;flex-direction:column}.description-area label{margin-bottom:.25rem;font-weight:500;color:var(--text-color)}.description-area textarea{width:100%;flex-grow:1;padding:.5rem;border:1px solid var(--border-color);border-radius:6px;background-color:var(--bg-color);color:var(--text-color);font-family:inherit;font-size:.9rem;resize:vertical;box-sizing:border-box}.description-area textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px var(--active-button-bg)}#style-input-area,#theme-input-area{display:flex;flex-direction:column;justify-content:center;align-items:center;border:2px dashed var(--border-color);border-radius:8px;padding:1rem;text-align:center;color:var(--text-color-light);cursor:pointer;transition:background-color .2s,border-color .2s;box-sizing:border-box;height:100%}#style-input-area{flex:0 0 200px}#theme-input-area{width:100%}#style-input-area:hover,#style-input-area.drag-over,#theme-input-area:hover,#theme-input-area.drag-over{background-color:var(--style-drop-bg);border-color:var(--primary-color)}#style-input-area p,#theme-input-area p{margin:0 0 .5rem}#theme-container{flex:0 0 180px;height:90px;min-height:0;align-self:flex-start}#theme-preview{width:100%;height:100%}#style-previews{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem;min-height:10px}.style-preview-item{position:relative;width:80px;height:80px}.style-preview-item img{width:100%;height:100%;object-fit:cover;border-radius:4px;border:1px solid var(--border-color)}#theme-preview .style-preview-item img{object-fit:contain;background-color:var(--bg-color)}.remove-style-btn{position:absolute;top:-5px;right:-5px;width:20px;height:20px;background-color:#000000b3;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-weight:700;line-height:1;padding:0;transition:background-color .2s;z-index:2}.remove-style-btn:hover{background-color:#f00c}.canvas-wrapper{position:relative;min-height:0;background-color:var(--canvas-bg);width:100%;margin:auto;box-shadow:0 4px 15px var(--shadow-color);border-radius:8px;overflow:hidden;flex-grow:1}#drawing-canvas{display:block;cursor:crosshair;width:100%;height:100%}#canvas-placeholder{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:2.5rem;font-weight:600;color:var(--text-color-light);opacity:.6;pointer-events:none;-webkit-user-select:none;user-select:none;text-align:center}.loader{border:5px solid var(--loader-bg);border-top:5px solid var(--primary-color);border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite}#loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.point-cost-badge{position:absolute;top:-8px;right:-8px;background-color:var(--error-color);color:#fff;border-radius:50%;width:24px;height:24px;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px #0000004d;z-index:1;border:1px solid var(--panel-bg-color)}.style-preview-item .point-cost-badge{top:auto;bottom:-8px}@media(max-width:768px){#main-app{flex-direction:column}.panel{height:50vh}.ai-panel{border-left:none;border-top:2px solid var(--border-color-heavy)}}#login-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:none;align-items:center;justify-content:center;z-index:1000;opacity:0;transition:opacity .3s ease-in-out}#login-overlay.visible{display:flex;opacity:1}#login-modal{background:var(--panel-bg-color);padding:2rem;border-radius:12px;box-shadow:0 5px 20px var(--shadow-color);width:90%;max-width:400px;text-align:center;transform:scale(.95);transition:transform .3s ease-in-out}#login-overlay.visible #login-modal{transform:scale(1)}#login-modal .auth-header{display:flex;margin-bottom:1.5rem;border-bottom:1px solid var(--border-color)}#login-modal .auth-tab-button{flex:1;padding:.75rem 1rem;border:none;background-color:transparent;color:var(--text-color-light);cursor:pointer;font-size:1rem;font-weight:500;transition:all .2s;border-bottom:3px solid transparent}#login-modal .auth-tab-button:hover{color:var(--text-color)}#login-modal .auth-tab-button.active{color:var(--primary-color);border-bottom-color:var(--primary-color)}#login-modal h2{margin-top:0;margin-bottom:.5rem;color:var(--text-color)}#login-modal p{margin-top:0;margin-bottom:1.5rem;color:var(--text-color-light)}.auth-form .form-group{margin-bottom:1rem;text-align:left}.auth-form label{display:block;margin-bottom:.5rem;font-weight:500;color:var(--text-color)}.auth-form input{width:100%;padding:.75rem;border:1px solid var(--border-color);border-radius:6px;background-color:var(--bg-color);color:var(--text-color);font-size:1rem;box-sizing:border-box}.auth-form input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px var(--active-button-bg)}.forgot-password-link{display:block;text-align:right;font-size:.85rem;margin-top:.5rem;color:var(--primary-color);text-decoration:none}.forgot-password-link:hover{text-decoration:underline}#login-submit-button,#signup-submit-button{width:100%;padding:.75rem 1rem;border:none;border-radius:6px;background-color:var(--primary-color);color:var(--primary-text-color);cursor:pointer;font-size:1rem;font-weight:700;transition:background-color .2s;position:relative}#login-submit-button:hover,#signup-submit-button:hover{background-color:var(--primary-hover-color)}#login-submit-button:disabled,#signup-submit-button:disabled{background-color:var(--text-color-light);cursor:not-allowed}.status-message{margin-top:1rem;min-height:1.2em;font-weight:500}.status-message.error{color:var(--error-color)}.status-message.success{color:var(--success-color)}#incognito-block-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:2000}#incognito-modal{background:var(--panel-bg-color);padding:2.5rem;border-radius:12px;box-shadow:0 5px 20px var(--shadow-color);width:90%;max-width:450px;text-align:center}#incognito-modal h2{margin-top:0;margin-bottom:1rem;color:var(--text-color)}#incognito-modal p{margin:0;color:var(--text-color-light);line-height:1.6}.admin-container{flex-direction:column;padding:0;background-color:var(--bg-color)}.admin-app-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background-color:var(--panel-bg-color);border-bottom:1px solid var(--border-color);box-shadow:0 2px 5px var(--shadow-color)}.admin-app-header h1{margin:0;font-size:1.5rem}.user-management{padding:2rem;overflow-y:auto;flex-grow:1}.user-management-header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem;margin-bottom:1.5rem}.user-management-controls{display:flex;flex-direction:column;gap:1rem;flex-grow:1}.user-management-controls h2{margin:0}.filter-controls{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}.filter-controls input,.filter-controls select{padding:.6rem .8rem;border-radius:6px;border:1px solid var(--border-color);background-color:var(--panel-bg-color);color:var(--text-color);font-size:.9rem}.filter-controls input:focus,.filter-controls select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px var(--active-button-bg)}#user-search-input{min-width:200px}.add-user-btn{padding:.6rem 1.2rem;border-radius:6px;border:none;background-color:var(--primary-color);color:var(--primary-text-color);font-weight:700;cursor:pointer;transition:background-color .2s;height:fit-content}.add-user-btn:hover{background-color:var(--primary-hover-color)}.error-message{padding:1rem;background-color:var(--error-color);color:var(--primary-text-color);border-radius:6px;margin-bottom:1rem}.table-container{overflow-x:auto;background:var(--panel-bg-color);border-radius:8px;border:1px solid var(--border-color);box-shadow:0 1px 3px var(--shadow-color)}.user-table{width:100%;border-collapse:collapse}.user-table th,.user-table td{padding:1rem;text-align:left;border-bottom:1px solid var(--border-color);vertical-align:middle}.user-table th{background-color:var(--panel-alt-bg-color);font-weight:600}.user-table tr:last-child td{border-bottom:none}.user-table tr:hover{background-color:var(--panel-alt-bg-color)}.user-table tr.deleting{transition:opacity .4s ease-out;opacity:0}.status-badge{padding:.25rem .6rem;border-radius:12px;font-size:.8rem;font-weight:500;text-transform:uppercase}.status-badge.status-enabled{background-color:var(--success-color);color:var(--primary-text-color)}.status-badge.status-disabled{background-color:var(--text-color-light);color:var(--bg-color)}.status-badge.status-verify{background-color:var(--warning-color);color:#111}.plan-select{width:100%;padding:.5rem;border:1px solid var(--border-color);border-radius:6px;background-color:var(--button-bg-color);color:var(--text-color);cursor:pointer;font-size:.9rem;font-family:inherit;transition:border-color .2s,box-shadow .2s}.plan-select:hover{border-color:var(--text-color-light)}.plan-select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px var(--active-button-bg)}.plan-select:disabled{cursor:not-allowed;opacity:.6;background-color:var(--button-hover-bg-color)}.action-buttons{display:flex;flex-wrap:wrap;gap:.5rem}.action-buttons button{position:relative;padding:.4rem .8rem;font-size:.85rem;border-radius:4px;border:1px solid var(--border-color);cursor:pointer;background-color:var(--button-bg-color);color:var(--text-color);transition:all .2s;min-width:120px;display:flex;align-items:center;justify-content:center}.action-buttons button:hover{background-color:var(--button-hover-bg-color);border-color:var(--text-color-light)}.action-buttons button:disabled{cursor:wait;opacity:.7}.button-spinner{position:absolute;top:50%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border:2px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin .8s linear infinite;display:none}.action-buttons button .button-text{transition:opacity .2s}.action-buttons button.processing .button-text{opacity:0}.action-buttons button.processing .button-spinner{display:block}.action-buttons .toggle-btn.status-disable:hover{background-color:#f44336;color:#fff;border-color:#f44336}.action-buttons .toggle-btn.status-enable:hover,.action-buttons .toggle-btn.status-approve:hover{background-color:var(--success-color);color:#fff;border-color:var(--success-color)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:1000;overflow-y:auto;padding:1rem 0}.modal-content{position:relative;background:var(--panel-bg-color);padding:2rem;border-radius:12px;box-shadow:0 5px 20px var(--shadow-color);width:90%;max-width:400px}.modal-content h3{margin-top:0;margin-bottom:.5rem}#upgrade-modal-content h3,#verification-modal-overlay h3,#forgot-password-modal-overlay h3{text-align:center}#upgrade-modal-content>p,#verification-modal-overlay>.modal-content>p,#forgot-password-modal-overlay>.modal-content>p{text-align:center;margin-bottom:1rem;color:var(--text-color-light)}.modal-close-btn{position:absolute;top:10px;right:15px;font-size:1.8rem;font-weight:300;background:none;border:none;color:var(--text-color-light);cursor:pointer;line-height:1}.modal-close-btn:hover{color:var(--text-color)}.modal-content .form-group{margin-bottom:1rem;text-align:left}.modal-content .form-group label{display:block;margin-bottom:.5rem;font-weight:500}.modal-content .form-group input{width:100%;padding:.75rem;border:1px solid var(--border-color);border-radius:6px;background-color:var(--bg-color);color:var(--text-color);font-size:1rem;box-sizing:border-box}.modal-actions{margin-top:1.5rem;display:flex;justify-content:flex-end;gap:.75rem}.btn-secondary{padding:.6rem 1.2rem;background:transparent;border:1px solid var(--border-color);color:var(--text-color)}.btn-primary{padding:.6rem 1.2rem;background:var(--primary-color);border:1px solid var(--primary-color);color:var(--primary-text-color)}.btn-secondary,.btn-primary{border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:var(--button-hover-bg-color)}.btn-primary:hover{background:var(--primary-hover-color)}#verification-modal-overlay .modal-content,#forgot-password-modal-overlay .modal-content{max-width:500px}.verification-tabs{display:flex;margin-bottom:1.5rem;border-bottom:1px solid var(--border-color)}.verify-tab-button{flex:1;padding:.75rem 1rem;border:none;background-color:transparent;color:var(--text-color-light);cursor:pointer;font-size:.9rem;font-weight:500;transition:all .2s;border-bottom:3px solid transparent}.verify-tab-button:hover{color:var(--text-color)}.verify-tab-button.active{color:var(--primary-color);border-bottom-color:var(--primary-color)}.verification-content{display:none;padding:1.5rem;border:1px solid var(--border-color);border-radius:8px;background-color:var(--panel-alt-bg-color)}.verification-content.active{display:block}.verification-content h4{margin-top:0;margin-bottom:1rem}.verification-content p{margin:0 0 1rem;color:var(--text-color-light);line-height:1.5;text-align:left}.verification-content .note{font-size:.8rem;margin-top:1rem;margin-bottom:0}.sms-content{background-color:var(--bg-color);padding:.75rem 1rem;border-radius:6px;font-family:Courier New,Courier,monospace;font-weight:700;color:var(--text-color);border:1px solid var(--border-color)}#upgrade-modal-content{max-width:800px;transition:max-width .4s ease-in-out}#upgrade-modal-content.qr-view-active{max-width:350px}.plan-options{display:flex;gap:1.5rem}.plan-card{flex:1;border:1px solid var(--border-color);border-radius:8px;padding:1.5rem;text-align:center;transition:all .2s;display:flex;flex-direction:column;position:relative;overflow:hidden}.plan-card:hover{box-shadow:0 4px 15px var(--shadow-color);transform:translateY(-5px)}.plan-card.plan-pro{border-color:var(--pro-color)}.plan-card h4{margin:0 0 .5rem;font-size:1.2rem}.plan-card-ribbon{position:absolute;top:18px;right:-30px;width:120px;padding:6px 0;background-color:var(--warning-color);color:#111;transform:rotate(45deg);text-align:center;font-size:.8rem;font-weight:700;box-shadow:0 2px 5px #0003;z-index:1}.plan-price{font-weight:700;margin:.75rem 0 .5rem;line-height:1.1;display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:.25rem;min-height:2.2rem}.plan-price span{font-size:1rem;font-weight:400;color:var(--text-color-light)}.plan-features{list-style:none;padding:0;margin:0 0 1.5rem;text-align:left}.plan-features li{margin-bottom:.5rem;padding-left:1.5rem;position:relative}.plan-features li:before{content:"✓";color:var(--success-color);position:absolute;left:0}.plan-card .btn-primary{width:100%;margin-top:auto}.plan-card.plan-pro .btn-primary{background-color:var(--pro-color);border-color:var(--pro-color)}.plan-card.plan-pro .btn-primary:hover{background-color:var(--primary-hover-color);border-color:var(--primary-hover-color)}#sale-countdown-timer{text-align:center;font-size:1rem;font-weight:500;padding:.75rem;margin-bottom:1.5rem;background-color:var(--panel-alt-bg-color);border-radius:8px;border:1px solid var(--border-color)}#countdown-display{font-weight:700;color:var(--error-color);font-size:1.1rem}.upgrade-btn .hot-sale-badge{display:none;margin-left:8px;padding:2px 6px;background-color:var(--error-color);color:#fff;border-radius:4px;font-size:.8em;font-weight:700;animation:pulse 1.5s infinite;vertical-align:middle}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.plan-card-sale-ribbon{position:absolute;top:18px;right:-30px;width:120px;padding:6px 0;background-color:var(--error-color);color:#fff;transform:rotate(45deg);text-align:center;font-size:.8rem;font-weight:700;box-shadow:0 2px 5px #0003;z-index:2}.plan-price .original-price{display:none;text-decoration:line-through;color:var(--text-color-light);font-size:1.2rem;font-weight:400}.plan-price .sale-price{font-size:2rem;font-weight:700;color:var(--text-color)}.info-texts-wrapper{margin-bottom:1rem;min-height:2.6em;display:flex;flex-direction:column;gap:.25rem;align-items:center}.info-text{font-size:.9rem;font-weight:700;min-height:1.2em;display:none}.sale-percentage-info{color:var(--success-color)}.sale-savings-info,.savings-info{color:var(--primary-color)}#qr-code-display{text-align:center}#qr-code-display h4{margin-top:0;margin-bottom:1rem;font-size:1.2rem}#qr-code-image{display:block;max-width:280px;width:100%;margin:0 auto 1.5rem;border:1px solid var(--border-color);border-radius:8px;background-color:#fff}.qr-text-content{text-align:left}#qr-payment-info{margin-bottom:1rem}#qr-payment-info p{margin:.5rem 0;color:var(--text-color-light);word-break:break-all;font-size:.9rem}#qr-payment-info p strong{color:var(--text-color);min-width:80px;display:inline-block;font-weight:500}.payment-info{margin-top:1rem;margin-bottom:1.5rem;padding:1rem;background-color:var(--panel-alt-bg-color);border:1px solid var(--border-color);border-radius:8px;text-align:left}.payment-info p{margin:.5rem 0;color:var(--text-color-light);line-height:1.5;word-break:break-all}.payment-info p strong{color:var(--text-color);min-width:100px;display:inline-block}.payment-notice{font-size:.8rem;color:var(--text-color-light);line-height:1.5;margin-bottom:1.5rem;border-top:1px solid var(--border-color);padding-top:1rem}.payment-notice strong{color:var(--text-color)}#qr-modal-actions{justify-content:center}#payment-confirmation-btn{background-color:var(--success-color);border-color:var(--success-color)}.toast-notification{position:fixed;top:-100px;left:50%;transform:translate(-50%);background-color:var(--success-color);color:var(--primary-text-color);padding:1rem 1.5rem;border-radius:8px;box-shadow:0 4px 12px var(--shadow-color);z-index:9999;font-weight:500;transition:top .5s ease-in-out;text-align:center}.toast-notification.show{top:20px}#tutorial-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:2000}#tutorial-spotlight{position:absolute;border-radius:8px;box-shadow:0 0 0 9999px #000000b3;z-index:2001;transition:all .4s ease-in-out;pointer-events:none}#tutorial-modal{position:absolute;background-color:var(--panel-bg-color);padding:1.5rem;border-radius:8px;box-shadow:0 5px 15px #0000004d;width:300px;z-index:2002;transition:all .4s ease-in-out}#tutorial-modal h4{margin-top:0;margin-bottom:.5rem;color:var(--text-color);font-size:1.1rem}#tutorial-modal p{margin:0 0 1rem;color:var(--text-color-light);line-height:1.6}.tutorial-navigation{display:flex;justify-content:space-between;align-items:center}.tutorial-navigation button{padding:.5rem 1rem;border-radius:6px;border:1px solid var(--border-color);background-color:var(--button-bg-color);color:var(--text-color);cursor:pointer;transition:background-color .2s}.tutorial-navigation button:hover{background-color:var(--button-hover-bg-color)}#tutorial-next-btn,#tutorial-finish-btn{background-color:var(--primary-color);color:var(--primary-text-color);border-color:var(--primary-color)}#tutorial-next-btn:hover,#tutorial-finish-btn:hover{background-color:var(--primary-hover-color)}.tutorial-nav-steps{display:flex;align-items:center;gap:.5rem}#tutorial-step-indicator{font-size:.9rem;color:var(--text-color-light);font-weight:500}#notification-bell-container{position:relative}#notification-bell-btn{width:44px;height:38px;display:flex;align-items:center;justify-content:center;padding:0;border-radius:6px;border-color:var(--border-color)}body.dark-mode #notification-bell-btn{border-color:var(--border-color)}#notification-count-badge{position:absolute;top:2px;right:2px;background-color:var(--error-color);color:#fff;border-radius:50%;width:18px;height:18px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;border:1px solid var(--panel-bg-color);pointer-events:none}#notification-panel{position:absolute;top:65px;right:1rem;width:350px;max-height:400px;background-color:var(--panel-bg-color);border:1px solid var(--border-color);border-radius:8px;box-shadow:0 5px 15px var(--shadow-color);z-index:1010;display:flex;flex-direction:column;opacity:0;transform:translateY(-10px);transition:opacity .2s ease-out,transform .2s ease-out;pointer-events:none}#notification-panel.visible{opacity:1;transform:translateY(0);pointer-events:auto}.notification-panel-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;border-bottom:1px solid var(--border-color);flex-shrink:0}.notification-panel-header h3{margin:0;font-size:1rem}.notification-panel-header .text-button{background:none;border:none;color:var(--primary-color);cursor:pointer;padding:0;font-size:.8rem}.notification-panel-header .text-button:hover{text-decoration:underline}#notification-list{overflow-y:auto;flex-grow:1}.notification-item{padding:.75rem 1rem;border-bottom:1px solid var(--border-color-heavy);cursor:pointer;transition:background-color .2s}.notification-item:last-child{border-bottom:none}.notification-item:hover{background-color:var(--panel-alt-bg-color)}.notification-item p{margin:0 0 .25rem;line-height:1.4;font-size:.9rem}.notification-item .timestamp{font-size:.75rem;color:var(--text-color-light)}.notification-item.unread{background-color:var(--active-button-bg);border-left:3px solid var(--primary-color);padding-left:calc(1rem - 3px)}body.dark-mode .notification-item.unread{background-color:#2a2f3a}.notification-item.unread p{font-weight:700;color:var(--text-color)}.no-notifications{padding:2rem 1rem;text-align:center;color:var(--text-color-light)}
