:root{--color-primary-50: #e5f2ff;--color-primary-100: #cce5ff;--color-primary-200: #99cbff;--color-primary-300: #66b0ff;--color-primary-400: #3395ff;--color-primary-500: #007AFF;--color-primary-600: #0066d6;--color-primary-700: #0052ad;--color-primary-800: #003d82;--color-primary-900: #002957;--color-secondary-50: #f2f2f7;--color-secondary-100: #e5e5ea;--color-secondary-200: #d1d1d6;--color-secondary-300: #c7c7cc;--color-secondary-400: #aeaeb2;--color-secondary-500: #8e8e93;--color-secondary-600: #636366;--color-secondary-700: #48484a;--color-secondary-800: #3a3a3c;--color-secondary-900: #1c1c1e;--bg-primary: #ffffff;--bg-secondary: #f2f2f7;--bg-tertiary: #e5e5ea;--bg-card: #ffffff;--bg-overlay: rgba(0, 0, 0, .4);--bg-gradient: #f2f2f7;--bg-gradient-card: #ffffff;--bg-gradient-button: #007AFF;--bg-gradient-accent: #007AFF;--bg-glass: rgba(249, 249, 249, .94);--text-primary: #000000;--text-secondary: #3c3c43;--text-tertiary: #8e8e93;--text-quaternary: #aeaeb2;--text-accent: #007AFF;--text-gradient: #007AFF;--text-gold: #f59e0b;--border-light: rgba(60, 60, 67, .08);--border-medium: rgba(60, 60, 67, .15);--border-strong: rgba(60, 60, 67, .25);--border-primary: #007AFF;--border-secondary: #007AFF;--border-accent: rgba(0, 122, 255, .35);--success-light: #34d399;--success-main: #10b981;--success-dark: #059669;--success-gradient: linear-gradient(135deg, #34d399 0%, #10b981 100%);--error-light: #f87171;--error-main: #ef4444;--error-dark: #dc2626;--error-gradient: linear-gradient(135deg, #f87171 0%, #ef4444 100%);--warning-light: #fbbf24;--warning-main: #f59e0b;--warning-dark: #d97706;--warning-gradient: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);--info-light: #60a5fa;--info-main: #3b82f6;--info-dark: #2563eb;--info-gradient: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);--gradient-primary: #007AFF;--gradient-secondary: #007AFF;--gradient-background: #ffffff;--gradient-card: #ffffff;--gradient-overlay: rgba(255, 255, 255, .95);--gradient-glass: rgba(249, 249, 249, .94);--gradient-text: #007AFF;--gradient-gold: #f59e0b;--gradient-error: #FF3B30;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);--shadow-md: 0 2px 8px rgba(0, 0, 0, .08);--shadow-lg: 0 4px 12px rgba(0, 0, 0, .1);--shadow-xl: 0 8px 24px rgba(0, 0, 0, .12);--shadow-xxl: 0 16px 40px rgba(0, 0, 0, .16);--shadow-glow: none;--shadow-glow-gold: none;--shadow-glow-accent: none;--shadow-inner: inset 0 1px 2px rgba(0, 0, 0, .04);--shadow-card: 0 1px 3px rgba(0, 0, 0, .06);--shadow-button: none;--shadow-accent: none;--breakpoint-sm: 640px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px;--breakpoint-2xl: 1536px;--container-sm: 640px;--container-md: 768px;--container-lg: 1024px;--container-xl: 1280px;--container-2xl: 1400px;--font-family-primary: "SF Pro Text", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;--font-family-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, monospace;--font-family-display: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang SC", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.0625rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--letter-spacing-tight: -.02em;--letter-spacing-normal: -.01em;--letter-spacing-wide: .02em;--font-weight-thin: 100;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-weight-black: 900;--line-height-tight: 1.25;--line-height-snug: 1.375;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--line-height-loose: 2;--line-height-base: 1.5;--space-0: 0;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--space-32: 8rem;--radius-none: 0;--radius-sm: .25rem;--radius-base: .5rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-xl: 1.25rem;--radius-2xl: 1.5rem;--radius-3xl: 2rem;--radius-full: 9999px;--radius-bubble: 18px;--radius-bubble-tail: 4px;--transition-fast: .15s ease-in-out;--transition-base: .2s ease-in-out;--transition-slow: .25s ease-in-out;--transition-slower: .35s ease-in-out;--z-hide: -1;--z-auto: auto;--z-base: 0;--z-docked: 10;--z-dropdown: 1000;--z-sticky: 1100;--z-banner: 1200;--z-overlay: 1300;--z-modal: 1400;--z-popover: 1500;--z-skip-link: 1600;--z-toast: 1700;--z-tooltip: 1800}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideLeft{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideRight{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes bounce{0%,20%,53%,80%,to{transform:translateY(0)}40%,43%{transform:translateY(-10px)}70%{transform:translateY(-5px)}90%{transform:translateY(-2px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes glow{0%,to{box-shadow:0 0 20px #7366f04d}50%{box-shadow:0 0 30px #7366f080}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes scale{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@media(max-width:640px){:root{--font-size-base: .875rem;--space-4: .875rem;--space-6: 1.25rem}}@media(max-width:480px){:root{--font-size-base: .8125rem;--space-4: .75rem;--space-6: 1rem}}.scrollbar-thin{scrollbar-width:thin;scrollbar-color:var(--color-primary-500) transparent}.scrollbar-thin::-webkit-scrollbar{width:6px}.scrollbar-thin::-webkit-scrollbar-track{background:transparent}.scrollbar-thin::-webkit-scrollbar-thumb{background:var(--color-primary-500);border-radius:var(--radius-full)}.scrollbar-thin::-webkit-scrollbar-thumb:hover{background:var(--color-primary-400)}.glass-effect{background:var(--bg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-light)}.glow-effect{box-shadow:var(--shadow-glow)}.glow-gold-effect{box-shadow:var(--shadow-glow-gold)}.gradient-text{background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hover-lift{transition:var(--transition-base)}.hover-lift:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-base{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--radius-lg);font-weight:var(--font-weight-medium);transition:var(--transition-base);cursor:pointer;text-decoration:none;position:relative;overflow:hidden}.btn-base:active{transform:translateY(-1px)}.btn-base:disabled{opacity:.6;cursor:not-allowed;transform:none}.card-base{background:var(--bg-gradient-card);border-radius:var(--radius-xl);border:1px solid var(--border-light);box-shadow:var(--shadow-card);transition:var(--transition-base)}.card-base:hover{box-shadow:var(--shadow-xl);border-color:var(--border-medium)}.bg-decoration-1{position:fixed;top:-50%;right:-10%;width:60%;height:100%;background:radial-gradient(circle,rgba(59,130,246,.08) 0%,transparent 70%);border-radius:50%;pointer-events:none;z-index:var(--z-hide);animation:float 6s ease-in-out infinite}.bg-decoration-2{position:fixed;bottom:-50%;left:-10%;width:50%;height:100%;background:radial-gradient(circle,rgba(96,165,250,.06) 0%,transparent 70%);border-radius:50%;pointer-events:none;z-index:var(--z-hide);animation:float 8s ease-in-out infinite reverse}.payment-method-item{position:relative;overflow:hidden}.payment-method-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(59,130,246,.1),transparent);transition:left .8s;z-index:0}.payment-method-item:hover:before{left:100%}.payment-method-item:hover{background:var(--bg-glass)!important;transform:translate(4px)}.payment-method-item.recommend{background:linear-gradient(90deg,rgba(59,130,246,.05) 0%,transparent 100%)}.payment-method-item.active{transform:scale(1.02);box-shadow:var(--shadow-lg)}.copyable-item{transition:var(--transition-base);position:relative;overflow:hidden;-webkit-user-select:none;user-select:none}.copyable-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(59,130,246,.15),transparent);transition:left .5s ease;z-index:0}.copyable-item:hover{background:var(--bg-glass)!important;border-color:var(--border-accent)!important;transform:translateY(-2px);box-shadow:0 4px 12px #3b82f626}.copyable-item:hover:before{left:100%}.copyable-item:active{transform:translateY(0) scale(.98);box-shadow:0 2px 8px #3b82f633}.copyable-item:hover .copy-icon{opacity:1!important;transform:scale(1.1)}.copyable-item .copy-icon{transition:all .3s ease;display:inline-block}@keyframes countdown-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.countdown-warning{animation:countdown-pulse 1s ease-in-out infinite}.navbar-box.back-icon{display:flex;align-items:center;gap:var(--space-3);cursor:pointer;transition:var(--transition-base)}.navbar-box.back-icon:hover{background:var(--bg-glass)}.navbar-box.back-icon:active{transform:scale(.98)}.app-main{max-width:600px;margin:0 auto;width:100%;padding:var(--space-6) var(--space-4)}.card-group{display:flex;flex-direction:column;gap:var(--space-6);margin-bottom:var(--space-6)}.card-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-4)}.info-item{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) 0;border-bottom:1px solid var(--border-light)}.info-item:last-child{border-bottom:none}.info-label{font-size:var(--font-size-sm);color:var(--text-tertiary);font-weight:var(--font-weight-medium)}.info-value{font-size:var(--font-size-base);color:var(--text-primary);font-weight:var(--font-weight-semibold)}.status-indicator{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold)}.status-pending{background:var(--warning-gradient);color:var(--text-primary)}.status-success{background:var(--success-gradient);color:var(--text-primary)}.status-error{background:var(--error-gradient);color:var(--text-primary)}.status-processing{background:var(--info-gradient);color:var(--text-primary)}.divider{height:1px;background:linear-gradient(to right,transparent,var(--border-light),transparent);margin:var(--space-4) 0}.divider-thick{height:2px;background:linear-gradient(to right,transparent,var(--border-medium),transparent);margin:var(--space-6) 0}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:none;border-radius:var(--radius-lg);background:var(--bg-glass);color:var(--text-primary);font-size:1.2rem;cursor:pointer;transition:var(--transition-base);box-shadow:var(--shadow-sm)}.icon-btn:hover{background:var(--gradient-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.highlight-text{background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:var(--font-weight-bold)}.floating-element{position:fixed;z-index:var(--z-modal);animation:float 3s ease-in-out infinite}@media(max-width:768px){.bg-decoration-1{top:-30%;right:-20%;width:80%}.bg-decoration-2{bottom:-30%;left:-20%;width:70%}.app-main{padding:var(--space-4) var(--space-3)}.payment-method-item{padding:var(--space-3)!important}.payment-method-item .icon{font-size:1.5rem!important;margin-right:var(--space-2)!important}.card-row{grid-template-columns:1fr}}@media(max-width:480px){.bg-decoration-1{top:-20%;right:-30%;width:100%}.bg-decoration-2{bottom:-20%;left:-30%;width:90%}.payment-method-item{padding:var(--space-2)!important}.payment-method-item .icon{font-size:1.25rem!important;margin-right:var(--space-2)!important}.info-item{flex-direction:column;align-items:flex-start;gap:var(--space-1)}.icon-btn{width:36px;height:36px;font-size:1rem}}@media(prefers-contrast:high){.copyable-item,.payment-method-item{border-width:2px}.copyable-item:hover,.payment-method-item:hover{border-width:3px}.divider{background:var(--border-medium)}.divider-thick{background:var(--border-strong)}}@media(prefers-reduced-motion:reduce){.bg-decoration-1,.bg-decoration-2,.countdown-warning{animation:none}.copyable-item:before,.payment-method-item:before{transition:none}.floating-element{animation:none}}@media print{.bg-decoration-1,.bg-decoration-2,.loading-overlay{display:none!important}.payment-method-item{background:#fff!important;color:#000!important;border:1px solid black!important}}.card{background:var(--bg-gradient-card);border:1px solid var(--border-light);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);transition:var(--transition-base);overflow:hidden;display:flex;flex-direction:column}.card-hover:hover{box-shadow:var(--shadow-xl);border-color:var(--border-medium);transform:translateY(-2px)}.card-elevated{box-shadow:var(--shadow-xxl);border:none}.card-glass{background:var(--bg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-light)}.card-bordered{background:transparent;border:2px solid var(--border-medium);box-shadow:none}.card-gradient{background:var(--gradient-primary);border:none;color:var(--text-primary)}.card-header{padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--border-light);background:var(--bg-glass);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.card-body{padding:var(--space-6);flex:1}.card-footer{padding:var(--space-4) var(--space-6);border-top:1px solid var(--border-light);background:var(--bg-glass);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.card-padding-none .card-header,.card-padding-none .card-body,.card-padding-none .card-footer{padding:0}.card-padding-small .card-header,.card-padding-small .card-footer{padding:var(--space-2) var(--space-4)}.card-padding-small .card-body{padding:var(--space-4)}.card-padding-normal .card-header,.card-padding-small .card-footer{padding:var(--space-3) var(--space-6)}.card-padding-normal .card-body,.card-padding-large .card-header,.card-padding-large .card-footer{padding:var(--space-6)}.card-padding-large .card-body{padding:var(--space-8)}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .8s}.btn:hover:before{left:100%}.btn-disabled:before{display:none}.btn-loading{pointer-events:none}.btn-loading-spinner{display:inline-flex;align-items:center;margin-right:var(--space-2)}.btn-text{position:relative;z-index:1}.icon-btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--radius-lg);background:var(--bg-glass);color:var(--text-primary);cursor:pointer;transition:var(--transition-base);box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.icon-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left .6s}.icon-btn:hover{background:var(--gradient-secondary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.icon-btn:hover:before{left:100%}.icon-btn:active{transform:translateY(-1px)}.icon-btn-sm{width:32px;height:32px;font-size:14px}.icon-btn-md{width:40px;height:40px;font-size:18px}.icon-btn-lg{width:48px;height:48px;font-size:20px}.icon-btn-xl{width:56px;height:56px;font-size:24px}.tooltip-wrapper{position:relative;display:inline-block}.tooltip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);background:var(--bg-overlay);color:var(--text-primary);padding:var(--space-2) var(--space-3);border-radius:var(--radius-lg);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);white-space:nowrap;pointer-events:none;opacity:0;transition:var(--transition-base);z-index:var(--z-tooltip);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border-light)}.tooltip-wrapper:hover .tooltip{opacity:1}.tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:4px solid transparent;border-top-color:var(--bg-overlay)}.form-field{margin-bottom:var(--space-4)}.form-field-error .form-label{color:var(--error-main)}.required-indicator{color:var(--error-main);margin-left:var(--space-0)}.form-input,.form-textarea,.form-select{width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--border-medium);border-radius:var(--radius-lg);background:var(--bg-card);color:var(--text-primary);font-size:var(--font-size-base);transition:var(--transition-base)}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--color-primary-400);box-shadow:0 0 0 3px #7366f01a;background:var(--bg-primary)}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-tertiary)}.form-input.error,.form-textarea.error,.form-select.error{border-color:var(--error-main);box-shadow:0 0 0 3px #ef44441a}.form-textarea{resize:vertical;min-height:120px;line-height:var(--line-height-base)}.resize-none{resize:none}.resize-horizontal{resize:horizontal}.resize-vertical{resize:vertical;min-height:100px}.resize-both{resize:both;min-height:100px;min-width:200px}.form-error{margin-top:var(--space-1);font-size:var(--font-size-xs);color:var(--error-main);font-weight:var(--font-weight-medium);display:flex;align-items:center;gap:var(--space-1)}.form-error:before{content:"⚠"}.form-help{margin-top:var(--space-1);font-size:var(--font-size-xs);color:var(--text-tertiary);line-height:var(--line-height-snug)}@media(max-width:768px){.card-header,.card-body,.card-footer{padding:var(--space-4)}.btn{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm)}.form-input,.form-textarea,.form-select{padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm)}}@media(max-width:480px){.card-header,.card-body,.card-footer{padding:var(--space-3)}.btn{padding:var(--space-2) var(--space-3);font-size:var(--font-size-xs)}.form-input,.form-textarea,.form-select{padding:var(--space-2);font-size:var(--font-size-sm)}.icon-btn-sm{width:28px;height:28px;font-size:12px}.icon-btn-md{width:36px;height:36px;font-size:16px}}@media(prefers-contrast:high){.card,.form-input,.form-textarea,.form-select{border-width:2px}.btn{border:2px solid currentColor}}@media(prefers-reduced-motion:reduce){.btn:before,.icon-btn:before{transition:none}.btn:hover,.icon-btn:hover{transform:none}}.responsive-container{width:100%;margin:0 auto;padding:0 var(--space-4)}@media(max-width:640px){.responsive-container{padding:0 var(--space-2);max-width:100%}.hide-mobile{display:none!important}.show-mobile{display:block!important}.responsive-text{font-size:.875rem}.responsive-spacing{padding:var(--space-3)}.responsive-card{margin:var(--space-2) 0;border-radius:var(--radius-lg)}.responsive-button{width:100%;padding:var(--space-3) var(--space-4);font-size:.875rem}.chat-wrapper{height:100vh}.chat-wrapper .chat-content{padding:var(--space-2) var(--space-1)}.chat-wrapper .message-bubble{max-width:85%}.chat-wrapper .message-avatar{width:24px;height:24px}.chat-wrapper .chat-input-container{padding:var(--space-2)}.chat-wrapper .chat-input{font-size:16px}.emoji-picker-container{bottom:80px;right:var(--space-2);width:280px;height:200px}}@media(min-width:641px)and (max-width:768px){.responsive-container{max-width:var(--container-sm)}.hide-tablet{display:none!important}.show-tablet{display:block!important}.chat-wrapper{max-width:90%;margin:0 auto}.chat-wrapper .message-bubble{max-width:75%}}@media(min-width:769px)and (max-width:1024px){.responsive-container{max-width:var(--container-md)}.hide-desktop{display:none!important}.show-desktop{display:block!important}.desktop-layout{display:flex;gap:var(--space-6);align-items:flex-start}.desktop-sidebar{width:300px;flex-shrink:0}.desktop-main{flex:1}.chat-wrapper{max-width:800px;margin:2rem auto;height:calc(100vh - 4rem);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-xxl)}.chat-wrapper .message-bubble{max-width:70%}.chat-wrapper .chat-content{padding:var(--space-4)}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-4)}}@media(min-width:1025px)and (max-width:1280px){.responsive-container{max-width:var(--container-lg)}.chat-wrapper{max-width:900px}.wide-layout{display:grid;grid-template-columns:350px 1fr;gap:var(--space-8)}}@media(min-width:1281px){.responsive-container{max-width:var(--container-xl)}.chat-wrapper{max-width:1000px}.ultra-wide-layout{display:grid;grid-template-columns:400px 1fr 300px;gap:var(--space-8)}}.responsive-img{max-width:100%;height:auto;border-radius:var(--radius-lg)}.responsive-heading{font-size:clamp(1.5rem,4vw,2.5rem);line-height:1.2}.responsive-subheading{font-size:clamp(1.125rem,3vw,1.5rem);line-height:1.3}.responsive-body{font-size:clamp(.875rem,2vw,1rem);line-height:1.6}.responsive-padding{padding:clamp(1rem,3vw,2rem)}.responsive-margin{margin:clamp(1rem,3vw,2rem)}.responsive-grid{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}@media(min-width:768px){.responsive-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}}@media(min-width:1024px){.responsive-grid{grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}}@media(orientation:landscape)and (max-height:600px){.chat-wrapper{height:100vh;margin:0}.chat-wrapper .chat-header{height:48px}.chat-wrapper .chat-content{top:48px;bottom:48px}.chat-wrapper .chat-input-container{height:48px}.emoji-picker-container{height:150px}}@media(-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.chat-wrapper .message-avatar,.responsive-img{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}@media(prefers-reduced-motion:reduce){.bg-decoration-1,.bg-decoration-2{animation:none}*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(hover:none)and (pointer:coarse){.btn,.icon-btn,.payment-method-item,.copyable-item{min-height:44px;min-width:44px}.chat-wrapper .chat-input{font-size:16px}.copyable-item{padding:1.25rem!important}}@media(hover:hover)and (pointer:fine){.btn:hover,.icon-btn:hover,.payment-method-item:hover,.copyable-item:hover{transform:translateY(-2px)}}@media(max-width:640px){.copyable-item{padding:1rem!important}.copyable-item div{font-size:clamp(.875rem,3vw,1rem)!important}.form-label{font-size:.875rem!important;margin-bottom:.5rem!important}.form-group{margin-bottom:1rem!important}.form-group div[style*="fontSize: '1.5rem'"]{font-size:clamp(1.25rem,4vw,1.5rem)!important}}@media(min-width:641px)and (max-width:1024px){.responsive-container{max-width:600px}.copyable-item{padding:1.125rem!important}}@media(min-width:1025px){.responsive-container{max-width:700px}.copyable-item{padding:1.25rem!important}.copyable-item:hover .copy-icon{transform:scale(1.15)}}.responsive-layout{width:100%;display:block}.desktop-layout{display:flex;gap:var(--space-6);align-items:flex-start}.desktop-layout .responsive-sidebar{width:300px;flex-shrink:0}.desktop-layout .responsive-main{flex:1}.wide-layout{display:grid;grid-template-columns:350px 1fr;gap:var(--space-8)}.wide-layout .responsive-sidebar{grid-column:1}.wide-layout .responsive-main{grid-column:2}.ultra-wide-layout{display:grid;grid-template-columns:400px 1fr 300px;gap:var(--space-8)}.ultra-wide-layout .responsive-sidebar{grid-column:1}.ultra-wide-layout .responsive-main{grid-column:2}.grid-cols-1{grid-template-columns:repeat(1,1fr)}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}.grid-cols-5{grid-template-columns:repeat(5,1fr)}.grid-cols-6{grid-template-columns:repeat(6,1fr)}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-5{gap:var(--space-5)}.gap-6{gap:var(--space-6)}.gap-7{gap:var(--space-7)}.gap-8{gap:var(--space-8)}@media(max-width:640px){.responsive-grid{grid-template-columns:1fr}.desktop-layout,.wide-layout,.ultra-wide-layout{display:block}.desktop-layout .responsive-sidebar,.wide-layout .responsive-sidebar,.ultra-wide-layout .responsive-sidebar{width:100%;margin-bottom:var(--space-4)}.desktop-layout .responsive-main,.wide-layout .responsive-main,.ultra-wide-layout .responsive-main{width:100%}}@media(min-width:641px)and (max-width:768px){.sm\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.sm\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.sm\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.wide-layout,.ultra-wide-layout{grid-template-columns:1fr}}@media(min-width:769px)and (max-width:1024px){.md\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.md\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.md\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.md\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}@media(min-width:1025px){.lg\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.lg\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.lg\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.lg\:grid-cols-4{grid-template-columns:repeat(4,1fr)}.lg\:grid-cols-5{grid-template-columns:repeat(5,1fr)}.lg\:grid-cols-6{grid-template-columns:repeat(6,1fr)}}.flex{display:flex}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}@media(max-width:640px){.mobile\:flex-col{flex-direction:column}.mobile\:items-center{align-items:center}.mobile\:justify-center{justify-content:center}}@media(min-width:769px){.desktop\:flex-row{flex-direction:row}.desktop\:items-start{align-items:flex-start}.desktop\:justify-between{justify-content:space-between}}.m-0{margin:0}.m-1{margin:var(--space-1)}.m-2{margin:var(--space-2)}.m-3{margin:var(--space-3)}.m-4{margin:var(--space-4)}.m-auto{margin:auto}.p-0{padding:0}.p-1{padding:var(--space-1)}.p-2{padding:var(--space-2)}.p-3{padding:var(--space-3)}.p-4{padding:var(--space-4)}.w-full{width:100%}.w-auto{width:auto}.max-w-xs{max-width:20rem}.max-w-sm{max-width:24rem}.max-w-md{max-width:28rem}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.h-full{height:100%}.h-screen{height:100vh}.h-auto{height:auto}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.rounded-none{border-radius:0}.rounded-sm{border-radius:var(--radius-sm)}.rounded{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:var(--radius-full)}.shadow-none{box-shadow:none}.shadow{box-shadow:var(--shadow-md)}.shadow-2xl{box-shadow:var(--shadow-xxl)}.transition{transition:all .3s ease}.transition-colors{transition:color .3s ease,background-color .3s ease,border-color .3s ease}.transition-transform{transition:transform .3s ease}.transition-opacity{transition:opacity .3s ease}.scale-95{transform:scale(.95)}.scale-100{transform:scale(1)}.scale-105{transform:scale(1.05)}.scale-110{transform:scale(1.1)}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.opacity-100{opacity:1}.cursor-pointer{cursor:pointer}.cursor-not-allowed{cursor:not-allowed}.cursor-default{cursor:default}.select-none{-webkit-user-select:none;user-select:none}.select-text{-webkit-user-select:text;user-select:text}.select-all{-webkit-user-select:all;user-select:all}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-scroll{overflow:scroll}.overflow-auto{overflow:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-hidden{overflow-y:hidden}.overflow-y-auto{overflow-y:auto}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-justify{text-align:justify}.font-normal{font-weight:var(--font-weight-normal)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.hidden{display:none}@media(max-width:640px){.mobile\:block{display:block}.mobile\:hidden{display:none}.mobile\:flex{display:flex}.mobile\:text-center{text-align:center}.mobile\:w-full{width:100%}}@media(min-width:641px)and (max-width:1024px){.tablet\:block{display:block}.tablet\:hidden{display:none}.tablet\:flex{display:flex}.tablet\:text-left{text-align:left}}@media(min-width:1025px){.desktop\:block{display:block}.desktop\:hidden{display:none}.desktop\:flex{display:flex}.desktop\:text-left{text-align:left}.desktop\:w-auto{width:auto}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.payment-page{--gradient-primary: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);--gradient-secondary: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);--gradient-order-info: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);--gradient-order-info-light: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);--glass-border-order: rgba(139, 92, 246, .2);--shadow-order: 0 10px 40px rgba(139, 92, 246, .3);--gradient-payment-method: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);--gradient-payment-method-light: linear-gradient(135deg, #22d3ee 0%, #06b6d4 100%);--glass-border-payment: rgba(6, 182, 212, .35);--shadow-payment: 0 10px 40px rgba(6, 182, 212, .3);--gradient-action-button: linear-gradient(135deg, #10b981 0%, #059669 100%);--gradient-action-button-light: linear-gradient(135deg, #34d399 0%, #10b981 100%);--glass-border-button: rgba(16, 185, 129, .2);--shadow-button: 0 10px 40px rgba(16, 185, 129, .35);--gradient-accent: linear-gradient(135deg, #22d3ee 0%, #0ea5e9 100%);--gradient-success: linear-gradient(135deg, #34d399 0%, #10b981 100%);--gradient-warning: linear-gradient(135deg, #fde68a 0%, #fbbf24 100%);--gradient-gold: linear-gradient(135deg, #c7e0ff 0%, #1e40af 100%);--glass-bg: rgba(255, 255, 255, .72);--glass-bg-light: rgba(255, 255, 255, .82);--glass-border: rgba(59, 130, 246, .16);--glass-shadow: 0 10px 40px rgba(59, 130, 246, .18);--shadow-purple: 0 10px 40px rgba(139, 92, 246, .28);--shadow-cyan: 0 10px 40px rgba(6, 182, 212, .28);--shadow-green: 0 10px 40px rgba(16, 185, 129, .35);--shadow-soft: 0 4px 16px rgba(37, 99, 235, .14);--text-white: #ffffff;--text-light: #e2e8f0;--text-gray: #475569;--text-dark: #0f172a;--text-secondary: rgba(15, 23, 42, .7);--space-1: 2px;--space-2: 4px;--space-3: 8px;--space-4: 12px;--space-5: 16px;--space-6: 20px;--space-8: 24px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-2xl: 24px;--radius-full: 9999px;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 30px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--header-bg: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);height:100vh;height:100dvh;background:#fff;position:fixed;inset:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--text-dark)}.payment-page .brand-section{text-align:center;padding:var(--space-6) var(--space-4) var(--space-4);animation:fadeInDown .8s ease-out}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.payment-page .brand-title{font-size:32px;font-weight:800;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--space-2);letter-spacing:-.5px}.payment-page .brand-subtitle{font-size:var(--font-size-sm);color:var(--text-gray);letter-spacing:2px;text-transform:uppercase;opacity:.8}.payment-page:before{content:"";position:fixed;top:-150px;left:-150px;width:400px;height:400px;background:radial-gradient(circle,rgba(96,165,250,.25) 0%,transparent 70%);border-radius:50%;pointer-events:none;z-index:var(--z-base)}.payment-page:after{content:"";position:fixed;bottom:-200px;right:-200px;width:500px;height:500px;background:radial-gradient(circle,rgba(14,165,233,.22) 0%,transparent 70%);border-radius:50%;pointer-events:none;z-index:var(--z-base)}.payment-page .page-header{position:sticky;top:0;z-index:var(--z-sticky);background:var(--header-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:var(--space-4) var(--space-5);display:flex;align-items:center;gap:var(--space-4);box-shadow:0 4px 12px #2563eb33}.payment-page .back-btn{display:inline-flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border:2px solid rgba(255,255,255,.3);border-radius:var(--radius-lg);background:#ffffff26;color:var(--text-white);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-base);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 4px 12px #0000001a}.payment-page .back-btn:hover{background:#ffffff40;border-color:#ffffff80;transform:translate(-3px);box-shadow:0 6px 20px #00000026}.payment-page .back-btn:active{transform:translate(-1px) scale(.97);box-shadow:0 2px 8px #0000001a}.payment-page .back-btn .back-icon{display:flex;align-items:center;justify-content:center;transition:transform var(--transition-base)}.payment-page .back-btn:hover .back-icon{transform:translate(-2px)}.payment-page .page-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--text-white);margin:0;text-shadow:0 2px 8px rgba(0,0,0,.1)}.payment-page .page-main{padding:var(--space-6) var(--space-4)}.payment-page .container{max-width:600px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-5)}.payment-page .section-card{background:var(--glass-bg-light);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:var(--glass-shadow);overflow:hidden;transition:all var(--transition-base)}@media(hover:hover)and (pointer:fine){.payment-page .section-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-purple)}}.payment-page .section-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-5);background:var(--gradient-primary);color:var(--text-white)}.payment-page .section-header h2{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}.payment-page .status-badge{padding:var(--space-1) var(--space-4);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);background:#fff3;color:var(--text-white);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.payment-page .section-body{padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-5)}.payment-page .countdown{display:flex;flex-direction:column;gap:var(--space-2)}.payment-page .countdown-label{font-size:var(--font-size-sm);color:var(--text-light);font-weight:var(--font-weight-medium)}.payment-page .countdown-display{background:var(--gradient-success);color:var(--text-white);border-radius:var(--radius-lg);padding:var(--space-5);text-align:center;font-family:SF Mono,Monaco,Consolas,monospace;font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);letter-spacing:.1em;box-shadow:var(--shadow-green);transition:all var(--transition-base)}.payment-page .countdown-display.urgent{background:var(--gradient-warning);box-shadow:var(--shadow-pink);animation:countdown-pulse 1s ease-in-out infinite}@keyframes countdown-pulse{0%,to{transform:scale(1);box-shadow:var(--shadow-pink)}50%{transform:scale(1.02);box-shadow:0 15px 50px #fa709a99}}.payment-page .info-group{display:flex;flex-direction:column;gap:var(--space-4)}.payment-page .info-item{display:flex;flex-direction:column;gap:var(--space-2)}.payment-page .info-item label{font-size:var(--font-size-sm);color:var(--text-gray);font-weight:var(--font-weight-medium)}.payment-page .copy-btn{width:100%;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);cursor:pointer;transition:all var(--transition-base);color:var(--text-white);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.payment-page .copy-btn:hover{background:var(--glass-bg-light);border-color:#4facfe66;box-shadow:0 4px 16px #4facfe33;transform:translateY(-1px)}.payment-page .copy-btn:active{transform:translateY(0) scale(.99)}.payment-page .copy-text{font-family:SF Mono,Monaco,Consolas,monospace;font-size:var(--font-size-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.payment-page .copy-icon{opacity:.7;transition:all var(--transition-base);font-size:var(--font-size-lg)}.payment-page .copy-btn:hover .copy-icon{opacity:1;transform:scale(1.15)}.payment-page .amount-display{width:100%;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);padding:var(--space-4);text-align:center;font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:#2563eb;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 2px 4px #2563eb0d}.payment-page .amount-display .currency{font-size:var(--font-size-lg);margin-right:4px}.payment-page .action-area{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-4)}.payment-page .btn-ghost{background:transparent;border:1px solid var(--glass-border);color:var(--text-gray);padding:var(--space-4);border-radius:var(--radius-lg);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-base)}.payment-page .btn-ghost:hover{background:var(--glass-bg);color:#2563eb}.payment-page .time-display{width:100%;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);text-align:center;font-size:var(--font-size-sm);color:var(--text-gray);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.payment-page .tip-box{padding:var(--space-3) var(--space-4);background:#2563eb14;border:1px solid rgba(37,99,235,.15);border-radius:var(--radius-md);color:#1e40af;font-size:var(--font-size-sm);display:flex;align-items:flex-start;gap:var(--space-2);line-height:1.5}.payment-page .tip-icon{font-size:var(--font-size-lg);color:#2563eb}.payment-page .payment-summary-card{background:#fff;color:#60a5fa;border:2px solid #dbeafe;border-radius:var(--radius-xl);box-shadow:0 4px 20px #60a5fa26}.payment-page .payment-summary-content{padding:var(--space-6) var(--space-5);text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.payment-page .summary-label{font-size:var(--font-size-sm);color:#60a5fa;letter-spacing:1px;font-weight:var(--font-weight-medium)}.payment-page .summary-amount{font-size:42px;font-weight:800;margin:var(--space-2) 0;display:flex;align-items:baseline;justify-content:center}.payment-page .summary-amount .currency{font-size:24px;margin-right:4px;color:#60a5fa}.payment-page .summary-amount .amount{color:#2563eb;text-shadow:0 2px 8px rgba(37,99,235,.2)}.payment-page .countdown-mini{display:inline-flex;align-items:center;justify-content:center;background:#fef2f2;padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--font-size-xs);margin-top:var(--space-2);border:1px solid #fecaca}.payment-page .mini-label{color:#ef4444;font-weight:var(--font-weight-medium)}.payment-page .mini-value{color:#dc2626;font-weight:var(--font-weight-bold)}.payment-page .mini-value.urgent{color:#dc2626;animation:pulse 1s infinite;font-weight:700}.payment-page .payment-header{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--glass-border);background:transparent;display:flex;justify-content:space-between;align-items:center}.payment-page .payment-header h2{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-dark)}.payment-page .payment-title{margin:0;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--text-dark)}.payment-page .payment-selected{display:flex;align-items:center;gap:var(--space-1);font-size:var(--font-size-xs)}.payment-page .payment-selected .selected-label{color:var(--text-gray)}.payment-page .payment-selected .selected-name{color:var(--primary-blue);font-weight:var(--font-weight-medium)}.payment-page .payment-methods{display:flex;flex-direction:column;gap:var(--space-2);min-height:120px}.payment-page .payment-method{position:relative;width:100%;background:transparent;border:none;border-bottom:1px solid var(--glass-border);padding:var(--space-5);display:flex;align-items:center;gap:var(--space-4);cursor:pointer;transition:all var(--transition-base);text-align:left;color:var(--text-white)}.payment-page .payment-method:last-child{border-bottom:none}.payment-page .payment-method:hover{background:#4facfe1a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.payment-page .payment-method.selected{background:var(--gradient-accent);box-shadow:var(--shadow-blue);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.payment-page .payment-method:active{transform:scale(.995)}.payment-page .recommended-badge{position:absolute;top:var(--space-3);right:var(--space-5);background:var(--gradient-warning);color:var(--text-white);padding:4px 12px;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);box-shadow:0 4px 12px #fa709a4d}.payment-page .payment-icon{font-size:32px;flex-shrink:0}.payment-page .method-icon{width:40px;height:40px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#ffffff1a;border-radius:10px;overflow:hidden;position:relative}.payment-page .method-icon img{width:100%;height:100%;object-fit:cover;border-radius:6px}.payment-page .method-icon img.icon-loading{opacity:0;position:absolute}.payment-page .method-icon img.icon-loaded{opacity:1}.payment-page .method-icon .icon-emoji{font-size:24px;line-height:1}.payment-page .method-icon .icon-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border-radius:6px;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}.payment-page .method-icon .icon-font{font-size:20px;color:var(--text-white)}.payment-page .payment-method-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);transition:all var(--transition-base);cursor:pointer;background:#00000008;border:1px solid transparent;min-height:56px}.payment-page .payment-method-item.selected{background:linear-gradient(135deg,#3b82f6,#2563eb);box-shadow:0 4px 12px #3b82f64d;border-color:#3b82f680}.payment-page .payment-method-item.selected .method-name,.payment-page .payment-method-item.selected .method-description{color:#fff}.payment-page .payment-method-item.selected .method-icon{background:#fff3}.payment-page .payment-method-item:not(.selected):hover{background:#3b82f614;border-color:#3b82f633}.payment-page .method-info{flex:1;min-width:0}.payment-page .method-header{display:flex;align-items:center;gap:var(--space-2)}.payment-page .method-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--text-dark)}.payment-page .method-description{font-size:var(--font-size-xs);color:var(--text-gray);line-height:1.3;margin-top:2px}.payment-page .method-actions{display:flex;align-items:center;gap:var(--space-2)}.payment-page .method-actions .copy-btn{background:transparent;border:1px solid var(--glass-border);color:var(--text-light);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:var(--font-size-xs);cursor:pointer;transition:all var(--transition-base)}.payment-page .method-actions .copy-btn:hover{background:#ffffff1a}.payment-page .selected-indicator{font-size:18px;color:var(--primary-blue);font-weight:700;opacity:0;transform:scale(.5);transition:all .2s ease}.payment-page .selected-indicator.visible{opacity:1;transform:scale(1);color:#fff}.payment-page .payment-info{flex:1;min-width:0}.payment-page .payment-name{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-white);margin-bottom:4px}.payment-page .payment-desc{font-size:var(--font-size-sm);color:var(--text-gray)}.payment-page .payment-method.selected .payment-desc{color:#ffffffe6}.payment-page .payment-radio{width:24px;height:24px;border-radius:var(--radius-full);border:2px solid var(--glass-border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all var(--transition-base);background:transparent}.payment-page .payment-method.selected .payment-radio{border-color:var(--text-white);background:#fff3}.payment-page .radio-dot{width:10px;height:10px;border-radius:var(--radius-full);background:var(--text-white);box-shadow:0 2px 8px #0003}.payment-page .pay-btn{width:100%;border:none;border-radius:var(--radius-lg);padding:var(--space-5);background:linear-gradient(135deg,#3b82f6,#2563eb);color:var(--text-white);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);cursor:pointer;transition:all var(--transition-base);box-shadow:0 10px 40px #3b82f64d}.payment-page .pay-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 15px 50px #3b82f680}.payment-page .pay-btn:active:not(:disabled){transform:translateY(0) scale(.98)}.payment-page .pay-btn:disabled{background:var(--glass-bg);color:var(--text-gray);cursor:not-allowed;box-shadow:none;opacity:.6}.payment-page .spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top:2px solid var(--text-white);border-radius:var(--radius-full);animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.payment-page .security-tip{text-align:center;color:#047857;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:#10b98114;border-radius:var(--radius-md);border:1px solid var(--glass-border-button)}.payment-page .security-tip .tip-icon{color:#059669}.payment-page .loading-overlay{position:fixed;inset:0;background:#667eea4d;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-5);z-index:var(--z-modal)}.payment-page .loading-overlay .spinner{width:48px;height:48px;border:4px solid rgba(255,255,255,.2);border-top:4px solid var(--text-white)}.payment-page-toast{position:fixed;top:20px;left:50%;transform:translate(-50%) translateY(-20px);opacity:0;z-index:99999;padding:14px 20px;border-radius:16px;font-size:14px;font-weight:600;color:#fff;box-shadow:0 12px 36px #00000040;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.18);transition:all .25s cubic-bezier(.4,0,.2,1);white-space:nowrap}.payment-page-toast.show{opacity:1;transform:translate(-50%) translateY(0)}.payment-page-toast.toast-success{background:linear-gradient(135deg,#43e97b,#38f9d7);box-shadow:0 12px 36px #43e97b59}.payment-page-toast.toast-error{background:linear-gradient(135deg,#f093fb,#f5576c);box-shadow:0 12px 36px #f093fb59}@media(max-width:768px){.payment-page .page-main{padding:var(--space-4) var(--space-3)}.payment-page .section-card{border-radius:var(--radius-lg)}.payment-page .section-header,.payment-page .section-body,.payment-page .payment-header{padding:var(--space-4)}.payment-page .countdown-display{font-size:1.25rem;padding:var(--space-4)}.payment-page .payment-icon{font-size:28px}.payment-page .payment-method{padding:var(--space-4)}.payment-page .pay-btn{padding:var(--space-4);font-size:var(--font-size-sm)}}@media(max-width:640px){.payment-page .page-title{font-size:var(--font-size-lg)}.payment-page .section-header h2,.payment-page .payment-header h2{font-size:var(--font-size-base)}.payment-page .countdown-display{font-size:1.125rem}.payment-page .amount-display{font-size:var(--font-size-xl)}.payment-page .payment-methods-card.centered-section{min-height:280px;padding:var(--space-6) var(--space-4)}.payment-page .centered-section .payment-header{max-width:100%}.payment-page .centered-section .payment-header h2{font-size:var(--font-size-lg)}.payment-page .centered-section .payment-methods{max-width:100%}.payment-page .centered-section .payment-method{padding:var(--space-4)}}@media(hover:none)and (pointer:coarse){.payment-page .copy-btn,.payment-page .payment-method,.payment-page .pay-btn,.payment-page .back-btn{min-height:44px}}@media(prefers-reduced-motion:reduce){.payment-page .countdown-display.urgent,.payment-page .spinner{animation:none}.payment-page *,.payment-page *:before,.payment-page *:after,.payment-page-toast,.payment-page-toast *{transition-duration:.01ms!important;animation-duration:.01ms!important}}.payment-page .payment-methods-card{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;padding:var(--space-6) var(--space-5);background:var(--glass-bg-light);border:1px solid var(--glass-border-payment);box-shadow:var(--shadow-payment)}.payment-page .payment-methods-card.centered-section{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:320px;padding:var(--space-8) var(--space-6);background:var(--glass-bg-light);border:1px solid var(--glass-border-payment);box-shadow:var(--shadow-payment)}.payment-page .centered-section .payment-header{width:100%;max-width:400px;text-align:center;margin-bottom:var(--space-6)}.payment-page .centered-section .payment-header h2{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--text-dark);margin-bottom:var(--space-3)}.payment-page .centered-section .payment-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-dark)}.payment-page .centered-section .payment-selected{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--gradient-payment-method);color:var(--text-white);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);box-shadow:var(--shadow-cyan)}.payment-page .centered-section .payment-methods{width:100%;max-width:400px;display:flex;flex-direction:column;gap:var(--space-2)}.payment-page .centered-section .payment-method-item{background:#00000008;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius-md);padding:var(--space-3)}.payment-page .centered-section .payment-method-item:hover{background:#3b82f614;border-color:#3b82f633}.payment-page .centered-section .payment-method-item.selected{background:linear-gradient(135deg,#3b82f6,#2563eb)!important;border-color:#3b82f680!important;box-shadow:0 4px 12px #3b82f64d!important}.payment-page .centered-section .payment-method-item.selected .method-name,.payment-page .centered-section .payment-method-item.selected .method-description{color:#fff!important}.payment-page .centered-section .payment-method-item.selected .method-icon{background:#fff3!important}.payment-page .centered-section .payment-method{background:var(--glass-bg-light);border:2px solid var(--glass-border-payment);border-radius:var(--radius-lg);padding:var(--space-5);transition:all var(--transition-base);box-shadow:var(--shadow-soft)}@media(hover:hover)and (pointer:fine){.payment-page .centered-section .payment-method:hover{border-color:#06b6d4;box-shadow:var(--shadow-cyan);transform:translateY(-2px)}}.payment-page .centered-section .payment-method.selected{background:linear-gradient(135deg,#87e8de,#54d1db);border-color:#4dd0e1;box-shadow:0 10px 40px #4dd0e166;transform:translateY(-2px) scale(1.02)}.payment-page .centered-section .payment-method.selected .payment-name,.payment-page .centered-section .payment-method.selected .payment-desc{color:#065f46}@supports not (backdrop-filter: blur(20px)){.payment-page .section-card,.payment-page .page-header,.payment-page .copy-btn,.payment-page .payment-header,.payment-page .loading-overlay,.payment-page-toast{backdrop-filter:none;-webkit-backdrop-filter:none;background:#ffffff24;border-color:#fff3}}.payment-page .loading-state,.payment-page .error-state,.payment-page .empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:120px;gap:var(--space-2);color:var(--text-gray);font-size:var(--font-size-sm)}.payment-page .loading-state .spinner-small{width:32px;height:32px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--primary-blue);border-radius:50%;animation:spin .8s linear infinite}.payment-page .error-state{color:#f87171}.payment-page .error-state span:first-child,.payment-page .empty-state span:first-child{font-size:32px;opacity:.8}.payment-page .order-loading{display:flex;flex-direction:column;align-items:center;gap:16px;padding:40px 0}.payment-page .order-loading .spinner{width:40px;height:40px;border-color:#2563eb33;border-top-color:#2563eb}.payment-page .order-loading-text{color:var(--text-gray);font-size:14px}.payment-page .order-error{padding:40px 0;text-align:center}.payment-page .order-error .empty-icon{font-size:48px;margin-bottom:12px}.payment-page .order-error .empty-title{color:var(--text-dark);font-size:16px;margin-bottom:20px}.payment-page .order-error .btn-ghost{width:auto;padding:10px 24px}.payment-page .order-status-page{padding:60px 0;text-align:center}.payment-page .order-status-page .empty-icon{font-size:64px;margin-bottom:16px}.payment-page .order-status-page .empty-title{color:var(--text-dark);font-size:20px;margin-bottom:12px}.payment-page .order-status-page .empty-desc{color:var(--text-gray);font-size:14px;margin-bottom:32px;max-width:300px;margin-left:auto;margin-right:auto}.payment-page .order-info-fields{display:flex;flex-direction:column;gap:8px}.payment-page .order-field-group{display:flex;flex-direction:column;gap:4px}.payment-page .order-field-value{width:100%;background:#ffffffb8;border:1px solid rgba(59,130,246,.16);border-radius:12px;padding:8px;text-align:center;position:relative;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.payment-page .order-field-value .text-primary{color:#1e40af}.payment-page .order-field-value .text-accent{color:#2563eb;font-weight:700}.payment-page .order-field-value.amount-field{font-size:24px;font-weight:700;color:#2563eb;box-shadow:inset 0 2px 4px #2563eb0d}.payment-page .order-field-value.amount-field .currency{font-size:18px;margin-right:4px}.payment-page .order-field-value.time-field{padding:6px 12px;font-size:14px;color:var(--text-gray)}.payment-page .order-copy-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:transparent;border:none;padding:4px;cursor:pointer;z-index:1}.payment-page .order-tip-box{margin-top:12px;padding:8px 12px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{font-family:var(--font-family-primary);line-height:var(--line-height-normal);font-weight:var(--font-weight-normal);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;letter-spacing:var(--letter-spacing-normal);font-feature-settings:"kern" 1,"liga" 1,"calt" 1;background:var(--bg-gradient);color:var(--text-primary);overscroll-behavior:contain}body{margin:0;background:var(--bg-gradient);color:var(--text-primary);font-size:var(--font-size-base);line-height:var(--line-height-normal);font-weight:var(--font-weight-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;overflow-x:hidden;overscroll-behavior:contain}#root{width:100%;min-height:100vh;background:var(--bg-gradient)}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-tertiary{color:var(--text-tertiary)}.text-quaternary{color:var(--text-quaternary)}.text-gold{color:var(--text-gold)}.text-gradient{background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.bg-primary{background:var(--bg-primary)}.bg-secondary{background:var(--bg-secondary)}.bg-tertiary{background:var(--bg-tertiary)}.bg-card{background:var(--bg-card)}.bg-gradient{background:var(--bg-gradient)}.bg-gradient-card{background:var(--bg-gradient-card)}.bg-gradient-button{background:var(--bg-gradient-button)}.bg-gradient-gold{background:var(--bg-gradient-gold)}.border-light{border-color:var(--border-light)}.border-medium{border-color:var(--border-medium)}.border-strong{border-color:var(--border-strong)}.border-primary{border-color:var(--border-primary)}.border-secondary{border-color:var(--border-secondary)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-xl{box-shadow:var(--shadow-xl)}.shadow-xxl{box-shadow:var(--shadow-xxl)}.shadow-glow{box-shadow:var(--shadow-glow)}.shadow-glow-gold{box-shadow:var(--shadow-glow-gold)}.shadow-card{box-shadow:var(--shadow-card)}.shadow-button{box-shadow:var(--shadow-button)}.shadow-gold{box-shadow:var(--shadow-gold)}.page-container{min-height:100vh;background:var(--bg-gradient);position:relative;overflow:hidden}.page-container:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 20% 80%,rgba(115,102,240,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(245,158,11,.1) 0%,transparent 50%);pointer-events:none;z-index:var(--z-hide)}.navbar-box{position:sticky;top:0;z-index:var(--z-sticky);background:var(--bg-card);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-light);padding:var(--space-4) var(--space-6);font-weight:var(--font-weight-semibold);font-size:var(--font-size-lg);color:var(--text-primary);box-shadow:var(--shadow-md);transition:var(--transition-base)}.navbar-box.back-icon{display:flex;align-items:center;gap:var(--space-3);cursor:pointer;padding:var(--space-4) var(--space-6)}.navbar-box .back-icon:hover{color:var(--color-primary-500);background:#7366f01a;border-radius:var(--radius-lg)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border:none;border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);line-height:1;text-decoration:none;cursor:pointer;transition:var(--transition-base);position:relative;overflow:hidden;background:var(--bg-gradient-button);color:var(--text-primary);box-shadow:var(--shadow-button)}.btn:hover{transform:translateY(-2px) scale(1.02);box-shadow:var(--shadow-lg)}.btn:active{transform:translateY(-1px) scale(1.01)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:var(--shadow-md)}.btn-primary{background:var(--gradient-primary);color:var(--text-primary)}.btn-secondary{background:var(--gradient-secondary);color:var(--text-primary)}.btn-success{background:var(--success-gradient);color:var(--text-primary)}.btn-error{background:var(--error-gradient);color:var(--text-primary)}.btn-warning{background:var(--warning-gradient);color:var(--text-primary)}.btn-info{background:var(--info-gradient);color:var(--text-primary)}.btn-ghost{background:transparent;border:1px solid var(--border-light);color:var(--text-secondary);box-shadow:none}.btn-ghost:hover{background:var(--bg-glass);border-color:var(--border-medium);color:var(--text-primary)}.btn-outline{background:transparent;border:1px solid var(--color-primary-500);color:var(--color-primary-500);box-shadow:none}.btn-outline:hover{background:var(--color-primary-500);color:var(--text-primary)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--font-size-lg)}.btn-xl{padding:var(--space-6) var(--space-12);font-size:var(--font-size-xl)}.btn-icon{padding:var(--space-3);aspect-ratio:1}.btn-block{width:100%}.card{background:var(--bg-gradient-card);border:1px solid var(--border-light);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);transition:var(--transition-base);overflow:hidden}.card:hover{box-shadow:var(--shadow-xl);border-color:var(--border-medium);transform:translateY(-2px)}.card-header{padding:var(--space-6);border-bottom:1px solid var(--border-light);background:var(--bg-glass)}.card-body{padding:var(--space-6)}.card-footer{padding:var(--space-6);border-top:1px solid var(--border-light);background:var(--bg-glass)}.form-group{margin-bottom:var(--space-4)}.form-label{display:block;margin-bottom:var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-secondary)}.form-input{width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--border-medium);border-radius:var(--radius-lg);background:var(--bg-card);color:var(--text-primary);font-size:var(--font-size-base);transition:var(--transition-base)}.form-input:focus{outline:none;border-color:var(--color-primary-500);box-shadow:0 0 0 3px #7366f01a;background:var(--bg-primary)}.form-input::placeholder{color:var(--text-tertiary)}.form-textarea{resize:vertical;min-height:120px}.loading-spinner{width:24px;height:24px;border:2px solid var(--border-light);border-top:2px solid var(--color-primary-500);border-radius:var(--radius-full);animation:spin 1s linear infinite}.loading-overlay{position:fixed;inset:0;background:var(--bg-overlay);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-16);text-align:center}.empty-icon{font-size:4rem;margin-bottom:var(--space-4);opacity:.5}.empty-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:var(--space-2)}.empty-description{font-size:var(--font-size-base);color:var(--text-tertiary);margin-bottom:var(--space-6);max-width:400px}.custom-toast{position:fixed;top:var(--space-4);left:50%;transform:translate(-50%);z-index:var(--z-toast);padding:var(--space-3) var(--space-6);border-radius:var(--radius-xl);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);box-shadow:var(--shadow-lg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:var(--transition-base)}.toast-success{background:var(--success-gradient);color:var(--text-primary)}.toast-error{background:var(--error-gradient);color:var(--text-primary)}.toast-warning{background:var(--warning-gradient);color:var(--text-primary)}.toast-info{background:var(--info-gradient);color:var(--text-primary)}@media(max-width:768px){html{font-size:var(--font-size-sm)}.btn{padding:var(--space-3) var(--space-4)}.card{margin:var(--space-4)}.navbar-box{padding:var(--space-3) var(--space-4)}}@media(max-width:480px){html{font-size:.8125rem}.btn{padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm)}.card{margin:var(--space-2);border-radius:var(--radius-lg)}.navbar-box{padding:var(--space-2) var(--space-3);font-size:var(--font-size-base)}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--color-primary-600);border-radius:var(--radius-full);border:2px solid var(--bg-primary)}::-webkit-scrollbar-thumb:hover{background:var(--color-primary-500)}*{scrollbar-width:thin;scrollbar-color:var(--color-primary-600) var(--bg-primary)}::selection{background:var(--color-primary-500);color:var(--text-primary)}::-moz-selection{background:var(--color-primary-500);color:var(--text-primary)}.focus-visible:focus{outline:2px solid var(--color-primary-500);outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media(prefers-contrast:high){:root{--border-light: rgba(255, 255, 255, .3);--border-medium: rgba(255, 255, 255, .4);--shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--shadow-md: 0 4px 8px rgba(0, 0, 0, .3)}}@media(prefers-color-scheme:dark){:root{color-scheme:dark}}.emoji-picker-overlay{position:fixed;inset:0;background-color:#0000004d;display:flex;align-items:flex-end;justify-content:center;z-index:var(--z-modal);animation:fadeIn var(--transition-fast) ease-in-out}.emoji-picker{background:#f2f2f7;border-radius:12px 12px 0 0;width:100%;max-width:500px;max-height:50vh;display:flex;flex-direction:column;box-shadow:0 -1px 3px #00000014;animation:slideUp var(--transition-base) ease-in-out;backdrop-filter:none;-webkit-backdrop-filter:none;border:none;border-top:.5px solid rgba(60,60,67,.12)}.emoji-picker-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) var(--space-4);border-bottom:.5px solid rgba(60,60,67,.12);background:transparent}.emoji-picker-title{font-size:15px;font-weight:var(--font-weight-semibold);color:#000}.emoji-picker-close{background:none;border:none;font-size:var(--font-size-lg);color:#8e8e93;cursor:pointer;padding:var(--space-1);border-radius:var(--radius-sm);transition:var(--transition-fast)}.emoji-picker-close:hover{color:#007aff;background:transparent}.emoji-picker-content{display:grid;grid-template-columns:repeat(8,1fr);gap:var(--space-1);padding:var(--space-2);overflow-y:auto}.emoji-item{background:none;border:none;font-size:28px;cursor:pointer;padding:var(--space-1);border-radius:var(--radius-md);transition:background .15s ease-in-out;display:flex;align-items:center;justify-content:center;min-height:2.5rem}.emoji-item:hover{background:#3c3c430f;transform:none}.emoji-item:active{background:#3c3c431f;transform:none}.chat-wrapper{height:100vh;width:100%;background:var(--gradient-background);overflow:hidden;position:relative;max-width:100%;margin:0 auto}.chat-wrapper .chat-header{position:fixed;top:0;left:0;right:0;height:44px;padding:0 var(--space-4);background:#f9f9f9f0;backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:.5px solid rgba(60,60,67,.12);display:flex;align-items:center;justify-content:space-between;box-shadow:none;z-index:var(--z-sticky);color:#000}.chat-wrapper .back-icon{font-size:22px;cursor:pointer;color:#007aff;flex-shrink:0;padding:var(--space-1);border-radius:var(--radius-md);transition:var(--transition-fast);display:flex;align-items:center}.chat-wrapper .back-icon:hover{opacity:.6}.chat-wrapper .chat-title{flex:1;text-align:center;font-size:17px;font-weight:600;font-family:var(--font-family-display);letter-spacing:-.02em;color:#000;margin:0 var(--space-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-font-smoothing:antialiased}.chat-wrapper .placeholder{width:28px;flex-shrink:0}.chat-wrapper .chat-content{position:fixed;inset:44px 0 60px;overflow-y:auto;padding:6px 10px;-webkit-overflow-scrolling:touch;background:#f2f2f7;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.chat-wrapper .message-list{display:flex;flex-direction:column;gap:1px}.chat-wrapper .load-more-hint{display:flex;justify-content:center;align-items:center;padding:var(--space-3) 0;color:var(--text-tertiary);font-size:var(--font-size-xs);cursor:pointer;-webkit-user-select:none;user-select:none}.chat-wrapper .load-more-hint .loading-text{color:var(--primary)}.chat-wrapper .load-more-hint .load-text{color:var(--text-tertiary)}.chat-wrapper .load-more-hint:active{opacity:.7}.chat-wrapper .message-item{display:flex;align-items:flex-start;gap:6px;margin-bottom:1px;padding:2px 0;animation:fadeIn var(--transition-fast) ease-in-out}.chat-wrapper .message-item-right{flex-direction:row-reverse!important}.chat-wrapper .message-item-right .message-content{background:#147efb!important;color:#fff!important;border-radius:16px 16px 4px!important;box-shadow:none;border:none}.chat-wrapper .message-avatar{width:32px;height:32px;flex-shrink:0;border-radius:var(--radius-full);overflow:hidden;background:#d1d1d6;box-shadow:none;border:none}.chat-wrapper .message-avatar img{width:100%;height:100%;object-fit:cover}.chat-wrapper .message-bubble{max-width:70%;display:flex;flex-direction:column}.chat-wrapper .message-item-right .message-bubble{align-items:flex-end}.chat-wrapper .message-nickname{font-size:11px;color:#8e8e93;margin-bottom:2px;font-weight:500;letter-spacing:-.01em;-webkit-font-smoothing:antialiased}.chat-wrapper .message-content{padding:8px 12px;background:#fff;border-radius:16px 16px 16px 4px;box-shadow:none;font-size:15px;font-family:var(--font-family-primary);letter-spacing:-.01em;color:#1c1c1e;line-height:1.42;font-weight:400;word-wrap:break-word;position:relative;border:none;display:inline-block;max-width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}.chat-wrapper .message-item-right .message-content{background:#147efb;color:#fff;border-radius:16px 16px 4px;border:none;font-weight:400}.chat-wrapper .message-time{font-size:11px;color:#aeaeb2;margin-top:2px;padding:0;font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-weight:400;-webkit-font-smoothing:antialiased}.chat-wrapper .message-item-right .message-time{color:#aeaeb2}.chat-wrapper .time-separator{display:flex;justify-content:center;align-items:center;margin:10px 0 6px;position:relative}.chat-wrapper .time-separator:before{display:none}.chat-wrapper .time-text{background:#0000000f;padding:3px 10px;border-radius:10px;font-size:12px;color:#8e8e93;box-shadow:none;position:relative;z-index:1;white-space:nowrap;backdrop-filter:none;-webkit-backdrop-filter:none;font-weight:500;letter-spacing:-.01em;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}.chat-wrapper .message-content.message-image{padding:2px;background:transparent;box-shadow:none;border-radius:16px;overflow:hidden;border:none}.chat-wrapper .message-content.message-image img{max-width:180px;max-height:180px;border-radius:12px;cursor:pointer;transition:var(--transition-fast);display:block;box-shadow:none}.chat-wrapper .message-content.message-image img:hover{opacity:.9;transform:none;box-shadow:none}.chat-wrapper .message-item-right .message-content.message-image img{border:none}.chat-wrapper .chat-input-area{position:fixed;bottom:0;left:0;right:0;z-index:var(--z-sticky);background:#f6f6f6;border-top:.5px solid rgba(60,60,67,.12);padding-bottom:env(safe-area-inset-bottom);box-shadow:none}.emoji-picker-fixed{position:fixed;bottom:calc(56px + env(safe-area-inset-bottom));left:0;right:0;z-index:var(--z-modal)}.chat-wrapper .chat-input-bar{display:flex;align-items:flex-end;padding:10px 12px;gap:10px;min-height:56px;max-height:140px;box-sizing:border-box}.chat-wrapper .input-buttons-left{display:flex;align-items:center;gap:8px;padding-bottom:2px;flex-shrink:0}.chat-wrapper .input-btn{width:32px!important;height:32px!important;font-size:20px!important;color:#8e8e93!important;background:transparent!important;border:none!important;border-radius:0!important;transition:opacity .15s ease-in-out!important;display:flex!important;align-items:center;justify-content:center;box-shadow:none!important}.chat-wrapper .input-btn:hover{background:transparent!important;color:#007aff!important;transform:none!important}.chat-wrapper .input-btn:active{opacity:.5!important;transform:none!important}.chat-wrapper .input-wrapper{flex:1;min-width:0;background:#fff;border-radius:18px;border:.5px solid rgba(60,60,67,.18);transition:border-color .15s ease-in-out;overflow:hidden;min-height:36px}.chat-wrapper .input-wrapper:focus-within{background:#fff;border-color:#3c3c4347;box-shadow:none}.chat-wrapper .input-wrapper textarea{width:100%!important;border:none!important;background:transparent!important;padding:8px 12px!important;min-height:36px!important;height:36px!important;max-height:120px!important;font-size:16px!important;font-family:var(--font-family-primary)!important;letter-spacing:-.01em!important;line-height:20px!important;color:#000!important;font-weight:400!important;resize:none!important;outline:none!important;display:block;margin:0!important;overflow-y:auto!important;box-shadow:none!important;word-break:break-word;white-space:pre-wrap;-webkit-font-smoothing:antialiased!important;-moz-osx-font-smoothing:grayscale!important}.chat-wrapper .input-wrapper textarea::placeholder{color:#aeaeb2}.chat-wrapper .send-btn{width:32px!important;height:32px!important;flex:0 0 32px!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:16px!important;font-weight:400!important;border-radius:50%!important;background:#007aff!important;color:#fff!important;border:none!important;box-shadow:none!important;transition:opacity .15s ease-in-out!important;white-space:nowrap!important;margin-bottom:2px!important}.chat-wrapper .send-btn:hover:not(:disabled){transform:none;box-shadow:none;opacity:.85}.chat-wrapper .send-btn:active:not(:disabled){transform:none;opacity:.6}.chat-wrapper .send-btn:disabled{background:#d1d1d6!important;color:#fff!important;box-shadow:none!important;cursor:not-allowed;opacity:1!important}.chat-wrapper .interaction-guide{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:var(--z-modal);background:var(--gradient-overlay);color:var(--text-primary);padding:var(--space-6);border-radius:var(--radius-2xl);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:var(--shadow-xxl);animation:pulse 2s infinite;cursor:pointer;transition:var(--transition-base);border:1px solid var(--border-medium)}.chat-wrapper .interaction-guide:hover{transform:translate(-50%,-50%) scale(1.05);box-shadow:var(--shadow-xxl)}.chat-wrapper .guide-content{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);text-align:center}.chat-wrapper .guide-icon{font-size:40px;animation:bounce 1s infinite}.chat-wrapper .guide-text{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);line-height:var(--line-height-snug);color:var(--text-secondary);text-shadow:0 2px 4px rgba(0,0,0,.3)}@media(max-width:768px){.chat-wrapper .chat-header{padding:0 var(--space-3)}.chat-wrapper .chat-title{font-size:17px}.chat-wrapper .message-avatar{width:30px;height:30px}.chat-wrapper .message-content{font-size:15px}.chat-wrapper .input-btn{width:30px!important;height:30px!important;font-size:18px!important}.chat-wrapper .send-btn{width:30px!important;height:30px!important}}@media(max-width:480px){.chat-wrapper .message-content{max-width:85%}.chat-wrapper .message-content.message-image img{max-width:180px;max-height:180px}.emoji-picker{border-radius:12px 12px 0 0}.emoji-picker-content{grid-template-columns:repeat(6,1fr)}}.image-viewer{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);cursor:pointer;backdrop-filter:none;-webkit-backdrop-filter:none}.viewer-image{max-width:90%;max-height:90%;object-fit:contain;border-radius:0;box-shadow:none}.close-button{position:absolute;top:var(--space-4);right:var(--space-4);background:#fff3;border:none;border-radius:var(--radius-full);width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:var(--font-size-lg);color:#fff;transition:var(--transition-fast);backdrop-filter:none;-webkit-backdrop-filter:none}.close-button:hover{background:#ffffff59;border-color:transparent;transform:none}.auto-send-hint{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--gradient-overlay);color:var(--text-primary);padding:var(--space-4) var(--space-6);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);z-index:var(--z-popover);animation:slideUp var(--transition-base) ease;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-medium)}.hint-content{display:flex;flex-direction:column;gap:var(--space-2);text-align:center}.error-container{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg-gradient);padding:var(--space-4)}@supports (backdrop-filter: blur(12px)){.glass-effect{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}}@supports not (backdrop-filter: blur(12px)){.glass-effect,.emoji-picker,.chat-wrapper .chat-header,.chat-wrapper .chat-input-area,.close-button,.auto-send-hint{background:var(--bg-card)}}.chat-wrapper .connection-status{font-size:11px;padding:2px 8px;border-radius:10px;margin-left:8px;font-weight:500;vertical-align:middle}.chat-wrapper .connection-status.connected{background:#34c75926;color:#34c759}.chat-wrapper .connection-status.disconnected{background:#ff3b3026;color:#ff3b30;animation:pulse 1.5s infinite}.chat-wrapper .network-warning{position:fixed;top:44px;left:0;right:0;background:#ff3b30;color:#fff;padding:6px 16px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;font-weight:500;z-index:100;box-shadow:none;animation:slideDown .2s ease-in-out}.chat-wrapper .network-warning .warning-icon{font-size:16px}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.chat-wrapper .message-meta{display:flex;align-items:center;gap:4px;margin-top:1px;padding:0}.chat-wrapper .message-meta .message-time{font-size:10px;color:#aeaeb2;margin:0;padding:0}.chat-wrapper .message-item-right .message-meta .message-time{color:#aeaeb2}.chat-wrapper .message-status{font-size:9px;padding:1px 6px;border-radius:8px}.chat-wrapper .message-status.sending{color:#007aff;background:#007aff1a;animation:pulse 1s infinite}.chat-wrapper .message-status.failed{color:#ff3b30;background:#ff3b301a;cursor:pointer}.chat-wrapper .chat-image-wrapper{position:relative;min-width:100px;min-height:100px}.chat-wrapper .image-skeleton{position:absolute;top:0;left:0;width:150px;height:150px;background:linear-gradient(135deg,#f1f5f9,#e2e8f0);border-radius:var(--radius-lg);overflow:hidden}.chat-wrapper .skeleton-shimmer{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.5) 50%,transparent 100%);animation:shimmer 1.5s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.chat-wrapper .chat-image.loading{opacity:0;position:absolute}.chat-wrapper .chat-image.loaded{opacity:1;transition:opacity .3s ease}.chat-wrapper .image-error{width:150px;height:100px;background:#f1f5f9;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:12px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.chat-wrapper .send-btn.sending{pointer-events:none;opacity:.7}.chat-wrapper .send-btn .btn-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.chat-wrapper .message-bubble{max-width:70%;display:flex;flex-direction:column;position:relative}.chat-wrapper .message-content{position:relative;width:max-content;max-width:100%;word-break:normal;overflow-wrap:break-word;white-space:pre-wrap}.chat-wrapper .message-content.message-image:after{display:none}