:root {
  



  
  --paper:        #FFFFFF;                
  --paper-rgb:    255 255 255;          
  --paper-warm:   #FFFBF0;                
  --paper-cool:   #F9FAFB;                
  












  --canvas:       #F7F6F3;
  --ink-pure:     #000000;                
  --ink-pure-rgb: 0 0 0;                
  --ink-900:      #1A1A1A;                
  --ink-navy:     #1A1A2E;                


  --ink-800:      #111827;                


  --ink-700:      #1F2937;                
  --ink-600:      #374151;                
  --ink-550:      #4B5563;                
  --ink-500:      #4A4A4A;                
  --ink-400:      #6B7280;                
  --ink-300:      #9CA3AF;                
  --ink-200:      #D1D5DB;                
  --ink-100:      #E5E7EB;                
  --ink-50:       #F3F4F6;                

  

  --gray-25:      #FAFAFA;                
  --gray-50:      #F8F8F8;                
  --gray-100:     #F0F0F0;                
  --gray-200:     #E5E5E5;                
  --gray-300:     #CCCCCC;                
  --gray-350:     #B0B0B0;                
  --gray-400:     #999999;                
  --gray-500:     #888888;                
  --gray-550:     #777777;                
  --gray-600:     #666666;                
  --gray-625:     #555555;                
  --gray-650:     #444444;                
  --gray-700:     #333333;                
  
  --stone-350:    #B8A99A;                
  --stone-500:    #78716C;                

  
  --pink-50:      #FFF0F5;                
  --pink-75:      #FFF0F6;                
  --pink-85:      #FFF5F9;                                
  --pink-85-rgb:  255 245 249;          
  --pink-100:     #FFD6E8;                
  --pink-200:     #FFB6C1;                
  --pink-300:     #FFB6D9;                
  --pink-400:     #FF85C8;                
  --pink-450:     #F472B6;                

  --pink-500:     #FF69B4;                
  --pink-500-rgb: 255 105 180;          
  --pink-600:     #E84393;                
  --pink-700:     #DB277F;                
  --pink-700-rgb: 219 39 127;           
  --pink-800:     #FF1493;                                
  --pink-800-rgb: 255 20 147;           
  
  --pink-25:      #FDF2F8;                
  --pink-150:     #FCE7F3;                
  --pink-250:     #FBCFE8;                
  --pink-350:     #F9A8D4;                
  --pink-550:     #EC4899;                
  --pink-550-rgb: 236 72 153;           
  --pink-650:     #DB2777;                
  --pink-750:     #BE185D;                
  --pink-850:     #9D174D;                                

  
  --yellow-25:    #FFF8E1;                
  --yellow-50:    #FFFBF0;
  --yellow-75:    #FFF9DB;                
  --yellow-100:   #FFF3D4;
  --yellow-150:   #FEF9C3;                
  --yellow-300:   #FFE6A8;
  --yellow-350:   #FDE047;                
  --yellow-450:   #EAB308;                
  --yellow-500:   #FFE156;                
  --yellow-600:   #FFD700;                
  --yellow-600-rgb: 255 215 0;
  --yellow-650:   #FBC02D;                
  --yellow-700:   #D4A810;
  

  --gold-600:     #B8860B;                
  --gold-800:     #8B6914;                

  
  


  --green-25:     #F0FDF4;                
  --green-50:     #ECFDF5;
  --green-100:    #D1FAE5;
  --green-200:    #A7F3D0;                
  --green-300:    #98FF98;                
  --green-300-rgb: 152 255 152;
  --green-500:    #06C755;                
  --green-500-rgb: 6 199 85;            
  --green-600:    #059669;
  --green-650:    #15803D;                
  --green-700:    #047857;
  --green-800:    #065F46;                
  --green-900:    #064E3B;                
  
  --green-350:    #BBF7D0;                
  --green-450:    #86EFAC;                
  --green-480:    #4ADE80;                
  --green-490:    #5EDE93;                
  --green-550:    #22C55E;                
  --green-750:    #16A34A;                
  --green-750-rgb: 22 163 74;           
  --green-770:    #05A847;                
  --green-850:    #166534;                
  --green-950:    #14532D;                
  
  --green-mat-50:  #E8F5E9;
  --green-mat-400: #66BB6A;               
  --green-mat-500: #4ECCA3;               
  --green-mat-800: #2E7D32;

  


  --emerald-300:  #6EE7B7;                
  --emerald-400:  #34D399;                
  --emerald-500:  #10B981;

  
  --rose-500:     #F43F5E;                
  --rose-200:     #FFE4E6;                
  --rose-400:     #FB7185;                
  --rose-600:     #E11D48;                                

  
  --red-50:       #FEF2F2;
  --red-100:      #FEE2E2;
  --red-200:      #FECACA;                
  --red-300:      #FCA5A5;
  --red-400:      #F87171;
  --red-500:      #EF4444;                
  --red-500-rgb:  239 68 68;            
  --red-600:      #DC2626;                
  --red-600-rgb:  220 38 38;            
  --red-700:      #B91C1C;
  --red-700-rgb:  185 28 28;            
  --red-800:      #991B1B;                
  --red-900:      #7F1D1D;                                

  
  --blue-50:      #EFF6FF;
  --blue-100:     #DBEAFE;
  --blue-200:     #BFDBFE;                
  --blue-300:     #87CEEB;                

  --blue-300-rgb: 135 206 235;          
  --blue-350:     #93C5FD;                


  --blue-400:     #60A5FA;
  --blue-mat-300: #90CAF9;                
  --blue-mat-400: #42A5F5;                
  --blue-500:     #3B82F6;
  --blue-600:     #2563EB;
  --blue-700:     #1D4ED8;                
  --blue-800:     #1E40AF;                
  --blue-900:     #1E3A8A;                

  
  --sky-50:       #F0F9FF;                
  --sky-400:      #38BDF8;                
  --sky-100:      #E0F2FE;                
  --sky-200:      #BAE6FD;                
  --sky-300:      #7DD3FC;                
  --sky-600:      #0284C7;                
  --sky-900:      #0C4A6E;                
  --sky-550:      #0EA5E9;                
  --sky-700:      #0369A1;                                                
  --sky-500:      #00BFFF;
  --sky-500-rgb:  0 191 255;

  
  --indigo-50:    #EEF2FF;                
  --indigo-100:   #E0E7FF;                
  --indigo-200:   #C7D2FE;                
  --indigo-400:   #818CF8;                
  --indigo-300:   #A5B4FC;                
  --indigo-450:   #6C63FF;                
  --indigo-grad-a: #667EEA;               
  --indigo-grad-b: #764BA2;               
  --indigo-500:   #6366F1;                
  --indigo-500-rgb: 99 102 241;         
  --indigo-600:   #4F46E5;                
  --indigo-700:   #4338CA;                
  --indigo-800:   #3730A3;                

  



  --purple-100:   #F3E8FF;                
  --purple-200:   #E9D5FF;                
  --purple-50:    #FAF5FF;                
  --purple-400:   #C084FC;                
  --purple-450:   #A855F7;                
  --purple-450-rgb: 168 85 247;         
  --purple-600:   #9333EA;                
  --purple-700:   #7E22CE;                
  --purple-800:   #6B21A8;                                
  --purple-300:   #DDA0DD;                
  --purple-350:   #D8B4FE;                
  --purple-900:   #581C87;                
  --fuchsia-100:  #FAE8FF;                
  --fuchsia-600:  #C026D3;                
  --purple-300-rgb: 221 160 221;
  --purple-500:   #8B5CF6;
  --violet-25:    #FAF9FF;                
  --violet-50:    #F5F3FF;                
  --violet-75:    #F0E9FF;                
  --violet-100:   #EDE9FE;                
  --violet-150:   #E6E1F7;                
  --violet-200:   #DDD6FE;                
  --violet-300:   #C4B5FD;                
  --violet-400:   #A78BFA;                
  --violet-600:   #7C3AED;                
  --violet-600-rgb: 124 58 237;         
  --violet-700:   #6D28D9;                
  --violet-800:   #5B21B6;                
  --violet-800-rgb: 91 33 182;          
  --violet-900:   #4C1D95;                
  
  --violet-muted-400: #A78BCA;
  --violet-muted-500: #8B80A0;
  --violet-muted-600: #7C6F9A;
  --orange-50:    #FFF7ED;                
  --orange-100:   #FFEDD5;                
  --orange-200:   #FED7AA;                
  --orange-400:   #FB923C;                
  --orange-500:   #F97316;
  --orange-600:   #EA580C;                
  --orange-600-rgb: 234 88 12;          
  --orange-350:   #FF8E53;                
  --orange-coral: #FF6B6B;                
  --amber-450:    #FFC93C;                
  --orange-300:   #FDBA74;                
  --orange-450:   #FFA500;                
  --orange-450-rgb: 255 165 0;          
  --orange-700:   #C2410C;                
  --orange-800:   #9A3412;                
  --orange-800-rgb: 154 52 18;          

  
  --amber-50:     #FFFBEB;                
  --amber-100:    #FEF3C7;
  --amber-200:    #FDE68A;
  --amber-300:    #FCD34D;                
  --amber-400:    #FBBF24;                
  --amber-500:    #F59E0B;
  --amber-500-rgb: 245 158 11;          
  --amber-600:    #D97706;
  --amber-700:    #B45309;
  --amber-650:    #CA8A04;                
  --amber-650-rgb: 202 138 4;           
  --amber-750:    #A16207;                
  --amber-800:    #92400E;
  --amber-850:    #854D0E;                
  --amber-900:    #78350F;

  

  --slate-50:     #F8FAFC;                
  --slate-100:    #F1F5F9;
  --slate-200:    #E2E8F0;
  --slate-300:    #CBD5E1;                
  --slate-400:    #94A3B8;                
  --slate-500:    #64748B;                
  --slate-600:    #475569;                
  --slate-700:    #334155;                
  --slate-800:    #1E293B;                
  --slate-900:    #0F172A;                
  --slate-900-rgb: 15 23 42;            

  
  --teal-50:      #F0FDFA;                
  --teal-100:     #CCFBF1;
  --teal-200:     #99F6E4;                
  --teal-300:     #5EEAD4;                
  --teal-400:     #2DD4BF;                
  --teal-500:     #14B8A6;                
  --teal-600:     #0D9488;                                
  --teal-700:     #0F766E;

  
  --cyan-50:      #ECFEFF;
  --cyan-100:     #CFFAFE;
  --cyan-300:     #67E8F9;
  --cyan-400:     #22D3EE;
  --cyan-500:     #06B6D4;                
  --cyan-600:     #0891B2;

  
  --coffee-25:    #FAF5ED;
  --coffee-50:    #FBF3E7;
  --coffee-75:    #F7EFE4;
  --coffee-100:   #F1E7D8;
  --coffee-150:   #EFE1CF;
  --coffee-200:   #F0ECE0;
  --coffee-250:   #D8C4A8;
  --coffee-400:   #C8945F;
  --coffee-500:   #A0714F;
  --coffee-600:   #8B5E3C;                
  --coffee-700:   #6F4E37;
  --coffee-800:   #5E4836;
  --coffee-blush: #F0E6E6;                

  
  --brand-google-blue:  #4285F4;
  --brand-google-green: #34A853;

  
  --color-text:           var(--ink-900);
  --color-text-secondary: var(--ink-500);
  --color-text-muted:     var(--ink-400);
  --color-text-inverted:  var(--paper);
  --color-border:         var(--ink-900);
  --color-border-soft:    var(--ink-200);
  --color-bg:             var(--paper);
  --color-bg-warm:        var(--paper-warm);
  --color-primary:        var(--pink-500);
  --color-primary-deep:   var(--pink-600);
  --color-success:        var(--green-500);
  --color-danger:         var(--red-500);
  --color-warning:        var(--yellow-500);
  --color-info:           var(--blue-500);

  













  --signal-act:     #B4245C;      
  --signal-alert:   #A32218;      

  











  





  --rule:           #E2DFDA;      

  

  --color-success-bg:     #DCFCE7;
  --color-success-text:   #14532D;

  


  --brand-fb:             #1877F2;        
  --brand-ig:             #E4405F;        
  --brand-line-square:    #00B900;        
  --brand-line-dark:      #00B040;        


  --brand-haomai:         #00A040;        


  --brand-haomai-dark:    #00792F;        


  


















  

  --shadow-xs:    none;                           
  --shadow-sm:    none;                           
  --shadow-md:    none;                           

  
  --shadow-lg:    0 1px 3px rgb(var(--ink-pure-rgb) / 0.06), 0 1px 2px rgb(var(--ink-pure-rgb) / 0.04);
  --shadow-xl:    0 4px 16px rgb(var(--ink-pure-rgb) / 0.08), 0 1px 4px rgb(var(--ink-pure-rgb) / 0.04);
  --shadow-2xl:   0 12px 32px rgb(var(--ink-pure-rgb) / 0.10), 0 4px 12px rgb(var(--ink-pure-rgb) / 0.06);

  
  --shadow-soft-sm:  0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-soft-md:  0 4px 16px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.04);
  --shadow-soft-lg:  0 12px 32px rgba(0,0,0,0.10), 0 4px 12px rgba(0,0,0,0.06);
  --shadow-soft-xl:  0 24px 64px rgba(0,0,0,0.12);

  
  --shadow-pink:   none;
  --shadow-green:  none;


  




  --radius-xs:    4px;     
  --radius-sm:    6px;     
  --radius-base:  8px;     
  --radius-md:    10px;    
  --radius-lg:    14px;    
  --radius-xl:    20px;    
  --radius-2xl:   28px;    
  --radius-full:  9999px;  


  




  --border-width-thin:    2px;
  --border-width-base:    3px;     
  --border-width-thick:   4px;

  --border-thin:   var(--border-width-thin)  solid var(--ink-900);
  --border-base:   var(--border-width-base)  solid var(--ink-900);
  --border-thick:  var(--border-width-thick) solid var(--ink-900);

  
  --border-soft:        1px solid var(--ink-200);
  --border-soft-strong: 1px solid rgba(0,0,0,0.12);


  



  --space-0:   0;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;     
  --space-5:   20px;
  --space-6:   24px;     
  --space-7:   28px;     
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;
  --space-16:  64px;
  --space-20:  80px;


  



  
  --duration-instant: 100ms;
  --duration-fast:    150ms;       
  --duration-base:    200ms;
  --duration-slow:    350ms;       
  --duration-slower:  500ms;       

  
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);             
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);              
  --ease-spring: cubic-bezier(0.2, 0.8, 0.3, 1.2);          
  --ease-snap:   cubic-bezier(0.65, 0, 0.35, 1);            

  
  --transition-fast: all var(--duration-fast) var(--ease-in-out);
  --transition-base: all var(--duration-base) var(--ease-in-out);
  --transition-slow: all var(--duration-slow) var(--ease-in-out);


  




  --font-sans:  'Inter', 'Noto Sans TC', system-ui, -apple-system, sans-serif;
  --font-serif: 'Noto Serif TC', 'Songti TC', 'Source Han Serif TC', ui-serif, Georgia, serif;
  --font-mono:  'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  
  --text-xs:    11px;
  --text-sm:    12px;
  --text-base:  14px;       
  --text-md:    15px;
  --text-lg:    16px;
  --text-xl:    18px;
  --text-2xl:   20px;
  --text-3xl:   24px;
  --text-4xl:   30px;
  --text-5xl:   36px;
  --text-6xl:   48px;

  
  














  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  500;    
  --weight-bold:      700;
  --weight-extrabold: 700;    
  --weight-black:     700;    

  
  --leading-tight:    1.2;
  --leading-snug:     1.35;
  --leading-normal:   1.5;
  --leading-relaxed:  1.75;     
  --leading-loose:    1.9;

  
  --tracking-tighter: -0.025em;
  --tracking-tight:   -0.01em;     
  --tracking-normal:  0;
  --tracking-wide:    0.025em;
  --tracking-wider:   0.05em;
  --tracking-widest:  0.15em;      


  



  --z-base:      1;
  --z-raised:    10;
  --z-sticky:    50;        
  --z-dropdown:  60;
  --z-tooltip:   80;
  --z-overlay:   100;       
  --z-modal:     200;
  --z-toast:     300;
  --z-max:       9999;


  



  --container-sm:  640px;
  --container-md:  780px;     
  --container-lg:  960px;     
  --container-xl:  1100px;    
  --container-2xl: 1280px;    

  --nav-height:    56px;

  



  --min-tap:       44px;    


  







  --nav-surface-1:    #1A1A2E;
  --nav-surface-2:    #16213E;
  --nav-surface-3:    #0F3460;
  

  --nav-surface-1-rgb: 26 26 46;
  --nav-surface-2-rgb: 22 33 62;
  --nav-surface-3-rgb: 15 52 96;
  --nav-fg:           #FFFFFF;             
  --nav-fg-rgb:       255 255 255;
  --nav-accent:       var(--color-primary);
  --nav-accent-soft:  var(--pink-400);     
  --nav-accent-rgb:   255 105 180;

  
  --nav-c-pink:    var(--pink-500);
  --nav-c-yellow:  var(--yellow-500);
  --nav-c-blue:    var(--blue-300);
  --nav-c-green:   var(--green-300);
  --nav-c-purple:  var(--purple-300);
}







.dd-card {
  background: var(--paper);
  border: var(--border-base);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: var(--space-6);
  transition: var(--transition-fast);
}
.dd-card:hover {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-lg);
}

.dd-card-flat {
  background: var(--paper);
  border: var(--border-soft);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
}


.min-tap {
  min-width: var(--min-tap);
  min-height: var(--min-tap);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}











body { background: var(--canvas); }







.dd-toast {
  position: fixed;
  bottom: calc(76px + env(safe-area-inset-bottom, 0px));
  left: 50%; transform: translateX(-50%);
  z-index: var(--z-toast);
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 22px;
  background: var(--ink-900); color: var(--paper);
  font-size: var(--text-base); font-weight: var(--weight-bold);
  border: var(--border-thin); border-color: var(--ink-900);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  animation: dd-toast-pop 0.32s var(--ease-spring);
  pointer-events: none;
  max-width: calc(100vw - 32px);
}
.dd-toast--success { background: var(--green-500); }
.dd-toast--error   { background: var(--red-500); }
.dd-toast--info    { background: var(--blue-500); }
.dd-toast--warning { background: var(--yellow-500); color: var(--ink-900); }

@keyframes dd-toast-pop {
  0%   { opacity: 0; transform: translateX(-50%) translateY(24px) scale(0.85); }
  60%  { opacity: 1; transform: translateX(-50%) translateY(-6px) scale(1.06); }
  100% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
}

@media (min-width: 900px) {
  .dd-toast { bottom: 24px; }
}






@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-instant: 1ms;
    --duration-fast:    1ms;
    --duration-base:    1ms;
    --duration-slow:    1ms;
    --duration-slower:  1ms;
  }
  *, *::before, *::after {
    animation-duration: 1ms !important;
    transition-duration: 1ms !important;
  }
}