@import"https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600;700&display=swap";:root{--font-family-primary: "Noto Serif JP", serif;--font-family-monospace: "Monaco", "Consolas", "Courier New", monospace;--font-weight-regular: 400;--element-wood-primary: #4CAF50;--element-wood-secondary: #2E7D32;--element-wood-accent: #81C784;--element-wood-background: rgba(76, 175, 80, .08);--element-wood-border: rgba(76, 175, 80, .3);--element-wood-glow: rgba(76, 175, 80, .6);--element-fire-primary: #FF5722;--element-fire-secondary: #D32F2F;--element-fire-accent: #FF8A65;--element-fire-background: rgba(255, 87, 34, .08);--element-fire-border: rgba(255, 87, 34, .3);--element-fire-glow: rgba(255, 87, 34, .6);--element-earth-primary: #FF9800;--element-earth-secondary: #F57C00;--element-earth-accent: #FFB74D;--element-earth-background: rgba(255, 152, 0, .08);--element-earth-border: rgba(255, 152, 0, .3);--element-earth-glow: rgba(255, 152, 0, .6);--element-metal-primary: #E0E0E0;--element-metal-secondary: #9E9E9E;--element-metal-accent: #F5F5F5;--element-metal-background: rgba(224, 224, 224, .08);--element-metal-border: rgba(224, 224, 224, .3);--element-metal-glow: rgba(224, 224, 224, .6);--element-water-primary: #2196F3;--element-water-secondary: #1565C0;--element-water-accent: #64B5F6;--element-water-background: rgba(33, 150, 243, .08);--element-water-border: rgba(33, 150, 243, .3);--element-water-glow: rgba(33, 150, 243, .6);--pillar-day-primary: #FFD700;--pillar-day-secondary: #FFA500;--pillar-day-accent: #FFF8DC;--pillar-day-background: rgba(255, 215, 0, .15);--pillar-day-border: rgba(255, 215, 0, .5);--pillar-day-text: #FFD700;--pillar-day-glow: rgba(255, 215, 0, .6);--pillar-month-primary: #FF69B4;--pillar-month-secondary: #FF1493;--pillar-month-accent: #FFB6C1;--pillar-month-background: rgba(255, 105, 180, .15);--pillar-month-border: rgba(255, 105, 180, .5);--pillar-month-text: #FF69B4;--pillar-month-glow: rgba(255, 105, 180, .7);--pillar-year-primary: #DA70D6;--pillar-year-secondary: #BA55D3;--pillar-year-accent: #DDA0DD;--pillar-year-background: rgba(218, 112, 214, .15);--pillar-year-border: rgba(218, 112, 214, .5);--pillar-year-text: #DA70D6;--pillar-year-glow: rgba(218, 112, 214, .7);--polarity-yang-modifier: 1;--polarity-yin-modifier: .85;--polarity-yang-border-style: solid;--polarity-yin-border-style: dashed;--color-hover-overlay: rgba(255, 255, 255, .1);--color-hover-glow: rgba(255, 215, 0, .3);--color-active-overlay: rgba(255, 255, 255, .15);--color-active-scale: .98;--color-focus-outline: #FFD700;--color-focus-outline-width: 3px;--color-selected-border: #FFD700;--color-selected-glow: rgba(255, 215, 0, .5);--color-selected-background: rgba(255, 215, 0, .1);--color-disabled-opacity: .4;--color-disabled-background: rgba(128, 128, 128, .1);--color-disabled-text: #888888;--color-zero-primary: #888888;--color-zero-background: rgba(136, 136, 136, .15);--color-zero-border: rgba(136, 136, 136, .5);--color-zero-opacity: .3;--abnormal-normal-primary: #FF6B35;--abnormal-normal-secondary: #FFA552;--abnormal-normal-glow: rgba(255, 107, 53, .3);--abnormal-coded-primary: #FF8C42;--abnormal-coded-secondary: #FFB074;--abnormal-coded-glow: rgba(255, 140, 66, .3);--void-primary: #DC143C;--void-secondary: #8B0000;--void-background: rgba(220, 20, 60, .1);--void-border: rgba(220, 20, 60, .3);--text-primary: #FFFFFF;--text-secondary: #E0E0E0;--text-tertiary: #B0B0B0;--text-on-dark: #FFFFFF;--text-on-light: #000000;--bg-gradient-primary: linear-gradient(135deg, rgba(0, 0, 0, .96), rgba(0, 0, 50, .92));--bg-gradient-secondary: linear-gradient(135deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03));--bg-gradient-element-overlay: linear-gradient(135deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .05));--shadow-small: 0 2px 8px rgba(0, 0, 0, .2);--shadow-medium: 0 4px 16px rgba(0, 0, 0, .3);--shadow-large: 0 8px 32px rgba(0, 0, 0, .4);--shadow-glow: 0 0 20px;--shadow-text: 0 2px 4px rgba(0, 0, 0, .8);--transition-fast: .2s ease;--transition-normal: .3s ease;--transition-slow: .5s ease;--animation-pulse: 2s ease-in-out infinite;--animation-glow: 3s ease-in-out infinite;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--font-sm: .875rem;--font-md: 1rem;--font-lg: 1.25rem;--font-xl: 1.5rem;--font-2xl: 2rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--surface-primary: rgba(255, 255, 255, .05);--surface-secondary: rgba(255, 255, 255, .08);--surface-elevated: rgba(255, 255, 255, .12);--border-primary: rgba(255, 255, 255, .1);--border-secondary: rgba(255, 255, 255, .2);--border-tertiary: rgba(255, 255, 255, .05);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);--shadow-md: 0 3px 6px rgba(0, 0, 0, .15), 0 2px 4px rgba(0, 0, 0, .12);--shadow-lg: 0 10px 20px rgba(0, 0, 0, .15), 0 3px 6px rgba(0, 0, 0, .1);--info-primary: #2196F3;--info-surface: rgba(33, 150, 243, .15);--warning-primary: #FF9800;--warning-surface: rgba(255, 152, 0, .15);--success-primary: #4CAF50;--success-surface: rgba(76, 175, 80, .15);--error-primary: #F44336;--error-surface: rgba(244, 67, 54, .15);--accent-primary: #FFD700;--accent-primary-dark: #DAA520;--accent-secondary: #9C27B0;--accent-secondary-dark: #7B1FA2}.element-wood{color:var(--element-wood-primary)}.element-fire{color:var(--element-fire-primary)}.element-earth{color:var(--element-earth-primary)}.element-metal{color:var(--element-metal-primary)}.element-water{color:var(--element-water-primary)}.bg-element-wood{background-color:var(--element-wood-background)}.bg-element-fire{background-color:var(--element-fire-background)}.bg-element-earth{background-color:var(--element-earth-background)}.bg-element-metal{background-color:var(--element-metal-background)}.bg-element-water{background-color:var(--element-water-background)}.pillar-year{color:var(--pillar-year-primary)}.pillar-month{color:var(--pillar-month-primary)}.pillar-day{color:var(--pillar-day-primary)}.bg-pillar-year{background-color:var(--pillar-year-background)}.bg-pillar-month{background-color:var(--pillar-month-background)}.bg-pillar-day{background-color:var(--pillar-day-background)}.glow-element-wood{filter:drop-shadow(0 0 8px var(--element-wood-glow))}.glow-element-fire{filter:drop-shadow(0 0 8px var(--element-fire-glow))}.glow-element-earth{filter:drop-shadow(0 0 8px var(--element-earth-glow))}.glow-element-metal{filter:drop-shadow(0 0 8px var(--element-metal-glow))}.glow-element-water{filter:drop-shadow(0 0 8px var(--element-water-glow))}.interactive-hover:hover{background-color:var(--color-hover-overlay);transform:translateY(-2px);transition:var(--transition-normal)}.interactive-active:active{transform:scale(var(--color-active-scale));transition:var(--transition-fast)}.accessible-focus:focus{outline:var(--color-focus-outline-width) solid var(--color-focus-outline);outline-offset:2px}@keyframes pulse-glow{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}@keyframes shimmer{0%,to{opacity:1}50%{opacity:.7}}.animate-pulse-glow{animation:pulse-glow var(--animation-glow)}.animate-shimmer{animation:shimmer 8s ease-in-out infinite}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%;font-family:var(--font-family-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button,input,select,textarea,optgroup{font-family:var(--font-family-primary);font-size:inherit;line-height:inherit}code,pre,kbd,samp{font-family:var(--font-family-monospace)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff80}::selection{background:#7928ca4d;color:#fff}:focus{outline:none;box-shadow:0 0 0 2px #ff008080}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle at 25% 25%,rgba(255,255,255,.2) 1px,transparent 1px),radial-gradient(circle at 75% 75%,rgba(255,255,255,.2) 1px,transparent 1px);background-size:50px 50px;z-index:-1;opacity:.3;animation:fadeIn 2s ease-in-out}
