:root{--color-primary:#4a90e2;--color-primary-dark:#357abd;--color-primary-light:#6ba3e8;--color-secondary:#6c757d;--color-accent:#28a745;--color-bg:#ffffff;--color-surface:#f8f9fa;--color-surface-elevated:#ffffff;--color-border:#dee2e6;--color-text:#212529;--color-text-secondary:#6c757d;--color-text-muted:#adb5bd;--spacing-xs:0.5rem;--spacing-sm:0.75rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--radius-sm:0.5rem;--radius-md:0.75rem;--radius-lg:1rem;--radius-xl:1.5rem;--shadow-sm:0 1px 3px rgba(0, 0, 0, 0.1);--shadow-md:0 4px 6px rgba(0, 0, 0, 0.1);--shadow-lg:0 10px 25px rgba(0, 0, 0, 0.15);--shadow-glow:0 0 20px rgba(74, 144, 226, 0.2);--transition-fast:150ms ease;--transition-normal:250ms ease;--transition-slow:400ms ease;--font-family:'Noto Sans JP',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family);background:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh;overflow-x:hidden}.container{max-width:1400px;margin:0 auto;padding:var(--spacing-xl);width:100%;box-sizing:border-box}.header{text-align:center;margin-bottom:var(--spacing-2xl);animation:fadeInDown .6s ease}.title{font-size:2.5rem;font-weight:700;color:var(--color-primary);margin-bottom:var(--spacing-sm);display:flex;align-items:center;justify-content:center;gap:var(--spacing-md)}.title-icon{font-size:2.5rem;filter:drop-shadow(0 4px 8px rgba(100, 150, 255, .4))}.subtitle{color:var(--color-text-secondary);font-size:1.1rem}.main{display:grid;gap:var(--spacing-xl);width:100%;box-sizing:border-box}.input-section,.output-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-md);backdrop-filter:blur(10px);animation:fadeInUp .6s ease;width:100%;box-sizing:border-box}.section-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--spacing-lg);flex-wrap:wrap;gap:var(--spacing-md);width:100%;box-sizing:border-box}.section-title{font-size:1.5rem;font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-md)}.chart-selector{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.chart-label{font-weight:500;color:var(--color-text-secondary)}.chart-dropdown{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-family:var(--font-family);font-size:.95rem;cursor:pointer;transition:all var(--transition-normal)}.chart-dropdown:hover{border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(100,150,255,.1)}.chart-dropdown:focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(100,150,255,.2)}.input-textarea{width:100%;min-height:150px;padding:var(--spacing-md);background:var(--color-bg);border:2px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-family:var(--font-family);font-size:1rem;resize:vertical;transition:all var(--transition-normal);margin-bottom:var(--spacing-lg);box-sizing:border-box}.input-textarea:focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(100,150,255,.2)}.input-textarea::placeholder{color:var(--color-text-muted)}.button-group{display:flex;gap:var(--spacing-sm);flex-wrap:wrap;width:100%;box-sizing:border-box}.btn{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:var(--radius-md);font-family:var(--font-family);font-size:1rem;font-weight:500;cursor:pointer;transition:all var(--transition-normal);position:relative;overflow:hidden;white-space:nowrap}.btn::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;transition:all .3s ease;box-shadow:var(--shadow-sm)}.btn-primary{background:var(--color-primary);color:#fff;width:100%;justify-content:center}.btn-primary:hover{background:var(--color-primary-dark);box-shadow:var(--shadow-md);transform:translateY(-2px)}.btn-secondary{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-border);box-shadow:var(--shadow-md);transform:translateY(-2px)}.btn-icon{font-size:1.2rem}.visualization-container{background:var(--color-bg);border:2px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-xl);min-height:400px;display:flex;align-items:center;justify-content:center;overflow:auto;width:100%;box-sizing:border-box}.placeholder{text-align:center;color:var(--color-text-muted)}.placeholder-icon{font-size:4rem;margin-bottom:var(--spacing-md);opacity:.5}.placeholder-text{font-size:1.2rem;margin-bottom:var(--spacing-sm)}.placeholder-subtext{font-size:.95rem;opacity:.7}#dependencyGraph{display:block;height:auto;max-width:100%;overflow:visible}.bunsetsu-box-group{transition:all var(--transition-normal)}.bunsetsu-box{transition:all var(--transition-normal);filter:drop-shadow(0 2px 4px rgba(0, 0, 0, .1))}.bunsetsu-box-group:hover .bunsetsu-box{filter:drop-shadow(0 4px 8px rgba(0, 0, 0, .2))}.bunsetsu-number{user-select:none;pointer-events:none}.bunsetsu-text{user-select:none;pointer-events:none}.dependency-connection{pointer-events:none}.dependency-line{transition:all var(--transition-normal)}.info-panel{margin-top:var(--spacing-lg);padding:var(--spacing-lg);background:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:var(--radius-md);animation:fadeIn var(--transition-normal)}.info-title{font-size:1.2rem;margin-bottom:var(--spacing-md);color:var(--color-primary-light)}.info-content{color:var(--color-text-secondary);line-height:1.8}.info-item{margin-bottom:var(--spacing-sm)}.info-label{color:var(--color-text-muted);font-weight:500}.info-value{color:var(--color-text);margin-left:var(--spacing-sm)}.footer{text-align:center;margin-top:var(--spacing-2xl);padding-top:var(--spacing-xl);border-top:1px solid var(--color-border);color:var(--color-text-muted)}.footer-text{font-size:.9rem}.footer-text a{color:var(--color-primary-light);text-decoration:none;transition:color var(--transition-fast)}.footer-text a:hover{color:var(--color-primary);text-decoration:underline}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);backdrop-filter:blur(5px);display:none;align-items:center;justify-content:center;flex-direction:column;z-index:1000}.loading-overlay.active{display:flex}.loading-spinner{width:60px;height:60px;border:4px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.loading-text{margin-top:var(--spacing-lg);font-size:1.2rem;color:var(--color-text)}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:768px){.container{padding:var(--spacing-md);max-width:100%;width:100%;box-sizing:border-box}.title{font-size:1.8rem;flex-direction:column;gap:var(--spacing-sm)}.section-header{flex-direction:column;align-items:flex-start}.button-group{width:100%;flex-wrap:wrap}.btn{flex:1;min-width:150px}.btn-secondary{flex:1;min-width:100px}.input-section,.output-section{width:100%;padding:var(--spacing-md);box-sizing:border-box}.visualization-container{padding:var(--spacing-md);min-height:300px;width:100%;box-sizing:border-box}.chart-dropdown{max-width:200px}}.hidden{display:none!important}.visible{display:block!important}